Question

我正在尝试创建一个元素，然后在删除一定时间后。

当我单击按钮一次时，我的代码有效，它在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);
}

Answer 1

在单个文档中具有多个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();

创建元素，然后删除元素

1 个答案: