Dom manipulation of JavaScript (i)

DOM: Document Object Model--tree model
Documents: Tag documents, objects: documents in each Element object, model: abstract Things

A: window:

Property (value or Sub-object):
Opener: Opens the source window of the current window, if the current window is open for the first time, then opener is NULL, you can use this property to close the source window.

Method (function):
Event (pre-Set program, triggered):

1.window.open ("Part I", "Part II", "Part Three", "Part IV");

Feature parameters:

Part I: Write the address of the page you want to open
Part Two: Open the way that _blank is open in a new window
Part III: Control open windows, can write multiple, separated by a space
Toolbar=no New Open Window no toolbar
Menubar=no no menu bar Status=no no status bar
width=100 height=100 Width Height
left=100 Open Window How far to the left
Resizable=no window size is not adjustable
Scrollbars=yes scroll bar appears
Location=yes has address bar

Return value: Newly opened Window object

2: The simplest open window
window.open ("http://www.baidu.com", "_blank", "toolbar=no"); Open Baidu in a new window.

3: Open the window and save it in a variable
var w= window.open ();

4: Open the window only once, examples are as follows:

if (w==null)
{
W=window.open ("http://www.baidu.com", "_blank", "toolbar=no");
}

Here with an If statement, determine whether the value of W is empty, open a window after the value of W is not empty, and then click on the mouse to call this function does not execute open a new window.

5: Saves all open windows, storing each open window value in an array.

function Openw ()
{
W[i++]=window.open ();
}

6:close (): Close the specified window

Window.close (): Close the current window
W.close (): Close W window
Close multiple child windows: The window placed in the array: W[i].close ();
Close the source window that opens the current window
Window.opener.close ();

7: A comprehensive example

(1) Only one window is opened and the child window is closed

First define two div in body, use onclick= "Openw ()" or onclick= "Closew ()" To set to trigger after mouse click, call function Openw and Closew;

<Divstyle= "margin:10px;padding:10px;border:1px solid blue; Cursor:pointer;float:left"onclick= "Openw ()" >Open a window</Div><Divstyle= "margin:10px;padding:10px;border:1px solid blue; Cursor:pointer;float:left"onclick= "Closew ()" >Close Window</Div>

Write the following code in the JavaScript statement:

<script language= "JavaScript" >var  W; function Openw () {     if(w==null)    {    w=window.open ("http://www.baidu.com", " _blank "," toolbar=no ");}    } function Closew () {    w.close ();} </script>

Effects such as:

Click open window, pop up a new window, click Open Window again because the value in W is not empty, you can no longer open a window:

When you click Close window, the child window is closed.

(2) Open a set of Windows, click Close window to turn off all the sub-windows

Using the array W to store each open window, close all the sub-windows with W[i when closing, and write the following code in the JavaScript statement:

var New Array (); var i=0; function Openw () {        w[i]=window.open ("http://www.baidu.com", "_blank", "toolbar=no");    I+ +;} function Closew () {    for (var n=0;n<w.length;n++)    {    w[n].close ()}    } 

Multiple windows are open:

Click Close All windows, then one click Closes all open child windows.

(3) Close the source window in the child window:

In the child window of the file definition of two functions, one is to close its own window, one is to close the source window is the previous level window, in the body with the onclick set to click Close the current window to call the C () function, click Close to open the source of the current window to call the CC () function:

function C () {    window.close ();} function cc () {    window.opener.close ();}

Effects such as:

8: Interval and delay:

Window.setinterval ("Code to execute", number of milliseconds in interval)
Window.clearinterval (ID of the interval); The code that is used to clear every few seconds after the loop is executed

Window.settimeout ("Code to execute", number of milliseconds to delay)
Window.cleartimeout (deferred ID); Clear settimeout, generally deferred execution is more commonly used.

(1) An example of interval execution, which is the function of popping three windows at intervals of 5 seconds, and then closing them after 10 seconds.

The Window.setinterval ("OK", 5000) is received with an ID, the Window.setinterval ("CC ()", 10000) is received with ID2, and three pages are opened when the program calls OK (). Then use Window.clearinterval (ID) to clear the loop of the ID, then call the function cc () to close the three windows, and then clear:

varId,id2;varSina,qq,xinhuafunctioncc () {sina.close ();    Qq.close ();    Xinhua.close (); Window.clearinterval (ID2);}functionok () {Sina= window.open ("http://www.sina.com.cn", "_blank", "Toolbar=no width=300 height=200 top=100 left=0"); QQ= window.open ("http://www.qq.com", "_blank", "toolbar=no width=300 height=200 top = left=500"); Xinhua= window.open ("http://www.xinhuanet.com", "_blank", "Toolbar=no width=300 height=200 top=300 left=200");        Window.clearinterval (ID); Id2= Window.setinterval ("CC ()", 10000);} ID= Window.setinterval ("OK ()", 5000);

(2) The example of deferred execution, which is the function of 5 seconds to pop up three windows, and then after 10 seconds to close it.

There is no need to clear the deferred execution here, so it is common to delay execution.

function cc () {    sina.close ();    Qq.close ();    Xinhua.close ();} function ok () {    = window.open ("http://www.sina.com.cn", "_blank", "Toolbar=no width=300 height=200 top=100 left=0" );     = window.open ("http://www.qq.com", "_blank", "toolbar=no width=300 height=200 top = left=500");     = window.open ("http://www.xinhuanet.com", "_blank", "Toolbar=no width=300 height=200 top=300 left=200");        Window.settimeout ("CC ()", 10000);        } Window.settimeout ("OK ()", 5000);

(3) Delay execution, open three windows every 5 seconds, open 4 times and then stop.

Use in the loop inside call yourself, this use way to pay attention to the conditions of the setting, otherwise it may cause the window has been open, and finally crashed.

varSina,qq,xinhua;varI=0;varID;functioncc () {sina.close ();    Qq.close (); Xinhua.close ();}functionok () {Sina= window.open ("http://www.sina.com.cn", "_blank", "Toolbar=no width=300 height=200 top=100 left=0"); QQ= window.open ("http://www.qq.com", "_blank", "toolbar=no width=300 height=200 top = left=500"); Xinhua= window.open ("http://www.xinhuanet.com", "_blank", "Toolbar=no width=300 height=200 top=300 left=200"); I++; if(I >= 4)    {        return; }    Else    {        //Window.settimeout ("CC ()", 10000);id = window.settimeout ("OK ()", 5000); }}window.settimeout ("OK ()", 5000);

Dom manipulation of JavaScript (i)