为什么jQuery.attr(）在IE9中不起作用

Why does not jQuery .attr() work in IE9?

本文关键字：IE9 不起作用 jQuery attr 为什么      更新时间：2023-09-26

以下代码只是HTML、CSS和JavaScript的组合，"注入"到现有iFrame（'iFrame_id'）中。尽管以下代码适用于Firefox、Chrome和Safari，但在IE9中不起作用。我检查了一些相关和现有的答案，其中大多数都与IE8或更高版本的问题有关，这在这种情况下没有帮助。它与jQuery.attr（）有关吗？IE9有问题吗（像旧版本的IE一样）？如果是，我该如何修复？

$("#iframe_id").attr(
    "src", "data:text/html;charset=utf-8," + 
    "<!DOCTYPE html>"+
    "<html>"+
    "<head>"+
    "<style>"+
    "/********** CSS stuff here **********/"+
    "</style>"+
    "</head>"+
    "<body>"+
    "<!--------- HTML stuff here ---------->"+
    "<script src='"http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'"><" + "/script>" +    
    "<script>"+
    "/*********** jQuery stuff here *****/"+
    "<" + "/script>"+     
    "</body>"+    
    "</html>"
    );

在IE9中，我得到了典型的"网页无法显示…"错误。

我已经复习了以下答案，但这并没有帮助。

IE中jQuery attr（）的替代方案？

attr（）在IE 中不起作用

jquery attr（）在IE 中不起作用

出于安全原因，数据URI仅限于下载的资源
数据URI不能用于导航、脚本、或填充框架或iframe元素

MSDN

这适用于所有版本的Internet Explorer。

为了让它发挥作用，你可以做：

var html = "<!DOCTYPE html>"+
    "<html>"+
    "<head>"+
    "<style>"+
    "/********** CSS stuff here **********/"+
    "</style>"+
    "</head>"+
    "<body>"+
    "<!--------- HTML stuff here ---------->"+
    "<script src='"http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'"><" + "/script>" +    
    "<script>"+
    "/*********** jQuery stuff here *****/"+
    "<" + "/script>"+     
    "</body>"+    
    "</html>";
var frame = document.getElementById('iframe_id');
frame.contentWindow.document.write(html);

.attr()工作正常，问题是data:text/html。这在IE中不起作用。

发件人http://caniuse.com/#feat=datauri:

Internet Explorer[8]中的支持仅限于图像和链接资源，如CSS文件，而不是HTML文件。

相反，您可以创建一个iFrame，然后编辑其document的innerHTML:

$("#iframe_id").contents().find('html').html('<div>test</test>');

或者，没有jQuery

document.getElementById('iframe_id').contentWindow.document.body.innerHTML = '<div>test</test>';

或者，您可以将HTML放在一个文件中，并将iframe设置为其url。

动态修改iframe的src是个坏主意，而且对IE不太好。只需创建一个新的iframe元素即可。

$('body').append('<iframe src=""></iframe>');

.attr（）方法在IE中是伪造的。(http://bugs.jquery.com/ticket/11071)。

找到另一种方式在iframe 中显示此HTML内容

正如本文所述，在IE中，您应该执行以下操作：

iframe.contentWindow.contents = yourHtmlString;
iframe.src = 'javascript:window["contents"]';

我在我的项目中尝试过它，它在IE11和Chrome中都有效。

相关文章：