Detailed explanation of using Location in JS_javascript skills

The location address object in JavaScript describes the address opened by a certain window object. To represent the address of the current window, just use "location"; to represent the address of a certain window, use ".location".

1. The meaning of Location in JS

1. The Location object is stored in the Location property of the Window object and represents the Web address of the document currently displayed in that window. Its href attribute stores the complete URL of the document, and other attributes describe various parts of the URL. These properties are very similar to the URL properties 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 you can use the expression location instead of location.href.

2. The Anchor object represents the hyperlink in the document, but the Location object represents the URL (or location) of the document currently displayed by the browser. But the Location object can do much more than that. It can also control the position of the document displayed by the browser. If a string containing a URL is assigned to the Location object or its href attribute, the browser will load the document pointed 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 part of the URL by assigning values ​​to other properties of the Location object. Doing so will create a new URL, part of which is different from the original URL, and the browser will load and display it. For example, if you set the hash property of the Location object, the browser will move to a specified location in the current document. Likewise, if the search attribute is set, the browser will reload the URL with the new query string appended.

4. In addition to the URL attribute, the reload() method of the Location object can reload the current document, and replace() can load a new document without creating a new history record for it. That is to say, in the browser In the history list, the new document will replace the current document.

2. Location attribute in JS

Property Description
hash Sets or returns the URL (anchor) starting with a pound sign (#). If there is no "#" in the address, an empty string is returned.
host sets or returns the host name and port number of the current URL.
hostname sets or returns the hostname of the current URL.
href sets or returns the complete URL. How to display it in the browser's address bar will return it.
pathname sets or returns the path portion of the current URL.
port Sets or returns the port number of the current URL. Sets or returns the port number of the current URL.
protocol sets or returns the protocol of the current URL, the value is 'http:', 'https:', 'file:' and so on.
search sets or returns the URL (query part) starting with a question mark (?).

3. Location object method in JS

Property Description
assign() loads a new document.
reload() reloads 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.

4. Location instance in JS

//简单跳转

function gotoPage(url) { 

var url ="url?catalogid="+catalogID; 

window.location =url; 

}

//为单个页面传递参数

function goto_catalog(iCat) { 

if(iCat<=0) { 

top.location = "url";

} else { 

window.location ="url&#63;catid="+iCat; 

}

}

// 对指定框架进行跳转页面

function goto_iframe(url) { 

parent.mainFrame.location ="url"; 

}

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