Question

在搜索Google和Stack Overflow后，我决定询问这是否可能。

目前我正在我的网站上加载iFrame。我希望隐藏iFrame中加载的某个元素。

<span id="blahblah">


function collapseAll(){

var body = document.getElementById('body');
var spans = body.getElementsByTagName("span");
var span;
for (i = 0; i < spans.length; i++){
  span = spans[i];
  if(span.class=='blahblah'){
  span.style.visibility = "hidden";
  }
 }
}

然而这不起作用。问题一是可以这样做吗？如果是，你可以解释一下吗？

谢天谢地。

Answer 1

您必须将该脚本放在iframe的内容中。您无法访问另一个框架的DOM，尤其是当它来自另一个框架时。

Answer 2

很抱歉，由于安全控制，您无法从外部窗口访问iframe中的元素。

你必须尝试这个，但你可以在iframe的window对象上创建一个函数，并从外部窗口调用它。

在iframe中：

<script type="text/javascript">
    window.collapseAll = function() {
        .....
    }
</script>

在外窗口：

<script type="text/javascript">
    function doCollapse() {
        document.getElementById('my_iframe").window.collapseAll();
    }
</script>

同样，这是未经测试的，但我很确定Facebook会做类似的事情。

Answer 3

如果iframe来自与您的javascript相同的域，那么这是可行的。

使用普通的javascript你会写下面的

`

function collapseAll(){

var body = document.getElementById('body');
var spans = body.getElementsByTagName("span");
var span;
for (i = 0; i < spans.length; i++){
  span = spans[i];
  if(span.class=='blahblah'){
  **span.style.display = "none";**
  }
 }
}

这解决了这个问题。

如果iframe来自不同的网站（域），那么事情就会变得非常困难。像greasemonkey这样的解决方案可以在不同领域的页面上运行。

你可以尝试

document.frame.document.getElementsByTagName('span')

Answer 4

<script type="text/javascript">

function remove_elemment() {
    var body = document.getElementById('body');
	var divs = body.getElementsByTagName("div");
	var div;
	for (i = 0; i < divs.length; i++){
	  div = divs[i];
	  if(div.class=='buybox'){
	  	**div.style.display = "none";**
	  }
	}
};

function doRemove() {
    document.frame.document.getElementById('my_iframe').remove_elemment();
}();

</script>

<div class="floating-widget">
	<iframe id="my_iframe" src="http://www.nodebeginner.org/index-vi.html" frameborder="0" width="100%" height="500">				
	</iframe>

</div>

Javascript删除iFrame中加载的元素

4 个答案: