從 2012 年一開始到 4 月底為止，Firefox 陸續推出了 10、11、12 三個版本，這些版本之間有了一些瀏覽器 bug 的修正、對應標準的更動、安全性上的調整，特別是 HTML5 本身仍是屬於正在發展，尚未正式定案的階段，Mozilla 必須變更 Firefox 在相關功能的實作以符合草案的變動。再加上，Firefox 10 除了是第一個兩位數版本號的版本，更是 Mozilla 為了企業實務上不一定能配合 Firefox 4 開始的高速釋出週期政策來更新所提供的第一個長期支援版本（Extended Support Release，簡稱「ESR」），開發者除了要注意網頁在新版本上是否能正確運作及顯示之外，兼顧向下相容，特別是對 ESR 的相容性變得更加重要了。有鑑於 Mozilla Japan 會對這些資訊加以整理，而台灣似乎沒有把相關資訊中文化並整理起來，因此小弟斗膽將 Firefox 10、11、12 的相容性資訊翻譯並加以彙整，希望讓以中文為母語的開發者能省去搜尋及閱讀的時間，在開發及維護時能提早預知可能的問題並加以避免。以下以版本號分別列出該版本與上一版本之間的差異。

Firefox 10

UserAgent 字串的版本編號變成兩位數

Firefox 10 是第一個主要版本編號為兩位數的版本。UserAgent 字串用來分辨瀏覽器，如果 Script 中用來判斷版本的代碼是有問題的，可能造成分辨瀏覽器失敗。請利用 Firefox 10 來檢查有利用到 UserAgent 字串的 Script 是否能正確運作。

Firefox 正式版及 Beta 版的 UserAgent 是長這個樣子的：

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:10.0) Gecko/20100101 Firefox/10.0

Mozilla/5.0 (Windows NT 6.2; rv:10.0.1) Gecko/20100101 Firefox/10.0.1

除了主要版本編號會有兩位元以上之外，還要特別注意的是，如果有安全性更新的話，版本編號不是像「10.0」這樣子區分為兩個部份，而是像「10.0.1」這樣子區分為三個部份。

Firefox 的 Beta 版使用與正式版相同的 UserAgent 字串，但是 Nightly 版及 Aurora 版則不同，是長這樣子的：

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:12.0a1) Gecko/20120122 Firefox/12.0a1

Mozilla/5.0 (Windows NT 6.2; rv:12.0a2) Gecko/20120122 Firefox/12.0a2

請注意，「Gecko/yyyymmdd」的部份並非固定在「20100101」，而且版本編號最後面則是跟著「a1」或「a2」之類的字樣。其他關於 Firefox UserAgent 字串的細節，請參照 Mozilla Developer Network 的文件。

〈table〉 元件的邊 (Margin) 現在能正確的被抵消

在新的 CSS 規範當中，兩個垂直排列元件之間的邊距將會被「折疊」。也就是說，垂直排列的元件之間的邊距將會被抵銷，而以最大的邊距作為上下元件之間的間隔距離。

但是，直到 Firefox 9 為止都沒有針對〈table〉元件的部份做上下元素間邊距相抵銷的處理，使得〈table〉元件的部份仍然以與其垂直排列的元件之間上下邊距的總和作為之間的間隔距離。Firefox 10 開始修正了這個問題，使得〈table〉與其他元件相同，會正確的對上下邊距做折疊。**這將導致〈table〉與上下的元件兩邊都有設定上下邊距的情況下邊距會變小**。如果您依據垂直高度來決定頁面佈局，並且有指定〈table〉的邊距，那麼請特別注意這點。

像是下面那樣的代碼，直到 Firefox 9 為止，〈table〉與上下元件之間的間距各自為 1+2=3em 與 2+3=5em，而從 Firefox 10 開始，則是 Max(1,2) = 2em 與 Max(2,3) = 3em（從這裡觀看結果）：

〈p style="margin: 1em;"〉有設置 margin-bottom 的元件〈/p〉
〈table style="margin: 2em;"〉〈tr〉〈td〉table 元件〈/td〉〈/tr〉〈/table〉
〈p style="margin: 3em;"〉有設置 margin-top 的元件〈/p〉

在不是設定為一般配置的 〈table〉 中設定為絕對配置時的基準位置之修正

在 CSS 的規範中，被設定為絕對配置 (position: absolute) 的元件，其位置是以被設定為一般配置 (position: static) 以外之配置方式 (position: relative / absolute / fixed) 的所有祖先元件之中層級最接近者為基準，並配合所指定的位移量 (top, bottom, left, right) 來加以決定的。

但是，直到 Firefox 9 為止，就算在祖先元件中的〈table〉元件被設定為一般配置以外之配置方式的情況下，被設定為絕對配置的子孫元件在決定基準點時，卻跳過〈table〉而以更上層中被設定為一般配置以外之配置方式的祖先元件為基準。

在對設置為絕對配置、相對配置及固定配置之〈table〉内的元件指定絕對位置的情況下，頁面佈局將有所變動。

像是下面那樣的代碼，直到 Firefox 9 為止，〈table〉内的〈div〉元件以外面的〈div〉元件作為基準的原因，從內容區域的上面算起 0+50 = 50px，左邊算起 100+50 = 150px 的地方開始繪製。而從 Firefox 10 開始，則是以〈table〉元件作為基準，從內容區域的上面算起 100+50 = 150px，左邊算起 100+50 = 150px 的地方開始繪製。（從這裡觀看結果）

〈div style="position: absolute; left: 100px;"〉設定為絕對配置的祖先元件
〈table style="position: absolute; top: 100px;"〉〈tr〉〈td〉
table 内的一般配置元件
〈div style="position: absolute; top: 50px; left: 50px;"〉table 内的絕對配置元件〈/div〉
〈/td〉〈/tr〉〈/table〉
〈/div〉

絕對配置的問題與邊距抵銷的問題最終總會依據 CSS 規範做出修正。如果為了修改成與其他瀏覽器相同的頁面佈局，直到現在不是選擇做出 Firefox 專用的頁面佈局，而是做成能對應多個瀏覽器的話，我想應該是不會產生出多大的問題的。詳細情形請看這篇文章。

另外，雖然為了方便起見只寫了〈table〉元件的部份，但其實也對設定成 display: table 的任意元件做出修正。

在 Strict 模式下無法使用 E4X

雖然 Firefox 的 JavaScript 引擎有支援被稱為 「E4X」這個為了能簡單處理 XML 而產生的語法，在從 ECMAScript 5th 開始導入的 Strict 模式已啟用的情況下 E4X 語法將會無法使用。

如果有 E4X 和 Strict 模式同時使用之情況的話，請選擇不要使用 Strict 模式，或是將以 E4X 撰寫的代碼改掉。

移除在 DOM4 中成為不建議使用的特性 (Property)

在 DOM4 中以下的屬性 (Attribute) 及特性變成了「不建議使用」，從 Firefox 10 開始被移除。

*   `document.xmlVersion` 屬性

*   `document.xmlStandalone` 屬性

*   `document.xmlEncoding` 屬性

*   `text.isElementContentWhiteSpace` 屬性

*   `text.replaceWholeText()` 方法

*   `node.isSameNode()` 方法

由於「document.xmlVersion」每次都會傳回「1.0」的原因，無法用來判斷取得的 document 究竟是 XML 還是是 HTML。我們可以用以下的方法來加以判別：

if (document.createElement("foo").tagName == "FOO") {
/* HTML 模式的話，呼叫 tagName 屬性將會取得被轉為大寫的元件名 */
}

`node.isSameNode()` 請改用同値運算子 (`===`) 進行比較。

遇到以「setAttribute()」指定一個整數值屬性時將末端的非數字文字無視來進行解釋

HTML 的規範當中，存在著「在指定一個整數值的屬性時，若用來指定的字串末端存在不是數字的文字則予以無視」

這樣的定義。也就是說，「100fox」必須被解釋成「100」。

直到 Firefox 9 為止，在包含不是數字的文字的情況下當作錯誤來處理，而從 Firefox 10 開始則修正為依照規範將以用來指定之字串前面的整數值部份來指定。

像是下面那樣的代碼，直到 Firefox 9 為止，〈canvas〉的寬度將不會被指定而是保留初始值「300」，而從 Firefox 10 開始，則將會被指定為「100」。

document.getElementById("canvasid").setAttribute("width", "100em");

ESC 鍵不會觸發 oninput 事件

雖然 HTML 已經有規定只有在元件的值被改變時才會觸發「oninput」事件，但是從 Firefox 4 到 Firefox 9 為止，按下 ESC 鍵也能觸發「oninput」事件。

從 Firefox 10 開始依照規範做出修正，ESC 鍵不會再觸發事件了。

IndexedDB 的實作依據最新規範進行更新

從 Firefox 4 開始支援仍然在制定規範中的 IndexedDB 的一部分 API，之後也持續的添加對應的 API 及配合規範的變更進行變更。

在 Firefox 10 中「IndexedDB」已經做出了大幅度的改變，其中請注意設定版本的方法已經改變了。

以前的作法是在開啟資料庫連接的地方以「setVersion()」方法進行設定，不過「setVersion()」方法將被移除，改成在連接資料庫時以參數來指定版本編號。先前使用「setVersion()」方法的代碼必須全部變更。

如需要關於這次 IndexedDB 之改變的日文解說，可以參考 mzsm 先生所寫的「關於 IndexedDB 的備忘錄（2011年12月版）」。

Firefox 11

MozBeforePaint 事件被廢除，mozRequestAnimationFrame 函數改成必須提供回傳參數

Bug 704171 – Remove the no-argument form of requestAnimationFrame

在此以前透過呼叫「mozRequestAnimationFrame」之際觸發「MozBeforePaint」事件的機制將被廢止。還有、在此之前能夠不提供引數直接呼叫「mozRequestAnimationFrame」，從此必須依照標準提供引數（callback 參數）。

從今以後，請利用提供 callback 參數給「mozRequestAnimationFrame」來取得時間戳記，以取代透過「MozBeforePaint」事件觸發。從 Firefox 11 開始，不提供參數或是提供一個 null 值作為參數呼叫「mozRequestAnimationFrame」將會得出例外狀況，將會在錯誤主控台中看到錯誤訊息。

Android 版 Firefox 的 UA 字串被改變

Bug 671634 – Useragent should be different between phones and tablets

Android 版 Firefox 的 UserAgent (UA) 字串被改變了。首先、追加了表示手持裝置種類的 token，像平板電腦則表示為「Tablet」，智慧手機等其他手持裝置則表示為「Mobile」。其次，移除掉代表開發代號「Fennec」的 token 被移除了。然後，「Gecko/」後面的數字，所表示的不再是凍結日期而是 Gecko 的版本號。

Mozilla/5.0 (Android; Mobile; rv:11.0) Gecko/11.0 Firefox/11.0

Mozilla/5.0 (Android; Tablet; rv:11.0) Gecko/11.0 Firefox/11.0

修正網站内 navigator 的特性 (Property) 被保留的這樣無法理解的行為

Bug 690952 – Remove the crazy navigator preservation behavior

Firefox 在此之前，對 navigator 物件設定擴充特性 (Property) 的話，在網站（同一網域）的頁面切換之間瀏覽器仍可能會保留住這些資料。為了這樣意料之外，無法理解的行為，而修正為資料不會被保留住了。如果想要在客戶端留下資料的話，請使用 Cookie、DOM Storage、IndexedDB 等其他一般的方法。

HTTP Content-Type 標頭的文字編碼用引號包起來指定將不被接受

Bug 700589 – HTTP content type charset parameter accepts single quotes

在此之前，Firefox 接受「Content-Type: text/plain; charset='UTF-8'」這樣用單引號來指定文件編碼的作法，但是這樣違反了 RFC 的規範，所以這樣不正確的指定作法將會被無視。使用 HTTP Content-Type 標頭指定文件編碼的情況下，請不要再用引號包起來。

能透過 Geolocation API 取得的「countryCode」被拿掉了

Bug 704056 – remove 'countryCode' from nsIDOMGeoPositionAddress.idl

在 Firefox 中，能透過 Geolocation API 取得的資訊包含了國家代碼、但是標準規範中並沒有這樣的定義所以把它拿掉了。如果遇到類似下面的程式碼，請使用「county」取代「countryCode」。

navigator.geolocation.getCurrentPosition(function(position) {
do_something(position.address.countryCode);
});

WebSockets API 的前綴拿掉了

Bug 695635 – tracking bug: unprefix WebSockets

配合最新版標準規範草案中對 Protocol、API 的更新，「MozWebSocket」被換成「WebSockets」了。有調用 WebSockets API 的情況下，請務必確保有無前綴都要能正確運作。為了向下相容，請用以下的方法確保有前綴的 API 也能被對應到。

var ws;
if (WebSocket) {
ws = new WebSocket(url); // 標準
} else if (MozWebSocket) {
ws = new MozWebSocket(url); // Firefox 10 及以前版本
} else {
// WebSockets 未對應
}

使用百分比值指定 SVG 根要素大小將不被認可

Bug 611099 – remove handling of percentages as intrinsic widths/heights (SVG height="100%" width="100%" defaults)

在此之前， Firefox 容許對 SVG 的根要素以「width="100%"」這樣以百分比值設定該要素的固有尺寸 (intrinsic dimensions)，為了配合標準，這樣的指定將不被接受。

使用者可設定提示文字的顯示前延遲時間

Bug 204786 – Add setting to change delay before tooltip shows

在網頁及 Firefox 的 UI 要素上，作為提供補充資訊的提示文字在顯示前的延遲時間，可以透過瀏覽器的隱藏設定「ui.tooltipDelay」加以變更。預設值跟以前一樣為 500（0.5 秒），設為 0 的話，當滑鼠指標指到時將直接顯示。

網頁這方面，透過 JavaScript 實作自己的提示文字的情況下、根據使用者的設定、可能會導致與瀏覽器所顯示的原生提示文字（title 屬性的值）重疊，請務必要注意。

Firefox 12

input 事件將被 compositionupdate 事件觸發

Bug 713502 - input event should be fired after compositionupdate

在 editor (Form) 上面透過 IME 輸入文字的情況下，本來是等到輸入完後才觸發 input 事件、Firefox 12 開始，仍在 IME 編輯中的文字經過變動而觸發 compositionupdate 事件後直接觸發 input 事件。從此之後，透過使用 input 事件的 handler，將能取得包含仍在輸入法編輯區中，尚未完成文字編輯的表單輸入內容。

在 editor 上被不實觸發的 keypress 事件將被無視

Bug 698949 – Refuse untrusted keypress events in editor

使用 dispatchEvent 的話 keypress 事件將有機會被不實觸發的情況下、在 Firefox 的 editor (Form) 上面仍會被接受。可是，關於在 editor 上面遇到「無法信賴」的事件處理規範尚未被制定，其他的瀏覽器都將其無視的情況下，Firefox 也決定跟進。

更新 border-image 的實做

Bug 497995 – Implement border-image revisions in latest css3-background

為了配合 CSS3 的最新規範，border-image（現在仍是加上表示測試用前綴字串的 -moz-border-image）的實作跟著更新了。對應舊版本（特別是 Firefox 10 ESR）的指定及併記的方法請參考 Piro 先生的部落格文章。

提示文字將接受多行的文字

Bug 358452 – Firefox: Let authors put line breaks (newlines) in tooltips (title attribute)

以前 Firefox 會無視 title 屬性值裡面的換行文字，而為了遵守 HTML5 的規範，將呈現出換行的效果，使得現在能做到顯示多行的提示文字。因此，在 title 屬性的值中包含換行文字的情況下新舊版本的呈現會有所不同。

刪除 UniversalXPConnect 以外的特權管理機制

Bug 713747 – Rip out non-UniversalXPConnect privilege manager functionality

在 Firefox 之中，透過 JavaScript 的擴充規格 netscape.security.PrivilegeManager.enablePrivilege 取得極高的權力，能做到一般 Web 應用不被許可的操作（像是讀取本機檔案、改變設定等等）。這個特權管理機制必須修改 Firefox 的設定才能使用，而且只能在區域網路等極有限的範圍內使用。

在 Firefox 12 之中、除了一般用途的 UniversalXPConnect 之外的五種特權，UniversalBrowserRead、UniversalBrowserWrite、UniversalPreferencesRead、UniversalPreferencesWrite、UniversalFileRead 皆被刪除了。

在將來，Web 應用中能夠使用的特權管理機制（enablePrivilege 參數）預計將被廢除，建議使用擴充套件取代。

停止支援 JavaScript 的 sharp 變數

Bug 566700 – remove sharp variables

Sharp 變數是從 Netscape 時代流傳下來，至今 Mozilla 的 JavaScript 引擎仍然實作的非標準擴充規範。Firefox 12 開始將不再支援。

相關連結：

Firefox 10 のサイト互換性情報 https://mozilla.jp/business/resources/site-compatibility/firefox-10/

Firefox 11 のサイト互換性情報 https://mozilla.jp/business/resources/site-compatibility/firefox-11/

Firefox 12 のサイト互換性情報 https://mozilla.jp/business/resources/site-compatibility/firefox-12/

You may be interested in the following articles:

• 從 Firefox 擴充套件之戰談起 - 2009-05-06