How to use JS to get the parameters of the query string in the browser URL

Source: Internet
Author: User

The first thing to know about location is the object and some of the properties in this object:

HREF: Sets or returns the full URL. Like this blog home return http://www.cnblogs.com/wymninja/

Host: Sets or returns the host name and port number of the current URL. Blog home Back to www.cnblogs.com

Hostname: Sets or returns the host name of the current URL. Blog home Back to www.cnblogs.com

Hash: Sets or returns the URL (anchor) starting with the pound sign (#). Homepage of this blog return empty

Pathname: Sets or returns the path portion of the current URL. Blog home Back to/wymninja/

PORT: Sets or returns the port number of the current URL. Homepage of this blog return empty

Protocol: Sets or returns the protocol for the current URL. Homepage of this blog return http:

Search: Sets or returns a URL starting from a question mark (?) (Query section)

Location Object Properties diagram: pictures from Mu-class network

The href attribute of the location holds the full URL of the document, and the other attributes describe each part of the URL, respectively. 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 that you can use an expression location instead of location.href. However, the Anchor object represents a hyperlink in the document, and the Location object represents the URL (or position) of the document currently displayed by the browser

var s = location.tostring (); Console.log (s); #result//http://www.cnblogs.com/wymninja/

These properties of the location object are both readable and writable, and if you change the location.href of the document, the browser loads the new page. Similarly, if you change the Location.hash, the page jumps to the new anchor point, but the page is not overloaded at this time.

The Location object also has three methods: Assign (), reload (), replace ()

Assign (): Loading a new document

Reload (): Can reload the current document

Replace (): You can load a new document without creating a new history for it. In other words, in the browser's history list, the new document replaces the current document. This will not return the current document through the Back button.

Attention:

Do not confuse the Location property of the Window object and the Location object of the Document object. The former refers to a location object, which is simply a read-only string and does not have any attributes of the location object. Document.location and Document.url are synonymous. However, when server redirection exists, Document.location contains URLs that have already been loaded, and Location.href contains the URLs of the documents that were originally requested.

So to get the parameters of the query string in the browser URL. That is the location.search part. Take the picture of Mu class net as an example? courseid = 8&cahpterid = 86 in 8 and 86!!!! Then use the following code:

function Getquery (name) {var reg = new RegExp ("(^|&)" + name + "= ([^&]*) (&|$)"); var r = Window.location.search. SUBSTR (1). Match (reg);//start matching after getquery (CourseID) returns an array ["Courseid=8", "", "8", "&", Index:0,input: "Courseid=8 "]
if (r!=null) return unescape (r[2]); return null;}

which

I'm not sure about match. Read my blog JavaScript string object

The unescape decodes the parameters, such as a space decoding of 20%.

How to use JS to get the parameters of the query string in the browser URL

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.