html5跨文档操作

html5新增功能

//跨文档操作    //配置服务器（多个虚拟主机实现跨域）        //在服务器的httpd.conf文件中进行配置        //  （自行根据条件修改）            <VirtualHost *:8086>                ServerName www.a.com                DocumentRoot "D:/host/a"                <Directory "D:/host/a">                    Options Indexes FollowSymLinks                    AllowOverride All                    Require all granted                </Directory>            </VirtualHost>        //C:\windows\system32\drivers\etc\hosts中添加（IP）127.0.0.1指向的新域名。（比如 www.c.com）        //修改文件后记得重新启动服务器。        //访问操作：www.a.com:8086/（8086为APMServer服务器所在端口）    //同域跨文档        //iframe内页            //主页面操作iframe内页                . iframe.contentWindow.document.body.style.color = "red";            //ifram内页操作主页面                . window.parent/top.document.body.style.color = "#000";        //新窗口页            //父页面操作子页面                . window.open( "open.html" ).document.body.style.background = "#000";            //子页面操作父页面                . window.opener.document.body.style.background = "#e20076";    //不同域跨文档        //注意，发送数据时只需要发送到域，不需要发送到域下具体的文件。        //（发送页面）        postMessage( "发送的数据","接收的域" );            . postMessage( "json","http://www.d.com:8086" );            . 注意指明协议和端口号（如果需要，此处指端口号，我的服务器指定端口为8086，协议必须指定），否则会出错。        //（接收页面）        message事件监听            . window.addEventListener( "message",function( ev ){                if( ev.origin == "某个域" && ev.data == "指定的数据" ){                    // 验证数据来源，必须是指定的域才能操作当前页面。                    // 接收到的必须是指定的数据。                    // 对当前页面进行操作。                }            } );        //发送方式            . iframe内联框架                #（发送数据）                    iframe.contentWindow.postMessage( "json","http://www.d.com:8086" );                #（接收数据）                    window.addEventListener( "message",function( ev ){                        btn.onclick = function(){                            if( ev.origin == "http://www.c.com:8086" ){                                if( ev.data == "json" ){                                    document.body.style.background = "#e20076";                                }                            }                        }                    } );            . 新建窗口                #（发送数据）                    var newWindow = window.open( "http://www.d.dom:8086/opener.html" );                    # 注意，open新建窗口需要一定的时间。                    setTimeout( function(){                        newWindow.postMessage( "json","http://www.d.com:8086" );                    },1000 );                #（结收数据）                window.addEventListener( "message",function( ev ){                    btn.onclick = function(){                        if( ev.origin == "http://www.c.com:8086" && ev.data == "json" ){                            box.innerHTML = "我是至尊宝@@@";                        }                    };                } );