隨筆-7  評論-24  文章-102  trackbacks-0

          1、window對象
          2、同源安全策略
          3、cookie



               瀏覽器對象模型(BOM)是一組從瀏覽器上下文繼承而來的對象,這也是絕大多數(shù) JavaScript應用程序中函數(shù)運行的上下文。有時它也被稱之為 DOM Level 0,或者就叫 DOM。

               BOM是一組有限的公共 Web對象,也是一個層次化的對象集,每個層次上的對象都可以通過它們的父對象來訪問,比如 window[navigator, location, frames, screen, history, document[forms, cookie, link/anchors, images, embeds/plug-ins, all]]。

               訪問對象時,你可以:
               var theImage = document.form[0].elements["someelement"].value;


          1、window對象

               瀏覽器的 window對象封裝了整個瀏覽器環(huán)境,包括 window的"chrome"(組成瀏覽器窗體的通用組件)、實際的 Web頁面,以及頁面中的事件。

               通過 window可以手動設置瀏覽器狀態(tài)條上的狀態(tài),執(zhí)行打開一個新窗口、重新調整已顯示窗口的大小、關閉窗口等操作。不過隨著動態(tài) Web效果和 Ajax的流行,這種彈出式窗口越來不被喜歡。

          window對象的方法和屬性可以分成4類:

          a. 創(chuàng)建新窗口,維護現(xiàn)有窗口行為

               彈出式對話框:alert、confirm和 prompt
               創(chuàng)建自定義窗口:window.open()
               維護窗口:通過窗口的引用能夠完成該窗口的維護,要維護父窗口則使用關鍵字 opener,要維護包含當前運行腳本的窗口,則應該使用關鍵字 self。


          b. 在窗口中創(chuàng)建帶分區(qū)的文檔(幀和iframes)

               frame對象定義了以下元素:parent、length和 name。對于跨幀通信而言,name和 parent屬性特別重要。其父元素 frameset(幀集,包括幀的窗口)可以通過每個幀的名字訪問所有子幀(也可以通過幀數(shù)組,以對象數(shù)量作為索引值);每個幀都可以通過通用的關鍵字 parent來訪問該幀集。兄弟幀元素之間可以通過 parent和對方的 name屬性來訪問。

               和標準的幀不一樣,iframe是內嵌在頁面中的。你可以為其指定高度和寬度,如果將它們都設置為0,那么它就將被隱藏起來。iframe會把它嵌入到的頁面視為自己的父元素,這也是它和更高層頁面進行通信的方法。通常,你可以使用 document的 getElementById方法來訪問它,也可以使用 target屬性載入其內容。


          c. 定時器的創(chuàng)建和控制

               有兩類定時器:一類是一次性的,另一類是周期性使用的。兩種定時器都能取消,一次性定時器方法只會被調用一次。

          要想創(chuàng)建一個不重復觸發(fā)的定時器,可以使用 setTimeout方法:
          var tmOut = setTimeout("func", 5000, "param1", param2,,,,, paramn);

          如果想清除這個定時器,可以使用 clearTimeout方法:
          clearTimeout(tmOut);

          如果你想周期性地使用這個定時器,那么應調用 setInterval方法:
          var tmOut = setInterval("functionName", 5000);

               同樣,如果想暫停或取消這個周期性定時器,可以使用 clearInterval方法。如果你想實現(xiàn)一個周期性定時器,但又想在參數(shù)中指定一個函數(shù)文字量,那么你可以在每次定時器過期時再用 setTimeout函數(shù)重新設置這個定時器。

          注:
               在 IE瀏覽器中,setInterval和 setTimeout方法是不支持在最后添加函數(shù)調用所需參數(shù)的。


          d. 用來控制瀏覽器其他元素

          history對象
               history對象負責維護瀏覽器中頁面載入操作的歷史記錄。同樣,其方法和屬性能夠完成通過瀏覽器的后退和前進按鈕所能實現(xiàn)的導航操作。

          screen對象
               screen對象所包含的信息是屏幕顯示有相關的,包括其寬度、高度,以及顏色或像素濃淡。雖然他們不是很常用,但他們對于那些需要修改瀏覽器窗口大小、創(chuàng)建需要特定調色板的帶色彩對象等功能而言是不錯的選擇。

          navigator對象
               navigator對象中提供的是和瀏覽器或其他訪問該頁面的用戶代理相關的信息。通過它可以檢查操作系統(tǒng)、瀏覽器或瀏覽器族、安全策略、語言以及 cookie是否啟用。

          document對象
          1.鏈接和錨
               document對象的 links集合是由頁面中所有超鏈接組成的,它的訪問方法和數(shù)組一樣。

          2.圖像
               和鏈接一樣,圖像也有其對應的對象,也可以直接設置他們的屬性,如表示圖像 URL的 src屬性。

          3.innerHTML
               使用 innerHTML屬性可以修改頁面中任何一個 HTML元素,它之所以仍然流行,是因為通過它修改頁面元素時無需構建整個頁面的內容,你只需創(chuàng)建一個 HTML格式的字符串,然后通過 innerHTML就可以添加到 Web頁面中。不過,使用 innerHTML意味著無論向 Web頁面添加了什么,他們都無法融合到頁面的 document樹上,因此如果你混合使用 innerHTML和新的 DOM方法將會帶來很大的破壞。


          2、同源安全策略

               同源安全策略確保了不同域名、協(xié)議或端口的頁面之間不能夠通過腳本進行通信。同源安全策略將應用于不同頁面之間的通信,包括父窗口中的表單和內嵌窗口之間的通信,如幀及 iframe。


          3、cookie

               cookie的意義就是一個帶有過期時間、域名、路徑的小型的鍵/值對,之所以需要提供這些消息,是為了確保正確的服務器能夠讀取到正確的 cookie。這些信息將作為 Web請求的一部分發(fā)送,因此在服務器端和瀏覽器都能訪問這些數(shù)據(jù)。

          設置、讀取、刪除 cookie
          // if cookie enabled
          window.onload = function() {
              
          if (navigator.cookieEnabled) {
                  
          var sum = readCookie("sum");
                  
          if (sum) {
                      
          var iSum = parseInt(sum) + 1;
                      alert(
          "cookie count is " + iSum);
                      
                      
          if (iSum > 5) {
                          eraseCookie(
          "sum");                
                      } 
          else {
                          setCookie(
          "sum", iSum);
                      }
                  } 
          else {
                      alert(
          "no cookie, setting now");
                      setCookie(
          "sum"0);
                  }
              }
          }

          // 將 cookie有效期設置為 2016年
          function setCookie(key, value) {
              
          var cookieDate = new Date(20161110193030);
              document.cookie 
          = key + "=" + encodeURI(value) + "; expires=" + cookieDate.toGMTString() + "; path=/";
          }

          // 在每個 cookie之前用分號隔開
          function readCookie(key) {
              
          var cookie = document.cookie;
              
          var first = cookie.indexOf(key + "=");
              
              
          // 存在 cookie
              if (first >= 0) {
                  
          var str = cookie.substring(first, cookie.length);
                  
          var last = str.indexOf(";");
                  
                  
          // 如果是最后一個 cookie
                  if (last < 0) last = str.length;
                  
                  
          // 獲取 cookie的值
                  str = str.substring(0, last).split("=");
                  
          return decodeURI(str[1]);
              } 
          else {
                  
          return null;
              }
          }

          // 將 cookie的有效期設置成過去,以達到刪除 cookie的目的
          function eraseCookie (key) {
              
          var cookieDate = new Date(20001110193030);
              document.cookie 
          = key + "= ; expirse=" + cookieDate.toGMTString() + "; path/";
          }
          posted on 2010-05-29 21:46 黃小二 閱讀(348) 評論(0)  編輯  收藏 所屬分類: Ajax
          主站蜘蛛池模板: 荥阳市| 山阴县| 平顺县| 磐石市| 晋城| 巫溪县| 枣强县| 莱西市| 饶平县| 洛南县| 荆门市| 安宁市| 象山县| 新龙县| 泸定县| 清涧县| 太仆寺旗| 鹰潭市| 神农架林区| 开远市| 都匀市| 遵义市| 桂东县| 咸宁市| 江陵县| 吴桥县| 汶川县| 永城市| 孝义市| 富民县| 怀仁县| 电白县| 绍兴市| 阳西县| 耿马| 资溪县| 松潘县| 廊坊市| 盘山县| 镇江市| 宝应县|