我想在删除一定时间后创建一个元素。
当我单击我的按钮一次时,我的代码工作,它会在2秒后删除元素,但如果我多次单击该按钮,setTimeout函数将停止工作。
function displayText(){
var element = document.createElement("P");
element.id = "text1";
element.appendChild(document.createTextNode('Hello'));
document.getElementById('Div1').appendChild(element);
setTimeout(function(){
document.getElementById("text1").style.display = "none";
}, 2000);
}
在单个文档中具有多个ID是无效的HTML - 在id
中选择text1
为setTimeout
的元素将仅选择具有该ID的第一个元素。您新创建的元素根本不需要ID - 您只需在闭包中引用element
变量,并设置其样式。
您也可能会发现分配给元素的textContent
比使用createTextNode
更容易:
function displayText(){
var element = document.createElement("P");
element.textContent = 'Hello';
document.getElementById('Div1').appendChild(element);
setTimeout(
function(){
element.style.display = "none";
}, 2000);
}
注意
element.style.display = "none";
实际上并没有删除元素 - 如果你想从DOM中删除元素,请使用
element.remove();