成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

兼容IE跨平臺解決方案

warmcheng / 2422人閱讀

摘要:兼容跨平臺解決方案目前對于的支持,是比較完善的,很多開發(fā)平臺也借助于內(nèi)核,所以使用開發(fā)是一個很不錯的選中。當(dāng)異步請求時,的這個值是至關(guān)重要的,它表示請求響應(yīng)過程的當(dāng)前活動階段。狀態(tài)為時,為成功的標(biāo)志。

[TOC]

兼容IE跨平臺解決方案

目前對于es5的支持,chrome是比較完善的,很多開發(fā)平臺也借助于webkit內(nèi)核,所以使用chrome開發(fā)是一個很不錯的選中。但是ie8-多個版本的兼容性也是讓無數(shù)程序員頭疼的事,那么下面會針對幾種比較典型的兼容做下總結(jié),該總結(jié)多數(shù)參考js高級編程內(nèi)部源碼和自身遇到的一些兼容問題,剛開始撰寫此類博客,希望大家多多指出問題。

事件兼容

code如下

   window.ct = {};
   (function(NS){
       var EventUtil = {
           addHandler:function(element, type, handler){
              if(element.addEventListener){
                 element.addEventListener(type,handler,false);//Chrome支持
              } else if(element.attachEvent){
                 element.attacheEvent("on" + type, handler);//IE9+支持
              }else{
                 element["on" + type] = handler;//IE8-支持
              }
           },
           removeHandler:function(element, type, handler){
              if(element.removeEventListener){
                 element.removeEventListener(type, handler, false);//Chrome支持
              }else if(element.detachEvent){
                 element.detachEvent("on" + type, handler);//IE9+支持
              }else{
                 element["on" + type] = null;//IE8-支持
              }
           },
           getEvent:function(event){
             return event ? event : window.event;
           },
           getTarget:function(event){
             return event.target || event.srcElement;
           },
           preventDefault:function(event){
             if(event.preventDefault){
                event.preventDefault();
             }else{
                event.returnValue = false;
             }
           },
           stopPropagation:function(event){
              if(event.stopPropagation){
                 event.stopPropagation();
              }else{
                 event.cancelBubble = true;
              }
           }
       }
       NS.EventUtil = EventUtil;
   })(window.ct);  
XPath兼容
   window.ct = {};
   (function(NS){
       var createDocument = function(){
          if(typeof arguments.callee.activeXArg != "string"){
              var versions = ["MSXML2.DOMDocument.6.0","MSXML2.DOMDocument.3.0","MSXML2.DOMDocument"],
                  i, len;
              for(i=0, len=versions.length; i< len; i++){
                  try{
                     new ActiveXObject(versions[i]);
                     arguments.callee.activeXArg = versions[i];
                     break;                  
                  }catch(e){
                     //step
                  }
              }
          }
          return new ActiveXObject(arguments.callee.ActiveXArg);
       }

       var parseXml = function(xml){
          var xmldom = null;
          if(typeof DOMParser != "undefined"){
              xmldom = (new DOMParser()).parseFromString(xml,"text/xml");
              var errors = xmldom.getElementsByTagName("parsererror");
              if(errors.length){
                 throw new Error("XML parsing error: " + error[0].textContent);
              }
          }else if(typeof ActiveXObject != "undefined"){
              xmldom = createDocument();
              xmldom.loadXML(xml);
              if(xmldom.parseError != 0){
                 throw new Error("XML parsing error: " + xmldom.parserError.reason);
              }
          }else{
              throw new Error("No XML parser avaiable");
          }
          return xmldom;
       }
       var serializeXml = function(xmldom){
          if(typeof XMLSerializer != "undefined"){
              return (new XMLSerializer()).serialToString(xmldom);
          }else if(typeof xmldom.xml != "undefined"){
              return xmldom.xml;
          }else{
              throw new Error("Could not serialize XML DOM.");
          }
       }

       var selectSingleNode = function(context, expression, namespaces){
           var doc = (context.nodeType != 9 ? context.ownerDocument : context);
           if(typeof doc.evaluate != "undefined"){
               var nsresolver = null;
               if(namespaces instanceof Objectt){
                  nsresolver = function(prefix){
                      return namespaces[prefix];
                  }
               }
               var result = doc.evaluate(expression, context, nsresolver, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
               return (result != null ? result.singleNodeValue : null);
           } 
       }

       var selectNodes = function(context, expression, namespaces){
           var doc = (context.nodeType != 9 ? context.ownerDocument : context);

           if(typeof doc.evaluate != "undefined"){
               var nsresolver = null;
               if(namespaces instanceof Object){
                    nsresolver = function(prefix){
                        return namespaces[prefix];
                    }
               }
               var result = doc.evaluate(expression, context, nsresolver, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
               var nodes = new Array();
               if(result != null){
                   for(var i=0,len=result.snapshotLength;i
XMLRequestHttp兼容

XMLRequestHttp各個瀏覽器支持情況
IE7+,Firefox,Opera,Chrome和Safari支持原生XMLRequestHttp

onreadystatechange運(yùn)行
下面的代碼中onreadystatechange中會直接使用XHR,這樣的處理方式是DOM0級方法為XHR對象添加了事件處理程序,原因是并不是所有的瀏覽器都輝支持DOM2級方法,所以有的瀏覽器內(nèi)部處理此事件時,可能不會向其傳遞event事件對象,那么為了所有平臺都兼容,最好的處理方式就是使用XHR對象本身來確定下一步應(yīng)該會怎么做。注意:此方法建議在open之前調(diào)用

readyState幾種狀態(tài)的講解
對于XHR請求,絕大多數(shù)情況下都會使用異步請求。 當(dāng)異步請求時,readyState的這個值是至關(guān)重要的,它表示請求響應(yīng)過程的當(dāng)前活動階段。0:未初始化,尚未調(diào)用open方法;1:啟動,已經(jīng)調(diào)用open方法,但未調(diào)用send方法;2:發(fā)送 已經(jīng)調(diào)用send方法,但尚未接到服務(wù)端相應(yīng); 3:接收,但是只接收了部分響應(yīng);4:完成,已經(jīng)接收了全部響應(yīng)數(shù)據(jù),二期已經(jīng)可以在客戶端使用了

state幾種狀態(tài)值的講解
在接收響應(yīng)后,我們認(rèn)為是readyState數(shù)值為4時為最佳判斷state時機(jī)。這時不得不普及一下HTTP響應(yīng)值state的意義。狀態(tài)為200時,為成功的標(biāo)志。此時responseText的內(nèi)容已經(jīng)準(zhǔn)備就緒,而且在內(nèi)容類型正確的情況下,responseXML也應(yīng)該能夠訪問了。如果狀態(tài)代碼304標(biāo)識請求的資源并沒有被修改,可以直接使用瀏覽器的緩存版本。

open方法的講解
接受3個參數(shù),第一個是請求類型get或者post;第二個是url;第三個表示是否異步。另外需要說明兩點(diǎn):意識URL相對于執(zhí)行代碼的當(dāng)前頁面(可以使用絕對路徑);而是open方法并不會真正發(fā)送請求。

send方法的講解
send方法只接受一個參數(shù),作為請求主體發(fā)送的數(shù)據(jù),如果不需要通過請求主體(即post),則必須傳入null,這個參數(shù)對于瀏覽器是必須的。調(diào)用send后,請求會發(fā)送到服務(wù)器上進(jìn)行處理。

    window.ct = {};
    (function(NS){
        var createXHR = function(){
            if(typeof XMLHttpRequest != "undefined"){
                return new XMLHttpRequest();
            }else if(typeof ActiveXObject != "undefined"){
                if(typeof arguments.callee.activeXString != "string"){
                    var versions = ["MSXML.XMLHttp.6.0","MSXML.XMLHttp.3.0","MSXML.XMLHttp"],
                        i,len;
                    for(i=0,len=version.length;i= 200 && xhr.status < 300 || xhr.status == 304){
                    console.info("successful responseText: " + xhr.responseText)
                }else{
                    console.error("Request was unsuccessful: " + xhr.status);
                }
            } 
        } 
        xhr.open("get","url",true);
        xhr.send(null);
    })(window.ct);

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/86641.html

相關(guān)文章

  • IE 兼容模式 設(shè)置 Meta Compatible 和 Iframe 子頁面的關(guān)系

    摘要:也能使用更復(fù)雜的,更頁面增加更強(qiáng)的效果。這是因為當(dāng)頂級頁面設(shè)置為或,里面的頁面設(shè)置不起作用,它的文檔模式顯示的是。參考參考使用來搞定瀏覽器兼容模式強(qiáng)制標(biāo)準(zhǔn)模式標(biāo)準(zhǔn)模式與兼容模式設(shè)置背景 因為歷史原因,之前很多的系統(tǒng)都會是 頂級頁面+Iframe來加載子級頁面的這種模式構(gòu)件系統(tǒng),而且系統(tǒng)都只能運(yùn)行在IE6或者IE 高版本兼容模式下(IE 7模式)。 隨著現(xiàn)在的審美原來越高,腳本能里越來越強(qiáng),...

    番茄西紅柿 評論0 收藏0
  • 瀏覽器和兼容問題

    一、瀏覽器內(nèi)核 參考文章:瀏覽器引擎(內(nèi)核)介紹?Rendering Engine,中文翻譯過來名稱很多,排版引擎、解釋引擎、渲染引擎,現(xiàn)在流行稱為瀏覽器內(nèi)核。 用來渲染網(wǎng)頁內(nèi)容的,將網(wǎng)頁的內(nèi)容和排版代碼轉(zhuǎn)換為可視的頁面,一個瀏覽器可能不止有一個內(nèi)核。 1、排版引擎 (1)Trident(Windows)360 IE(2)Gecko(跨平臺)Mozilla Firefox、Mozilla SeaM...

    guqiu 評論0 收藏0
  • 瀏覽器和兼容問題

    一、瀏覽器內(nèi)核 參考文章:瀏覽器引擎(內(nèi)核)介紹?Rendering Engine,中文翻譯過來名稱很多,排版引擎、解釋引擎、渲染引擎,現(xiàn)在流行稱為瀏覽器內(nèi)核。 用來渲染網(wǎng)頁內(nèi)容的,將網(wǎng)頁的內(nèi)容和排版代碼轉(zhuǎn)換為可視的頁面,一個瀏覽器可能不止有一個內(nèi)核。 1、排版引擎 (1)Trident(Windows)360 IE(2)Gecko(跨平臺)Mozilla Firefox、Mozilla SeaM...

    geekzhou 評論0 收藏0
  • 瀏覽器和兼容問題

    一、瀏覽器內(nèi)核 參考文章:瀏覽器引擎(內(nèi)核)介紹?Rendering Engine,中文翻譯過來名稱很多,排版引擎、解釋引擎、渲染引擎,現(xiàn)在流行稱為瀏覽器內(nèi)核。 用來渲染網(wǎng)頁內(nèi)容的,將網(wǎng)頁的內(nèi)容和排版代碼轉(zhuǎn)換為可視的頁面,一個瀏覽器可能不止有一個內(nèi)核。 1、排版引擎 (1)Trident(Windows)360 IE(2)Gecko(跨平臺)Mozilla Firefox、Mozilla SeaM...

    EdwardUp 評論0 收藏0
  • Zepto 源碼分析 2 - Polyfill 設(shè)計

    摘要:此模塊包含的設(shè)計思路即為預(yù)以匹配降級方案。沒有默認(rèn)編譯該模塊,以及利用該模塊判斷后提供平臺相關(guān)邏輯的主要原因在于其設(shè)計原則的代碼完成核心的功能。此處,也引出了代碼實(shí)現(xiàn)的另一個基本原則面向功能標(biāo)準(zhǔn),先功能覆蓋再優(yōu)雅降級。 在進(jìn)入 Zepto Core 模塊代碼之前,本節(jié)簡略列舉 Zepto 及其他開源庫中一些 Polyfill 的設(shè)計思路與實(shí)現(xiàn)技巧。 涉及模塊:IE/IOS 3/Dete...

    chuyao 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<