【JavaScript】frame跨域访问元素

什么是跨frame访问元素呢?比如main.html中有如下代码:

<frameset cols="50%,*">
  <frame src="frame1.html">
  <frame src="frame2.html">
</frameset>

如果想在frame2.html的页面操作frame1.html中的元素,那么通过如下的js代码就可以完成:

parent.frames[0].document

其中parent表示访问main.html的文档。frames[0]表示访问main.html中的第一个frame对象,也就是frame1.html页面。也可以通过name来指定访问特定的页面,例如:

<frameset cols="50%,*">
  <frame name="myframe1" src="frame1.html">
  <frame name="myframe2" src="frame2.html">
</frameset>

frame2.html中的访问代码就可以改为:

parent.frames["myframe1"].document

 

到这里我们知道了frame之间如何访问元素,笔者这里只是列举了一种方法,有兴趣的读者可以自行googling。那么什么是跨域访问元素呢?

若我们把上面main.html中的一个frame指向其它的域名地址(比如:www.google.com),那么我们还能正常在myframe2中操作myframe1中的元素吗?

<frameset cols="50%,*">
  <frame name="myframe1" src="www.google.com">
  <frame name="myframe2" src="frame2.html">
</frameset>

答案是不行!在myframe2中操作myframe1中的元素,会得到如下的错误信息:frame Blocked a frame with origin "null" from accessing a cross-origin frame.

浏览器是禁止这种行为的。那么有没有什么方法可以实现这种操作呢?

答案是有的,解决方法有多种,笔者稍后会把链接粘贴在后面。这里笔者说一下,笔者可行方法(就是禁用浏览器的安全域检查):

笔者的Chrome是75.0.3770.142,环境是win7。

然后使用如下的命令启动chrome浏览器:

chrome.exe --disable-site-isolation-trials --disable-web-security --user-data-dir="your dir"

 

读者可以翻阅下面的链接,查看更详细的说明

1.Disable same origin policy in Chrome

2.blocked a frame of origin “null” from accessing a cross-origin frame - chrome

 

posted @ 2019-07-17 10:37 HDWK 阅读(...) 评论(...) 编辑 收藏