標籤：img 跳轉 首頁 span href ima 指令碼 err 擷取
：
頁面代碼
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>home</title> 6 </head> 7 8 <body> 9 <!-- 頁面文字 -->10 <h1>操作成功</h1>11 <span id="time">5</span>12 <span>秒後回到首頁</span>13 <a href="back()">返回</a> <!-- 也可以寫成javascipt：back(); -->14 </body>15 </html>16 17 <script type="text/javascript">18 //擷取要定時元素的值19 var num=document.getElementById("time").innerHTML;20 //定時函數21 function count(){22 num--;23 document.getElementById("time").innerHTML=num;24 if(num==0){25 window.location="http://www.imooc.com"; //時間到點則跳轉到指定頁面26 }27 }28 setInterval("count()", 1000); //調用定時方法29 function back(){ //返回前一頁面的方法30 window.history.back(); //同window.history.go(-1);31 }32 </script>
要注意的問題（html代碼的順序執行性）
如果指令碼代碼的位置放在html代碼的前面，如下:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>home</title> 6 </head> 7 <script type="text/javascript"> 8 //擷取要定時元素的值 9 var num=document.getElementById("time").innerHTML;10 //定時函數11 function count(){12 num--;13 document.getElementById("time").innerHTML=num;14 if(num==0){15 window.location="http://www.imooc.com"; //時間到點則跳轉到指定頁面16 }17 }18 setInterval("count()", 1000); //調用定時方法19 function back(){ //返回前一頁面的方法20 window.history.back(); //同window.history.go(-1);21 }22 </script>23 <body>24 <h1>操作成功</h1>25 <span id="time">5</span>26 <span>秒後回到首頁</span>27 <a href="back()">返回</a> 28 </body>29 </html>
瀏覽器中運行代碼則會出錯，顯示第9行出錯:
| 1 | TypeError: null is not an object (evaluating ‘document.getElementById("time").innerHTML‘) |
原因是HTML代碼在頁面載入是順序執行（函數在被調用時才執行），當執行到：
1 var num=document.getElementById("time").innerHTML;
id為"time"的span標籤的內容並未載入，所以提示說傳回值為空白。
如果選擇指令碼代碼在html代碼之前，則需要將這條語句寫到函數體內。
*javascirpt函數在頁面載入時自動執行的方法：
方法一：
1 <script type="text/javascript">2 function load(){3 alert(‘hello‘);4 }5 </script>6 7 <body onload="load()">
方法二：
1 <script>2 window.onload = function(){3 alert("hello");4 }5 </script>6 7 <body>
JS實現操作成功定時回到首頁效果
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
