JS's Location Object

Source: Internet
Author: User

The Location property of the Window object refers to the place object, which represents the URL of the document currently displayed in the window, and defines a method for loading the window into the new document. The Location property of the Document object is also referenced to the location object: window.location = = = Document.location returns True
The Document object also has a URL property, which is a static string that holds the URL of the documents when the document is first loaded. If you navigate to a fragment identifier in the document (such as #table-of-c ontents), the location object is updated accordingly, and document. The URL property does not change.

The Location property of the Window object refers to the position object, which represents the URL of the document currently displayed in the window. The href attribute of the Location object is a string that contains the full text of the URL. The ToString () method of the Location object returns the value of the href attribute so that, in the case where ToString () is called implicitly, you can make the
Use location instead of location. Href. Other properties of this object-protocol,host,hostname,port,pathname , and search, Each part of the URL is represented separately. They are called "URL decomposition" properties and are supported by the link object (created by <a> and <area> elements in the HTML document).

    • Location.hostname returns the domain name of the web host
    • Location.pathname returns the path and file name of the current page
    • Location.port returns the port of the web host (80 or 443)
    • Location.protocol returns the Web protocol used (HTTP///https://)
    • The Location.href property returns the URL of the current page.
    • The Location.assign () method loads the new document.

The hash and search properties of the Location object are more interesting. If so, the hash property returns the fragment identifier section in the URL. The search property is similar, and it returns the URL after the question mark, which is usually a query string of some kind. In general, this section is used to parameterize URLs and embed parameters in them.
Although these parameters are typically used for scripts that run on the server, they can be used in JavaScript-enabled pages as well.

Example 14-2: Extracting the parameter/rate in the search string for a URL 10 This function is used to parse the Name=value parameter pair from the URL of the query string + it will name=value to the property stored in an object and return that object + to use it + var args= Urlargs ();//Parse the parameter + var Q=args from the URL. Q | | "";//If the parameter is defined, use the parameter} otherwise use a default value +var N=ARGS.N? PARSELNT (ARGS.N): 1o,+/function Urlargs () {var args={);//define an empty object Var query=location. Search  SUBSTRING (1); Find the query string and remove the '? ' Var pairs=query. Split ("&");//separate query strings according to the "&" symbol for (Var i:o;i<Pairs. Length i++) {//For each fragment var pos=pairs[i].indexof (' = '); /, find the "name=value "if (POS==-i)continue;//If not found, skip Var name=pairs[i].substring (o,pos),ll extract name var value=pairs[i].substring (pos+1);ll extract Value value=decodeuricomponent (value); //Decode value Args[name]=value; //Storage as attribute) return args; Returns the parsed argument)

The Assign () method of the Location object allows the window to load and display the document in the URL you specify. The replace () method is similar, but it deletes the current document from the browsing history before loading the new document. If the script loads a new document unconditionally, the replace () method may be a better choice than the Assgin () method. Otherwise, "back"
The button will bring the browser back to the original document, and the same script will reload the new document. You can use location if you detect that a user's browser does not support certain features to display a fully functional version. Replace () to load the static HTML version.
If the XMLHttpRequest object is not supported by the Johei browser
is directed to a static page that does not require Ajax

if (ixmlhttprequest) location.replace ("staticpage.html");

Note that in this example, the descendant of replace () is a relative URL. Relative URLs are parsed relative to the directory in which the current page resides, as if they were used in a hyperlink. In addition to the Assgin () and Replace0 methods, the Location object also defines the reload () method, which allows the browser to reload the current document.

A more traditional way to make a browser jump to a new page is to assign the new URL directly to the Location property:

Location= "http://www.oreilly.com";//purchase book on this website!


Relative URLs can also be assigned to location, which is parsed relative to the current URL:

Location= "page2.html";//Load Next page


A purely fragment identifier is a type of relative URL that does not let the browser load a new document, but only scrolls it to a location in the document. #top标识符是个特殊的例子: If the ID of a document without an element is "top", it will cause the browser to jump to the beginning of the document.

Location= "#top";//jump to the top of the document


The URL decomposition properties of the location object are writable, and re-assigning them will change the position of the URL and cause the browser to load a new document (or jump in the current document if the hash attribute is changed):

Location.search = "? page=" + (pagenum+i);//Load Next page

JS's Location Object

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.