<!DOCTYPE html>
<html>
<head>
<title>Phương thức removeChild() từng vị trí trong JavaScript</title>
</head>
<body>
<h1>Phương thức removeChild() từng vị trí trong JavaScript</h1>
<p>Phương thức removeChild() trong JavaScript dùng để xóa nút con HTML của một nút cha thông qua vị trí, id hoặc xóa tất cả các phần tử HTML con của một nút cha, ở ví dụ này mình chỉ định được vị trí của phần tử con cần xóa:</p>
<ul id="ulid" style="border:1px solid red; padding:20px">
<li>Trang chủ</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 XÓA PHẦN TỬ CON để xóa phần tử con đầu tiên, 0 là vị trí đầu tiên, sau khi xóa phần tử con đầu tiên thì phần tử con gần nhất sẽ là phần tử con đầu tiên, bạn có thể chỉ định 1, 2 để xóa phần tử con ở vị trí 1 hoặc 2. </p>
<button onclick="xoaPhanTuCon()">XÓA PHẦN TỬ CON</button>
<script>
function xoaPhanTuCon() {
const ulid = document.getElementById("ulid");
ulid.removeChild(ulid.children[0]);
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Phương thức removeChild() từng vị trí trong JavaScript</title>
</head>
<body>
<h1>Phương thức removeChild() từng vị trí trong JavaScript</h1>
<p>Phương thức removeChild() trong JavaScript dùng để xóa nút con HTML của một nút cha thông qua vị trí, id hoặc xóa tất cả các phần tử HTML con của một nút cha, ở ví dụ này mình chỉ định được vị trí của phần tử con cần xóa:</p>
<ul id="ulid" style="border:1px solid red; padding:20px">
<li>Trang chủ</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 XÓA PHẦN TỬ CON để xóa phần tử con đầu tiên, 0 là vị trí đầu tiên, sau khi xóa phần tử con đầu tiên thì phần tử con gần nhất sẽ là phần tử con đầu tiên, bạn có thể chỉ định 1, 2 để xóa phần tử con ở vị trí 1 hoặc 2. </p>
<button onclick="xoaPhanTuCon()">XÓA PHẦN TỬ CON</button>
<script>
function xoaPhanTuCon() {
const ulid = document.getElementById("ulid");
ulid.removeChild(ulid.children[0]);
}
</script>
</body>
</html>
