008 BOM

A: Description

1. Description

　　Browser Object Model

2. The top-level objects

　　Top-level objects in the browser window is

　　Top-level objects in the page document is

　　therefore:

　　　Variable part of the window, the window function is.

　　　You can use the window. Variables, window. Function.

Another name of 3.window

　　top=window

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8 <script>
 9     var name="tom";
10     console.log(top.name);
</11 script>
12 </body>
13 </html>

4. A system dialog

　　Not recommended, one looks different, the impact load.

　　window.alert("mnmnmn")

　　window.prompt ( "Input:");

　　var result = window.confirm (); true or false value is returned

Two: Load Event

1. After triggering event page loads

1 window.onload=function () {
2         
3 }

2. Extended Events

　　Before triggering event is closed: onbeforeunload

　　Close page after the trigger: onunload

Three: Location Object

1. Description

　　Address bar

　　You can set and retrieve URL

2. Program

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <script>
 9         console.log(window.location);
10     </script>
11 </body>
</12 html>

　　effect:

3. Example

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <input type="button" value="显示" id="btn">
 9     <script>
10         console.log (window.location.hash);      // content #, and after 
11          console.log (window.location.host);      // host name and port number 
12          console.log (window.location.hostname);
 13 is          the console.log (window.location.pathname);
 14          the console.log (window.location.port);
 15          the console.log (window.location.protocol);
 16          the console.log (the window.location.search); // content search 
. 17  
18 is          the onload = function () {
 . 19              document.getElementById ( " BTN " ) .onclick= Function () {
 20 is                  the location.href = " https://www.baidu.com " ;      // Properties: Set the address of the jump, with a back 
21 is                  location.assign ( " https://www.baidu.com " );   // method, the same as above, there are back 
22                  location.reload (); // refresh 
23                  the location.replace ( " https://www.baidu.com " );   // no retreat, because there is no historical record 
24              }
 25          }
 26 is      </ Script > 
27 </body>
28 </html>

Guess you like