URL Encode Query String Parameters

Encode query string parameters for safe URL construction. Handle special characters in key-value pairs.

Why Encode Query Parameters?

Query string parameters (?key=value&key2=value2) use special characters that have structural meaning: & separates parameters, = separates keys from values, and # starts the URL fragment. If your values contain these characters, they must be percent-encoded to avoid breaking the URL structure. For example, searching for "Tom & Jerry" without encoding would create a second empty parameter instead of one value containing an ampersand.

Encoding Rules for Query Strings

Use encodeURIComponent() for parameter values — it encodes everything except A-Z a-z 0-9 - _ . ~ ! * ' ( ).
Don't use encodeURI() for parameters — it preserves &, =, and # which breaks query strings.
Spaces: encodeURIComponent produces %20. HTML forms use + for spaces (application/x-www-form-urlencoded).
Build URLs safely: Use the URLSearchParams API in JavaScript — it handles encoding automatically.

// JavaScript - URLSearchParams (recommended)
const params = new URLSearchParams({
  query: 'Tom & Jerry',
  page: '1',
  filter: 'name=test'
});
params.toString();
// "query=Tom+%26+Jerry&page=1&filter=name%3Dtest"

// Manual encoding
const value = encodeURIComponent('Tom & Jerry');
// "Tom%20%26%20Jerry"

// Python
from urllib.parse import urlencode
urlencode({'query': 'Tom & Jerry', 'page': 1})