GET 매개 변수에서 값을 얻는 방법은 무엇입니까? 매개 변수가있는

다음과 같이 GET 매개 변수가있는 URL이 있습니다.

www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5

의 전체 가치를 얻어야합니다 c. URL을 읽으려고했지만 m2. JavaScript를 사용하여이 작업을 어떻게 수행합니까?

답변

JavaScript 자체 에는 쿼리 문자열 매개 변수를 처리하기위한 기본 제공 기능이 없습니다.

(현대) 브라우저에서 실행되는 코드는 URL객체 (브라우저가 JS에 제공하는 API의 일부)를 사용할 수 있습니다 .

var url_string = "http://www.example.com/t.html?a=1&b=3&c=m2-m3-m4-m5"; //window.location.href
var url = new URL(url_string);
var c = url.searchParams.get("c");
console.log(c);

스 니펫 확장

이전 브라우저 (Internet Explorer 포함)의 경우이 polyfill 또는 이전 버전의이 답변의 코드를 사용할 수 있습니다 URL.

URL location.search에서 ?문자 끝까지 또는 조각 식별자 (#foo)의 시작 (둘 중 빠른 것 중 하나)을 제공하는에 액세스 할 수 있습니다 .

그런 다음 다음과 같이 구문 분석 할 수 있습니다.

function parse_query_string(query) {
  var vars = query.split("&");
  var query_string = {};
  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split("=");
    var key = decodeURIComponent(pair[0]);
    var value = decodeURIComponent(pair[1]);
    // If first entry with this name
    if (typeof query_string[key] === "undefined") {
      query_string[key] = decodeURIComponent(value);
      // If second entry with this name
    } else if (typeof query_string[key] === "string") {
      var arr = [query_string[key], decodeURIComponent(value)];
      query_string[key] = arr;
      // If third or later entry with this name
    } else {
      query_string[key].push(decodeURIComponent(value));
    }
  }
  return query_string;
}

var query_string = "a=1&b=3&c=m2-m3-m4-m5";
var parsed_qs = parse_query_string(query_string);
console.log(parsed_qs.c);

스 니펫 확장

다음을 사용하여 현재 페이지의 URL에서 쿼리 문자열을 얻을 수 있습니다.

var query = window.location.search.substring(1);
var qs = parse_query_string(query);

답변

내가 본 대부분의 구현은 이름과 값을 URL 디코딩하는 것을 놓쳤다.

올바른 URL 디코딩을 수행하는 일반적인 유틸리티 함수는 다음과 같습니다.

function getQueryParams(qs) {
    qs = qs.split('+').join(' ');

    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
    }

    return params;
}

//var query = getQueryParams(document.location.search);
//alert(query.foo);

답변

출처 

function gup( name, url ) {
    if (!url) url = location.href;
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regexS = "[\\?&]"+name+"=([^&#]*)";
    var regex = new RegExp( regexS );
    var results = regex.exec( url );
    return results == null ? null : results[1];
}
gup('q', 'hxxp://example.com/?q=abc')

답변

이것은 하나의 매개 변수를 확인하는 쉬운 방법입니다.

URL 예 :

    http://myserver/action?myParam=2

자바 스크립트 예제 :

    var myParam = location.search.split('myParam=')[1]

URL에 “myParam”이 있으면 변수 myParam에 “2”가 포함되고 그렇지 않으면 정의되지 않습니다.

이 경우 기본값을 원할 수도 있습니다.

    var myParam = location.search.split('myParam=')[1] ? location.search.split('myParam=')[1] : 'myDefaultValue';

업데이트 : 이것은 더 잘 작동합니다.

    var url = "http://www.example.com/index.php?myParam=384&login=admin"; // or window.location.href for current url
    var captured = /myParam=([^&]+)/.exec(url)[1]; // Value is in [1] ('384' in our case)
    var result = captured ? captured : 'myDefaultValue';

URL에 매개 변수가 가득 찬 경우에도 올바르게 작동합니다.

답변

브라우저 공급 업체는 URL 및 URLSearchParams를 통해이를 수행하는 기본 방법을 구현했습니다.

let url = new URL('http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5');
let searchParams = new URLSearchParams(url.search);
console.log(searchParams.get('c'));  // outputs "m2-m3-m4-m5"

Firefox, Opera, Safari, Chrome 및 Edge에서 현재 지원됩니다. 브라우저 지원 목록 은 여기를 참조하십시오 .

https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams
https://developer.mozilla.org/en-US/docs/Web/API/URL/URL

https://url.spec.whatwg.org/

Google 엔지니어 인 Eric Bidelman 은 지원되지 않는 브라우저 에이 폴리 필 을 사용 하도록 권장 합니다.

답변

나는 이것을 아주 쉽게 발견했다.

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,
    function(m,key,value) {
      vars[key] = value;
    });
    return vars;
  }

그런 다음 다음과 같이 호출하십시오.

var fType = getUrlVars()["type"];

답변

에서 쿼리 문자열을 가져올 수 있으며 location.search물음표 다음에 모든 것을 나눌 수 있습니다.

var params = {};

if (location.search) {
    var parts = location.search.substring(1).split('&');

    for (var i = 0; i < parts.length; i++) {
        var nv = parts[i].split('=');
        if (!nv[0]) continue;
        params[nv[0]] = nv[1] || true;
    }
}

// Now you can get the parameters you want like so:
var abc = params.abc;