--- title: URLSearchParams slug: Web/API/URLSearchParams tags: - API - Interface - Landing - Reference - URL API - URLSearchParams translation_of: Web/API/URLSearchParams ---
URLSearchParams
インターフェイスは URL のクエリー文字列の操作に役立つメソッドを定義します。
URLSearchParams
を実装するオブジェクトは 直接 {{jsxref("Statements/for...of", "for...of")}} で使うことができます。例えば次の 2行は等価です。
for (const [key, value] of mySearchParams) {} for (const [key, value] of mySearchParams.entries()) {}
{{availableinworkers}}
URLSearchParams
オブジェクトを返すコンストラクターです。var paramsString = "q=URLUtils.searchParams&topic=api"; var searchParams = new URLSearchParams(paramsString); // 検索パラメーターを列挙する for (let p of searchParams) { console.log(p); } searchParams.has("topic") === true; // true searchParams.get("topic") === "api"; // true searchParams.getAll("topic"); // ["api"] searchParams.get("foo") === null; // true searchParams.append("topic", "webdev"); searchParams.toString(); // "q=URLUtils.searchParams&topic=api&topic=webdev" searchParams.set("topic", "More webdev"); searchParams.toString(); // "q=URLUtils.searchParams&topic=More+webdev" searchParams.delete("topic"); searchParams.toString(); // "q=URLUtils.searchParams"
URLSearchParams
コンストラクターは完全な URL をパースしません。ただし、先頭に ?
が存在すれば、読み飛ばします。
var paramsString1 = "http://example.com/search?query=%40"; var searchParams1 = new URLSearchParams(paramsString1); searchParams1.has("query"); // false searchParams1.has("http://example.com/search?query"); // true searchParams1.get("query"); // null searchParams1.get("http://example.com/search?query"); // "@" (equivalent to decodeURIComponent('%40')) var paramsString2 = "?query=value"; var searchParams2 = new URLSearchParams(paramsString2); searchParams2.has("query"); // true var url = new URL("http://example.com/search?query=%40"); var searchParams3 = new URLSearchParams(url.search); searchParams3.has("query") // true
仕様書 | 状態 | 備考 |
---|---|---|
{{SpecName('URL', '#urlsearchparams', "URLSearchParams")}} | {{Spec2('URL')}} | 初回定義 |
{{Compat("api.URLSearchParams")}}