29

以下曾经在 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>');

我得到以下异常： SCRIPT5022: DOM Exception: INVALID_CHARACTER_ERR (5)

是不是上面这段代码不符合标准。该问题的解决方法是什么？

4

6 回答 6

29

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

于 2011-03-17T19:24:29.683 回答
13

对于 jQuery.bgiframe.js，修复错误的 IE6 测试会是更好的解决方案吗？

替换这个怎么样：

if($.browser.msie&&/6.0/.test(navigator.userAgent)

像这样：

if ($.browser.msie && $.browser.version=="6.0")
于 2011-04-13T10:14:04.040 回答
7

对于 jquery.bgiframe.js：

我下载了版本 1.1.3 pre at

https://github.com/brandonaaron/bgiframe/blob/master/jquery.bgiframe.js

这解决了这个问题。

于 2011-06-21T13:48:26.953 回答
0

如果您不使用命名空间，意外地将标准 JavaScript 函数名称用作您自己的函数名称时，可能会出现此错误。例如，我有一个名为“属性”的概念，我想尝试一个新函数来创建一个新函数：

<button onclick="createAttribute('Pony')">Foo</button>
<button onclick="createAttribute('Magical pony')">Bar</button>
<script type="text/javascript">
    function createAttribute(name) { alert(name); } 
</script>
  • 点击“Foo”不会给你任何东西
  • 点击 Foo 会给你INVALID_CHARACTER_ERR (5)或InvalidCharacterError: DOM Exception 5
  • 打开你的开发控制台并运行createAttribute('Django')会给你警报

正在发生的事情是按钮正在调用document.createAttribute()，而您的开发控制台正在调用您声明的函数。

解决方案：使用不同的函数名或者更好的命名空间。

于 2013-04-12T08:17:52.497 回答
0

如果您愿意牺牲一点性能并且可以使用外部库，我建议您使用：

原型 JS

var el = new Element('iframe', {
  id: "<your id here>",
  src: "<your source here>",
  style: "<your style here>"
});

jQuery

var el = jQuery('<iframe>', {
  id: '<your id here>',
  src: "<your source here>",
  style: "<your style here>"
})[0];

这可以解决浏览器之间的所有不一致问题，并且更漂亮:-)

注意：这是未经测试的伪代码 -有关更多信息，请参阅Prototype JS和jQuery的官方文档页面。

于 2013-07-29T09:05:12.707 回答
-6

这是 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 );
            }
于 2011-04-09T12:03:03.867 回答