ES6의 페이지 리디렉션을 설명하시겠습니까?

이 튜토리얼에서는 ES6 버전의 JavaScript에 도입된 페이지 리디렉션을 소개합니다. 페이지 리디렉션은 웹페이지 방문자를 현재 URL에서 다른 URL로 보내는 방법입니다. 당사는 사용자를 동일한 웹사이트의 다른 페이지나 다른 웹사이트 또는 서버로 리디렉션할 수 있습니다.

JavaScript에서 창은 위치 개체를 포함하는 전역 개체입니다. 우리는 위치 객체의 다양한 방법을 사용하여 ES6에서 페이지를 리디렉션할 수 있습니다. 이에 대해서는 다음에 배우겠습니다.

window.location 객체의 href 속성 값을 사용하세요

창 전역 객체의 위치 객체에는 href 속성이 포함되어 있습니다. 위치 개체에는 현재 페이지의 위치에 대한 모든 정보가 포함되어 있습니다. 위치 개체의 "href" 속성에는 현재 URL이 포함되어 있습니다.

방문자를 다른 URL로 리디렉션하려면 웹 브라우저에서 현재 URL을 변경해야 하며, 이는 위치 개체의 href 속성 값을 변경하여 달성할 수 있습니다.

문법

사용자는 다음 구문에 따라 href 속성 값을 변경하여 방문자를 다른 페이지로 리디렉션할 수 있습니다.

으아악

위 구문에서 window.location 객체에 새 URL 값을 할당하면 기본적으로 위치 객체의 href 속성 값이 변경됩니다.

예

아래 예에서는 "다른 웹 페이지로 리디렉션"이라는 텍스트가 포함된 버튼을 만들었습니다. 사용자가 버튼을 클릭하면 JavaScript의 리디렉션() 함수가 호출됩니다.

redirect() 함수에서는 위치 객체의 href 속성 값을 변경하여 방문자를 새 URL로 이동시킵니다.

으아악

location.sign() 메소드를 사용하세요

sign()은 위치 객체 내부에 정의된 메서드입니다. location.sign() 메소드를 사용하여 브라우저 창에 새 문서를 로드할 수 있으며, 브라우저에서 새 문서를 다시 로드하는 것은 리디렉션을 의미합니다.

문법

아래 구문에 따라 할당() 메서드를 사용하여 리디렉션합니다.

으아악

위 구문에서는 위치 객체를 참조로 사용하여 할당() 메서드를 호출합니다.

매개변수

• New_URL - 사용자를 리디렉션하려는 URL입니다.

예

이 예에서는 위치 개체의 할당() 메서드를 사용하여 현재 브라우저 창에 다른 웹 페이지를 로드합니다.

으아악

사용 location.replace()method

위치 객체의 replace() 메소드는 할당() 메소드와 동일하게 작동합니다. 바꾸기()와 할당() 메서드의 유일한 차이점은 바꾸기() 메서드가 현재 URL을 기록 스택의 새 URL로 바꾸는 것입니다. 따라서 기록 스택에 이전 웹 페이지에 대한 정보가 포함되는 것을 허용하지 않습니다. 즉, 사용자가 돌아갈 수 없습니다.

할당() 메서드는 기록 스택에 새 항목을 추가합니다. 따라서 사용자는 웹 브라우저의 뒤로 버튼을 이용하여 이전 페이지로 돌아갈 수 있습니다.

문법

사용자는 다음 구문에 따라 교체() 메서드를 사용하여 페이지를 리디렉션할 수 있습니다.

으아악

매개변수

• Redirection_URL - 리디렉션 URL은 방문자를 웹페이지로 리디렉션하려는 새 URL입니다.

예

이 예에서는 사용자를 새 웹 페이지로 리디렉션하기 위해 위치 개체의 replacement() 메서드를 사용합니다. 출력에서 사용자는 리디렉션 후 뒤로 버튼을 클릭하여 뒤로 돌아가려고 시도할 수 있습니다. 바꾸기() 메소드는 반환이 허용되지 않습니다.

으아악

또한 사용자는 리디렉션을 위해 창 개체의 Navigate() 메서드를 사용할 수도 있습니다. Navigate() 메서드는 더 이상 사용되지 않으므로 리디렉션에 권장되지 않습니다.

사용자를 다른 웹페이지로 리디렉션하는 3~4가지 방법을 배웠습니다. 사용자는 필요에 따라 어떤 방법이든 사용할 수 있습니다. 예를 들어, 현재 URL을 바꾸려면 바꾸기() 메서드를 사용하고, 그렇지 않으면 할당() 메서드를 사용합니다. 사용자는 reload() 메서드를 사용하여 새 서버 데이터를 얻을 수 있습니다.

위 내용은 ES6의 페이지 리디렉션을 설명하시겠습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!