父窗口和iframe互相取值

1.js方式

   (1)父页面获取iframe中元素的内容

window.frames["_frame(frame的名字)"].document.getElementById("ch(想要获取元素的id)").textContent
通过得到id来获取元素的内容
1.contentWindow
var obj = document.getElementById("_frame(frame的id").contentWindow;
获取页面中的iframe元素contentWindow,把它当做window对象来使用,适合各种浏览器。
var value = obj.document.getElementById("ch").textContent;然后再获取子页面中元素的内容。
2.contentDocument
var obj = document.getElementById("_frame").contentDocument;
var value = obj.getElementById("ch").textContent;//contentDocument Firefox 支持Firefox,ie8以上版本支持。可取得子窗口的 document 对象。

   (2).在iframe中获取父窗口元素的内容

var value = window.parent.document.getElementById("pch").textContent;//获取父页面元素的内容
document.getElementById("getp").innerHTML=value;

3.jQuery方式

   (1)父页面获取frame元素内容

$("#jqgetp").click(function(){
var text = $("#_frame").contents().find("#ch").text();//先获得frame然后遍历frame找符合元素然后获取内容
$("#getch").html(text);//设置内容
});
var text = $("#ch",window.frames["_frame"].document).text();
$("#getch").html(text);

     

 (2)frame获取父元素的内容

$("#getpp").click(function(){
var text = $('#pch', parent.document).text();
$("#getp").text(text);
});


你可能感兴趣的:(iframe)