In js, window. open () function is the most frequently used window operation. Next we will introduce various operations in js window. If you need to know about it, you can refer to it.
Open a window in HTML
We already know how to open a window in HTML. In most popular browsers, you can use an href statement to open a new window, for example:
Click
| The Code is as follows: |
Copy code |
| <A href = "yer_new_00000000html" target = yer_new_window> here </A> |
To open another window.
Note: In the above Code, the window opened by the target link is the window named "yer_new_window" above.
After reviewing the href goal, we will learn how to open a window in JavaScript.
Open a window in JavaScript
Opening a window in HTML has some drawbacks: you cannot control the size and style of the window. But JavaScript gives you such control.
The syntax for opening a window in JavaScript is:
| The Code is as follows: |
Copy code |
Window. open ("URL", "name", "features "); |
Parameter description:
<Script language = "javascript"> the js SCRIPT starts;
Window. open command to pop up a new window;
'Page.html 'name of the pop-up window;
'Newwindow' indicates the name of the pop-up window (not the file name). It is optional and can be replaced by null;
Height = 100 window height;
Width = 400 window width;
Top = the pixel value between the 0 window and the top of the screen;
Left = 0 the pixel value between the window and the left of the screen;
Toolbar = no indicates whether to display the toolbar. yes indicates display;
Menubar and scrollbars indicate the menu bar and scroll bar.
Resizable = no: whether to change the window size. yes: yes;
Location = no indicates whether the address bar is displayed. yes indicates yes;
Status = no whether to display the information in the status bar (usually the file has been opened), yes is allowed;
</SCRIPT>
The first parameter URL, in actual use, may be such a "http://shop34219081.taobao.com"
The second parameter name is the window name. If you open a window with the same name, the URL will send the open statement to the window that has already been opened.
The third parameter, features. this parameter is optional. It indicates different features of the window. For details, see "Windows features"
Let's look at instance 1:
| The Code is as follows: |
Copy code |
<A onclick = "too many open('win_1.html ', 'javascript _ 1');" href = "#"> Here's a window named cript_1 </A>. |
Let's look at instance 2:
| The Code is as follows: |
Copy code |
<A onclick = "too many open('win_2.html ', 'javascript _ 2');" href = "#"> Here's a window named cript_1 </A>. |
The two small instances will open two pages in two windows, and the two window names are cript_1 and cript_1 respectively. If another instance is like this:
| The Code is as follows: |
Copy code |
<A onclick = "too many open('win_3.html ', 'javascript _ 1');" href = "#"> Here's a window named cript_1 </A>. |
Then you place a page named window_3.html In the first window.
Learning point
| The Code is as follows: |
Copy code |
Window. open ("URL", "name", "features ") |
Note: Do not confuse Methods Window. open () with Methods Document. open (). The functions of these two methods are completely different. To make your code clear, use Window. open () instead of open ()
| The Code is as follows: |
Copy code |
| Window. open ("URL", "name", "features ") |
Method of the Window object. For details, see the html dom tutorial of w3school
JavaScript DOM
If you understand html dom, it will not be difficult to understand JavaScript DOM. For details about html dom, see the html dom tutorial of w3school
In JavaScript, the default window object is window. How can I obtain the properties of the default window?
| The Code is as follows: |
Copy code |
Var the_status = window. status; |
This is to say: Find the status attribute called window and call it to the variable the_status. The status feature of the window contains the words on the status bar. You can also set it in advance, like this:
| The Code is as follows: |
Copy code |
Window. status = "I'm monkeying around! "; |
Window Communication
Sometimes we open two windows at the same time and need to move the other window to the front-end. To use javascript to communicate between windows, you need to apply a reference to the window.
| The Code is as follows: |
Copy code |
Var new_window = window. open ("hello.html", "html_name", "width = 200, height = 200 "); |
This statement opens a small window and assigns it to the variable new_window as a reference to this window.
You can call the new_window method as you call the window method.
New_zookeeper blur ();
Now let's take a look at the two links that move the new window to the foreground or to the background:
| The Code is as follows: |
Copy code |
<A onmouseover = new_00000000focus (); href = "#"> Bring It forward </A> <A onmouseover = new_00000000blur (); href = "#"> Put it Backward </A> |
Connect the above Code, the complete is like this:
| The Code is as follows: |
Copy code |
[Html] [head] [title] Getting and using a window reference [/title] [Script language = "JavaScript"] <! -- Hide me // Open a new window and get a reference to it Var new_window = window. open ("hello.html", "html_name", "width = 200, height = 200 "); // Blur the new window New_zookeeper blur (); // Show me --> </SCRIPT> <H1> A new window has been opened and moved to the background. </H1>
<A onmouseover = new_00000000focus (); href = "#"> Bring it forward </A> <A onmouseover = new_00000000blur (); href = "#"> Put it backward </A> [/Body] [/html] |
Framework Frames
In fact, the framework is also a feature of windows, mainly used to implement window separation.
Other methods
Note:
| The Code is as follows: |
Copy code |
// Close. The parent window dialog box is displayed, and the Child window is closed directly. This. Response. Write ("<script language = javascript> window. close (); </script> "); // Close. The parent window and Child Window are not displayed. Close them directly. This. Response. Write ("<script> "); This. Response. Write ("{top. opener = null; top. close ();}"); This. Response. Write ("</script> "); // In the pop-up window, refresh the current page width = 200 height = 200 menu. Menu Bar, tool bar, address bar, and status bar none This. response. write ("<script language = javascript> window. open ('rows. aspx ', 'newwindow', 'width = 200, height = 200') </script> "); // Refresh the current page in the pop-up window This. Response. Write ("<script language = javascript> window. open ('rows. aspx ') </script> "); This. Response. Write ("<script> window. open ('webform2. aspx ',' _ blank '); </script> "); // In the pop-up window, jump to the webform2.aspx page (in an IE window) This. response. write ("<script language = javascript> alert ('registered successfully'); window. window. location. href = 'webform2. aspx '; </script> "); // Close the current Child Window and refresh the parent window This. Response. Write ("<script> window. opener. location. href = window. opener. location. href; window. close (); </script> "); This. Response. Write ("<script> zookeeper opener.location.replace(w.w.opener.doc ument. referrer); window. close (); </script> "); // Refresh the parent window in the Child Window This. Response. Write ("<script> window. opener. location. href = window. opener. location. href; </script> "); This. Response. Write ("<script> window. opener. location. href = 'webform1. aspx '; </script> "); // A prompt window is displayed. After confirmation, A subwindow (WebForm2.aspx) is displayed) This. Response. Write ("<script language = 'javascript '> alert (' published successfully! '); Window. open ('webform2. aspx') </script> "); // A prompt window is displayed. After confirmation, refresh the parent window. This. Response. Write ("<script> alert ('published successfully! '); Window. opener. location. href = window. opener. location. href; </script> "); // The Same page is displayed. <INPUT type = "button" value = "Button" onclick = "javascript: window. open (window. location. href)"> // Response. Write ("parent. mainFrameBottom. location. href = 'yourwebform. aspx? Temp = "+ str + "';"); |