jQuery Encode/Decode URL String

Sam Deering
Tweet

Simple jQuery code snippet to encode/decode (convert) a href params in a url string (http address) so that they can be properly viewed on a web page. For example, %20 is the html equivalent of a space and %40 is an ampersand (@).

Encode URL String

var url = $(location).attr('href'); //get current url
//OR
var url = 'folder/index.html?param=#23dd&noob=yes'; //or specify one

var encodedUrl = encodeURIComponent(url);
console.log(encodedUrl);
//outputs folder%2Findex.html%3Fparam%3D%2323dd%26noob%3Dyes

Decode URL String

var url = $(location).attr('href'); //get current url
//OR
var url = 'folder%2Findex.html%3Fparam%3D%2323dd%26noob%3Dyes'; //or specify one

var decodedUrl = decodeURIComponent(url);
console.log(decodedUrl);
//outputs  folder/index.html?param=#23dd&noob=yes

HTML URL Endoding References

space 	%20
! 	%21
" 	%22
# 	%23
$ 	%24
% 	%25
& 	%26
' 	%27
( 	%28
) 	%29
* 	%2A
+ 	%2B
, 	%2C
- 	%2D
. 	%2E
/ 	%2F
... 
etc

See all HTML URL Endoding References

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • http://www.androidfordummies.it Giorgio

    Simply and direct.
    thanks :)

  • http://twitter.com/pleivac Soy Pedro no Pedrito

    like

  • praba

    superub with exclamatory mark..!

  • Rajan

    Thank you. Lines are small but very important. Thanks again

  • Navratan

    decodeURIComponent shows ‘+’ instead of any space ??

  • http://www.minddotss.com varalakshmi

    Thanks for the solution…