Back to tech

JavaScriptでGetをする方法

1 min read
Table of Contents

現在、訳あってJavaScriptを使ってます

久しぶりのWebサービスの開発でなれない状態が続いています

さて、JavaScriptにて、ページジャンプをした時にGETの変数を受け取りたいと思い、色々調べててみました

しかし、調査しても出てきませんでした(html見えないようにgetを受け取れるところ埋め込もう的なことは出てきた)

そこで、JavaScriptからGETを受け取れる関数的なものを作っていました。

行った方法は、URLの解析です

下記のようなURLが来たときに、?で分割すれば良いと考えました

http://localhost:8181/D3/next.html?name=Tomoru00%2002311

さらに分割やらして空想配列におさめてあげます

下記に作った関数を書いておきます

function get(){
    var getUrl = window.location.href;
    var getUrlvalue = getUrl.split('?')[1].split('&'); //get
    var values = {};
    for(var i = 0; i < getUrlvalue.length; i++){
        var key = getUrlvalue[i].split("=")[0]; //key
        var value = getUrlvalue[i].split("=")[1]; //value
        values[key] = value; //空想配列に追加
    }
    return values; //空想配列を返す
}

EXAMPLE

URL

http://localhost:8181/D3/next.html?name=Tomoru00%2002311

HTML & JS

<!DOCTYPE html>
<html lang="ja">
    <head>
        <title>examle</title>
        <meta charset="UTF-8">
    </head>
    <body>
        <script type="text/javascript">
            var getvalues = get();
            for (var key in getvalues) {
                document.write("<p>" + getvalues[key] + '</p>');
            }

            function get(){
                var getUrl = window.location.href;
                var getUrlvalue = getUrl.split('?')[1].split('&'); //get
                var values = {};
                for(var i = 0; i < getUrlvalue.length; i++){
                    var key = getUrlvalue[i].split("=")[0]; //key
                    var value = getUrlvalue[i].split("=")[1]; //value
                    values[key] = value; //空想配列に追加
                }
                return values; //空想配列を返す
            }
        </script>
    </body>
</html>

結果

Tomoru00%2002311

注意

GETしたい変数のなかに”?”や”=“があるとうまく値をもらえない可能性がある