Javascript IE9 中的无效字符 DOM 异常
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5344029/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Invalid Character DOM Exception in IE9
提问by Pramanat
The following piece of JS which used to work in IE8 is failing now in IE9.
下面这段曾经在 IE8 中工作的 JS 现在在 IE9 中失败了。
document.createElement('<iframe id="yui-history-iframe" src="../../images/defaults/transparent-pixel.gif" style="position:absolute;top:0;left:0;width:1px;height:1px;visibility:hidden;"></iframe>');
I get the following exception : SCRIPT5022: DOM Exception: INVALID_CHARACTER_ERR (5)
我收到以下异常：SCRIPT5022: DOM Exception: INVALID_CHARACTER_ERR (5)
Is the above piece of code not according to standards. What's the fix for the issue?
上面这段代码是不是不符合标准。该问题的解决方法是什么？
采纳答案by Adam Ayres
The API for createElement specifies that the constructor wants a stringthat species the name of an element. It would appear that IE9 is more strictly following standards. You can accomplish the same thing you are trying to do with the following code:
createElement 的 API 指定构造函数需要string一个元素名称。IE9 似乎更严格地遵循标准。您可以使用以下代码完成您正在尝试执行的相同操作：
var iframe = document.createElement("iframe");
iframe.setAttribute("id", "yui-history-iframe");
iframe.setAttribute("src", "../../images/defaults/transparent-pixel.gif");
iframe.setAttribute("style", "position:absolute;top:0;left:0;width:1px;height:1px;visibility:hidden;");
http://msdn.microsoft.com/en-us/library/ms536389(v=vs.85).aspx
http://msdn.microsoft.com/en-us/library/ms536389(v=vs.85).aspx
回答by Marco
For jQuery.bgiframe.js, would be a better solution to fix the wrong IE6 test?
对于 jQuery.bgiframe.js，修复错误的 IE6 测试会是更好的解决方案吗？
What about replacing this:
替换这个怎么样：
if($.browser.msie&&/6.0/.test(navigator.userAgent)
with something like this:
像这样：
if ($.browser.msie && $.browser.version=="6.0")
回答by Tillito
For jquery.bgiframe.js:
对于 jquery.bgiframe.js：
I downloaded version 1.1.3 pre at
我在以下位置下载了 1.1.3 版
https://github.com/brandonaaron/bgiframe/blob/master/jquery.bgiframe.js
https://github.com/brandonaaron/bgiframe/blob/master/jquery.bgiframe.js
and this solved the problem.
这解决了问题。
回答by Nenotlep
This error can come when accidentally using standard JavaScript function names as your own function names if you don't use namespaces. For example I have a concept called "Attribute" and I wanted to try a new function that created a new one of those:
如果您不使用命名空间，不小心将标准 JavaScript 函数名称用作您自己的函数名称，就会出现此错误。例如，我有一个名为“属性”的概念，我想尝试一个新函数来创建其中的一个新函数：
<button onclick="createAttribute('Pony')">Foo</button>
<button onclick="createAttribute('Magical pony')">Bar</button>
<script type="text/javascript">
function createAttribute(name) { alert(name); }
</script>
- Clicking "Foo" gives you nothing
- Clicking Foo gives you
INVALID_CHARACTER_ERR (5)orInvalidCharacterError: DOM Exception 5 - Opening your dev console and running
createAttribute('Django')gives you the alert
- 点击“Foo”什么也没给你
- 点击 Foo 给你
INVALID_CHARACTER_ERR (5)或InvalidCharacterError: DOM Exception 5 - 打开你的开发控制台并运行
createAttribute('Django')会给你警报
What is happening is that the buttons are calling document.createAttribute()and your dev console is calling the function you declared.
发生的事情是按钮正在调用，document.createAttribute()而您的开发控制台正在调用您声明的函数。
Solution:use a different function name or better yet, a namespace.
解决方案：使用不同的函数名称或更好的名称空间。
回答by Niko
If you are willing to sacrifice a little performance and can use an external library I would suggest using:
如果您愿意牺牲一点性能并可以使用外部库，我建议您使用：
Prototype JS
原型JS
var el = new Element('iframe', {
id: "<your id here>",
src: "<your source here>",
style: "<your style here>"
});
jQuery
jQuery
var el = jQuery('<iframe>', {
id: '<your id here>',
src: "<your source here>",
style: "<your style here>"
})[0];
This takes care of all the inconsistencies between browsers and is also a lot prettier :-)
这可以解决浏览器之间的所有不一致问题，而且更漂亮:-)
Note: This is untested pseudocode - refer to the official documentation pages of Prototype JSand jQueryfor more information.
注意：这是未经测试的伪代码 -有关更多信息，请参阅Prototype JS和jQuery的官方文档页面。
回答by kees0000
This is a solution for jquery's jquery.bgiframe.js.
这是 jquery 的jquery.bgiframe.js的解决方案。
if ( $.browser.msie && /9.0/.test(navigator.userAgent) ) {
var iframe = document.createElement("iframe");
iframe.setAttribute("class", "bgiframe");
iframe.setAttribute("frameborder", "0");
iframe.setAttribute("style", "display:block;position:absolute;z-index:-1;filter:Alpha(Opacity=\'0\');top:expression(((parseInt(this.parentNode.currentStyle.borderTopWidth)||0)*-1)+\'px\');left:expression(((parseInt(this.parentNode.currentStyle.borderLeftWidth)||0)*-1)+\'px\');width:expression(this.parentNode.offsetWidth+\'px\');height:expression(this.parentNode.offsetHeight+\'px\');");
this.insertBefore( iframe, this.firstChild );
} else {
this.insertBefore( document.createElement(html), this.firstChild );
}
