JavaScript學習之二JavaScript瀏覽器對象模型詳解---window對象(下)


  接上一篇

      3.    系統提示框
    • window.alert   顯示消息提示框,用法 window.alert([Message]); (注:一般都省略window對象,直接使用alert
    •  window.confirm   顯示一個確認對話框,其中包括“確定”和“取消”按鈕。         

                        小示例:用戶單擊"確定"按鈕時,window.confirm返回true,用戶單擊"取消"按鈕時,window.confirm返回false。     

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>confirm示例</title>
6 <script type="text/javascript">
7     if(window.confirm("確定關閉窗口?"))
8 alert("true");
9     else
10 alert("false");
11   </script>
12 </head>
13 <body>
14 </body>
15 </html>
    • window.prompt   顯示一個消息提示框,其中包含一個文本輸入框。                

                        用法:window.prompt([Message],[default]);      Message是顯示在提示框上的文本,default是設置文本框的默認值。如圖:

          

            4.    狀態欄控制

                    通過window.status屬性進行控制。如:window.status="錯誤提示";    這樣做會影響用戶體驗,所以不建議對狀態欄信息進行修改。  

 

     5.    定時操作   

                    定時操作是web開發中常用功能,在基於Ajax技術的開發中,有一類應用需要定時的訪問后台服務器並且更新前台頁面,這類應用實現通常依賴於定時操作函數。

                    定時操作函數有四個:window.setInterval、window.clearInterval、window.setTimeout、window.clearTimeout,這四個函數都是window對象的方法,這說明瀏覽器中的定時操作是有瀏覽器窗口完成的。下面對這四種方法的用法詳細介紹

      •    window.setInterval     設置定時器,每隔一段時間執行指定的代碼    window.setInterval(code,time);

                                 說明: code參數可以是一個函數,也可以是一個字符串形式的JavaScript代碼

                                            time參數是執行代碼的時間間隔,單位是ms。

 

                                示例:           

1 <script type="text/javascript">
2 window.setInterval(function(){
3 alert("定時器");
4 },5000);
5 </script>
      •    window.clearInterval    清除setInterval函數設置的定時器    window. clearInterval(time); 、                       

            示例:

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title></title>
5 <script type="text/javascript">
6     //定時器
7     var timer;
8     //開始計數
9     function startCount() {
10        //timer將保存計數器的ID
11 timer = window.setInterval(function () {
12          //從div中取得當前計數值
13          var divid = document.getElementById("counter");
14           var num = Number(divid.innerHTML);
15          //計數值加1,更新頁面
16 divid.innerHTML = String(num + 1);
17 },1000);
18 }
19
20      //停止計數
21      function pause() {
22 window.clearInterval(timer);
23 }
24 </script>
25 </head>
26 <body>
27 <div id="counter">0</div>
28 <input type="button" onclick="startCount()" value="開始計數" />
29 <input type="button" onclick="pause()" value="停止計數" />
30 </body>
31 </html>
      •    window.setTiimeout    設置定時器,每隔一段時間執行指定的代碼    window.setTiimeout(code,time);

                                 說明: code參數可以是一個函數,也可以是一個字符串形式的JavaScript代碼,setTiimeout與setInterval區別在於setTiimeout對指定的代碼只執行一次。

                                            time參數是執行代碼的時間間隔,單位是ms。

                                示例:

1 <script type="text/javascript">
2 window.setTimeoutl(function(){
3 alert("setTimeout");
4 },5000);
5 </script>
      •    window.clearTimeout     清除 setTiimeout 函數設置的定時器    window. clearTimeout(time);    

            示例:

 

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title></title>
5 <script type="text/javascript">
6     //定時器
7     var timer;
8     //開始計數
9     function startCount() {
10       //從div中取得當前計數值
11       var divid = document.getElementById("counter");
12       var num = Number(divid.innerHTML);
13       //計數值加1,更新頁面
14 divid.innerHTML = String(num + 1);
15       //為了讓setTimeout在執行一次后繼續執行
16 timer = window.setTimeout(startCount, 1000);
17 }
18
19     //停止計數
20     function pause() {
21 window.clearTimeout(timer);
22 }
23 </script>
24 </head>
25 <body>
26 <div id="counter">0</div>
27 <input type="button" onclick="startCount()" value="開始計數" />
28 <input type="button" onclick="pause()" value="停止計數" />
29 </body>
30 </html>

  到這里window對象就寫完了,接下來我們將繼續document、location、screen、navigation、history對象的講解。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM