How to navigate some specific child nodes

Question

I have this DOM tree:

<li> 
data ....
  <br>
  data ...
  <img ... />
  <br>
  <script> ... </script>
  <span> data ... </span>
</li>

how can I scroll the children of this li element that fall between the sheet itself and the script element, i.e. script, and span elements are out of loop ... thanks in advace !!

note: I do not want to use jQuery because my application uses Protoype and it will conflict with jQuery, if I use both of them together, I would appreciate a quick solution using Prototype.

Answer 1

is something like this work for you?

var child = liElement.firstChild;
while(child){
    if(child.nodeName.toLowerCase() == 'script'){
        break
    }
    //do your stuff here
    child = child.nextSibling;
}

, "" , textNodes. , ,

switch(child.nodeType){
case 3:
   //text Node
   break;
case 1:
   //Element node
   break;
default:
    //break;
}

https://developer.mozilla.org/en/nodeType node

Answer 2

jQuery:

<li>:

$('li').children();

:

$('li').children().not('script').not('span');

:

$('li').children().not('script').not('span').each(function(index, element){
    //do sth like hide the element
    $(element).hide();
});

Answer 3

, :

    $( "li" ).each(function( index ) {
 console.log($(this).find("span:first").text());
});

Answer 4

hav eyou looked at jquery? It has a very subtle query syntax. i`m nit is sure which particular elements you want to loop, but for intance: $ ('li> img') will return all images under all elements of the list. check specification for more jquery