Question

如何使用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为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>

Answer 1

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

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

两者之间存在差异。隐藏可见性后，div仍将占用空间，但您无法看到它。使用display ='none'，就好像它不存在一样。

为你选择更好的一个。

Answer 2

你需要使用这样的东西：

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

Answer 3

上面的答案基本上都是正确的，但你需要注意display =＆＃34; none＆＃34;之间的区别。＆安培; visibility =＆＃34; hidden＆＃34;。显示＆＃34;无＆＃34;该元素将从页面上的元素布局中删除。随着能见度＆＃34;隐藏＆＃34;元素仍然占据着它的空间，你再也看不到它了。

Answer 4

var divOne = document.getElementById('1');
divOne.style.visibility = 'hidden';

document.getElementById on MDN

Answer 5

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

很棒

使用javascript隐藏Html元素

5 个答案: