Đánh số thứ tự các phần tử DOM trong JavaScript
Hiểu về trình vòng lặp cho phép bạn dễ dàng thêm số thứ tự vào các phần tử DOM. Ví dụ, giả sử chúng ta có các đoạn văn:
<p>văn bản</p>
<p>văn bản</p>
<p>văn bản</p>
Hãy lấy danh sách (collection) các đoạn văn này vào một biến:
let elems = document.querySelectorAll('p');
Hãy sử dụng trình vòng lặp có sẵn
entries để lặp qua:
for (let entry of elems.entries()) {
console.log(entry);
}
Hãy sử dụng cú pháp hủy cấu trúc (destructuring) để tách số thứ tự ra khỏi phần tử:
for (let [num, elem] of elems.entries()) {
console.log(num, elem);
}
Thêm số thứ tự của nó vào cuối mỗi đoạn văn:
for (let [num, elem] of elems.entries()) {
elem.textContent += num;
}
Cho một bảng HTML. Hãy đánh số thứ tự cho mỗi ô (cell) trong bảng này.