JS-BOM objects (a) _window, location

BOM / Browser Object Model

He gave js provides an implementation can operate the browser

BOM what can be done?

1. You can manipulate window objects

2. Providing navigation objects

3. Providing positioning objects

4. It provides historical objects

5. It provides screen object

window: it is the topmost object:

1. document document object: the corresponding page

2. Loction positioning objects: corresponds to the address bar

3. histroy historical objects: buttons that correspond to the forward and backward refresh

4. Navigator navigation objects: the corresponding information for the client browser (for example: the type of browser version of the browser, etc.)

5. Screen screen objects: the corresponding screen

6. frame object frame (with much ***)

The method of the window object

// window may be omitted when the method is invoked window object 

// ------ ----- alert box 
    window.alert ( "warning text" ); 

// ----- confirmation box (when click OK to return return true cancel false) ---- 
    the let the Result = window.confirm ( "you sure you want to delete it?" ); 

// ---- input box ----- (rarely used, basic without) 
    the let the Result = prompt ( "Please output an integer" );  
     // all get data from the client is a string, involved in computing flower, needs data type conversion 
   
// --- Open --- methods: method to open a new browser window or a named window to find 
    / * open has four parameters are optional:      
        1 url: web page address link of 
        2 name: the name of the form is mainly used for ultra target attribute links. 
        Feature 3 window: used to set the size of the form, position, the display content, etc. 
        4 change the current entry browsing history (basic need) 
    * /        
    //When you open a form when it will return to a new form objects                
    let new_window = window.open ( "web address", "form name", "form characteristic" ); 

// --close () - Close the form: make sure you are close which is a form 
     
// interval function 
    window.setInterval ()    
    window.setTimeout ()   
//   when the start-up time interval function this function returns a time id to us. We can function to cancel the time interval    

//   -------- open interval -------------- 
//     the setInterval ()   
//     the specified period (in milliseconds ) to call a function or evaluate the expression. How many milliseconds every time, (it will be repeated execution) 
//     the setTimeout ()    
// call the function after a specified number of milliseconds or calculation expression. Execution time (it's worth executed once) how many milliseconds 
// -------- cleanup interval --------------- 
    clearInterval (time id)   
    clearTimeout (time id)

Property of the window object

 // get the internal and external form of the height and width 

    window.innerWidth 
    window.innerHeight   
    // width and height of the visible area forms 

    window.outerWidth 
    window.outerHeight 
    // form and the width and height 

    document.documentElement.clientWidth    
    Document .documentElement.clientHeight 
    // width and height of the viewable area of the form, not a window but a simple 

// opener returns a reference to create this window the window.

 

Location

Location object: the object is mainly operating address bar of the browser

Location object contains information about the current URL.

Location object is a part of the Window object, it can be accessed by window.location property.

An integral part of the complete url address:

1. Protocol: http: //

   http: hypertext transfer protocol (http protocol is actually a package tcp / ip protocols)

   https: Hypertext Transfer Protocol (security mechanism)

   tcp / ip: Internet Protocol

   ftp: File Transfer Protocol

   smtp: Simple Mail Transfer Protocol

2. Host address: localhost: 8080 (127.0.0.1:8080) ip address + port number

   A plurality of servers may be installed on a computer

3. The name of the project under the host

4. Below the name of the project resources

5. The query string role: backstage pass parameters to the network used. ? A plurality of parameters using an ampersand.

url given uri

url: Uniform Resource Locator role: to obtain and access resources on the Internet

uri: uri Uniform Resource Identifier may think that he is an integral part of the url: remove the protocol and host address part is behind uri

Location of use

// how to obtain the location object 
    var   locationObj = the window.location; 

// attribute manipulation target location 
    // get host address 
     var   host_val =   locationObj.host; 

    // get the host name 
    var hostname = locationObj.hostname; 

    // get the port number 
    var = port_val locationObj.port; 

    // get the full url address on the address bar (often used with conventional ****) 
    var url_val = locationObj.href; 

    // get the path portion (URI) 
    var path_val = locationObj.pathname; 
    
    / / reception of the protocol 
    var   protocol_val = locationObj.protocol; 

    //Obtain the query string 
    var STR = locationObj.search;

location methods

// ASSIGN () to load the new document. History will have it jump page. 
    window.location.assign ( "https://www.baidu.com" ); 

// reload (Boolean value) refresh If set to true it means that has been retrieved from the server. 
    window.location.reload (); 

// the replace () can be used a new document to replace the current document. No, no history will have it jump page. 
    window.location.replace ( "https://www.baidu.com" ); 

// skip our usual method of setting the href attribute. 
    = window.location.href "https://www.baidu.com" ;
     // window.location.href = "#"; do not jump