初学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个回答

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

 <!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>

<!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"; } }

缺少一个括号

建议学习jquery

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

var show = document.querySelector(".show"); document.querySelector(".btn").onclick = function () { this.innerHTML = (this.innerHTML === "隐藏" ? "显示" : "隐藏"); show.style.display = (show.style.display === "none" ? "block" : "none"); }

jq tiggle()方法

为什么要用js呢,

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






显示

这是一个段落




<br> $(document).ready(function(){<br> $(&quot;#btn&quot;).click(function(){<br> $(&quot;#demo&quot;).toggle();<br> });<br> });<br>
zxfjnfjcn
vic.zhu jQuery之前没学,谢谢
2 年多之前 回复

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

把 ;改为 }

chen510103032
chen510103032 写错了, 把 ;改为 {
2 年多之前 回复
chen510103032
chen510103032 写错了 把 ;改为 {
2 年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问