logo标签列表

使用JavaScript隐藏HTML元素

javascripthtml
20
如何使用JavaScript隐藏HTML元素？如果我有这个HTML页面。
<body>

<h1>test</h1>

<div id="1" align="center" style="padding-top: 10%;" >
 <h1 style="color: #FFFFFF">fawazapp</h1>
 <p style="color: #C0C0C0;"> bbb</p>
 <p style="color: #FFFFFF;">aaaaaaaaa</p>

 </div>

<div id="2" align="center" style="padding-top: 10%;" >
 <h1 style="color: #FFFFFF">fawazapp</h1>
 <p style="color: #C0C0C0;"> bbb</p>
 <p style="color: #FFFFFF;">aaaaaaaaa</p>

 </div>

</body>

我想要隐藏除了ID为“number 2”的div之外的所有元素，使页面变成这样。

<div id="2" align="center" style="padding-top: 10%;" >
 <h1 style="color: #FFFFFF">fawazapp</h1>
 <p style="color: #C0C0C0;"> bbb</p>
 <p style="color: #FFFFFF;">aaaaaaaaa</p>

 </div>
你的问题有点含糊不清。你想什么时候做这件事？那是你页面的完整HTML吗？你是否希望其他DIV重新显示出来？等等。请你更新一下你的问题，包括这些答案。 - mohkhan
2
这与Xcode和iOS有什么关系？ - Ry-
5个回答
30

除了DevlshOne的答案，您还可以使用CSS使其不显示：

var divOne = document.getElementById('1');
divOne.style.display='none';

这两者是有区别的。使用 visibility:hidden，该 div 元素仍会占据空间，但你看不见它。而使用 display:none，就像它不存在一样。

根据你的需要选择更适合你的方式。

10

你需要使用类似这样的东西：

document.getElementById("1").style.display = "none";
6

以上的答案基本上都是正确的，但你需要注意一下display = "none" 和 visibility = "hidden"之间的区别。使用display "none"时，该元素从页面元素布局中被移除了；而使用visibility "hidden"时，该元素仍占据着它的空间，只是你看不到它了。

2
这种方法仍然占据容器中的空间，只是可见性被隐藏了。 - Omkar Yadav
0

您可以使用JQUERY：$('#1').hide()

太好了

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接