Ứng dụng bộ sưu tập Map

Giả sử chúng ta có các đoạn văn:

<p>aaa</p>
<p>bbb</p>
<p>ccc</p>
<p>ddd</p>
<p>eee</p>

Hãy làm sao cho khi nhấp vào mỗi đoạn văn thì số thứ tự của nó trong danh sách sẽ được ghi vào cuối đoạn. Hãy giải quyết bài toán này bằng cách sử dụng Map.

Bắt đầu nào. Đầu tiên, hãy lấy các đoạn văn của chúng ta vào một biến:

let elems = document.querySelectorAll('p');

Tạo một bộ sưu tập Map mới:

let map = new Map;

Điền vào bộ sưu tập của chúng ta sao cho các khóa là các đoạn văn của chúng ta, và giá trị của chúng là số thứ tự:

let i = 1;
for (let elem of elems) {
	map.set(elem, i++);
}

Duyệt qua các đoạn văn bằng vòng lặp và gắn trình xử lý sự kiện nhấp chuột cho chúng:

for (let elem of elems) {
	elem.addEventListener('click', function() {
		
	});
}

Bây giờ hãy thêm số thứ tự vào cuối văn bản của đoạn văn khi nhấp chuột. Đồng thời, hãy lấy số thứ tự này từ bộ sưu tập của chúng ta:

for (let elem of elems) {
	elem.addEventListener('click', function() {
		this.textContent += map.get(this);
	});
}

Cho trước các ô input. Hãy duyệt qua các ô input này bằng vòng lặp và tạo một bộ sưu tập Map, trong đó các khóa sẽ là các ô input, và giá trị sẽ là số thứ tự của chúng trên trang. Hãy làm sao cho khi nhấp vào bất kỳ ô input nào, số thứ tự của nó sẽ được ghi vào value của ô đó.

Cho trước các ô input. Có thể nhập một số vào mỗi ô input. Giả sử khi nhấn phím Enter, ô input sẽ ghi nhớ số đã nhập. Hãy làm sao cho khi mất tiêu điểm (blur) trên ô input, tất cả các số đã nhập trước đó vào ô input đó sẽ được hiển thị ra console dưới dạng một mảng.