JavaScriptにより、URLエンコードとデコードを行います。
このページでそのままツールとして使えるように実行サンプルとソースを記載しておきます。
個人的に少々使いたいので、実行サンプルを先に書きます(; ･`д･´)
URLエンコードとデコードの実行サンプル
URLエンコードとデコードを行います。
左のテキストエリアに入力した文字列をもとに、エンコード、または、デコードを実行。右側のテキストエリアに表示します。
| 入力 | →操作→ | encodeURIComponent | encodeURI |
|---|---|---|---|
| |
URLエンコードとデコード実行サンプルのソース
上記サンプルのソースは、次の通りです。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | <table> <thead> <tr> <th>入力</th> <th>→操作→</th> <th>encodeURIComponent</th> <th>encodeURI</th> </thead> <tbody> <tr> <td><textarea id="txtSrc" placeholder="ここに処理したい文字列を書く"></textarea></td> <td> <button type="button" onclick="enc();">エンコード</button><br> <button type="button" onclick="dec();"> デコード </button> </td> <td><textarea id="txtDest_uc" placeholder="変換結果1:decodeURIComponent"></textarea></td> <td><textarea id="txtDest_u" placeholder="変換結果2:decodeURI"></textarea></td> </tbody> </table> <script> function enc(){ document.getElementById("txtDest_uc").value = encodeURIComponent(document.getElementById("txtSrc").value); document.getElementById("txtDest_u").value = encodeURI(document.getElementById("txtSrc").value); } function dec(){ document.getElementById("txtDest_uc").value = decodeURIComponent(document.getElementById("txtSrc").value); document.getElementById("txtDest_u").value = decodeURI(document.getElementById("txtSrc").value); } </script> |
サンプルの解説
URLエンコードをしたい場合、encodeURIComponent()、または、encodeURI()を使用して、URLエンコードを行います。
逆に、URLデコードをしたい場合、decodeURIComponent()、または、decodeURI()を使用して、URLデコードを行います。
URL全体を処理したい場合は、xxcodeURI()。キー、値とかクエリの一部だけを処理したい場合は、xxcodeURIComponent()を使います。
