ottenere JavaScript elementi figlio di className

Question

ho scritto la seguente linea in Javascript:

var eleCategory = document.getElementById("cmbCategory"); 

Ora voglio trovare tutte elementbyClassName contenuto nell'elemento eleCategory.

È possibile con qualcosa di simile?

var eleChild = eleCategory.getElementByClassName("autoDropdown"); 

Come posso ottenere l'elemento figlio dell'elemento padre?

Answer 1

getElementsByClassName non è stato implementato in tutti i browser. Niels' solution, ad esempio, non funziona in IE. Tuttavia, altri hanno creato la propria implementazione; John Resig ha un write-up su his blog

Answer 2

Sì, è possibile, vedere questo violino: http://jsfiddle.net/ajAY2/

Ma la getElementsByClassName restituirà un insieme di elementi, perché cercherà tutte le classi all'interno dell'oggetto. Quindi, se hai solo 1 classe del genere all'interno di questo oggetto, è necessario ottenere l'oggetto 0a come:

var eleChild = eleCategory.getElementsByClassName("autoDropdown")[0]; 

sceneggiatura Totale:

Script:

var eleCategory = document.getElementById("cmbCategory"); 
var eleChild = eleCategory.getElementsByClassName("autoDropdown"); 
alert(eleChild.length); 

HTML

<div id="cmbCategory"> 

    <div class="autoDropdown"></div> 
    <div class="autoDropdown"></div> 
</div> 

<div class="autoDropdown"></div> 

Answer 3

var eleChild = eleCategory.childNodes; 
for(i = 0 , j = eleChild.length; i < j ; i++){ 
    if(eleChild[ i ].className == "autodropdown"){ 
     YOUr_SCRIPT 
    } 
} 

Answer 4

È possibile accedere a tutto in DOM albero, con questo:

document.childNodes[0].childNodes[0].childNodes[0] ... n[n] ... 

Basta guardare per childNodes di childNodes. E se ricordo bene, è possibile:

var element = document.getElementById("myid"); 
var child = element.childNode[0] 

Answer 5

Il modo moderno:

var element = document.querySelector('#Element'); 
var elementChildren = element.querySelectorAll('.Element-child'); 

elementChildren conterrà un array di tutti i bambini con una classe di Element-child all'interno element.

Utilizzando la notazione della parentesi, è possibile accedere all'ennesima figlia nel nostro array, ad es.

var firstElementChild = elementChildren[0]; // zero-based