본문 바로가기
개발

JavaScript로 URL 파라미터 가져오는 방법 및 예제

by 농담곰이 2023. 5. 5.
반응형

JavaScript를 사용하여 URL 파라미터를 가져오는 방법은 다양한 방법이 있지만, 가장 일반적인 방법은 `URLSearchParams` 객체를 사용하는 것입니다. 다음은 `URLSearchParams` 객체를 사용하여 URL 파라미터를 가져오는 방법입니다.

```javascript
// 현재 URL에서 파라미터 값 추출하기
const urlParams = new URLSearchParams(window.location.search);

// 단일 파라미터 값 가져오기
const paramValue = urlParams.get('parameterName');

// 모든 파라미터 가져오기
const params = Object.fromEntries(urlParams.entries());
```


위 코드에서 `window.location.search`는 현재 URL의 쿼리 문자열을 나타내며, `URLSearchParams` 객체를 사용하여 파라미터를 추출합니다. `get()` 메서드를 사용하여 특정 파라미터의 값을 가져올 수 있으며, `entries()` 메서드를 사용하여 모든 파라미터와 값을 가져올 수 있습니다. 이를 `Object.fromEntries()` 메서드를 사용하여 객체로 변환할 수 있습니다.

예를 들어, `http://example.com?param1=value1&param2=value2`와 같은 URL에서 `param1`의 값을 가져오려면 다음과 같이 코드를 작성할 수 있습니다.

```javascript
const urlParams = new URLSearchParams(window.location.search);
const paramValue = urlParams.get('param1');
console.log(paramValue); // "value1"
```

위 코드에서 `urlParams.get('param1')` 메서드는 `param1`의 값을 가져와 `"value1"`을 반환합니다.

반응형

댓글