Home > Developer > Web Develop
The code is as follows:
$ (' #objId ', parent.document);
Get...
Gets the element of the IFRAME child page on the parent page
The code is as follows:
$ ("#objid", Document.frames (' Iframename '). Document)
$ (document.getElementById (' Iframeid '). contentWindow.document.body). HTML ()
Displays the contents of the BODY element in the IFRAME.
$ ("#testId", Document.frames ("Iframename"). Document). HTML ();
get the element with the id "TestID" according to Iframename
$ (window.frames["Iframename"].document). Find ("#testId"). HTML ()
accessing an IFRAME within a page with JS or jquery, compatible with IE/FF
Note: Pages within a frame are not cross-domain!
Suppose there are two pages under the same domain.
The index.html file contains an iframe:
xml/html Code
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en"
"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/>
<title> Page Home </title>
<body>
<iframe src= "iframe.html" id= "koyoz" height= "0" width= "0" ></iframe>
</body>
Iframe.html content:
xml/html Code
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en"
"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/>
<title>iframe.html</title>
<body>
<div id= "Test" >www.koyoz.com</div>
</body>
1. Perform JS direct access in index.html:
JavaScript code
document.getElementById (' Koyoz '). contentWindow.document.getElementById
(' Test '). style.color= ' Red '
By accessing the IFRAME page with the ID named ' Koyoz ' in index.html, and getting the id ' test ' in this IFRAME page
object and sets its color to red.
This code has been tested and can support Ie/firefox.
2. Access with jquery in index.html:
JavaScript code
$ ("#koyoz"). Contents (). Find ("#test"). CSS (' Color ', ' red ');
The effect of this code and JS direct access is the same, because the use of the jquery framework, the code is much shorter.
Collect some examples on the Web:
Use jquery to get the value of an element of the parent window in an IFRAME
Had to use the DOM method and the jquery method to implement the way
1. Manipulate all the radio buttons in the selected IFrame in the parent window
$ (window.frames["iframe1"].document). Find ("Input:radio"). attr ("Checked", "true");
2. Action in the IFRAME Select all the radio buttons in the parent window
$ (window.parent.document). Find ("Input:radio"). attr ("Checked", "true");
The parent window wants to get the IFRAME in the IFRAME, just add a frames child, such as:
$ (window.frames["iframe1"].frames["Iframe2"].document). Find ("Input:radio"). attr ("Checked", "true");
3. A method (FRAME) to invoke another child window in the parent window in a child window:
parent.frames["Main"]. Fun ();
Note: It is recommended to use [], this is more compatible with multiple browsers, () Firefox/Sogou/Google is not compatible.
Several methods of jquery acquiring elements in IFrame
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
