JavaScript를 사용하여 URL 매개변수를 동적으로 수정하려면 어떻게 해야 합니까?

JavaScript로 URL 매개변수 수정

AJAX 중심 웹 애플리케이션에서는 URL 매개변수를 동적으로 수정해야 할 필요성이 발생합니다.

• 원본 URL: http://server/myapp.php?id=10
• 원하는 결과: http://server/myapp. php?id=10&enabled=true

이를 달성하기 위해 JavaScript는 두 가지 강력한 기능을 제공합니다. 옵션:

URL 객체

ECMAScript 6에 도입된 URL 객체를 사용하면 URL 구성 요소를 직접 조작할 수 있습니다. 예는 다음과 같습니다.

var url = new URL("http://server/myapp.php?id=10");

// Set a new or update an existing parameter
url.searchParams.set('enabled', 'true');

// Retrieve the modified URL
var modifiedURL = url.href; // http://server/myapp.php?id=10&enabled=true

URLSearchParams 인터페이스

URLSearchParams를 사용하면 URL 매개변수를 키-값 쌍의 모음으로 조작할 수 있습니다.

var url = new URL("http://server/myapp.php?id=10");

// Append a new parameter or update a value
var searchParams = new URLSearchParams(url.search);
searchParams.append('enabled', 'true');

// Update the URL
url.search = searchParams.toString(); // http://server/myapp.php?id=10&enabled=true

구현 고려 사항

• 두 방법 모두 새 매개변수 추가와 기존 매개변수 업데이트를 모두 지원합니다.
• 수정된 URL을 문자열로 가져오려면 url.href 또는 url.toString()을 사용하세요.
• 브라우저 호환성 문제가 발생하는 경우 쿼리 문자열 또는 js-url.

위 내용은 JavaScript를 사용하여 URL 매개변수를 동적으로 수정하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!