In js, when both the parent and child pages belong to the same domain, the js methods between them can be called each other. You can specify the object to which the function belongs before calling the method. On the parent page, you can obtain the object that the iframe belongs to: name. window of iframe, and on the iframe page, you can obtain that the object on the parent page is parent.
When both the parent and child pages belong to the same domain, the js methods between them can be called each other. Specify the object to which the function belongs before calling the method. On the parent page, obtain the object to which the iframe belongs. The method is the name of iframe. window. method Name (), iframe page to get the parent Page Object method: parent. method Name ().
However, there is a very important restriction. Because the browser does not allow js to communicate with different domain names based on security considerations, the Parent and Child pages must belong to the same domain, even different second-level domains under the same primary domain do not work.
If the parent and child pages belong to two different domain names, they cannot communicate directly. If the parent and child pages belong to different second-level domains in the same primary domain, you can use force to set document. domain to make them communicate with each other. Document. the default value of domain is window. location. host, which can be set as window in js. location. host, but cannot be the root domain. For example, you can set document on www.duankou.com. domain is duankou.com, but cannot be set to other.duankou.com or com.
To some extent, document. domain solves the cross-domain problem of different second-level domain names pages. Note that if the parent page contains multiple iframe and is configured with document. domain, the iframe to communicate with it must also be set to document. domain.
Mutual call between the iframe parent window and Child Window
1. How to Use IE:
Parent window: iframe_ID.iframe_document_object.object_attribute = attribute_value
Example: onClick = "iframe_text.myH1.innerText = 'HTTP: // www.pint.com ';"
Child Window call parent window: parent. parent_document_object.object_attribute = attribute_value
Example: onclick = "parent. myH1.innerText = 'HTTP: // www.pint.com ';"
2. Usage in Firefox:
There is no problem in IE, but it is not normal in firefox. In firefox, the following call method should be used:
Parent window: window. frames ["iframe_ID" ..doc ument. getElementById ("iframe_document_object"). object_attribute = attribute_value
Example: window. frames ["iframe_text" ].doc ument. getElementById ("myH1"). innerHTML = "http://hi.www.bKjia. c0m ";
Child Window call parent window: parent.doc ument. getElementById ("parent_document_object"). object_attribute = attribute_value
Example: parent.doc ument. getElementById ("myH1"). innerHTML = "http://www.bKjia. c0m ";
An example is as follows:
Parent page: parent.html
| The Code is as follows: | Copy code |
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Function callChild (){ |
|
Subpage: child.html
| The Code is as follows: | Copy code |
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Function callParent (){ |
|
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
