Question

当我点击按钮时，我试图让它显示div，我做错了什么？

<button type="button" onclick="myFunction()">Click Me!</button>
<div class="dglow">Glow</div>

<script>
    function myFunction(){
        dglow.style.display='block'
    }
</script>

Answer 1

您使用

 document.getElementById("Dglow")

但你的元素不是id而是类。

您有2种方法可以解决它：

1）为你的元素添加一个id

<div id="Dglow" class="Dglow">
    Glow
</div>

Example

2）调用查找具有类

的元素

function myFunction() {
    var y = document.getElementsByClassName('Dglow');
    y[0].style.display = 'block';
}

Example

希望它可以帮助你。

Answer 2

你把班级与id混为一谈。

你说：

class = "Dglow"

但是在javascript中你做了：

getElementById("Dglow")

而是使html等于：

id = "Dglow"

Answer 3

你只需要在div中添加id。

function myFunction() {
document.getElementById("Dglow").style.display = 'block';
}

.Dglow
{
  display:none;
  }

<button type="button" onclick="myFunction()">Click Me!</button>

<div id="Dglow" class="Dglow">
Glow
</div>

Answer 4

这是你想要的吗？将类更改为Id并显示和隐藏。

var dglow=document.getElementById("dglow");

function myFunction(){
    var style=dglow.style.display;
        if(style=='block')
        	{
            dglow.style.display='none';
        	}
    	else{
            dglow.style.display='block';
        	}    			
    }

<button type="button" onclick="myFunction()">Click Me!</button>
<div id="dglow" style="display:none;">Glow</div>

如何让按钮显示内容onclick？

4 个答案: