JavaScript: Unable to read all elements from innerHTML content -


i trying read elements in innerhtml of div, seems alternate elements being read.

code block:

<!doctype html> <html>   <body>     <script type="text/javascript">        var tdiv=document.createelement("div");        tdiv.innerhtml="<span>a1</span><span>a2</span><span>a3</span><span>a4</span><span>a5</span>";         var cn=tdiv.getelementsbytagname("*");        var len=cn.length;         console.log("length: "+len);        console.log("tdiv len: "+tdiv.getelementsbytagname("*").length);         for(var i=0;i<len;i++){           if(cn[i]){              console.log(i+": "+cn[i].nodename+": "+cn[i].tagname);              document.body.appendchild(cn[i]);           }        }     </script>   </body> </html> 

output: a1a3a5

note: a2 , a4 missing. have tried using both childnodes , getelementsbytagname("*") in browsers, ie, ff, chrome, opera, safari , see same behavior.

when add white space between spans elements being read. expected behavior ? if so, why ?

the returned item live nodelist. appending them body element, nodelist shrinking each iteration of for loop. causes appear it's arbitrarily skipping elements.

try...

while (cn.length) {     cn[0] && document.body.appendchild(cn[0]); } 

jsfiddle.

when add white space between spans elements being read. expected behavior ? if so, why ?

yes, it's expected. means instead of skipping span elements, it's skipping text nodes introduced spaces. never rely on - it's terribly fragile.


Comments

Popular posts from this blog

html5 - What is breaking my page when printing? -

c# - must be a non-abstract type with a public parameterless constructor in redis -

ajax - PHP/JSON Login script (Twitter style) not setting sessions -