자바스크립트 대체 URL-프런트엔드 Q&A-php.cn

집

웹 프론트엔드

프런트엔드 Q&A

자바스크립트 대체 URL

王林

May 16, 2023 pm 12:25 PM

머리말

인터넷 시대에는 웹사이트나 애플리케이션이 비즈니스 요구로 인해 URL을 대체해야 하는 경우가 많습니다. 이때 JavaScript는 매우 유용한 도구가 되었습니다. 본 글에서는 자바스크립트 대체 URL의 사용법을 예시를 통해 분석하고, 독자들에게 자바스크립트에 대한 심층적인 이해를 돕기 위한 지침을 제공할 것입니다.

Text

JavaScript 대체 URL은 웹페이지 콘텐츠의 특정 부분을 다른 URL로 바꾸는 것을 의미합니다. 이 작업은 JavaScript의 위치 개체를 통해 수행할 수 있습니다. 위치 객체는 현재 문서의 URL 정보에 접근할 수 있으며, URL의 다양한 부분을 추출하여 새로운 URL을 설정할 수 있습니다. URL을 바꾸는 기본 JavaScript 코드 예를 살펴보겠습니다.

function redirect() {
  location.replace("http://www.baidu.com"); // 替换网址
}
redirect(); // 调用函数

로그인 후 복사

위 코드에서 location.replace() 메서드는 현재 URL을 바꾸고 "http://www.baidu.com"을 가리키는 데 사용됩니다. , 마지막으로 리디렉션() 함수를 통해 호출하고 실행합니다.

location.replace() 메서드를 사용하는 것 외에도 location.href 및 location.sign() 메서드를 사용하여 URL을 바꿀 수도 있습니다. 이 두 메서드의 기능은 동일하며 현재 URL을 가리킵니다. 새로운 URL.

function redirect() {
  location.href = "http://www.baidu.com"; // 替换网址
}
redirect(); // 调用函数

function redirect() {
  location.assign("http://www.baidu.com"); // 替换网址
}
redirect(); // 调用函数

로그인 후 복사

위 코드에서 location.href 및 location.sign() 메소드는 현재 URL을 새 URL로 가리킬 수도 있습니다.

실제 응용 프로그램에서는 다양한 상황에 따라 동적 URL 교체를 수행해야 하는 경우가 많습니다. 예를 들어, 입력 상자를 통해 사용자가 입력한 콘텐츠를 얻은 다음 입력 콘텐츠를 URL에 매개변수로 전달하여 동적 교체를 수행합니다.

function redirect() {
  var keyword = document.getElementById("searchInput").value; // 获取输入框中的内容
  var newUrl = "https://www.baidu.com/s?wd=" + keyword;
  location.href = newUrl; // 替换新的 URL
}

로그인 후 복사

위 코드에서는 먼저 ID가 "searchInput"인 입력 상자의 콘텐츠를 가져온 다음 더하기 기호를 사용하여 새 URL로 연결하고 마지막으로 현재 URL로 바꿉니다.

JavaScript 대체 URL을 사용하여 페이지 이동 및 리디렉션을 구현할 수도 있습니다. 다음은 JavaScript를 통한 페이지 점프 및 리디렉션을 위한 샘플 코드입니다.

// 页面跳转
function jumpToPage() {
  var pageNum = document.getElementById("pageNumInput").value;
  var newUrl = "http://www.example.com/page_" + pageNum + ".html";
  location.href = newUrl;
}

// 重定向
function redirect() {
  location.replace("http://www.example.com"); // 重定向到新的网站
}
redirect(); // 调用函数

로그인 후 복사

위 샘플 코드에서는 사용자가 입력한 콘텐츠를 가져온 다음 이를 새 URL에 매개변수로 연결하여 페이지 점프를 달성합니다.

결론

JavaScript URL 교체는 실제 애플리케이션에서 종종 필요한 매우 실용적인 기능입니다. 이 기사의 예제 코드를 통해 독자는 JavaScript를 사용하여 URL을 대체하고 동적 대체, 페이지 점프 및 리디렉션과 같은 기능을 구현할 수 있습니다. URL 교체를 수행할 때 URL의 형식과 구문에 주의해야 합니다. 그렇지 않으면 정상적인 교체 및 액세스가 이루어지지 않습니다.

참고자료