Как искать дочерние элементы 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

И вы можете использовать getElementById просто сделать document.getElementById(id), так как идентификаторы уникальны который найдет тот единственный элемент div, который вы хотели.

Вы также можете использовать elem.getElementsByClassName, чтобы выбрать потомка элемента по классу