Phương thức replaceChild() phần tử trong JavaScript

Phương thức replaceChild() phần tử trong JavaScript

Phương thức replaceChild() phần tử trong JavaScript

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

<h1>Phương thức replaceChild() phần tử trong JavaScript</h1>
<p>Phương thức replaceChild() trong JavaScript dùng để thay thế phần tử HTML hoặc thay thế nút văn bản trong phần tử HTML, ở ví dụ này mình tạo một phần tử HTML mới và thay thế vào vị trí của phần tử HTML con:</p>

<ul id="ulid">
	<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 THAY PHẦN TỬ để thay thế giá trị thẻ li ở vị trí 0</p>
<button onclick="thayPhanTu()">THAY PHẦN TỬ</button>
<script>
function thayPhanTu() {
 // Tạo phần tử li 
 const phantuli = document.createElement("li");
 // Tạo một node (nút) văn bản
 const nodevanban = document.createTextNode("Trang chủ");
 // Thêm nút văn bản vào phần tử li mới tạo
 phantuli.appendChild(nodevanban); 	
 // Lấy id ulid
 const ulid = document.getElementById("ulid");
 // Thay thế phần tử li mới tạo vào li đầu tiên
 ulid.replaceChild(phantuli, ulid.children[0]);
}
</script>
</body>
</html>
Phương thức replaceChild() phần tử trong JavaScript nằm trong bài viết Phương thức replaceChild() trong JavaScript