Traverse

This section discusses methods that will enable you to walk the DOM, from selecting the parent to selecting the nodes that are next to the current element.

end( )

Gets the elements in the previous chain.

<div>a</div>
<span>b</span>

Karma('div'); // div
Karma('div').add('span'); // div, span
Karma('div').add('span').end(); // div

children( [selector] )

Selects all the children of the elements that match the selector (only if selector exists)

<ul>
 <li>a</li>
 <li>b</li>
 <li>c</li>
</ul>

alert(Karma('ul').children().get()); // [ <li>a</li>, <li>b</li>, <li>c</li> ]

decendents( selector ) / find( selector )

Selects all the decendents of the elements that match the selector.

<div id="demo">
  <ul>
   <li>a</li>
   <li>b</li>
   <li>c</li>
  </ul>
</div>

alert(Karma('#div').decendents('li').get()); // [ <li>a</li>, <li>b</li>, <li>c</li> ]

parent( [selector] )

Selects all the parent of the elements that match the selector (only if selector exists)

<div id="demo">
  <ul>
   <li>a</li>
   <li>b</li>
   <li>c</li>
  </ul>
</div>

alert(Karma('ul').parent().get()); // [ #demo ]

ancestors( [selector] )

Selects all the ancestors of the elements that match the selector (only if selector exists)

<div id="demo">
  <ul>
   <li>a</li>
   <li>b</li>
   <li>c</li>
  </ul>
</div>

alert(Karma('li').ancestors('div').get()); // [ div#demo ]

prev( [selector] )

Selects the sibling element that appears just before the current elements that match the selector (only if selector exists)

<div id="hi">a</div>
<div id="hi2">b</div>
<div id="hi3">c</div>

alert(Karma('#hi3').prev().get());        // [ <div id="hi2">b</div> ]
alert(Karma('#hi3').prev().prev().get()); // [ <div id="hi">a</div> ]

prevAll( [selector] )

Selects the all the sibling elements that appear before the current elements that match the selector (only if selector exists)

<div id="hi">a</div>
<div id="hi2">b</div>
<div id="hi3">c</div>

alert(Karma('#hi3').prevAll().get()); // [ <div id="hi">a</div>, <div id="hi2">b</div> ]

next( [selector] )

Selects the sibling element that appears just after the current elements that match the selector (only if selector exists)

<div id="hi">a</div>
<div id="hi2">b</div>
<div id="hi3">c</div>

alert(Karma('#hi2').next().get()); // [ <div id="hi3">c</div> ]

nextAll( [selector] )

Selects the all the sibling elements that appear after the current elements that match the selector (only if selector exists)

<div id="hi">a</div>
<div id="hi2">b</div>
<div id="hi3">c</div>

alert(Karma('#hi').nextAll().get()); // [ <div id="hi2">b</div>, <div id="hi3">c</div> ]

siblings( [selector] )

Selects siblings of the elements that match the selector (only if selector exists), current elements are not included

<div id="hi">a</div>
<div id="hi2">b</div>
<div id="hi3">c</div>

alert(Karma('#hi2').siblings().get()); // [ <div id="hi">a</div>, <div id="hi3">c</div> ]