JavaScript 学习_006 javasrcipt 能够 隐藏和显示html的元素

由 hrs, 31 十月, 2020

在这个实例中我们来使用javasrcipt 隐藏和显示html的元素，利用style.display属性来控制字段的隐藏和显示。

实例代码：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <h2>Javasrcipt 能做什么？</h2>
    <p >javasrcipt 能够改变html 元素。</p>
    <p id="demo">点击隐藏元素，则这条字段将被隐藏<p> 
    <p id="block" style="display:none"> 这条字段是由style.display属性显示出来的>。</p>
    <button onclick="document.getElementById('demo').style.display='none'">隐藏>元素</button>
    <button onclick="document.getElementById('block').style.display='block'">显>示元素</button>
    <p style="color:red">提示：点击按钮会改变相应的html元素。</p>     
  </body>
</html>


<!--
 style.display='none'  隐藏元素
style.display='block'  显示元素

-->

运行效果：

javasrcipt_006.png

标签

评论