JavaScript_javascript 기술을 기반으로 지정된 페이지로 예약된 점프 구현
- WBOY원래의
- 2016-05-16 15:22:321810검색
일부 시나리오에서는 웹페이지가 지정된 시간 후에 지정된 페이지로 자동으로 이동할 수 있어야 합니다. 예를 들어 지정된 웹페이지를 찾을 수 없는 경우 이전에 설정된 404 페이지가 표시되고 지정된 페이지로 이동합니다. 페이지에서 다음은 이 효과를 얻기 위한 코드입니다.
코드는 다음과 같습니다.
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>js指定时间之后跳转到指定页面代码实例</title>
<script type="text/javascript">
function redirect()
{
if(second<0)
{
location.href='http://wwww.jb51.net';
}
else
{
if(navigator.appName.indexOf("Explorer")>-1)
{
document.getElementById('totalSecond').innerText=second--;
}
else
{
document.getElementById('totalSecond').textContent=second--;
}
}
}
window.onload=function()
{
var second=document.getElementById('totalSecond').textContent;
if(navigator.appName.indexOf("Explorer")>-1)
{
second=document.getElementById('totalSecond').innerText;
}
else
{
second = document.getElementById('totalSecond').textContent;
}
setInterval("redirect()",1000);
}
</script>
</head>
<body>
<h1>找不到指定的页面</h1>
<span id="totalSecond">3</span>秒后自动跳转到指定页面
</body>
</html>
위 코드는 3초 후에 지정된 페이지로 이동할 수 있습니다. 다음은 구현 과정에 대한 간략한 소개입니다.
1. 구현 원칙:
타이머 기능을 사용하여 매초마다 범위 요소의 숫자를 수정합니다. 숫자가 0에 도달하면 페이지가 지정된 링크로 이동합니다. 여기서는 구체적으로 설명하지 않겠습니다. 코드 주석을 볼 수 있습니다.
2. 코드 주석:
1.function 리디렉션(){}, 점프에 대한 모호성을 선언합니다.
2.if(secondfc32a86cb0ac67d4281f67cc2539caa8-1), IE 브라우저인지 확인합니다.
5.document.getElementById('totalSecond').innerText=second--, IE 브라우저인 경우 innerText 속성을 사용하여 범위 요소에 숫자 값을 설정합니다.
6.document.getElementById('totalSecond').textContent=second--, 다른 브라우저는 textContent 속성을 사용하여 범위 요소에 숫자 값을 설정합니다.
7.window.onload=function(){}, 문서가 완전히 로드되면 함수의 코드를 실행합니다.
8.if(navigator.appName.indexOf("Explorer")>-1){}, IE 브라우저인 경우 innerText 특성을 사용하여 범위 요소의 콘텐츠를 가져옵니다.
9.second = document.getElementById('totalSecond').textContent, 다른 표준 브라우저는 textContent 속성을 사용하여 범위 요소 값을 얻습니다.
10.setInterval("redirect()",1000)은 매초 타이머 기능을 실행합니다.
3. 관련자료:
1. indexof() 함수는 JavaScript의 lastIndexOf() 메서드 사용에 대한 자세한 설명 장에서 찾을 수 있습니다.
2. setInterval() 함수에 대해서는 setInterval()과 setTimeout()의 사용법 및 차이점예제 소개 장을 참조하세요.
위 내용은 편집자가 공유한 JavaScript를 기반으로 특정 페이지로 예약 점프를 구현하는 방법에 대한 전체 설명입니다.