iframe子页面与父页面元素的访问以及js变量的访问

1、子页面访问父页面元素 

parent.document.getElementById('id')和document相关的方法都可以这样用 

2、父页面访问子页面元素 

document.getElementById('iframeId').contentDocument.getElementsByTagName('table'); contentDocument后可以使用document相关方法 

3、子页面访问父页面js变量(注:父页面的js变量需为全局变量) 

子页面var variable = parent.variableParent   (variableParent为父页面定义的变量) 

4、父页面访问子页面js变量 

这部分目前的解决方案是在父页面设置全局变量,在子页面进行修改后将子页面的变量赋值给父页面

网上还有一种方法,但我在chrome上试过了,不好使。

1)获取iframe节点

2)获取iframe中的变量

示例:

a.html


b.html


在a.html中获取y,则可以通过以下方式
window.frames['x'].y  //先获取frame,在获取y
或者
document.getElementById('x').contentWindow.y

在iframe 定义了name属性的情况下:window.frames['x']==document.getElementById('x').contentWindow。

iframe尽量定义name属性。

参考:https://blog.csdn.net/cuihaiyang/article/details/40587075

你可能感兴趣的:(web前端)