jquery で iframe_jquery を操作するいくつかの方法のまとめ

iframe は複合ドキュメントでよく使用されます。jquery を使用して iframe を操作すると、効率が大幅に向上します。

DOM メソッド:
親ウィンドウ操作 IFRAME: window.frames["iframeSon"].document
IFRAME 操作親ウィンドウ: window.parent.document

jquery メソッド:
親ウィンドウの IFRAME 内のすべての入力ボックスを選択します: $(window.frames["iframeSon"].document).find(":text"); 🎜>IFRAME の親ウィンドウですべての入力ボックスを選択します: $(window.parent.document).find(":text");

iframe HTML:

1. 親ウィンドウの IFRAME 内のすべてのラジオ ボタンを選択します
$(window.frames["iframe1"].document).find("input[@type=' radio' ]").attr("チェック済み","true");

2. IFRAME の親ウィンドウ内のすべてのラジオ ボタンを選択します
$(window.parent.document).find("input[@type='radio']") .attr ("チェック済み","true");

iframe フレーム:

コードをコピー コードは次のとおりです。

< HTML xmlns ="http://www.w3.org/1999/xhtml"> ="../js/jquery-1.2.6.js" type="text/ecmascript "> ;
< .").contents().find("body").append("iframe 内です!"); [@type='text']").attr("size","30px");
//$("#iframe1").contents().find("#d1").css(' color','red');
//$(window.frames["iframe1"].document).find("input[@name='t1']").css({background:"#369 "});


🎜>

收集利用Jquery取得iframe中元素的几种方法 :

$(document.getElementById('iframeId').contentWindow.document.body).htm() 
$(document.getElementById('iframeId').contentWindow.document.body).htm() 

显示iframe中body元素的内容。

$("#testId", document.frames("iframename").document).html(); 
$("#testId", document.frames("iframename").document).html(); 

根据iframename取得其中ID为"testId"元素

$(window.frames["iframeName"].document).find("#testId").html() 
$(window.frames["iframeName"].document).find("#testId").html() 

作用同上
收集网上的一些示例：

用jQuery在IFRAME里取得父窗口的某个元素的值
只好用DOM方法与jquery方法结合的方式实现了

1.在父窗口中操作 选中IFRAME中的所有单选钮
$(window.frames["iframe1"].document).find("input[@type='radio']").attr("checked","true");

2.在IFRAME中操作 选中父窗口中的所有单选钮
$(window.parent.document).find("input[@type='radio']").attr("checked","true");

iframe框架的：

IE7中测试通过

使用jquery操作iframe

1、内容里有两个ifame

leftiframe中jQuery改变mainiframe的src代码：
$("#mainframe",parent.document.body).attr("src","http://www.jb51.net")

2、如果内容里面有一个ID为mainiframe的ifame