remove - Seleccionando segundos hijos de primeros div niños en javascript

remove element javascript

Question

Tengo un html que se parece a esto:

<div id="mainDiv"> <-- I have this
    <div>
        <div></div>
        <div></div> <-- I need to get this
    </div>
    <span></span>
    <more stuff />
</div>

estoy usando:

var mainDiv = document.getElementById(''mainDiv'');

porque necesito ese div en una var, pero también necesito obtener ese segundo div en el primer div dentro de mainDiv en una variable.

¿Cómo podría hacerlo de una manera simple en varios navegadores?

Answer 1

Elegiría jQuery y terminaría con algo como esto:

var getThis = $(''#mainDiv > div:eq(0) > div:eq(1)'');

Fiddle

Answer 2

Suponiendo que la estructura es estática puedes hacer esto:

var mainDiv = document.getElementById(''mainDiv''),
    childDiv = mainDiv.getElementsByTagName(''div'')[0],
    requiredDiv = childDiv.getElementsByTagName(''div'')[1];

Lectura adicional: .getElementsByTagName() (de MDN) .

Answer 3

Yo iría simplemente con una sola línea de código de vainilla.

Funciona para cualquier elemento, no se limita a los nombres de etiqueta que tiene en la estructura. Pero el número de elementos y la jerarquía deben ser preservados.

var requiredDiv = document.getElementById(''mainDiv'').firstChild.firstChild.nextSibling;

Answer 4

var mainDiv = document.getElementById(''mainDiv'');
var div = maindiv.getElementsByTagName(''div'')[2];//third div

http://jsfiddle.net/MGVw8/

Answer 5

 var mainDiv = document.getElementById(''mainDiv'');
 var x = mainDiv.children[0].children[1];

o

 var mainDiv = document.getElementById(''mainDiv'');
 var x = mainDiv.getElementsByTagName(''div'')[0].getElementsByTagName(''div'')[1];