<script> <br>function setHeight(){ <br>var dHeight = document.documentElement.scrollHeight; <br>var t = document.createElement("div"); <br>t.innerHTML = ' <iframe id="kxiframeagent" src="http://rest.kaixin001.com/api/agent.html#' dHeight '"scrolling="yes" height="0px" width="0px">< /iframe>'; <br>document.documentElement.appendChild(t.firstChild); <br>} <br></script>
I was thinking about how to solve the cross-domain problem! Later After searching on the Internet, I suddenly realized
. I copied it as follows and everyone focused on understanding its implementation ideas:
Question:
The page a.htm under domain name A is embedded into the page b.html under domain name B through iframe. Since the size of b.html is unpredictable and will change, the iframe adaptive size in a.htm is required. .
The essence of the problem: JS cross-domain problem, because in order to control the size of the iframe in a.htm, you must first read the size of b.html, A and B do not belong to the same domain. The access of js is limited and the size of b.html cannot be read.
Solution: First of all, the premise is A , B is a cooperative relationship, b.html can introduce the js provided by A
First, a.html introduces b.html through iframe
B introduced the js file provided by A in b.html
Html code
The js first reads b .html width and height, then create an iframe, src is the intermediate proxy page a_proxy.html in the same domain as A, set the read width and height into the hash of src
Html code
a_proxy.html is a good intermediate proxy page provided under domain A. It is responsible for reading the width and height values in location.hash, and then setting the width and height of the iframe in a.html under the same domain.
Js code
var pParentFrame = parent. parent.document.getElementById("aIframe");
var locationUrlHash = parent.parent.frames["aIframe"].frames["iframeProxy"].location.hash;
pParentFrame.style.width = locationUrlHash. split("#")[1].split("|")[0] "px";
pParentFrame.style.height = locationUrlHash.split("#")[1].split("|") [1] "px";
var pParentFrame = parent.parent.document.getElementById("aIframe");
var locationUrlHash = parent.parent.frames["aIframe"].frames["iframeProxy"]. location.hash;
pParentFrame.style.width = locationUrlHash.split("#")[1].split("|")[0] "px";
pParentFrame.style.height = locationUrlHash.split ("#")[1].split("|")[1] "px";
In this case, the iframe in a.html will adapt to the width and height of b.html .
Other similar js cross-domain operation problems can also be solved according to this idea