Encode URL Query Values: encodeURIComponent
To percent-encode a query-string value, run encodeURIComponent on that value only. Docify's Encode component button does that. Load sample fills https://example.com/search?q=hello world&category=news and does not run Encode URI or Encode component. Encode URI then writes https://example.com/search?q=hello%20world&category=news. Encode component writes https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dhello%20world%26category%3Dnews. Spaces become %20, not +. Reserved characters such as :/?#&= are encoded on Encode component. Encode URI is a different button — encodeURI on a full URL. Nothing is uploaded.
A query parameter is data, not URL structure. If you paste a whole URL into Encode component, the :, /, ?, and & delimiters are encoded too and the URL breaks. The steps below match the live URL encoder. Load sample fills that leftover URL and does not run Encode URI or Encode component.
How to encode a query value in three steps
Step 1: Paste the value, not the whole URL
On Encode, type or paste the parameter value into the left-hand box. Both Encode buttons stay disabled until that box has text. There is no file picker and no as-you-type encoding. Load sample fills a complete URL instead — see the leftover below. A single query value still looks like:
Step 2: Click Encode component
Open the Docify URL encoder and click Encode component. The page runs encodeURIComponent(input). Use Encode URI only when the box already holds a complete URL and you only need spaces and non-ASCII encoded. The work stays in the browser.
Step 3: Copy the encoded value
Copy writes the output to the clipboard. There is no download button. A space becomes %20:
Encode URI on a full URL
If the string is already a URL and only the values contain spaces, Encode URI is the matching button. It runs encodeURI and leaves reserved delimiters intact. Load sample fills this leftover and does not run Encode:
Encode URI leftover is that same URL with the space as %20 and :/?#&= left as delimiters. Encode component on that same leftover writes https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dhello%20world%26category%3Dnews — usable as a single parameter value, not as a navigable URL. See encodeURI vs encodeURIComponent.
What each button encodes
| Character | encodeURI | encodeURIComponent |
|---|---|---|
| Space | %20 | %20 |
| & | & | %26 |
| ? | ? | %3F |
| = | = | %3D |
| # | # | %23 |
| + | + | %2B |
What this page does not do
Form encoding
HTML form POST bodies often use application/x-www-form-urlencoded, where a space is +. Docify never emits that dialect. A plus in the input is left as + by Encode URI and becomes %2B on Encode component.
Unreserved marks
Both functions leave !'()* unescaped. If a server requires those as percent sequences, you must add that encoding yourself.
Encode a query value in the browser
encodeURIComponent for a value. encodeURI for a full URL. Spaces are %20. Nothing is uploaded.
Use URL Encoder →FAQ
- Does Docify upload the text I encode?
- No. Encode URI, Encode component, Load sample, and Copy run in your browser. The page does not send the text to a server.
- Should I use Encode URI or Encode component for a query value?
- Use Encode component. It runs encodeURIComponent, which percent-encodes reserved characters such as : / ? # & = so the value is safe inside a path segment or query parameter. Encode URI runs encodeURI and leaves those delimiters intact — that is for a complete URL, not one field. Load sample fills https://example.com/search?q=hello world&category=news and does not run either button. Encode URI then writes https://example.com/search?q=hello%20world&category=news. Encode component writes https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dhello%20world%26category%3Dnews.
- Does this turn spaces into + like HTML forms?
- No. encodeURI and encodeURIComponent emit %20 for a space. They do not implement application/x-www-form-urlencoded, where a space is + and a literal plus must be %2B.
- Does Encode component encode ! ' ( ) * ?
- No. Neither encodeURI nor encodeURIComponent encodes the marks ! ' ( ) * (ECMA-262 / historical RFC 2396). Letters, digits, and -_.~ also stay unescaped.