jQuery seleziona elementi al 1o "livello"

Question

Voglio selezionare solo gli elementi sul primo "livello".

Es:

<div id="BaseElement"> 
    <p>My paragraph 0</p> 
    <div> 
    <span>My Span 0</span> 
    <span>My Span 1</span> 
    </div> 
    <span>MySpan 2</span> 
    <span>MySpan 3</span> 
    <p>My paragraph 1</p> 
</div> 

Diciamo che avete ottenuto il nodo BaseElement.

var Element = $("div#BaseElement"); 

Come si prelevano i nodi dal solo nodo dell'elemento di base?

$("div#BaseElement span") 

dovrebbe portare solo a ottenere MySpan 2 e MySpan 3.

Answer 1

$("#BaseElement").children("span"); 

o

$("#BaseElement > span"); 

Vedi jQuery selectors e children().

Answer 2

Nel API jQuery, quando si fa riferimento a 'discendenti' significa tutti i livelli, e quando si riferisce ai 'figli' significa solo il primo livello

questo ti porterà a tutti i bambini di primo livello (nella tua esempio il primo p, div, 2 campate, e ultimo p)

$('#BaseElement > *') 

Answer 3

Vedi anche What is the difference direct descendent (>) vs. descendant in jQuery selectors? differenze tra spazio e > nei selettori. Con spazio è uguale a find() e > uguale a children(). In altre parole, le seguenti coppie sono equivalenti,

$("#BaseElement").children("span"); 
$("#BaseElement > span"); 

ottenere tutti i bambini, più i loro discendenti:

$("#BaseElement").find("span"); 
$("#BaseElement span");