홈페이지>웹 디자인 튜토리얼>HTML 튜토리얼

페이지 점프 기능을 구현하려면 HTML 페이지의 버튼을 클릭하세요.

저자：Eve Cole 업데이트 시간：2024-12-19 13:47:50

HTML 페이지의 버튼을 클릭하면 해당 페이지로 이동합니다.

방법 1. 버튼 태그 외부에 태그를 중첩하고 하이퍼링크를 사용하여 점프합니다.

 <a href="https://www.baidu.com/" target="_blank">
<button>바이두 홈페이지 들어가기</button>
</a>

방법 2. 버튼 태그에 οnclick="window.location.href='page url'" 코드를 추가하고 onclick 이벤트를 이용해 점프하세요.

 <button onclick="window.location.href = 'https://www.baidu.com/' target="_blank"">바이두 홈페이지 입력</button>

HTML 페이지로 자동으로 이동하는 방법

1. 메타 요소 사용

 <meta http-equiv="refresh" content="5;url=hello.html">

http-equiv="refresh"는 페이지를 새로 고치는 것을 의미하며 5초 후에 새로 고침 작업이 수행됩니다. URL은 점프의 대상 페이지 주소입니다.

 <meta http-equiv="새로고침" content="5">

이 코드 줄은 점프가 아닌 새로 고침만을 의미합니다.

2. 스크립트 코드 사용

즉시 hello.html 페이지로 이동하세요.

 <스크립트 유형="텍스트/자바스크립트">
window.location.href = 'hello.html';
</script>

또는

 <스크립트 언어="자바스크립트">
location.replace("http://www.baidu.com/");
</script>

5초 후에 hello.html 페이지로 이동합니다.

 <스크립트 유형="텍스트/자바스크립트">
setTimeout("window.location.href = 'hello.html'", 5000);
</script>

3. 휴대폰 버전인지 확인

 <스크립트 유형="텍스트/자바스크립트">
var wapurl = window.location.pathname; 
만약에
(/Android|webOS|iPhone|iPod|BlackBerry|Windows CE|Windows Phone/i.test(navigator.userAgent))
{만약에
(window.location.href.toLowerCase().indexOf("?pc")<0)
{노력하다
{window.location.href="/wap"+wapurl}
잡기(e){}}
}
</script>

이것으로 HTML 페이지의 버튼을 클릭하여 페이지로 이동하는 방법에 대한 기사를 마칩니다. 버튼을 클릭하여 페이지로 이동하는 방법에 대한 자세한 내용은 downcodes.com의 이전 기사를 검색하거나 아래의 관련 기사를 계속 찾아보세요. 앞으로도 downcodes.com을 지원해 주시기 바랍니다!

관련 기사