When should I use encodeURIComponent vs encodeURI?

Use encodeURIComponent for query-string values and path segments. Use encodeURI only for an entire URL where you want to preserve the structure characters.

Does it decode + as space?

URL components technically encode spaces as %20, but application/x-www-form-urlencoded encodes them as +. The decoder handles both.

Is encoding the same as escaping for HTML?

No. HTML escaping (&, <) is different from URL encoding (%26, %3C). Use the HTML Entity Encoder for markup.

$url-encoder

Encoders

Encode or decode URL strings. Compare encodeURIComponent vs encodeURI output side by side. Everything runs in your browser.

Mode:

Text / URL Input

encodeURIComponent

Encodes all special characters. Use for query parameter values.

Output will appear here

encodeURI

Preserves :, /, ?, #, &, =. Use for full URLs.

Output will appear here

When to use which?

encodeURIComponent: Encodes everything except A-Z a-z 0-9 - _ . ! ~ * ' ( ). Use this when encoding a value inside a query string, path segment, or fragment.
encodeURI: Leaves structural characters intact: : / ? # [ ] @ ! $ & ' ( ) * + , ; =. Use this when encoding an entire URL that may contain non-ASCII characters but already has valid structure.