2011-01-17 9 views
15

Qual è il modo più semplice per ottenere la profondità di un elemento in puro JavaScript o jQuery? Con "profondità" intendo quanti elementi profondi è annidato, o quanti antenati ha.JS/jQuery: ottieni profondità dell'elemento?

+0

http://stackoverflow.com/ domande/748842/how-to-get-all-element-parents-using-jquery – mplungjan

risposta

24

ne dite:

$('#my-element').parents().length 
2

provare qualcosa di simile:

<html> 
    <head> 
     <title>MooExample</title> 
     <script type="text/javascript" src="jquery.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       $("li").click(function() { 
        alert($(this).parents().length); 
       }); 
      }); 
     </script> 
    </head> 

    <body> 
     <ul> 
      <li>moo</li> 
      <li>foo</li> 
      <li>fasoo</li> 
      <li>moasf</li> 
      <li>moosadg</li> 
      <li>moo1</li> 
      <li>moo412</li> 
      <li>moo613a</li> 
     </ul> 
    </body> 
</html> 
4

Supponendo non si desidera includere corpo e tag HTML nei genitori di contare l'uso:

$("#element").parents("*").not("body,html").size() 

Demo online qui: http://jsfiddle.net/zaJff/

1

Il mio consiglio sarebbe quello di ripensare il modo in cui risolvete il vostro problema - penso che trovare il numero di generazioni tra i nodi probabilmente non sia il modo migliore per andare, sembra una soluzione che probabilmente si romperà facilmente con le modifiche future al codice.

Se insistete invece, la soluzione (da Cletus, in javascript nativo) sembra abbastanza buono in questa pagina: find number of nodes between two elements with jquery?

+0

Quando la soluzione polarblau sarebbe errata? Ogni elemento può avere un solo genitore, quindi logicamente, se sta contando il numero di antenati, dovrebbe sempre essere corretto. Ho dimenticato perché stavo facendo la domanda anche se ... probabilmente era un cattivo approccio. – mpen

+0

In realtà ora che ci penso, hai ragione, correggendo il mio commento. –

8

Una nota aggiuntiva. Se si desidera ottenere la profondità relativa ad un certo contesto si può fare:

var depth = $("#my-element","#ContextContainerID").parents("ul").length; 

Sopra, sto cercando di quanti UL sono all'interno del contenitore #ContextContainerID

+0

C'è un diff tra 'size()' e 'lunghezza'? – mpen

+0

@Sachin Sharma suggerisce '$ (" # mio-elemento "). ParentsUntil (" # ContextContainerID "," ul "). Length' – mplungjan

Problemi correlati