Why does this JavaScript work for FF and not IE8

I have just found out after half a year that an IE cannot process this script and now that my programmer is gone I'm stuck with it myself :-(

It works fine in FF

This is the code:

function updateFields(name, value) {
  var elements = getElementsByClass('field_' + name);
  for(var i=0; i<elements.length; i++) {
    var e = elements[i];
    while(e.firstChild != null) { e.removeChild(e.firstChild); }
    e.appendChild(document.createTextNode(value + ' '));*
  } // for i
} // updateFields()

My IE debugger complains about the line marked with *. It says: Error: Unexpected call to method or property access.

Can anybody spend some of his/her precious time to help? Please write answers as if I'm a four-year-old.

function getElementsByClass(cls) {
  var fields = document.getElementsByTagName('*');
  var r = new Array();

  for(var i=0; i<fields.length; i++) {
    var f = fields[i];

    var a = f.getAttribute('class');
    if(a == null)
      a = f.className;

    if(a == null)
      continue;

    var classes = a.split(' ');
    for(var j=0; j<classes.length; j++) {
      if(classes[j] == cls) {
        r.push(f);
        break;
      } // if
    } // for j
  } // for i

  return r;
}
开发者_运维技巧

Button:

<form>
  <p class="center">
    <input type="button" onclick="javascript:book_wire_transfer();" style="border: none;      border:0;"\>


  <p class="center">
    <img src="http://www.-.com/images/text/arrow_left_small.png" alt="&raquo;" class="middle" />
    <span class="submit">
      <input class="submit" type="submit" value="Book now"  />
    </span>
    <img src="http://www.-.com/images/text/arrow_right_small.png" alt="&laquo;" class="middle" />
    </p>

  </p>
  </form>

There are elements that IE8 and below cannot add textNodes to, though IE9 and other browsers do.

option element(use optionelement.text)
input element(use inputelement.value)
style element(use styleelement.styleSheet.cssText)
script element(use scriptelement.text)

getElementsByClass is not a built-in function, so it probably comes from some other library you are using that is incompatible with IE8. In this case, it is probably returning something that is not a valid set of DOM nodes.

If you could post what that method does, that would help us in debugging. Otherwise, you could try using document.querySelectorAll('.field_' + name) instead and see if that fixes it; this is supported in IE8 onwards, at least if you are in standards mode.

EDIT: your custom getElementsByClass function looks OK, although without unit tests it's hard for me to be 100% sure. One way to test would be to try and replace the body of getElementsByClass with return document.querySelectorAll('.field_' + name) and see if that fixes it... In this way, the getElementsByClass function still exists, so all your other code is not broken, but it may be more correct.

well, remove the * at the end of

 e.appendChild(document.createTextNode(value + ' '));*