How to Encode URL in JavaScript
Topic: JavaScript / jQueryPrev|Next
Answer: Use the encodeURIComponent() Method
You can use the built-in method encodeURIComponent() to safely encode a URL in JavaScript.
The encodeURIComponent() method encode all characters except the following:
A-Z a-z 0-9 - _ . ! ~ * ' ( )Let's check out an example to understand how this method basically works:
Example
Try this code »<script>
// URL unsafe string
var item = "$url+/unsafe@item #name;"
// Encode item name and append to URL
var url = "http://example.com/search.php?product=" + encodeURIComponent(item);
document.write(url);
// Prints: http://example.com/search.php?product=%24url%2B%2Funsafe%40item%20%23name%3B
</script>You can alternatively use the encodeURI() method, which does not encode characters that have special meaning (reserved characters) for a URI e.g. #, /, ?, etc.
The encodeURI() method encode all characters except the following:
A-Z a-z 0-9 ; , / ? : @ & = + $ - _ . ! ~ * ' ( ) #The following example demonstrates how this method actually works:
Example
Try this code »<script>
// Sample URL
var url = "http://example.com/search.php?product=laptop&price=500#featured";
document.write(url);
// Prints: http://example.com/search.php?product=laptop&price=500#featured
</script>Please check out the tutorials on HTML URL and HTML URL encoding to learn more about the different components of a URL and URL encoding.
Related FAQ
Here are some more FAQ related to this topic:
