如何搜索HTMLDivElement的子项？

Question

我有一个HTMLDivElement,我的目标是找到一个div嵌套在这下面.

理想情况下,我想要类似的东西getElementById,但该功能不起作用HTMLDivElement.

我是否需要手动遍历图表,还是有更简单的方法？

Answer 1

演示:http://jsfiddle.net/ThinkingStiff/y9K9Y/

如果<div>您正在搜索有课程,您可以使用getElementsByClassName():

document.getElementById( 'parentDiv' ).getElementsByClassName( 'childDiv' )[0];

如果它没有类,您可以使用getElementsByTagName():

document.getElementById( 'parentDiv' ).getElementsByTagName( 'div' )[0];

如果它有,id你当然可以用getElementById()它来找到它,无论它在DOM中的位置:

document.getElementById( 'childDiv' );

Answer 2

  //For immediate children 

  var children = document.getElementById('id').childNodes;

   //or for all descendants

   var children = document.getElementById('id').getElementsByTagName('*');

Answer 3

var div = ...
var divChildren = div.getElementsByTagName("div");
var divYouWant = [].filter.call(divChildren, function (el) {
  return matchesSomeCondition(el);
});

理想情况下，我想要像 getElementById 这样的东西

您可以使用getElementByIdjust do document.getElementById(id)and 因为 ids 是唯一的，可以找到您想要的单个 div 项目。

您还可以使用elem.getElementsByClassName按类选择 elem 的后代