为什么这个 JavaScript 适用于 FF 而不是 IE8
半年后我刚刚发现 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="»" 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="«" class="middle" />
</p>
</p>
</form>
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="»" 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="«" class="middle" />
</p>
</p>
</form>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
尽管 IE9 和其他浏览器可以,但 IE8 及更低版本无法向某些元素添加 textNode。
There are elements that IE8 and below cannot add textNodes to, though IE9 and other browsers do.
getElementsByClass
不是内置函数,因此它可能来自您正在使用的其他与 IE8 不兼容的库。在这种情况下,它返回的内容可能不是有效的 DOM 节点集。如果您可以发布该方法的作用,这将有助于我们进行调试。否则,您可以尝试使用
document.querySelectorAll('.field_' + name)
来代替,看看是否可以解决问题; IE8 及以上版本支持此功能,至少在标准模式下是这样。编辑:您的自定义
getElementsByClass
函数看起来不错,尽管没有单元测试,我很难 100% 确定。一种测试方法是尝试用return document.querySelectorAll('.field_' + name)
替换getElementsByClass
的主体,看看是否可以解决问题...这样,getElementsByClass
函数仍然存在,因此您的所有其他代码都没有损坏,但它可能更正确。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 ofgetElementsByClass
withreturn document.querySelectorAll('.field_' + name)
and see if that fixes it... In this way, thegetElementsByClass
function still exists, so all your other code is not broken, but it may be more correct.好吧,删除末尾的*
well, remove the * at the end of