<!DOCTYPE html>
<html>
<head>
<title>Phương thức getElementsByTagName() đổi nội dung trong JavaScript</title>
</head>
<body>
<h1>Phương thức getElementsByTagName() đổi nội dung trong JavaScript</h1>
<p>Phương thức getElementsByTagName() trong JavaScript dùng để lấy tên thẻ HTML rồi thực hiện nhiều hành động vào thẻ đó, ngoài ra còn có thể đếm có bao nhiêu thẻ, ở ví dụ này mình đổi nội dung trong thẻ li:</p>
<ul style="border:1px solid red;padding:20px">
<li>Home</li>
<li>Giới thiệu</li>
<li>Hosting</li>
<li>Blog</li>
<li>Liên hệ</li>
</ul>
<p>Click vào nút ĐỔI NỘI DUNG để thay đổi nội dung li đầu tiên</p>
<button onclick="doiNoiDung()">ĐỔI NỘI DUNG</button>
<script>
function doiNoiDung() {
// Lấy tên thẻ UL đầu tiên
const list = document.getElementsByTagName("UL")[0];
// Thay đổi nội dung li ở vị trí đầu tiên thành Trang chủ
list.getElementsByTagName("li")[0].innerHTML = "Trang chủ";
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Phương thức getElementsByTagName() đổi nội dung trong JavaScript</title>
</head>
<body>
<h1>Phương thức getElementsByTagName() đổi nội dung trong JavaScript</h1>
<p>Phương thức getElementsByTagName() trong JavaScript dùng để lấy tên thẻ HTML rồi thực hiện nhiều hành động vào thẻ đó, ngoài ra còn có thể đếm có bao nhiêu thẻ, ở ví dụ này mình đổi nội dung trong thẻ li:</p>
<ul style="border:1px solid red;padding:20px">
<li>Home</li>
<li>Giới thiệu</li>
<li>Hosting</li>
<li>Blog</li>
<li>Liên hệ</li>
</ul>
<p>Click vào nút ĐỔI NỘI DUNG để thay đổi nội dung li đầu tiên</p>
<button onclick="doiNoiDung()">ĐỔI NỘI DUNG</button>
<script>
function doiNoiDung() {
// Lấy tên thẻ UL đầu tiên
const list = document.getElementsByTagName("UL")[0];
// Thay đổi nội dung li ở vị trí đầu tiên thành Trang chủ
list.getElementsByTagName("li")[0].innerHTML = "Trang chủ";
}
</script>
</body>
</html>
