Row.cells[0].firstChild return different values in IE and FF.

Question

I have a javascript function (function toggleTree(theRow) ) where the row is passed to this function from a cell in a table onclick.

<tr class="rowWhite"><td style="text-align:center"><img class="expand" alt="" src="images/plus.jpg"onclick="toggleTree(this.parentNode.parentNode);" />

Toggle tree function is below.

    function toggleTree(theRow)
{
var imgEl = theRow.cells[0].firstChild;
if (theRow.cells[0].firstChild.className == "expand")
{
theRow.cells[0].firstChild.className="collapse";
theRow.cells[0].firstChild.src="images/minus.jpg";
alert(theRow.cells[0].firstChild.className);
alert(theRow.cells[0].firstChild.src);
return "expand";
}
else
{
theRow.cells[0].firstChild.className="expand";
theRow.cells[0].firstChild.src="images/plus.jpg";
alert(theRow.cells[0].firstChild.className);
alert(theRow.cells[0].firstChild.src);
return "collapse";
}
}

The values of theRow.cells[0].firstChild.className and theRow.cells[0].firstChild.src are different in IE and Firefox due to which, the function does not work in FF but it works in IE. How do i get the values into the jsfunction from any browser?

You must have some whitespace you are not showing. also cache your objects and put a space after the end " in src — mplungjan, Oct 02 '13 at 20:54
You want `.children[0]` instead of `.firstChild` because some browsers will return whitespace as a firstChild text node. — rescuecreative, Oct 02 '13 at 21:01

mplungjan · Answer 1 · 2013-10-04T06:55:50.150

0

You are likely getting a textnode in other browsers than IE

How about something like

Live Demo

window.onload=function() {
    var expImg = document.querySelectorAll("img.expand"); // for example
    console.log(expImg)
    for (var i=0;i<expImg.length;i++) {
        expImg[i].onclick=function() {  
          var exp = this.className == "expand";
          this.className=exp?"collapse":"expand";
          this.setAttribute("alt",this.className);
          this.src=exp?"images/minus.jpg":"images/plus.jpg";  
          // here you can do something with the row
        }
    }
}

edited Oct 04 '13 at 06:55

answered Oct 02 '13 at 21:01

mplungjan

169,008
28
173
236

querySelectorAll is great but it won't work in legacy IE. Make sure you don't need to support IE6 or IE7 before you use it. – rescuecreative Oct 02 '13 at 21:09

Row.cells[0].firstChild return different values in IE and FF.

1 Answers1