JavaScriptでクエリパラメータを作成するにはどうすればよいですか?

ここで問題は、なぜ JavaScript を使用してクエリ パラメーターを作成する必要があるのか​​ということです。実際の例を通してそれを理解しましょう。

たとえば、Amazon Web サイトにアクセスして製品を検索すると、URL に検索クエリが自動的に追加されることがわかります。これは、検索クエリからクエリ パラメータを生成する必要があることを意味します。

さらに、ユーザーがドロップダウン オプションから任意の値を選択できるようにすることもできます。クエリパラメータを生成し、選択した値に基づいてユーザーを新しい URL にリダイレクトして結果を取得できます。このチュートリアルでは、クエリ パラメーターの作成方法を学習します。

ここでは、クエリ パラメーターを作成するさまざまな例を見ていきます。

encodeURIComponent() メソッドを使用する

encodeURIComponent() メソッドを使用すると、URL の特殊文字をエンコードできます。たとえば、URL にはスペースが含まれません。したがって、スペース文字を、スペース文字のエンコード形式を表す文字列 ' ' に置き換える必要があります。

さらに、encodedURLComponent() は、URL 全体をエンコードするのではなく、URL のコンポーネントをエンコードするために使用されます。

＃＃＃文法＃＃＃

ユーザーは、次の構文に従ってクエリ パラメーターを作成し、エンコードされた URI コンポーネント () メソッドを使用してそれらをエンコードできます。

リーリー

上記の構文では、キーはクエリ パラメーターに設定されたキーであり、値はクエリ パラメーターの特定のキーに関連付けられます。キーと値を区切るには「=」文字を使用し、2 つのクエリを区切るには「&」文字を使用します。

例 1

以下の例では、オブジェクトを作成し、キーと値のペアを保存します。オブジェクトのキーと値を使用して、クエリ パラメーターを作成します。その後、for-of ループがオブジェクトを反復処理し、1 対 1 のキーと値のペアを取得し、encodedURIComponent() メソッドを使用してエンコードされた文字列を生成します。

最後に、クエリ文字列の長さ -1 と等しい長さの部分文字列を取得して、最後の "&" 文字を削除します。

リーリー

例 2

この例では、ユーザー入力データをクエリ パラメーターとして受け取ります。ユーザー入力を取得するには、prompt() メソッドを使用しました。これは、ユーザーからキーと値を 1 つずつ取得します。

その後、encodeURIComponent() メソッドを使用して、ユーザー入力値を使用してクエリ パラメーターを作成します。

リーリー

このチュートリアルでは、ユーザーはさまざまなデータからクエリ パラメーターを作成する方法を学習しました。オブジェクト データからクエリ パラメーターを作成する方法を学びました。さらに、ユーザー入力を使用してクエリ パラメーターを作成する方法も学びました。これは、Web サイトに検索機能を追加するときに非常に役立ちます。

以上がJavaScriptでクエリパラメータを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。