Phương thức getElementsByClassName() for set trong JavaScript

Phương thức getElementsByClassName() for set trong JavaScript

Phương thức getElementsByClassName() for set trong JavaScript

Tự code rồi chạy thử... Chạy Thử
<!DOCTYPE html>
<html>
<head>
<title>Phương thức getElementsByClassName() for set trong JavaScript</title>
</head>
<body>

<h1>Phương thức getElementsByClassName() for set trong JavaScript</h1>
<p>Phương thức getElementsByClassName() trong JavaScript dùng để lấy các phần tử HTML có tên lớp giống nhau và cùng nằm trong một phần tử cha để thực hiện những hành động vào các phần tử HTML con đó theo những vị trí được chỉ định, ở ví dụ này mình tạo nội dung cho từng class, tạo giá trị cho từng thuộc tính của class, những class đó nằm trong một phần tử HTML khác có ID hoặc nằm trong document (body):</p>

<div id="divid">
    <p class="tieude">Tiêu đề 1</p>
    <p class="tieude">Tiêu đề 2</p>
    <p class="tieude">Tiêu đề 3</p>
    <p class="tieude">Tiêu đề 4</p>
    <p class="tieude">Tiêu đề 5</p>
</div>
<script>
  document.write("<b>Kết quả:</b><br>");	
  // Lấy id của divid
  const divid = document.getElementById("divid");
  // Lấy danh sách class tieude nằm trong id divid
  const list = divid.getElementsByClassName('tieude');
  // Lặp qua các class tieude
  for (let i = 0; i < list.length; i++) {
  // Tạo nội dung cho từng class tieude
  list[i].innerText = "Tiêu đề mới "+i;
  // Tạo giá trị cho từng thuộc tính data-id cho từng class tieude
  list[i].setAttribute("data-id","thep"+i);
  // Lấy nội dung và giá trị của thuộc tính data-id trong mỗi class tieude
  document.write("Nội dung: "+list[i].innerText+", data-id: "+list[i].getAttribute('data-id')+"<br>");
  }
</script>
</body>
</html>
Phương thức getElementsByClassName() for set trong JavaScript nằm trong bài viết Phương thức getElementsByClassName() trong JavaScript