使用javascript隐藏div

Question

我想使用 javascript 隐藏没有与其关联的 id 的 div。例如，在共享点 .ms-globalbreadcrumb 中没有 id。

frame = document.getElementById('frame1'); 
frame.contentWindow.document.getElementById('ctl00_PlaceHolderGlobalNavigation_PlaceHolderGlobalNavigationSiteMap_GlobalNavigationSiteMap').style.display='none'; 

上面的代码适用于有 id 的片段，但我不确定如何为其他没有 id 的 div 实现此目的。

谢谢，

Answer 1

使用标准化对 DOM 的访问的东西会让您的生活变得更加轻松，以便相同的代码（对于所有内容 - 表单、事件、对象属性等）可以在所有浏览器上运行。使用 JQuery 只是：

$('div').hide();

隐藏所有 div...并且有很大范围的 'selectors' 来优化您的选择。

Answer 2

案例一
如果您想隐藏所有没有 id 的 div，那么您必须循环所有 div 并根据该条件隐藏它们。 （使用 .getElementsByTagName()< 查找 div /a>)

var alldivs = document.getElementsByTagName('div');
for( var i = 0; i < alldivs.length; i++) {    
       alldivs[i].style.display = "none";
    }

---

案例 2
如果您想查找基于类的元素，就像您的示例中的 .ms-globalbreadcrumb 那么（查找带有 .getElementsByClassName()）

var allbyclass = document.getElementsByClassName('ms-globalbreadcrumb');
for( var i = 0; i < allbyclass.length; i++) {    
       allbyclass[i].style.display = "none";
    }

（ getElementsByClassName 不适用于 IE9 之前的 IE 版本）

两种情况的示例位于 http://jsfiddle.net/gaby/H3nNr/

---

建议

使用jQuery 允许各种 选择器和复杂的遍历 DOM 找到你想要的东西想要..

• jQuery 中的情况 1 为 $('div:not([id])').hide();
• jQuery 中的情况 2 为 $('.ms-globalbreadcrumb ').hide();

Answer 3

如果您可以在 DOM 中找到 div，那么您应该能够隐藏它们。例如，如果父/祖父母等 div 有一个 ID，您可以使用 Javascript 沿着 DOM 树向下查找，直到找到要隐藏的元素。

var elem = document.getElementById("topelement");
var elem2 = elem.firstChild.firstChild;
elem2.style.display = "none";

JQuery 有很多选择器可以让这种事情变得简单。

Answer 4

所以还有其他方法可以使用
您可以通过标记名或类来获取它们

 document.getElementsByClassName
 document.getElementsByTagName

，它们返回您需要迭代的元素列表，

因此您的示例应该是

var ellements = frame.contentWindow.document
   .getElementsByClassName("ms-globalbreadcrumb");
for(i in ellements) {
  ellements[i].style.display = "none";
}