同域下面的窗口操作

作者: 迷人的洋葱葱 | 来源:发表于2017-07-12 15:58 被阅读0次

同域下面的窗口操作
什么是同源策略？什么是跨域？什么是 JSONP，什么是 CORS
iframe通信
跨域的几种方法
跨域的相关
iterm02-zellij
常用DOS命令（cmd）
jsonp和跨域
SSO三种情况的实现方式
js—iframe父子页面间通信

方式一：iframe

下面的程序中 oMyIframe.contentWindow->被iframe包含的页面（iframe的src属性指定的页面）2.iframe.html的window对象

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
window.onload=function(){
    var oBtn=document.getElementById('btn');
    var oMyIframe=document.getElementById('myframe');
    oBtn.onclick=function(){
    
        oMyIframe.contentWindow.document.body.style.background='red';
//如果我们要操作一个 iframe里面的dom元素，首先要获取到iframe引入页面的window对
//象, 此处，oMyIframe.contentWindow即为被iframe引入的页面的window对象
        }
    };
</script>
</head>

<body>
<input  type="button"  id="btn" value="点击我，改变2.iframe.html的背景色"/>
        <iframe id="myframe" src="2.iframe.html"></iframe>
</body>
</html>

方式二：window.open()
下面的程序中,newWindow即为用window.open()打开新窗口4.window.open.html后，返回的window对象。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
window.onload=function(){
    var oBtn1=document.getElementById('btn1');
    var oBtn2=document.getElementById('btn2');
    var newWindow=null;
    oBtn1.onclick=function(){
        
        newWindow=window.open('4.window.open.html','_blank');
//window.open 返回被打开窗口的window对象,这里返回新打开的窗口4.window.open.html     
        };
    oBtn2.onclick=function(){
        newWindow.document.body.style.background='red';
        };
    };
</script>
</head>

<body>
<input  type="button"  id="btn1" value="点击我，开启一个新窗口，打开4.window.open.html"/>
<input  type="button"  id="btn2" value="点击我，改变4.window.open.html 的背景色"/>
</body>
</html>