JS未跨域操作iframe里的DOM_Javascript教程-查字典教程网
JS未跨域操作iframe里的DOM
JS未跨域操作iframe里的DOM
发布时间:2016-12-30 来源:查字典编辑
摘要:这里简单说明两个方法,都是未跨域情况下在index.html内操作b.html内的DOM。如:index.html内引入iframe,在in...

这里简单说明两个方法,都是未跨域情况下在index.html内操作b.html内的 DOM。

如:index.html内引入iframe,在index内如何用JS操作iframe内的DOM元素?

先贴下index.html和iframe引入的a.html内容。

index-> <div> <iframe src="a.html" frameborder="0" name="one" id="iframeId"></iframe> </div>

a.html

<div id="dd"> <h1>iframe里的元素!</h1> </div>

法一:

var d=window.frames["one"].window; d.onload=function(){ console.log(d.document.getElementById("dd")); };

法二:

JS动态创建iframe并插入

var ifr = document.createElement('iframe'); ifr.src = 'a.html'; document.body.appendChild(ifr); ifr.onload = function(){ var doc = ifr.contentDocument || ifr.contentWindow.document; // 在这里操纵b.html console.log(doc.getElementById("dd")); };

两种的输出结果都是

以上所述是小编给大家介绍的JS未跨域操作iframe里的DOM 的相关知识,希望对大家有所帮助!

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类