为什么这个JavaScript在Firefox中能够运行而在IE8中不能运行？

Question

我刚刚发现，在半年后，IE无法处理这个脚本，现在我的程序员已经离开了，所以我只能自己解决了 :-(

在FF中它运行正常。

这是代码：

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()

我的IE调试器指出了带有*标记的行。 它显示：错误：意外调用方法或属性访问。

有没有人能花一些他/她珍贵的时间来帮忙？ 请把答案写得像我是一个四岁的孩子。

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;
}

按钮：

<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>

- Tom

---

你好，Alxandr， 我不明白你的意思。你所说的“mode”是什么意思？ - Tom

在谷歌上有很多关于“ie8模式”的结果。 - Lightness Races in Orbit

如果你在IE中按F12，它会打开一个新窗口（即IE中的调试器窗口）。在该窗口的顶部栏中，您可以看到浏览器模式和文档模式。 - Alxandr

这个（http://jsfiddle.net/BZB3t/）对我有效... - Alxandr

Answer 1

在IE8及以下版本中，有一些元素无法添加文本节点，但IE9和其他浏览器可以。

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

- kennebec

Answer 2

getElementsByClass不是一个内置函数，所以它可能来自于你正在使用的某个与IE8不兼容的库。在这种情况下，它可能返回的是一些无效的DOM节点集合。

如果你能够发布该方法的具体功能，那将有助于我们进行调试。否则，你可以尝试使用document.querySelectorAll('.field_' + name)来替代，并查看是否解决了问题；至少在IE8及以上版本中支持这种方式，前提是你处于标准模式。

编辑：你自定义的getElementsByClass函数看起来还不错，虽然没有单元测试很难百分之百确定。一种测试的方法是尝试将getElementsByClass函数的主体替换为return document.querySelectorAll('.field_' + name)，看看是否解决了问题... 这样，getElementsByClass函数仍然存在，所以你的其他代码不会出错，但可能更加正确。

- Domenic

---

在IE怪异模式下，document.getElementsByClassName未定义。 - Alxandr

即使在IE8中也会出现这种情况？？该死！！好的，使用querySelectorAll建议进行修复。 - Domenic

当然，你说得对，但令人惊讶的是，在IE8标准模式下也不存在。O_o - Domenic

@Tom，如果你能够编辑你的帖子并适当地格式化它，那将比我试图在评论栏中阅读要好得多。 - Domenic

我希望尽可能避免更改名称，除非必要。这个网站很大，我不知道有多少模板在引用那个名称。 - Tom

Answer 3

好的，将末尾的星号*删除

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

- Anze Jarni