編寫跨瀏覽器的javascript代碼必備[js多瀏覽器兼容寫法]
序號 |
操作 |
分類 |
IE |
FireFox |
Mozilla |
當前 |
備注 |
1 |
"." |
訪問tag的固有屬性 |
OK |
OK |
OK |
OK |
|
2 |
"." |
訪問tag的用戶定義屬性 |
OK |
NO |
NO |
OK |
可以用getAttribute函數(shù) 替代 |
3 |
obj.getAttribute |
訪問tag的固有屬性 |
OK |
OK |
OK |
OK |
|
4 |
obj.getAttribute |
訪問tag的用戶定義屬性 |
OK |
OK |
OK |
OK |
|
5 |
document.all |
訪問document的所有子元素 |
OK |
OK |
NO |
OK |
建議用childNodes對象或者getElementById函數(shù)實現(xiàn)對應(yīng)操作。 |
6 |
obj.all |
訪問非document元素的所有子元素 |
OK |
NO |
NO |
OK |
同上 |
7 |
根據(jù)元素的id/name來取得元素。 |
OK |
NO |
NO |
OK |
注意:很多元素是沒有name屬性的,eg: td, div,span... | |
8 |
變量名 = "" |
隱式定義變量-通過向變量名附值方式定義一個新的變量。 |
OK |
OK |
OK |
OK |
建議:為避免必要的麻煩,顯示定義變量。 |
9 |
id |
通過id直接調(diào)用對象 |
OK |
OK |
NO |
OK |
eval()函數(shù)用來執(zhí)行腳本,所以向eval函數(shù)里面?zhèn)魅雽ο骾d/name的話,IE同樣會返回對象的引用。 |
10 |
name |
通過name直接調(diào)用對象 |
OK |
NO |
NO |
OK |
同上/ 原因同7 |
11 |
name |
支持的特殊字符("!",".","@","#","$","<",...) |
NO |
OK |
OK |
NO |
其它的字符沒有測試 |
12 |
tr.innerHTML = "" |
設(shè)置TR元素的內(nèi)部HTML腳本 |
NO |
OK |
OK |
NO |
在IE中,table、tr的innerHTML是只讀屬性,不能夠?qū)ζ渲苯釉O(shè)置??梢酝ㄟ^insertRow/insertCell函數(shù)進行設(shè)置。 |
13 |
cells對象訪問 |
訪問tr的cells對象 |
NO |
OK |
OK |
undefined |
可以將其插入Table再訪問,或者可以用getElementsByTagName函數(shù) 對td/th訪問。 |
14 |
(index) |
訪問集合類對象 |
OK |
NO |
NO |
OK |
建議用正式的操作符"[]". |
15 |
obj.toString() |
取得對象的字符串"[object 對象類型的名稱]". |
NO |
OK |
OK |
NO |
可以省略toString()函數(shù),直接用對象來操作。 |
16 |
obj.class |
定義對象的css式樣/風格。 |
NO |
OK |
NO |
- |
無法寫測試代碼,會有編譯錯誤!可以自己用typeof(class) == null來測試一下,沒有異常就在代碼中可以使用。 |
17 |
const |
保留關(guān)鍵字,用于定義常量。 |
NO |
OK |
OK |
- |
暫時只能不使用const。 |
18 |
input.type |
變更input元素的類型 |
NO |
OK |
OK |
NO |
IE可以初始input元素類型,但是不能變更類型。 |
19 |
obj.children |
訪問對象的子元素集合 |
OK |
NO |
NO |
OK |
可以用childNodes對象替代。 |
20 |
node.replaceNode |
替換新的節(jié)點對象 |
OK |
NO |
NO |
OK |
可以用replaceChild函數(shù)替換。 |
21 |
node.removeNode |
刪除已有節(jié)點對象 |
OK |
NO |
NO |
OK |
可以用oldNode.parentNode.removeChild(oldNode)方式實現(xiàn)。 |
22 |
node.insertBefore |
在指定節(jié)點對象前面插入一個節(jié)點對象 |
OK |
OK |
OK |
OK |
|
23 |
obj.parentElement |
訪問對象的父元素 |
OK |
NO |
NO |
OK |
可以用parentNode對象替代。 |
24 |
obj.childNodes.length |
返回子節(jié)點的數(shù)量,和tag的數(shù)量相同。 |
OK |
NO |
NO |
OK |
FF/Mozilla中,空白或者換行是文本節(jié)點,是childNodes的成員。 |
25 |
obj. |
向指定的位置插入元素 |
OK |
NO |
NO |
OK |
insertAdjacentElement函數(shù)和insertAdjacentText函數(shù)也類似。 |
26 |
createElement() |
創(chuàng)建指定類型元素。 |
OK |
NO |
NO |
OK |
可以先創(chuàng)建出對象元素,再進行屬性設(shè)置;或者直接以InnerHTML的形式加到對應(yīng)位置。 |
27 |
nodeName |
取對象(tag,attribute,textnode)節(jié)點名稱 |
OK |
OK |
OK |
OK |
有人說存在差異,不知道是具體的前提條件,先記錄備考。 |
28 |
window.event |
取得當前的事件對象 |
OK |
NO |
NO |
? |
可以主動向事件的響應(yīng)函數(shù)傳入event參數(shù)。 |
29 |
event.target |
取得事件的觸發(fā)對象 |
NO |
OK |
OK |
? |
可以和srcElement共同使用;可以主動向事件的響應(yīng)函數(shù)傳入觸發(fā)對象元素。 |
30 |
event.srcElement |
取得事件的觸發(fā)對象 |
OK |
NO |
NO |
? |
可以和target共同使用;可以主動向事件的響應(yīng)函數(shù)傳入觸發(fā)對象。 |
31 |
event對象屬性 |
當前三個瀏覽器的共同擁有的屬性: |
altLeft |
bubbles |
bubbles |
? |
event對象的不同點太多,在使用的時候需要一一檢查才行。具體可以用頁面下方的測試區(qū)域試驗。 |
32 |
注冊event |
用attachEvent函數(shù)注冊 |
OK |
NO |
NO |
- |
小心內(nèi)存泄漏?。?! |
33 |
注冊event |
addEventListener函數(shù)注冊 |
NO |
OK |
OK |
- |
|
34 |
注冊event |
obj.onxxx = Function("響應(yīng)函數(shù)名稱或代碼");方式注冊 |
OK |
OK |
OK |
- |
|
35 |
銷毀event |
detachEvent函數(shù)銷毀 |
OK |
NO |
NO |
- |
|
36 |
銷毀event |
removeEventListener函數(shù)銷毀 |
NO |
OK |
OK |
- |
|
37 |
銷毀event |
obj.onxxx = null;方式注冊 |
OK |
OK |
OK |
- |
|
38 |
觸發(fā)event |
fireEvent函數(shù) |
OK |
NO |
NO |
- |
|
39 |
觸發(fā)event |
dispatchEvent函數(shù) |
NO |
OK |
OK |
- |
|
相關(guān)文章
js限制輸入框只能輸入數(shù)字(onkeyup觸發(fā))
這篇文章主要介紹了通過js實現(xiàn)input輸入框只能輸入數(shù)字的實現(xiàn)方法,主要是通過正則表達式替換實現(xiàn),需要的朋友可以參考下2018-09-09JavaScript設(shè)計模式之性能優(yōu)化模式享元模式
這篇文章主要介紹了JavaScript設(shè)計模式之性能優(yōu)化模式享元模式,享元設(shè)計模式是用于性能優(yōu)化的模式,這種設(shè)計模式的核心在于可以共享技術(shù)并支持對大量細分過后的對象進行調(diào)整,更多相關(guān)內(nèi)容需要的小伙伴可以參考一下2022-06-06人人網(wǎng)javascript面試題 可以提前實現(xiàn)下
JavaScript面試題要求:以下題目必須從一至四題中,選出三道題,使用原生代碼實現(xiàn),不可使用任何框架,第五題為選作題2012-01-01JavaScript三種方法解決約瑟夫環(huán)問題的方法
約瑟夫環(huán)問題又稱約瑟夫問題或丟手絹問題,是一道經(jīng)典的算法問題,本篇將以循環(huán)鏈表、有序數(shù)組、數(shù)學遞歸三種方式來解決約瑟夫環(huán)問題。感興趣的可以了解一下2021-09-09