js gets the elements between the iframe and the parent, methods, attributes, get the height of the iframe adaptive iframe height

1. Get the elements of the iframe child page on the parent page

(In the case of the same domain and tested under http://, and preferably dosomething after the iframe onload is loaded...)

js writing

a. Obtained through contentWindow

It can also be obtained by contentDocument, but contentWindow is compatible with various browsers and can obtain the window object of the child window.
contentDocument Firefox support, ie support > ie8. The document object of the child window can be obtained.

Get method

[html]  view plain copy  
  1. var frameWin=document.getElementById('iframe').contentWindow;    //window对象  
  2. var frameDoc=document.getElementById('iframeId').contentWindow.document  //document对象  
  3. var frameBody=document.getElementById('iframeId').contentWindow.document.body   //body对象  

There is also iframe.contentDocument method // but ie 6,7 does not support



b. Obtained through the frames[] array

(But it must be obtained after the iframe frame is loaded, iframe1 is the name attribute of the iframe)

[html]  view plain copy  
  1. document.getElementById('iframId').onload=function(){  
  2.     var  html window .frames["name property"].document.getElementById('id of the element in the iframe').innerHTML;  
  3.     alert(html)  
  4. }  
  5.  If you want to get iframe inside iframe  
  6. document.getElementById('iframId').onload=function(){  
  7.     var  html window .frames["name property"].frames["name property"].document.getElementById('id of the element in the iframe').innerHTML;  
  8.     alert(html)  
  9. }  

jq writing method: it must be valid after the iframe is loaded

[html]  view plain copy  
  1. a. $("#iframe ID").contents().find("#iframe control ID").click();//jquery method 1 must be valid after the iframe is loaded  
  2. b. $("#Control ID in iframe",document.frames("frame's name").document)//Method 2  < span style = "font-family: Arial, Helvetica, sans-serif;" > Required Only works after the iframe is loaded </ span >   


=================================

2. Get the id element of the parent page in the iframe 

(In the case of the same domain and tested under http://, it is best to dosomething after the iframe is recorded)

js writing:

get objid in parent

[html]  view plain copy  
  1. var obj=window.parent.document.getElementById('objId')  
The window.top method can get the parent's parent....the topmost element object

jq writing:

[html]  view plain copy  
  1. $('#objId' of the parent window, window.parent.document).css('height':'height); // window can be omitted and not written  
  2. or  
  3. $(window.parent.document).find("#objId").css('height':'height); // window can be omitted or not written  
===================================

3、父级窗体访问iframe中的属性  

(经测试,在ie中最好用原生的onload事件,如果用jq的load把iframe加载完毕 有时候方法调用不到 多刷新才有效果)

[html]  view plain  copy
  1. a、 用contentWindow方法   
  2. document.getElementById('iframe1').onload=function(){  
  3.          this.contentWindow.run();  
  4.  }  
  5. b、用iframes[]框架集数组方法  
  6. document.getElementById('iframe1').onload=function(){  
  7.          frames["iframe1"].run();  
  8. }  

===================================

4、在iframe中访问父级窗体的方法和属性 //window 可以不写

[html]  view plain  copy
  1. window.parent.attributeName;  // 访问属性attributeName是在父级窗口的属性名  
  2. window.parent.Func();  // 访问属性Func()是在父级窗口的方法  

5、让iframe自适应高度

[html]  view plain  copy
  1. $('#iframeId').load(function() { //方法1  
  2.     var iframeHeight = Math.min(iframe.contentWindow.window.document.documentElement.scrollHeight, iframe.contentWindow.window.document.body.scrollHeight);  
  3.     var h=$(this).contents().height();  
  4.     $(this).height(h+'px');   
  5. });  
  6.   
  7. $('#iframeId').load(function() { //方法2  
  8.     var iframeHeight=$(this).contents().height();  
  9.     $(this).height(iframeHeight+'px');   
  10. });  

6. The onload event of iframe,

All major browsers support iframe.onload=function....
In ie, you need to use attachEvent to bind events

7. Write anti-phishing code in the URL introduced by the iframe

if(window!=window.top){
window.top.location.href=window.location.href;
}

8. Get the height of the iframe

iframe.contentWindow.document.body.offsetHeight;

Reprinted from: https://blog.csdn.net/kongjiea/article/details/38870399

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325418512&siteId=291194637