Location object attributes in html documents and common usage,

Location object attributes in html documents and common usage,

A simple understanding of location objects:

1. The location object contains the url Information of the currently loaded html document.

2. The location object is an attribute of the window object and can be accessed through the old window. location

Here are some URL (Resource Locator) Information:

In a browser, a URL consists of the following parts:

[Protocol] [host] [path] [query]

Protocols: common protocols include:

Http: // indicates that the resource file is on the web server.

Ftp: // indicates that the resource file is on the ftp server on the network.

Host: host name and port number, for example, host: localhost: 8080

Path: the path information of the project, which is generally composed of "/" and characters. "/" indicates the parent-subordinate relationship.

Query: generally "?" When a key-value Pair (key = value) is added at the beginning, multiple key-value pairs are separated by "&" and can be used for dynamic web pages, you can submit parameters to the server for background operations, query database conditions, submit table data, and so on, encryption or other methods are required for security-related things ....

You can also add parameters starting with "#" after the query, but this item is not used at the moment.

Location object property:

1. href attribute: the complete url Information of the current page, including the protocol, host name, port number, query parameter, and # information. The complete information includes

2. host attribute: host name and port number, for example, localhost: 8080 Local Machine

3. hostname: Host Name

4. port: port number in the url

5. pathname: the part of the path content in the url that contains "/"

6. protocol: protocol

7. serach: Take "?" Part of the Start query

8. hash: content starting "#"

Common location usage

Obviously, in addition to providing developers with convenient property information, there is also a more important and common use.

Reload the page to refresh the document content. But more importantly, you can reload the document content after modifying the href information.

Location. href: After the value is assigned, the browser will refresh the content of the document based on the new url specified.

Location. reload (): reload the document

Help us solve cross-origin page problems:

1. Refresh the current page

Window. location. href = url // I am used to this method.

Self. location. href = url

Location. href = url

The above three methods can be used to refresh the current page (reload Based on the specified url, it can be another brand new document, replacing the current document)

2. When iframe is used to include a child page in the parent page

Refresh the child page on the parent page:

Window. frames ["id"]. location. reload () // id is the iframe id in the page

3. Refresh the parent page on the Child page

Parant. location. reload ()

Self. opener. location. reload ()

There are many methods available. Continue to summarize them with the actual use in the future !!!!

Other common methods:

Location. replace () // use the new document to replace the current document

Location. assign () // load new document