带内部iframe中的类的元素

Question

我在页面上有几个iframe s。里面有一些类名为test的元素。我需要为他们设置任何style。

当我只有一个iframe，我可以用接下来的建设：

$('#iframeId').contents().find('.test').css({background: '#f00'}); 

但我有几个iframe S，所以这将是巨大的未设定具体的iframe和使用建筑，如：

$('.test').css({background: '#f00'}); 

但它当然不起作用。

我以前使用的是原生getElementsByClassName，但在IE8之前，它不起作用，其中出现缺陷。

这可能是愚蠢的问题，但..有没有像任何建筑：

$(getElementById('something')).css({background: '#f00'}); 

这将是非常有益的。我的意思是，将JavaScript对象与jQuery对齐，然后使用jQuery方法。

更新：我解决了这个问题，接下来的建设：

[].forEach.call(document.getElementById('something').querySelectorAll('.test'), function (el) { 
    el.style.backgroundColor = '#f00'; 
}); 

但它仍然不适合IE8工作。

Answer 1

你应该尝试一些这样的事

$("iframe").each(function(index){ 
    $(this).contents().find('.test').css({background: '#f00'}); 
}); 

希望这会帮助你。

Answer 2

您可能会遇到以下两个问题之一： 1）您通常无法修改从外部域返回的iFrame的内容，虽然在此情况可能不是这样。如果你的iframe指向你的域名，你应该没问题。 2）ie8知道jQuery的.css可能依赖的“innerHTML”属性的问题。相反，尝试使用DOM方法：

document.getElementById("yourIframe").contentWindow.document.body.getElementById("innerIframeElement").setAttribute("style", "background:'#f00';"