[HTML] HTML 페이지로 이동하는 5가지 방법-HTML 튜토리얼-php.cn

집

웹 프론트엔드

HTML 튜토리얼

[HTML] HTML 페이지로 이동하는 5가지 방법

高洛峰

Feb 16, 2017 pm 02:44 PM

html

디렉토리 구조:

콘텐츠 구조 [-]

html 구현
javascript 구현
결합된 상호 JavaScript 구현(IE)
Firefox가 innerText를 지원하지 않는 문제 해결
상호 자바스크립트 구현 결합(IE, Firefox)
참고기사

자세히 설명하기 위해 아래에 5가지 예시를 나열했습니다. 이들 예시의 주요 기능은 5초 후 자동으로 점프합니다. hello.html 파일을 동일한 디렉터리에 저장합니다(필요에 따라 수정).
1) html 구현

<head>
<!-- 以下方式只是刷新不跳转到其他页面 -->
<meta http-equiv="refresh" content="10">
<!-- 以下方式定时转到其他页面 -->
<meta http-equiv="refresh" content="5;url=hello.html"> 
</head>

로그인 후 복사

장점: 단순
단점: Struts Tiles에서 사용할 수 없음

2) 자바스크립트 구현

<script language="javascript" type="text/javascript"> 
// 以下方式直接跳转window.location.href=&#39;hello.html&#39;;// 以下方式定时跳转setTimeout("javascript:location.href=&#39;hello.html&#39;", 5000); 
</script>

로그인 후 복사

장점: 유연성, 더 많은 다른 기능과 결합 가능
단점: 다양한 브라우저에 영향을 받음

3) 결합된 상호 자바스크립트 구현(IE)

<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript"> 
 second ="redirect()", 1000=--(second<0) location.href=&#39;hello.html&#39;</script>

로그인 후 복사

장점: 사용자 친화적
단점: firefox에서 지원되지 않음(firefox The 스팬, p 등의 innerText 속성은 지원되지 않습니다.)

3') 역수(firefox)의 자바스크립트 구현과 결합

<script language="javascript" type="text/javascript"> 
var second = document.getElementById(&#39;totalSecond&#39;).textContent; 
setInterval("redirect()", 1000); 
function redirect() 
{ 
document.getElementById(&#39;totalSecond&#39;).textContent = --second; 
if (second < 0) location.href = &#39;hello.html&#39;; 
} 
</script>

로그인 후 복사

4) Firefox에서 innerText를 지원하지 않는 문제 해결

<span id="totalSecond">5</span><script language="javascript" type="text/javascript"> if(navigator.appName.indexOf("Explorer") > -1){ 
document.getElementById(&#39;totalSecond&#39;).innerText = "my text innerText"; 
} else{ 
document.getElementById(&#39;totalSecond&#39;).textContent = "my text textContent"; 
} 
</script>

로그인 후 복사

5) 상호 자바스크립트 구현과 결합(IE, Firefox)

<span id="totalSecond">5</span>
 <script language="javascript" type="text/javascript"> var second = document.getElementById(&#39;totalSecond&#39;).textContent; 
 
if (navigator.appName.indexOf("Explorer") > -1)  { 
    second = document.getElementById(&#39;totalSecond&#39;).innerText; 
} else { 
    second = document.getElementById(&#39;totalSecond&#39;).textContent; 
} 
 
setInterval("redirect()", 1000); 
function redirect() { 
if (second < 0) { 
    location.href = &#39;hello.html&#39;; 
} else { 
    if (navigator.appName.indexOf("Explorer") > -1) { 
        document.getElementById(&#39;totalSecond&#39;).innerText = second--; 
    } else { 
        document.getElementById(&#39;totalSecond&#39;).textContent = second--; 
    } 
} 
} 
</script>

로그인 후 복사

[HTML] HTML 페이지로 이동하는 5가지 방법 관련 기사를 더 보려면 PHP 중국어 웹사이트를 주목하세요!

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.