原生js,兼容

  • var的作用

,通過'var'聲明的全局變量,其實際上是爲'window'對象增加了一個不可配置的屬性, 而不加'var'聲明的全局變量,其實際上是爲'window'對象增加了一個可以配置的屬性,delete 不可以刪除那些可配置性爲false的屬性" ,某些內置對象的屬性是不可配置的,比如通過變量聲明或者函數聲明創建的全局對象的屬性

delete Object.prototype; // false 不可刪除,該屬性是不可配置的
var a = 'aa';
delete window.a;//false 不可刪除,該屬性是不可配置的
function test(){};
delete window.test;//false 不可刪除,該屬性是不可配置的
  • 事件對象
    1.事件綁定的方法:addEventListener,(ie>=9),attachEvent(ie7,ie8)
    2.獲取事件的兼容方法:var event = window.event || arguments[0]

        ​​​​​​
        firefox裏的event跟IE裏的不同,IE裏的是全局變量,隨時可用;firefox裏的要用參數引導才能用
        參考:http://www.cnblogs.com/snandy/archive/2011/03/07/1976317.html

  • 冒泡
    IE: window.event.cancelBubble=true
    w3ce.stopPropagation()
    function stopBubble(e) {
    
        // 如果提供了事件對象,則這是一個非IE瀏覽器
    
        if ( e && e.stopPropagation ) {
    
            // 因此它支持W3C的stopPropagation()方法 
    
            e.stopPropagation();
    
        } else {
    
            // 否則,我們需要使用IE的方式來取消事件冒泡
    
            window.event.cancelBubble = true;
    
        }
    
    }
  • 默認事件
    IE: e.returnValue = false;
    w3c: e.preventDefault()
    function stopDefault( e ) {
    
        // 阻止默認瀏覽器動作(W3C)
    
        if ( e && e.preventDefault ) {
    
            e.preventDefault();
    
        } else {
    
            // IE中阻止函數器默認動作的方式
    
            window.event.returnValue = false;
    
        }
    
        return false;
    
    }

    javascript的return false只會阻止默認行爲,而是用jQuery的話則既阻止默認行爲又防止對象冒泡

  • react阻止默認事件

    阻止冒泡事件分三種情況:

    A、阻止合成事件間的冒泡,用e.stopPropagation();
    B、阻止原生事件與最外層document上的事件間的冒泡,用
        e.nativeEvent.stopImmediatePropagation();
    C、阻止合成事件與除最外層document上的原生事件上的冒泡,通過判斷e.target來避免
     

      合成事件     除最外層document外 最外層的document
    原生事件        

    e.nativeEvent.

    stopImmediatePropagation()

    合成事件 e.stopPropagation() 判斷e.target來避免  
           


     

  • escape,encodeURI,encodeURIComponent區別

    escape不編碼字符有69個:*,+,-,.,/,@,_,0-9,a-z,A-Z

    encodeURI不編碼字符有82個:!,#,$,&,',(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,A-Z

    encodeURIComponent不編碼字符有71個:!, ',(,),*,-,.,_,~,0-9,a-z,A-Z

    encodeURI用來編碼整個url,encodeURIComponent用來編碼url中的參數。
    escape方法已被廢棄。在編碼整個url時,encodeURIComponent會把http和端口後的冒號也編碼

  • unload,beforeunload事件:
$(window).on('beforeunload', function() {  
    alert(1);  
});  

可是這種方法只在ie瀏覽器有效果。

解釋:

1 ,其實beforeunload是起了作用的,只不過alert()彈框在瀏覽器中沒有出現(是大部分瀏覽器會阻止正在關閉的窗口彈對話框)

2, 測試這個,我們可以對後臺發送請求,看看後臺數據是否發生變化(AJAX的話要同步,不然這個函數返回AJAX直接被cancel了.)

3, beforeunload在ff中不兼容,我們同時可以加上unload事件()
4 ,唯一能阻止頁面關閉的就是beforeunload返回truthy value,並且用戶點擊了Cancel/No,瀏覽器會負責跳出個confirm對話框,返回值可以會做爲提示的一部份也可能壓根就不用。
5,這兩個事件的區別:

  1.onunload事件是已經從服務器讀取到了數據,在替換到當前頁面之前執行的。

     onbeforeunload事件是正要去服務器讀取數據還沒有讀取到頁面數據時執行的,因此onbeforeunload事件優先於onunload事件執行,可以阻止onunload事件的執行。

  2.onunload事件在窗口打開、刷新、關閉時都會執行。

     onbeforeunload事件在新窗口被打開的時候並不會執行,只在刷新和關閉時執行。

注:

    1.所有的Falsy值,當進行邏輯判斷時均爲false。Falsy值包括:false、undefined、null、正負0、       NaN、”"。
    2.其餘所有的值均爲Truthy,當進行邏輯判斷時均爲true。值得注意的是,Infinity、空數組、”0″都是Truthy值。
   

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章