Computer >> 컴퓨터 >  >> 프로그램 작성 >> JavaScript

JavaScript 리디렉션을 수행하는 방법

웹 페이지를 리디렉션하는 방법에는 여러 가지가 있습니다. 예를 들면 HTML의 메타 태그를 사용하는 클라이언트 측과 HTTP 리디렉션 방법을 사용하는 서버 측이 있습니다. 이 기사에서는 JavaScript를 사용하여 웹 페이지를 리디렉션하는 방법을 살펴봅니다.

두 가지 방법

페이지 리디렉션에 JavaScript 코드를 사용하는 방법에는 두 가지가 있습니다. 둘 다 창 위치 개체를 포함합니다.

참조

첫 번째 방법은 위치 개체의 href 속성을 포함합니다(이는 차례로 창 개체의 일부임). 당신이 해야 할 유일한 일은 리디렉션을 위해 원하는 URL을 location.href로 지정하여 리디렉션을 처리하는 것입니다. 페이지가 로드될 때 실행할 JavaScript 함수에서 이 작업을 수행합니다.

    https://www.careerkarma.com/blog/html.
 5초 이내에 리디렉션되지 않으면 이 링크를 클릭하십시오.  

문서 하단의 body 태그 바로 앞에 스크립트 태그를 추가했습니다. 이것이 우리의 JavaScript가 가는 곳입니다. handleRedirect라는 함수에는 url이라는 매개변수가 있습니다. 해당 URL의 값에 location.href를 할당합니다.

문서 본문 상단에는 onload 이벤트가 있습니다. 이 onload 이벤트는 할당된 JavaScript 기능을 실행합니다. 여기에 우리가 가고자 하는 URL을 전달했습니다. 리디렉션은 즉시 발생하며 Career Karma 블로그 게시물의 HTML 부분으로 이동합니다.

페이지가 리디렉션되기 전에 약간의 일시 중지를 추가하려면 setTimeout을 사용하면 됩니다. 함수. 방법은 다음과 같습니다.

const handleRedirect =(url) => { setTimeout(() => { location.href =url; }, 2000); }

다른 모든 것은 동일하게 유지됩니다.

이 메서드는 원본 페이지를 기록 스택에 추가합니다. 브라우저의 뒤로 버튼으로 액세스할 수 있습니다. 대신 URL을 교체하는 다른 방법이 있습니다. 다음에 해당 방법을 살펴보겠습니다.

참가자의 81%는 부트캠프에 참석한 후 기술 직업 전망에 대해 더 자신감을 느꼈다고 말했습니다. 지금 부트캠프에 참여하십시오.

부트캠프 졸업생은 부트캠프 시작부터 첫 직장을 찾는 데까지 6개월도 채 걸리지 않았습니다.

교체

위치 개체의 속성에 새 URL을 할당하는 위에서 만든 메서드와 달리 location.replace() 원래 URL을 지정하고 지정한 URL로 바꾸는 방법입니다.

이 방법은 원래 URL을 브라우저 스택에 배치하지 않고 대상을 리디렉션된 URL로 바꿉니다. 방법은 다음과 같습니다.

    https://www.careerkarma.com/blog/html.
 5초 이내에 리디렉션되지 않으면 이 링크를 클릭하십시오.  

보시다시피 이 한 줄짜리에는 스크립트 태그가 전혀 필요하지 않습니다. 문서가 로드되면 괄호 안의 사이트로 안내하는 location.replace 메서드가 실행됩니다.

그게 다야! 이제 JavaScript를 사용하여 새 웹페이지로 리디렉션할 수 있습니다.