Mọi người cho em hỏi đoạn removeChild ở phía dưới nếu em thay i
ở childNodes bằng một chỉ số bất kỳ thì tại vị trí phần tử ấy sẽ xóa được còn em chỉ giữ nguyên i
để vòng for thêm phần tử thì lại bị lỗi Uncaught TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.
là sao ạ? Em mong mọi người giải thích giúp em và đề xuất cho em một cách giải quyết với ạ.
<!DOCTYPE html>
<html>
<head>
<title>To do list</title>
<meta charset="utf-8"/>
<style>
</style>
</head>
<body>
<input type="text" id="textbox" placeholder="Xin mời nhập">
<button id="btn" onclick="eventOfButton(inputClear)">Thêm</button>
<div id="ad"></div>
</body>
<script>
var bodyTag;
var divArray;
function inputClear(){
document.getElementById('textbox').value = "";
}
function eventOfButton(inputClear){
var textBValue = document.getElementById('textbox').value;
var divTotal = document.createElement('DIV');
divTotal.className = "Total";
var listDv = document.getElementsByClassName('Total');
divArray = listDv;
var divShow = document.createElement('DIV');
var showContent = document.createTextNode(textBValue);
divShow.appendChild(showContent);
var closeDiv = document.createElement('BUTTON');
closeDiv.className = 'dlt';
var listClsDv = document.getElementsByClassName('dlt');
var closeBtn = document.createTextNode("Xóa");
closeDiv.appendChild(closeBtn);
divTotal.appendChild(divShow);
divTotal.appendChild(closeDiv);
var divad = document.getElementById('ad');
bodyTag = divad;
divad.appendChild(divTotal);
inputClear();
for(var i = 0 ; i < listClsDv.length ; i++){
listClsDv[i].onclick = function (){
bodyTag.removeChild(bodyTag.childNodes[i]);
}
}
}
</script>
</html>