Chào mọi người,
Mình đang tự học Javascript/html theo các tutorial online
Mình có viết 1 example cho replaceChild method nhưng nó đang ko chạy như ý muốn.
Ý tưởng của mình là có 5 thẻ h5 và mình muốn replace từng thẻ theo thứ tự từ trên xuống mỗi khi click vào button Replace nhưng kết quả là nó chỉ chạy đúng trong lượt đầu, từ lần chạy thứ 2 trở đi thì mảng hReplace bị down từ 5 phần tử xuống còn 4, tiếp tục kích replace thì nó lại giảm còn 3 mà ko rõ lý do và kết quả hiển thị cũng ko đúng như mong đợi. Cảm ơn mọi người
Mình đang tự học Javascript/html theo các tutorial online
Mình có viết 1 example cho replaceChild method nhưng nó đang ko chạy như ý muốn.
Ý tưởng của mình là có 5 thẻ h5 và mình muốn replace từng thẻ theo thứ tự từ trên xuống mỗi khi click vào button Replace nhưng kết quả là nó chỉ chạy đúng trong lượt đầu, từ lần chạy thứ 2 trở đi thì mảng hReplace bị down từ 5 phần tử xuống còn 4, tiếp tục kích replace thì nó lại giảm còn 3 mà ko rõ lý do và kết quả hiển thị cũng ko đúng như mong đợi. Cảm ơn mọi người
HTML:
<!DOCTYPE html>
<html>
<body>
<div id="replace">
<h5>Replace Children 0</h5>
<h5>Replace Children 1</h5>
<h5>Replace Children 2</h5>
<h5>Replace Children 3</h5>
<h5>Replace Children 4</h5>
</div>
<input type="button" value="Replace" id="buttonReplace"/>
<script language="javascript">
var buttonRp = document.getElementById("buttonReplace");
var index = 0;
var str = "Replaced by new Children ";
var newElement = document.createElement("h5");
var hReplace = document.getElementsByTagName("h5");
buttonRp.addEventListener("click", function()
{
if (index < hReplace.length)
{
newElement.innerHTML = str + index;
document.getElementById("replace").replaceChild(newElement, hReplace[index]);
index++;
}
});
</script>
</body>
</html>Bài viết liên quan
Bài viết mới
