js之瀏覽器相容性
阿新 • • 發佈:2018-12-20
1、ie瀏覽器不支援函式預設值
hi('李四'); function hi(msg = '張三'){ alert(msg); }
此函式在火狐、谷歌等瀏覽器下均沒問題,唯獨在萬惡的ie瀏覽器下會提示如下錯誤:
為什麼會出現這樣的問題呢?
在ES6之前,不能直接為函式的引數指定預設值,Chrome,Firefox,Safari等瀏覽器對es6支援較好,所以沒有報錯,而萬惡的ie對es6支援的很差勁,所以會報錯
- Chrome:51 版起便可以支援 97% 的 ES6 新特性。
- Firefox:53 版起便可以支援 97% 的 ES6 新特性。
- Safari:10 版起便可以支援 99% 的 ES6 新特性。
- IE:Edge 15可以支援 96% 的 ES6 新特性。Edge 14 可以支援 93% 的 ES6 新特性。(IE7~11 基本不支援 ES6)
如何解決此問題呢?只能採取變通的方法
hi(); function hi(msg){ msg = msg || '張三'; alert(msg); }
這種寫法有一種致命的缺點:
那就是如果引數msg賦值了,但是對應的布林值為false,則該賦值不起作用,如果在呼叫函式的時候,傳入的引數是一個空字元傳,那麼msg就會被修改為預設值;
那又如何避免這個問題呢?需要先判斷一下
1、arguments.length是否為1
2、判斷值是否為undefined
修改後的完整程式碼?
hi(" "); function hi(msg){ msg = arguments.length && arguments[0] != undefined ? msg : '張三'; alert(msg); }
2、關於事件的相容性處理
document.onkeydown = function(event){ //相容IE和Firefox獲得keyBoardEvent物件 event = event ? event : ((window.event) ? window.event : ""); //相容IE和Firefox獲得keyBoardEvent物件的鍵值 var key = event.keyCode ? event.keyCode : event.which; if(key == 13){ alert("hello wolrd"); } };