JavaScript에서 쿼리 문자열을 얻는 방법

이 짧은 기사에서는 JavaScript에서 쿼리 문자열을 얻는 몇 가지 다른 방법에 대해 논의합니다.

JavaScript를 사용할 때 스크립트의 쿼리 문자열 매개변수에 액세스해야 하는 경우가 있습니다. 이를 수행할 수 있는 내장된 JavaScript 함수나 메소드가 없기 때문에 이를 수행할 수 있는 직접적인 방법은 없습니다. 물론 요구 사항에 맞는 타사 유틸리티 스크립트를 많이 찾을 수 있지만 일반 JavaScript를 사용하여 수행하는 것이 더 좋습니다.

이 게시물에서는 일반 JavaScript로 쿼리 문자열 매개변수를 가져오는 사용자 정의 함수를 작성하는 방법에 대해 설명합니다. 나중에 URLSearchParams 인터페이스를 탐색하여 작동 방식과 쿼리 문자열 매개변수에 어떻게 도움이 되는지 이해하겠습니다.

바닐라 JavaScript에서 쿼리 문자열을 얻는 방법

이 섹션에서는 일반 JavaScript를 사용하여 쿼리 문자열 값을 얻는 방법을 살펴보겠습니다.

아래 JavaScript 예시를 살펴보겠습니다.

으아아아

URL에서 사용 가능한 쿼리 문자열 매개변수 값을 가져오는 데 사용할 수 있는 getQueryStringValues 함수를 만들었습니다.

기능을 살펴보고 어떻게 작동하는지 살펴보겠습니다.

다음 코드 조각은 이 함수에서 가장 중요한 코드 조각 중 하나입니다.

으아아아

먼저 indexOf 方法来查找 ? 字符在 URL 中的位置。接下来，我们使用 slice 方法提取 URL 中的查询字符串部分。最后，我们使用 split 方法通过 & 字符分割查询字符串。因此，url 쿼리 문자열 매개변수 배열을 사용하여 변수를 초기화합니다.

다음으로 루프를 돌립니다. url 数组的所有元素。在循环中，我们使用 split 方法通过 = 字符来分割数组值。这样， arrParamInfo 변수는 배열로 초기화됩니다. 여기서 배열 키는 매개변수 이름이고 배열 값은 매개변수 값입니다. 아래 코드 조각에서 이를 확인할 수 있습니다.

으아아아

다음으로 함수에 전달된 매개변수와 비교합니다. 전달된 매개변수와 일치하면 매개변수 값을 arrParamValues 배열에 푸시합니다. 보시다시피 단일 매개변수와 배열 매개변수도 도입했습니다.

으아아아

마지막으로 arrParamValues 变量包含值，我们将返回它，否则返回 null 변수에 값이 포함되어 있으면 해당 값이 반환되고, 그렇지 않으면 null이 반환됩니다.

으아아아

다른 값으로 getQueryStringValues 기능을 계속 테스트할 수 있습니다.

위 예시와 같이 다양한 값으로 호출하고 console.log 함수를 사용하여 출력을 기록합니다. 주의할 점은 console.log 函数记录输出。需要注意的是，如果您在 getQueryStringValues 함수에 전달한 매개변수가 쿼리 문자열에 배열로 존재하는 경우 응답으로 배열을 얻고 해당 매개변수의 모든 값을 반환한다는 것입니다.

URLSearchParams 웨이

이것은 JavaScript에서 쿼리 문자열 값을 얻는 가장 쉬운 방법 중 하나입니다. URLSearchParams 인터페이스는 URL의 쿼리 문자열을 처리하는 유틸리티 메서드를 제공합니다. "사용할 수 있나요?"를 통해 브라우저 지원을 확인할 수 있습니다.

작동 방식을 간단히 살펴보겠습니다.

으아아아

쿼리 문자열로 URLSearchParams 对象后，您就可以使用 URLSearchParams 개체를 초기화한 후

개체에서 제공하는 유틸리티 메서드를 사용할 수 있습니다.

이 글에서는 몇 가지 유용한 방법을 소개하겠습니다.

get

방법

get이름에서 알 수 있듯이

메소드는 쿼리 문자열 매개변수의 값을 가져오는 데 사용됩니다.

다음 예를 통해 이해해 보겠습니다.

으아아아 keyword위 예에서는 검색 텍스트를 출력하는

쿼리 문자열 매개변수의 값을 얻습니다.

get이 방법으로

메서드를 사용하여 쿼리 문자열 매개변수의 값을 가져올 수 있습니다.

has

방법

has

메소드는 쿼리 문자열에 매개변수가 존재하는지 확인하는 데 사용됩니다.

으아아아 has위의 예에서는

메소드를 사용하여 다양한 매개변수의 존재 여부를 확인했습니다.

getAll

방법

getAll

메소드는 매개변수가 여러 번 존재할 때 해당 매개변수의 값을 모두 가져오는 데 사용됩니다.

다음 예시를 통해 확인해 보겠습니다.

으아아아 getAll보시다시피

메소드를 사용하면 해당 매개변수와 연관된 모든 값이 반환됩니다.

결론

오늘 우리는 JavaScript에서 쿼리 문자열을 가져오는 데 사용할 수 있는 다양한 방법에 대해 논의했습니다. 일반 JavaScript 외에도 URLSearchParams

인터페이스를 사용하여 쿼리 문자열 변수를 얻는 방법도 논의했습니다. 🎜

위 내용은 JavaScript에서 쿼리 문자열을 얻는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!