How to use Location in JS _ javascript tips-js tutorial

Source: Internet
Author: User
In javascript, location is used to obtain or set the URL of a form and parse the URL. It is one of the most important objects in BOM. Next we will discuss in detail the use of Location objects. The location address object in javascript describes the address opened by a window object. To represent the address of the current window, you only need to use "location". To represent the address of a window, use" <窗口对象> . Location ".

1. Meaning of Location in JS

1. The Location object is stored in the Location attribute of the Window object, indicating the Web address of the document currently displayed in that Window. Its href attribute stores the complete URL of the document, while other attributes describe each part of the URL. These attributes are very similar to the URL attributes of the Anchor object (or Area object. When a Location object is converted to a string, the value of the href attribute is returned. This means that you can use the expression location to replace location. href.

2. The Anchor object represents the hyperlink in the document, while the Location object represents the URL (or Location) of the document currently displayed by the browser ). However, the Location object can do much more than this. It can also control the Location of the document displayed by the browser. If you assign a URL-containing string to the Location object or its href attribute, the browser will load the document referred to by the new URL and display it.

3. In addition to setting location or location. href to replace the current URL with the complete URL, you can also modify some URLs by assigning values to other attributes of the Location object. In this way, a new URL will be created, and some of them are different from the original URL. the browser will load and display it. For example, if the hash attribute of the Location object is set, the browser moves to a specified Location in the current document. Similarly, if the search attribute is set, the browser will re-load the URL with the new query string appended.

4. Besides the URL attribute, the reload () method of the Location object can reload the current document. replace () can load a new document without creating a new history for it, that is to say, in the browser's history list, the new document replaces the current document.

Ii. Location attribute in JS

Attribute description
Set the hash or return the URL (Anchor) starting with ). If the address does not contain "#", an empty string is returned.
Host setting or return the host name and the port number of the current URL.
Set or return the Host Name of the current URL.
Href sets or returns the complete URL. Display it in the address bar of the browser and return it.
Pathname setting or return the path of the current URL.
Port is set or the port number of the current URL is returned, and the port number of the current URL is set or returned.
The protocol that sets or returns the current URL. The value is 'HTTP: ', 'https:', 'file: ', and so on.
Search sets or returns the question mark (?) The start url (query part ).

Iii. Location object method in JS

Attribute description
Assign () loads new documents.
Reload () Reload the current document, which is equivalent to pressing the "refresh" (IE) or "reload" (Netscape) key on the browser.
Replace () replaces the current document with a new document, which is equivalent to pressing the "refresh" (IE) or "Reload" key on the browser.

Iv. Location instance in JS

// Simple jump function gotoPage (url) {var url = "url? Catalogid = "+ catalogID; window. location = url;} // pass the function goto_catalog (iCat) {if (iCat <= 0) {top for a single page. location = "url";} else {window. location = "url? Catid = "+ iCat ;}/// jump to the page of the specified framework function goto_iframe (url) {parent. mainFrame. location =" url ";}

The above is all the content of this article. I hope you will like it.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.