一、函數和方法差異
1 . getyear()方法
【分析說明】先看一下以下代碼：
在ie中得到的日期是"2010"，在firefox中看到的日期是"110"，主要是因為在 firefox 裡面 getyear 傳回的是 "目前年份-1900" 的值。
【相容處理】
加上對年份的判斷，如:
也可以通過 getfullyear getutcfullyear 去調用:
2 . eval()函數
【分析說明】在ie中，可以使用eval("idname")或getelementbyid("idname")來取得id為idname的 html對象；firefox下隻能使用getelementbyid("idname")來取得id為idname的html對象。
【相容處理】統一用getelementbyid("idname")來取得id為idname的html對象。
3 . const聲明
【分析說明】在 ie 中不能使用 const 關鍵字。如：
在ie中這是文法錯誤。
【相容處理】不使用 const ，以 var 代替。
4 . var
【分析說明】請看以下代碼：
這個函數在ie上運作正常，firefox下卻報錯了。
【相容處理】而在echo前加上var就正常了，這個就是我們提到var的目的。
5 . const 問題
【分析說明】在 ie 中不能使用 const 關鍵字。如 const constvar = 32; 在ie中這是文法錯誤。
【解決方法】不使用 const ，以 var 代替。
二、樣式通路和設定
1 . css的"float"屬性
【分析說明】javascript通路一個給定css 值的最基本句法是：object.style.property，但部分css屬性跟javascript中的保留字命名相同，如"float"，"for"，"class"等，不同浏覽器寫法不同。
在ie中這樣寫：
在firefox中這樣寫：
【相容處理】在寫之前加一個判斷，判斷浏覽器是否是ie：
2 . 通路<label>标簽中的"for"
【分析說明】和"float"屬性一樣，同樣需要使用不現的句法區分來通路<label>标簽中的"for"。
【相容處理】解決的方法也是先 判斷浏覽器類型。
3 . 通路和設定class屬性
【分析說明】同樣由于class是javascript保留字的原因，這兩種浏覽器使用不同的 javascript 方法來擷取這個屬性。
ie8.0之前的所有ie版本的寫法：
适用于ie8.0 以及 firefox的寫法：
另外，在使用setattribute()設定class屬性的時候，兩種浏覽器也存在同樣的差異。
setattribute("classname",value);
這種寫法适用于ie8.0之前的所有ie版本，注意：ie8.0也不支援"classname"屬性了。
setattribute("class",value);适用于ie8.0 以及 firefox。
方法一，兩種都寫上：
方法二，ie和ff都支援object.classname，是以可以這樣寫：
方法三，先判斷浏覽器類型，再根據浏覽器類型采用對應的寫法。
4 . 對象寬高指派問題
【分析說明】firefox中類似 obj.style.height = imgobj.height 的語句無效。
【相容處理】統一使用 obj.style.height = imgobj.height + ‘px’;
三、dom方法及對象引用
1 . getelementbyid
【分析說明】先來看一組代碼：
在firefox中，按鈕沒反應，在ie中，就可以，因為對于ie來說，一個html 元素的 id 可以直接在腳本中當作變量名來使用，而firefox中不可以。
【相容處理】盡量采用w3c dom 的寫法，通路對象的時候，用document.getelementbyid("id") 以id來通路對 象，且一個id在頁面中必須是唯一的，同樣在以标簽名來通路對象的時候，用document.getelementsbytagname("div") [0] 。該方式得到較多浏覽器的支援。
2 . 集合類對象通路
【分析說明】ie下，可以使用()或[]擷取集合類對象；firefox下，隻能使用[]擷取集合類對象。如：
【相容處理】将document.forms("formname")改為 document.forms["formname"]。統一使用[]擷取集合類對象。
3 . frame的引用
【分析說明】ie可以通過id或者name通路這個frame對應的window對象，而firefox隻可以通過name來通路這個frame對應的window對象。
例如如果上述frame标簽寫在最上層的window裡面的htm裡面，那麼可以這樣通路：
ie： window.top.frameid或者window.top.framename來通路這個window對象；
firefox：隻能這樣window.top.framename來通路這個window對象。
【相容處理】使用frame的name來通路frame對象，另外，在ie和firefox中都可以使用window.document.getelementbyid(”frameid”)來通路這個frame對象。
4 . parentelement
【分析說明】ie中支援使用parentelement和parentnode擷取父節點。而firefox隻可以使用parentnode。
【相容處理】因為firefox與ie都支援dom，是以統一使用parentnode來通路父節點。
5 . table操作
【分析說明】ie下table中無論是用innerhtml還是appendchild插入<tr>都沒有效果，而其他浏覽器卻顯示正常。
【相容處理】解決的方法是，将<tr>加到table的<tbody>元素中，如下面所示：
6 . 移除節點removenode()和removechild()
【分析說明】appendnode在ie和firefox下都能正常使用，但是removenode隻能在ie下用。
removenode方法的功能是删除一個節點，文法為node.removenode（false）或者node.removenode（true），傳回值是被删除的節點。
removenode（false）表示僅僅删除指定節點，然後這個節點的原孩子節點提升為原雙親節點的孩子節點。
removenode（true）表示删除指定節點及其所有下屬節點。被删除的節點成為了孤立節點，不再具有有孩子節點和雙親節點。
【相容處理】firefox中節點沒有removenode方法，隻能用removechild方法代替，先回到父節點，在從父節點上移除要移除的節點。
7 . childnodes擷取的節點
【分析說明】childnodes的下标的含義在ie和firefox中不同，看一下下面的代碼：
分别用ie和firefox運作，ie的結果是3，而firefox則是7。firefox使用dom規範，"#text"表示文本（實際是無意義的空格和換行等）在firefox裡也會被解析成一個節點，在ie裡隻有有實際意義的文本才會解析成"#text"。
方法一，擷取子節點時，可以通過node.getelementsbytagname()來回避這個問題。但是 getelementsbytagname對複雜的dom結構周遊明顯不如用childnodes，因為childnodes能更好的處理dom的層次結構。
方法二，在實際運用中，firefox在周遊子節點時，不妨在for循環裡加上：
這樣可以跳過一些文本節點。
延伸閱讀
8 . firefox不能對innertext支援
【相容處理】通過判斷浏覽器類型來相容：
四、事件處理
1 . window.event
【分析說明】先看一段代碼
以上代碼在ie運作的結果是[object]，而在firefox無法運作。
因為在ie中event作為window對象的一個屬性可以直接使用，但是在firefox中卻使用了w3c的模型，它是通過傳參的方法來傳播事件的，也就是說你需要為你的函數提供一個事件響應的接口。
【相容處理】添加對event判斷，根據浏覽器的不同來得到正确的event：
2 . 鍵盤值的取得
3 . 事件源的擷取
【分析說明】在使用事件委托的時候，通過事件源擷取來判斷事件到底來自哪個元素，但是，在ie下，event對象有srcelement屬性，但是沒有target屬性；firefox下，even對象有target屬性，但是沒有srcelement屬性。
4 . 事件監聽
【分析說明】在事件監聽處理方面，ie提供了attachevent和detachevent兩個接口，而firefox提供的是addeventlistener和removeeventlistener。
【相容處理】最簡單的相容性處理就是封裝這兩套接口：
需要特别注意，firefox下，事件處理函數中的this指向被監聽元素本身，而在ie下則不然,可使用回調函數call，讓目前上下文指向監聽的元素。
5 . 滑鼠位置
【分析說明】ie下，even對象有x，y屬性，但是沒有pagex，pagey屬性；firefox下，even對象有pagex，pagey屬性，但是沒有x，y屬性。
【相容處理】使用mx(mx = event.x ? event.x : event.pagex;)來代替ie下的event.x或者firefox下的event.pagex。複雜點還要考慮絕對位置。
五、其他差異的相容處理
1 . xmlhttprequest
【分析說明】new activexobject("microsoft.xmlhttp");隻在ie中起作用，firefox不支援，但支援xmlhttprequest。
2 . 模态和非模态視窗
【分析說明】ie中可以通過showmodaldialog和showmodelessdialog打開模态和非模态視窗，但是firefox不支援。
【解決辦法】直接使用window.open(pageurl,name,parameters)方式打開新視窗。 如果需要傳遞參數，可以使用frame或者iframe。
3. input.type屬性問題
ie下 input.type屬性為隻讀，但是firefox下可以修改
4 . 對select元素的option操作
設定options，ie和firefox寫法不同：
firefox:可直接設定
ie:隻能設定
删除一個select的option的方法：
firefox:可以
ie7:可以用
ie6:需要寫
5 . img對象alt和title的解析
【分析說明】img對象有alt和title兩個屬性，差別在于，alt：當照片不存在或者load錯誤時的提示。
title：照片的tip說明, 在ie中如果沒有定義title，alt也可以作為img的tip使用，但是在firefox中，兩者完全按照标準中的定義使用
在定義img對象時。
【相容處理】最好将alt和title對象都寫全，保證在各種浏覽器中都能正常使用 。
6 . img的src重新整理問題
【分析說明】先看一下代碼：
在ie 下，這段代碼可以用來重新整理圖檔，但在firefox下不行。主要是緩存問題。
【相容處理】在位址後面加個随機數就解決了:
總結
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)