Several methods of parsing jquery to obtain elements in IFRAME

IFrame often used in composite documents, using jquery operation IFrame can greatly improve efficiency, here to collect some basic operations, the need for friends can refer to the next

Dom Method:
Parent window Operation iframe:window.frames["Iframeson"].document
IFrame Operation parent window: window.parent.document
jquery Method:
action in the parent window selects all input boxes in the IFRAME: $ (window.frames["Iframeson"].document). Find (": Text");
Action in IFRAME selects all input boxes in the parent window: $ (window.parent.document). Find (": Text");
Html:<iframe src= of the iframe frame "test.html" id= "Iframeson" width= "700″height=" 300″frameborder= "Auto" ></iframe>

1. Select all radio buttons in the iframe in the parent window
$ (window.frames["iframe1"].document). Find ("input[@type = ' Radio ']"). attr ("Checked", "true");

2. Operation in iframe Select all radio buttons in the parent window
$ (window.parent.document). Find ("input[@type = ' Radio ']"). attr ("Checked", "true");
of the IFRAME framework:
<iframe src= "test.html" id= "iframe1″width=" 700″height= "300″frameborder=" 0″scrolling= "Auto" ></ Iframe>

Copy Code code as follows:


&lt;html xmlns= "http://www.w3.org/1999/xhtml" &gt;


&lt;HEAD&gt;


&lt;mce:script mce_src= "Js/jquery-1.2.6.js" src= ". /js/jquery-1.2.6.js "type=" Text/ecmascript "&gt;&lt;/MCE:SCRIPT&gt;


&lt;mce:script type= "Text/javascript" &gt;&lt;!--





$ (function () {


$ ("#t1"). Hover (function () {alert (');});


//$ ("iframe"). Contents (). Find ("Body"). Append ("I ' m in a iframe!");


$ (window.frames["iframe1"].document). Find ("input[@type = ' text ']"). attr ("Size", "30px");


//$ ("#iframe1"). Contents (). Find ("#d1"). CSS (' Color ', ' red ');


//$ (window.frames["iframe1"].document). Find ("input[@name = ' T1 ']"). CSS ({background: "#369"});


//$ ("#iframe1"). SRC ("test.html");


         });





//--&gt;&lt;/mce:script&gt;


&lt;DIV&gt;


&lt;input id=t1&gt;


&lt;iframe id=iframe1 src= "child.htm" mce_src= "child.htm" &gt;&lt;/IFRAME&gt;


&lt;iframe height=100 src= "child.htm" width=300 mce_src= "child.htm" &gt;&lt;/IFRAME&gt;


&lt;/DIV&gt;


&lt;DIV&gt;


&lt;/DIV&gt;

collects several ways to obtain elements in an IFRAME using jquery:

Copy Code code as follows:


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

Displays the contents of the BODY element in the IFRAME.

Copy Code code as follows:


$ ("#testId", Document.frames ("Iframename"). Document). HTML ();

Get the element with ID "TestID" according to Iframename

Copy Code code as follows:


$ (window.frames["Iframename"].document). Find ("#testId"). HTML ()

Function ditto

collect some examples on the Web:
use jquery to get the value of an element of the parent window in the IFRAME
We had to use the DOM method in conjunction with the JQuery method to implement the

1. Select all radio buttons in the iframe in the parent window
$ (window.frames["iframe1"].document). Find ("input[@type = ' Radio ']"). attr ("Checked", "true");

2. Operation in iframe Select all radio buttons in the parent window
$ (window.parent.document). Find ("input[@type = ' Radio ']"). attr ("Checked", "true");
IFrame frame: <iframe src= "test.html" id= "iframe1" width= "M" height= "" frameborder= "0" scrolling= "Auto" ></ Iframe>
Test Pass in IE7

using jquery to manipulate IFRAME
1, there are two ifame in the content
<iframe id= "Leftiframe" ...</iframe>
<iframe id= "Mainiframe. </iframe>
Leftiframe jquery Changes the SRC code of the Mainiframe:
$ ("#mainframe", Parent.document.body). attr ("src", "http://www.jb51.net")

2, if there is a ifame
<iframe id= "Mainifame" ...></ifame>
in the content with an ID mainiframe Ifame contains a someid
<div id= "Someid" >you want to getting this content</div>
gets the contents of Someid
$ ("#mainiframe" ). Contents (). Find ("Someid"). html () HTML or $ ("#mainiframe"). Contains (). Find ("Someid"). Text () value

3, action in the parent window selects all radio buttons
$ (window.frames["iframe1"].document) in the IFRAME. Find ("input[@type = ' Radio '"). attr ("Checked", "true");
The Select ID is naturally still using the Find Method
$ (window.frames["iframe1"].document). Find ("#id")

4, as shown above
jquery operations in Leftiframe the contents of the Mainiframe content Someid
$ ("#mainframe", Parent.document.body). Contents (). Find ("Someid"). HTML () or $ ("#mainframe", Parent.document.body). Contents (). Find ("Someid"). Val ()

Using JavaScript to manipulate the IFRAME
cross-references between frames
all frames in a page are provided as properties of the Window object as a collection. For example, Window.frames represents a collection of all the frames within the page, similar to the form objects, linked objects, picture objects, and so on, and these collections are attributes of the document. Therefore, to refer to a child frame, you can use the following syntax:
window.frames["FrameName"];
Window.frames.frameName
Window.frames[index]
where the word "window" can also be replaced or omitted with self, assuming that FrameName is the first frame in the page, The following notation is equivalent: self.frames["framename"]
Self.frames[0]
Frames[0]
framename
Each frame corresponds to an HTML page. So this frame is also a standalone browser window that has all the properties of a window, and a reference to a frame is a reference to a Window object. With this Window object, you can easily manipulate the pages in it, such as using the Window.documThe Ent object writes data to the page, uses the Window.location property to change the page inside the frame, and so on.

The following are references to each other between different levels of frameworks:
1. Reference to the parent frame to the child frame
knowing the above principle, referencing the child frame from the parent frame becomes very easy, namely:
window.frames["FrameName"];
This refers to a child frame named FrameName within the page. If you want to refer to a child frame within a child frame, you can do so by referring to a frame that is actually the nature of the Window object:
window.frames["FrameName"].frames["frameName2"];
This refers to a two-level child framework, and so on, you can implement a reference to a multi-tier framework.

2. Child frame to Parent frame reference
each Window object has a parent attribute, which represents its parental frame. If the frame is already a top-level frame, window.parent also represents the framework itself.

3. The reference between the brothers frame
If two frames are a child of a framework, they are called sibling frameworks, and can be referenced through the parent framework, such as a page that includes 2 child frames:
<frameset rows= "50%,50%" >
<frame src= "1.html" name= "frame1"/>
<frame src= "2.html" name= "frame2"/>
</frameset>
You can use the following statement to refer to frame2 in frame1:
self.parent.frames["Frame2"];

4. Mutual reference between different levels of frames
the hierarchy of the framework is for the top level framework. When levels are different, you can easily access each other by knowing the hierarchy and the hierarchy and name of the other frame, and by using the Window object properties referenced by the framework, for example:
self.parent.frames["ChildName"].frames["Targetframename"];

5. A reference to the top-level frame
is similar to the parent property, and the Window object also has a top property. It represents a reference to the top-level framework, which can be used to determine whether a frame itself is a top-level frame, for example:
//To determine if this frame is a top-level frame
if (self==top) {
//dosomething
}