Practical frame (iframe) operation code_javascript skills

Commonly used codes:

<iframe src="http://www.baidu.com" marginwidth="0" marginheight="0" border="0"
	scrolling="no" frameborder="0"
	width="350" height="270"></iframe>

<iframe src="http://www.jb51.net/plugins/like.php&#63;href=YOUR_URL"
    scrolling="no" frameborder="0"
    style="border:none; width:450px; height:80px"></iframe>

Javascript access frame, iframe and href orientation

一.frame

1． Reference from parent frame to child frame

Knowing the above principles, it is very easy to reference the child frame from the parent frame, that is:

window.frames["frameName"];

This references the subframe named frameName within the page. If you want to reference a subframe within a subframe, according to the nature of the referenced frame, which is actually the window object, you can implement it like this:

window.frames["frameName"].frames["frameName2"];

In this way, the second-level sub-frame is referenced, and by analogy, multi-layer framework references can be achieved.

2． Reference from child frame to parent frame

Each window object has a parent attribute, representing its parent frame. If the frame is already a top-level frame, window.parent also represents the frame itself.

3． References between sibling frameworks

If two frames are sub-frames of the same frame, they are called sibling frames and can reference each other through the parent frame. For example, a page includes 2 sub-frames:

<frameset rows=”50%,50%”>
  <frame src=”1.html” name=”frame1″ />
  <frame src=”2.html” name=”frame2″ />
</frameset>

You can use the following statement in frame1 to reference frame2:

self.parent.frames["frame2"];

4． Mutual references between frameworks at different levels

The hierarchy of frames is for top-level frames. When the levels are different, as long as you know the level you are at and the level and name of the other frame, you can easily access each other by using the properties of the window object referenced by the frame, for example:

self.parent.frames["childName"].frames["targetFrameName"];

5． Reference to the top-level frame

Similar to the parent attribute, the window object also has a top attribute. It represents a reference to the top-level frame, which can be used to determine whether a frame itself is a top-level frame, for example:

Copy code The code is as follows:

//Determine whether this frame is a top-level frame
if(self==top){
//dosomething
}

i.e.

Copy code The code is as follows:

if (window.top!=window.self) {
// dosomething
}

Change the loading page of the frame

The reference to the frame is a reference to the window object. Using the location attribute of the window object, you can change the navigation of the frame, for example:

window.frames[0].location = "1.html";

Reference JavaScript variables and functions in other frameworks

Before introducing the techniques of referencing JavaScript variables and functions in other frameworks, let’s take a look at the following code:

<script language=”JavaScript” type=”text/javascript”>
<!–
function hello(){
  alert(“hello,ajax!”);
}
window.hello();
//–>
</script>

2.iframe

Strictly speaking, you should use the frames array and document.all.

Copy code The code is as follows:

三.href

1. The onclick event of the link is executed first, followed by the action under the href attribute (page jump, or javascript pseudo link);
2. Assume that both href and onclick exist in the link. If you want the action under the href attribute not to be executed, onclick must get a false return value. If you don’t believe it, you can comment out the return false in the goGoogle function;
3. If the page is too long and has a scroll bar, and you want to perform operations through the onclick event of the link. Its href attribute should be set to javascript:void(0); instead of #, which can prevent unnecessary page jumps;
4. If a function with a return value is called in the href attribute of the link, the content of the current page will be replaced by the return value of this function;
5. There will be a difference when holding down the Shift key.
6. The problem I encountered today is that the parentNode cannot be accessed in the form of href in IE6.0.
7. Try not to use javascript: protocol as the href attribute of A. This will not only cause the window.onbeforeunload event to be triggered unnecessarily, but also cause the gif animated image to stop playing in IE.

For example:

Change password

Adjust the height of the frame

Copy code The code is as follows:

window.onload = function() {
 parent.document.getElementById('customiframe').style.height = document.body.clientHeight "px";
}