天天看点

window实现跨页面传输数据

一般在js中定义变量的时候禁止使用name 作为属性名 ,因为 我们可以使用window.name实现页面的跨域传输

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <script>
        window.name='var num = 100;';
    </script>
</body>
</html>      
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<button>点我</button>
    <script>
        //获取另一个页面的数据,则那个页面必须被加载
        document.querySelector('button').onclick = function(eve){
            //定义iframe加载数据提供的页面
            var iframe = document.createElement('iframe');
            iframe.src='anotherPage.html';
            iframe.style.display='none';
            document.body.appendChild(iframe);
            //加载成功后获得数据
            iframe.onload = function (eve) {
                var e = eve||window.event;
                var t = e.target|| e.srcElement;
                var iframeWindowName =t.contentWindow.name;
                console.log(typeof iframeWindowName);
                eval(iframeWindowName);//将字符串转为代码
                console.log(num);
            }
        }
    </script>
</body>
</html>