zxfjnfjcn
朱小熊
2017-08-25 12:50
采纳率: 75%
浏览 840

初学JS求大神帮忙修改一下!

求大神帮忙实现一下,点击“隐藏”,可以隐藏h1标签里面的内容,同时把隐藏变成显示。再点击反之求大神指点,在线等。。。

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>显示隐藏</title>
</head>
<body>
    <div class="btn">隐藏</div>
    <h1 class="show" >快把我隐藏起来</h1>
</body>
<script type="text/javascript">
    // 获取元素
    var btn = document.getElementsByClassName('btn')[0];
    var showDiv = document.getElementsByClassName('show')[0];
    // 添加点击事件
    btn.onclick = function(){
        //      
        if (showDiv.style.display != "none");
            btn.innerHTML = '显示';
            showDiv.style.display = "none";
        }else{
            btn.innerHTML = '隐藏';
            showDiv.style.display = "block";
        }       
    }
</script>
</html>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

8条回答 默认 最新

  • Small_Mouse0
    鼠小 2017-08-25 14:40
    已采纳

    帮你改好了,,,你试试下面的,,,给个采纳呗,,有问题还可以追问,,

     <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>显示隐藏</title>
    </head>
    <body>
    <div class="btn" onclick="change()">隐藏</div>
    <h1 class="show">快把我隐藏起来</h1>
    </body>
    <script type="text/javascript">
        function change() {
            // 获取元素
            var btn = document.getElementsByClassName('btn')[0];
            var showDiv = document.getElementsByClassName('show')[0];
            // 添加点击事件
            btn.onclick = function () {
                //
                if (showDiv.style.display != "none")
                {
                    btn.innerHTML = '显示';
                    showDiv.style.display = "none";
                }
                else
                {
                    btn.innerHTML = '隐藏';
                    showDiv.style.display = "block";
                }
            }
        }
    
    </script>
    </html>
    
    点赞 评论
  • googleoyyp
    googleoyyp 2017-08-25 13:49

    <!DOCTYPE html>



    显示隐藏


    隐藏

    快把我隐藏起来


    // 获取元素 var btn = document.getElementsByClassName('btn')[0]; var showDiv = document.getElementsByClassName('show')[0]; // 添加点击事件 btn.onclick = function(){ // if (showDiv.style.display != "none"){ btn.innerHTML = '显示'; showDiv.style.display = "none"; }else{ btn.innerHTML = '隐藏'; showDiv.style.display = "block"; } }

    缺少一个括号

    点赞 评论
  • SJBBBWQ
    SJBBBWQ 2017-08-25 19:27

    jq tiggle()方法

    点赞 评论
  • bm15533984642
    尅湖的雨 2017-08-26 01:32

    为什么要用js呢,

    jquery更容易解决:
    <!DOCTYPE html>






    显示

    这是一个段落




    <br> $(document).ready(function(){<br> $(&quot;#btn&quot;).click(function(){<br> $(&quot;#demo&quot;).toggle();<br> });<br> });<br>
    点赞 评论
  • jkl012789
    叮咚呛咚呛 2017-08-26 08:08

    建议学习jquery

    点赞 评论
  • haihhhhh
    leon老海 2017-08-27 14:27

    jquey,原生js都要学、练。如果是做前端开发的,更要多写写原生的。

    点赞 评论
  • chen510103032
    chen510103032 2017-08-28 08:13

    if (showDiv.style.display != "none")**;**

    把 ;改为 }

    点赞 评论
  • qq_29436025
    qq_29436025 2017-08-29 07:56
    var show = document.querySelector(".show"); document.querySelector(".btn").onclick = function () { this.innerHTML = (this.innerHTML === "隐藏" ? "显示" : "隐藏"); show.style.display = (show.style.display === "none" ? "block" : "none"); }
    点赞 评论

相关推荐