1.1 瀏覽器內核差別
1.2. Safari和Chrome瀏覽器簡介
Safari和Chrome，一個是蘋果公司MAC OS系統的瀏覽器，一個是Google開發的瀏覽器，它們都使用了同樣的內核webkit，關於webkit，有如下簡介。
WebKit 是一個開源瀏覽器網頁排版引擎，與之相應的引擎有Gecko（Mozilla，Firefox 等使用的排版引擎）和Trident（也稱爲MSHTML，IE 使用的排版引擎）。同時WebKit 也是蘋果Mac OS X 系統引擎框架版本的名稱，主要用於Safari，Dashboard，Mail 和其他一些Mac OS X 程序。WebKit 所包含的 WebCore 排版引擎和 JSCore 引擎來自於 KDE 的 KHTML 和 KJS，當年蘋果比較了 Gecko 和 KHTML 後，仍然選擇了後者，就因爲它擁有清晰的源碼結構、極快的渲染速度。
目前使用WebKit 引擎的瀏覽器主要有：Safari(apple出品)，Midori，chrome(google出品)等。
1.3. 改造問題彙總
在改造過程的測試及排查中，總結排查出來的共同點一共有以下數十點：
1.2.1 document.formName.item("itemName") 問題
說明:IE下,可以使用document.formName.item("itemName")或document.formName.item["itemName"]或document.formName.elements["elementName"];
W3C標準,只能使用document.formName.elements["elementName"].
解決方法:統一使用document.formName.elements["elementName"].
1.2.2 集合類對象問題
說明:IE下,可以使用()或[]獲取集合類對象; Safari及Chrome下,只能使用[]獲取集合類對象.
解決方法:統一使用[]獲取集合類對象.
1.2.3 各種style描述需嚴格大小寫
說明:IE下，各種CSS屬性大小寫要求不嚴格，均能正確操作。
Safari及Chrome下出現過因爲大小寫問題無法正確解析的情況，建議嚴格大小寫。
解決方法：統一嚴格按照CSS屬性大小編寫。
1.2.4 自定義屬性問題
說明:IE下,可以使用獲取常規屬性的方法來獲取自定義屬性,也可以使用getAttribute()獲取自定義屬性; 在Safari和Chrome下,只能使用getAttribute()獲取自定義屬性.
解決方法:統一通過getAttribute()獲取自定義屬性.
實例：<input type='text' id='comdiv' paic='it' style='display:block' style='font-size: 20pt;' size='4'/>
IE下可以使用element.paic獲取，在Safari和Chrome下只需要使用element. getAttribute('paic')
1.2.5 元素中不能有一處以上的style描述
說明:IE下,一個元素中可以多次style的定義，Safari及Chrome下，若有多次描述無法生效。 解決方法:統一元素中只存在一處的style描述。.
示例：<input type='text' id='comdiv' style='display:block' style='font-size: 20pt;' size='4'/>
在IE下，示例中的兩處style定義都會加載，在Safari和Chrome下只有第一處style會被加載。
1.2.6 eval("idName")問題
說明: 在Safari、Chrome及IE下,可以使用eval("idName")或getElementById("idName")來取得id爲idName的HTML對象;Firefox下只能使用getElementById("idName")來取得id爲idName的HTML對象.
解決方法:統一用getElementById("idName")來取得id爲idName的HTML對象.
1.2.7 變量名與某HTML對象ID相同的問題
說明:IE、 Safari及Chrome下,HTML對象的ID可以作爲document的下屬對象變量名直接使用;Firefox下則不能。
解決方法:使用document.getElementById("idName")代替document.idName.最好不要取HTML對象ID相同的變量名,以減少錯誤;在聲明變量時,一律加上var,以避免歧義.
1.2.8 獲取對象方式
HTML對象的 id和name 在IE使用getElementByID都會找到，在Safari及Chrome中name是找不到的，必須嚴格使用getElementByID和getElementsByName.
解決方法：
id使用getElementByID
name使用getElementsByName
1.2.9 input.type屬性問題
說明:IE下input.type屬性爲只讀;但是在Safari及Chrome中下input.type屬性爲讀寫.
<input type='text' id='comdiv' size='4'/>
Safari及Chrome下，可以使用 comdiv.type ='button' 修改type類型。
1.2.10 模態和非模態窗口問題
說明:IE下,可以通過showModalDialog和showModelessDialog打開模態和非模態窗口; 在Safari及Chrome中則不能.
解決方法:直接使用window.open(pageURL,name,parameters)方式打開新窗口。
如果需要將子窗口中的參數傳遞迴父窗口,可以在子窗口中使用window.opener來訪問父窗口. 例如：var parWin = window.opener; parWin.document.getElementById("Aqing").value = "Aqing";
1.2.11 cursor:hand 和 cursor:pointer
firefox不支持hand，但ie、Safari及Chrome中支持pointer
解決方法: 統一使用pointer
1.2.12 對select的options集合操作
枚舉元素除了[]外，SelectName.options.item()也是可以的, 另外SelectName.options.length, SelectName.options.add/remove都可以在兩種瀏覽器上使用。注意在add後賦值元素，否則會失敗。
