Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Please explain difference between IE and Firefox in dom .childNodes length values.

Posted on 2006-06-22
3
Medium Priority
?
477 Views
Last Modified: 2008-01-16
Here is a test html file.  (see below).  In IE it returns the number of child nodes for the row as 3, which is what I expected.  In firefox it returns the number of children as 7, which appears to be the number of all descendents, not just the number of children.  Is there an easy way of getting the number of children that will work in both IE and firefox?

==== code below ====
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<head>
      <title>Untitled</title>
</head>

<body>
<table id="t" border="1">
<tr id="row1">
<td id="cell1">cell 1</td>
<td id="cell2"><div id="div1">cell 2 in div</div></td>
<td id="cell3"><div id="div2">cell 3 in div</div></td>
</tr>
</table>

<script type="text/javascript">var tr = document.getElementById("row1")
            document.write("number of childs:"+tr.childNodes.length)
</script>
</body>
</html>
0
Comment
Question by:Bob_j_Wallace
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 30

Accepted Solution

by:
GrandSchtroumpf earned 500 total points
ID: 16964817
That's because IE ignores the text nodes that separate your <td> elements.
This script shows the node types (3 = text node):

<script type="text/javascript">
  var tr = document.getElementById("row1")
  document.write("number of childs:"+tr.childNodes.length)
  var children = tr.childNodes;
  for (var i = 0; i < children.length; i++) {
    document.write("<br>childs node type:" + children[i].nodeType);
  }
</script>

remove the space chars between your <td> and you'll get the same results in all browsers:

<table id="t" border="1">
<tr id="row1"><td id="cell1">cell 1</td><td id="cell2"><div id="div1">cell 2 in div</div></td><td id="cell3"><div id="div2">cell 3 in div</div></td></tr>
</table>

You can use the DOM inspector in FF (menu tools/DOM inspector).  It will show you the text nodes.
0

Featured Post

[Webinar] Lessons on Recovering from Petya

Skyport is working hard to help customers recover from recent attacks, like the Petya worm. This work has brought to light some important lessons. New malware attacks like this can take down your entire environment. Learn from others mistakes on how to prevent Petya like worms.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I spend far too much time on the web keeping up with the news: politics, the environment, computer stuff, the Experts Exchange. It's never-ending. But many of the most informative web pages are overwhelmed with noise: scrolling banners, flashing tex…
SSL stands for “Secure Sockets Layer” and an SSL certificate is a critical component to keeping your website safe, secured, and compliant. Any ecommerce website must have an SSL certificate to ensure the safe handling of sensitive information like…
Google currently has a new report that is in beta and coming soon to Webmaster Tool accounts. This Micro Tutorial will highlight new features for Google Webmaster Tools.
This Micro Tutorial will demonstrate how nuggets on the Web are formatted by using Chrome Developer Tools. These tools would not only view the site's CSS but it can also modify it and save the CSS to use on your own site.

636 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question