javascript中的显示和隐藏（display属性）

最新推荐文章于 2025-02-19 17:30:34 发布

武晓兵

最新推荐文章于 2025-02-19 17:30:34 发布

阅读量4.3w

点赞数 2

分类专栏： JavaScript

本文链接：https://blog.csdn.net/wuxiaobingandbob/article/details/51381091

版权

JavaScript 专栏收录该内容

82 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现网页元素显示与隐藏的方法。通过简单的HTML页面与JavaScript代码结合，用户可以点击按钮来控制文本内容的显示或隐藏，从而改善用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>display</title>
    <script type="text/javascript">
        function hidetext()
       {
       var mychar = document.getElementById("con");
         mychar.style.display="none"; // 不显示，隐藏
       }
       function showtext()
       {
       var mychar = document.getElementById("con");
         mychar.style.display="block";   // 显示，不隐藏
       }
    </script>
</head>
<body>
    <h1>JavaScript</h1>
    <p id="con">做为一个Web开发师来说，如果你想提供漂亮的网页、令用户满意的上网体验，JavaScript是必不可少的工具。</p>
    <form>
       <input type="button" οnclick="hidetext()" value="隐藏内容" />
       <input type="button" οnclick="showtext()" value="显示内容" />
    </form>
</body>
</html>