iframe 的操作

1.父子窗口的相互操作

　　父窗口：

　　iframe.contentWindow.document OR iframe.contentDocument

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title></title>
 6     <script>
 7         window.onload = function() {
 8             var btn = document.getElementById('btn');
 9             var iframe1 = document.getElementById('iframe1');
10 
11             btn.onclick = function(){
12                 iframe1.contentWindow.document.body.style.background = 'red';
13             }
14         }
15     </script>
16 </head>
17 <body>
18 <input type="button" value="color" id="btn"/>
19 <iframe src="test.html" frameborder="1" id="iframe1"></iframe>
20 </body>
21 </html>

　　子窗口：

　　window.parent (父窗口) window.top(最顶层窗口)

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title></title>
 6     <script>
 7         window.onload = function(){
 8             var btn = document.getElementById('btn');
 9             btn.onclick = function() {
10                 window.parent.document.body.style.background = 'yellow';
11             }
12         }
13     </script>
14 </head>
15 <body>
16 <input type="button" value="color" id="btn"/>
17 </body>
18 </html>

2.防止网页被钓鱼网站嵌套

1 <script>
2 if (window != window.top) {
3     window.top.location.href = window.location.href;
4 }
5 </script>

3. offsetLeft

　　offsetTop

　offsetHeight

　　offsetWidth

posted on 2015-10-10 22:35 aoun 阅读(201) 评论(0) 收藏举报