IFRAME large data volume passing Parameter Local call remote page does not have cross-domain problem JS component call Principle

Put the code first without talking nonsense

Index.html (call page)

<SCRIPT type=text/javascript>var liArr003 = "";liArr003 += "<li><a href=''></a></li>";document.write('<iframe name="'+liArr003+'" src="http://localhost/iframe.html" width="100" height="100"></iframe>');</SCRIPT>

Iframe.html (JS component page)

<script>alert(window.name);</script>

The above is the final code used

 

Requirement: Why is this code available?

For a long time, slides or other components are often used on pages. However, a front-end JS component is usually composed of three parts: CSS, JavaScript, and HTML. In this way, CSS conflicts or JS conflicts may occur when there are multiple page components, which is inconvenient for normal editing. While the SRC address of IFRAME is limited in length, and if you want to use js to manipulate IFRAME, cross-origin issues may occur during local operations. The page cannot be displayed or previewed, very inconvenient. I have been studying the get Method for pages before, but this method has a character length limit. If it exceeds a certain character, it is not supported by browsers such as IE. Then, we have studied cross-origin for a long time.

Purpose: Write the parameters on the Production page. The js iframe component reads the data and displays the data, for example, the focus chart.

 

Source of inspiration: I saw an article about IFRAME adaptive height, which talks about cross-origin. I also want to write a function based on my ideas, but the core content is window. name. Isn't that the name attribute in the tag? Therefore, you just need to write the data directly in the name tag of IFRAME.

 

Actually: <IFRAME name = "data" src = "http: // localhost/iframe.html" width = "100" Height = "100"> </iframe>

Then the window. Name Data is called on the IFRAME page. The data here should be about 3 m at most, which is enough for use.

 

For cross-origin calls, you can add some differences, such

<SCRIPT>
Trydomainprofilereparent.doc ument. Domain} catch (e) {alert ("Err ")}
</SCRIPT>

Summary:

It is embarrassing to study the problem solved by one attribute for a day. However, the idea of exploring truth is very precious. At last, I had another thought.