我想把所有名字叫“面具”的div都藏起来
这是我的HTML:
<div id="first">
<div id="firsttest"></div>
<div class="one onehelp">
<div id="mask">
<div id="onetip"></div>
</div>
<div id="Div5"></div>
<div id="resultone"></div>
</div>
<div class="two twohelp">
<div id="mask">
<div id="twotip"></div>
</div>
<div id="Div6"></div>
<div id="resulttwo"></div>
</div>
<div class="three threehelp">
<div id="mask">
<div id="threetip"></div>
</div>
<div id="Div7"></div>
<div id="resultthree"></div>
</div>
</div>
我试着用下面的JS代码隐藏“mask”,但它并不适用于所有div,只适用于第一个div。
var hidemask = document.getElementById("mask");
hidemask.style.display = "none";
有没有办法用纯Javascript隐藏它们。没有jQuery。
最佳答案
您不应该在HTML中使用重复的ID,请考虑将其更改为类。
如果将id="mask"
更改为class="mask"
,则可以执行以下操作:
var hidemask = document.querySelectorAll(".mask");
for (var i = 0; i < hidemask.length; i++) {
hidemask[i].style.display = "none";
}
或者对于仍处于石器时代(IE7及以下版本)的浏览器,可以执行以下操作:
var elems = document.getElementsByTagName('*'), i;
for (i in elems) {
if((' ' + elems[i].className + ' ').indexOf(' ' + 'mask' + ' ') > -1) {
elems[i].style.display = "none";
}
}
关于javascript - 使用JavaScript隐藏具有相同名称的DIV,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/19127047/