javascript - 如何使按钮消失并在 'x' 秒后重新出现？

Question

我怎样才能编写这段代码；

 <input onclick="myFunction();" alt="click">Click Me!</button>

隐藏几秒钟，然后在“x”秒后重新出现？ (如果有任何改变，这个按钮就可以正常工作)

我想坚持使用纯 HTML，但如果我需要 Javascript 也没关系。 SO 上没有其他解决方案适合我。谢谢。

编辑:

<link rel="stylesheet" type="text/css" href="formalign.css">
      <script type="text/javascript" src="trinit5.js"></script>
      <button class="button" id="btn" input onclick="doSingle();" alt="Summon">Summon</button>
      <img id="canvas"></img>
      <div class="element"></div>

我应该在哪里嵌入该部件？

Answer 1

输入标签(它是独立标签)和按钮标签(它是配对标签)，如果你想要一个按钮，你可以尝试两件事:

1-将按钮分配给类型属性

<input type="button" id="btn" onclick="myFunction()" value="Click Me">

2-使用按钮标签，它也有 type 属性，但默认情况下按钮分配给 type 属性

<button id="btn" onclick="myFunction()">Click Me!</button>

在js中我写了一个函数JS:

<script>
    function myFunction()
    {
      document.getElementById('btn').style.display ='none'; //first hide the button
      setTimeout(function(){ //using setTimeout function
      document.getElementById('btn').style.display ='inline'; //displaying the button again after 3000ms or 3 seconds
    }
    ,3000); 
    }
</script>

注意:setTimeout() 方法在指定的毫秒数后调用函数或计算表达式。提示:1000 毫秒 = 1 秒。提示:该函数只执行一次