jQuery gets element value in iframe

This time I will bring you jQueryGet the element value in iframe, what are the precautions for jQuery to get the element value in iframe, the following is a practical case, let's take a look.

Several ways to get elements in iframe with jquery:

Get parent page elements in iframe sub-page

$('#objId', parent.
document
);

Get it done...

Get the elements of the iframe subpage in the parent page:

$("#objid",document.frames('iframename').document)
$(document.getElementById('iframeId').contentWindow.document.body).html()

Display the content of the body element in the iframe.

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

Get the element whose ID is "testId" based on iframename

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

Use JS or jQuery to access the iframe in the page, compatible with IE/FF

Note: Pages within the frame cannot cross domains!

Assume there are two pages under the same domain.

The index.html file contains an iframe:

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<meta>
<title>页面首页</title>


<iframe></iframe>

iframe.html Content:

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<meta>
<title>iframe.html</title>


<p>www.jb51.net</p>

1. Execute JS in index.html for direct access:

document.getElementById('koyoz').contentWindow.document.getElementById('test').style.color='red'

Access the ID named 'koyoz' in index.html iframe page, and obtain the object with the ID 'test' in this iframe page, and set its color to red.

This code has been tested and can support IE/firefox.

2. Use jQuery to access index.html:

$("#koyoz").contents().find("#test").css('color','red');

The effect of this code is the same as direct JS access. Because of the jQuery framework, the code is shorter.

Collect some examples from the Internet:

Using jQuery to obtain the value of an element of the parent window in IFRAME can only be achieved by combining the DOM method and the jquery method

1. Operate in the parent window to select all radio buttons in the IFRAME

$(window.frames["iframe1"].document).find("input:radio").attr("checked","true");

2. Operate in the IFRAME to select all radio buttons in the parent window

$(window.parent.document).find("input:radio").attr("checked","true");

Parent window If you want 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");

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Recommended reading:

Detailed explanation of the steps for Jquery to operate js arrays and objects

A collection of methods for jquery to traverse and filter arrays and json objects

The above is the detailed content of jQuery gets element value in iframe. For more information, please follow other related articles on the PHP Chinese website!