目標(biāo)：兼容IE6 IE7 Firefox；

        當(dāng)我和我們的美工開始著手進(jìn)行網(wǎng)站的瀏覽器兼容工作的時(shí)候，有一個(gè)明顯的感覺：以前我們被IE慣壞了，由奢入儉難，改變壞毛病是不容易啊；如何現(xiàn)存系統(tǒng)進(jìn)行瀏覽器兼容呢？以后的工作中怎么進(jìn)行瀏覽器兼容呢？

       開始我用事先想好的一套：用搜索引擎搜索出來各種瀏覽器兼容的方案，比如：兩個(gè)層重疊了怎么處理，表格撐開了怎么處理...然后整理出來一份文檔放在團(tuán)隊(duì)共享。我的確就是這樣做的，從早晨開始做到晚上8點(diǎn)，也有“成就”：40多頁的文檔；可就在臨睡覺之前我意識(shí)到這是一件“勤勞而愚蠢的事情”。

        原因：頁面對了，不考慮瀏覽器對HTML元素渲染的差別，那么在所有瀏覽器中顯示基本一樣；但是頁面錯(cuò)了那就花樣百出了。比如同樣是一個(gè)DIV的閉合標(biāo)簽沒有寫，在火狐里面，有可能一個(gè)頁面是表現(xiàn)成層重疊，另一個(gè)頁面表現(xiàn)為這個(gè)層跑到頁面最下面了。而在IE中這有可能是完全正常的。我做的工作是什么呢？是在窮舉出所有的錯(cuò)誤情況并找出解決方案，豈不荒唐

       無論整體思路有沒有，手頭的問題還是要解決的，在解決問題的過程中，一切豁然開朗；

       那是一個(gè)系統(tǒng)中最重要的頁面，也是在火狐中最混亂的頁面：有一部分功能被覆蓋，左右兩個(gè)DIV一上一下，隨著頁面內(nèi)容展開footer不自動(dòng)往下延伸...經(jīng)過兩天的奮戰(zhàn)頁面正常了，回頭看看我們到底做了什么呢？我們實(shí)質(zhì)上是在無限的靠近W3C標(biāo)準(zhǔn)。

        于是，一個(gè)個(gè)問題迎刃而解：對于現(xiàn)存的頁面，用W3C驗(yàn)證工具，從Fatal級(jí)別的錯(cuò)誤開始解決；以后的開發(fā)中頁面的瀏覽器兼容怎么保證----只要遵循W3C標(biāo)準(zhǔn)做就可以了。這里有一個(gè)技巧，不是所有瀏覽器都完美的支持W3C的所有標(biāo)準(zhǔn)，同時(shí)W3C標(biāo)準(zhǔn)在有些地方的確吹毛求疵，所以我們大體上遵循W3C的標(biāo)準(zhǔn)，但是頁面上并不添加W3C的聲明。

        做瀏覽器兼容開始做的比較累，后來找到一個(gè)工具，一開始我只告訴她，沒想到一傳十十傳百，竟成了眾人皆知的秘密（玩笑了）----FireBug+Yslow；http://com3.devnet.re3.yahoo.com/yslow/  前者是調(diào)試腳本和頁面樣式的絕佳工具，可以在腳本中設(shè)置斷點(diǎn)。后者則是根據(jù)High performance Web sites提到的14條原則做成了一個(gè)工具：

YSlow analyzes web pages and tells you why they're slow based on the rules for high performance web sites. YSlow is a Firefox add-on integrated with the popular Firebug web development tool.

做瀏覽器兼容時(shí)遇到的一些腳本兼容問題：

1.Firefox里面不能操作剪貼板（有曲線救國之策么？）

2.IE里面的event.srcElement在FireFox里面是event.target注意兼顧

3.IE里面的 div.innerText;在FireFox里面是div.textContent;

4.文本超長自動(dòng)省略： style="overflow: hidden; text-overflow: ellipsis;  width: 260px; white-space: nowrap; cursor: pointer; "注意要?jiǎng)h掉頁面上的W3c標(biāo)準(zhǔn)！

5.如果真的需要為不同的瀏覽器做區(qū)分那么可以

if (window.navigator.userAgent.indexOf("MSIE")>=1)  //IE6 7

if (window.navigator.userAgent.indexOf("Firefox")>=1)  //FF

6.CSS方面也有一些做瀏覽器兼容的策略 就不越俎代庖了 可以搜索一下

總結(jié)一下：

1.  遵循標(biāo)準(zhǔn)但是不把W3C標(biāo)準(zhǔn)聲明添加到頁面上，這種做法在時(shí)間和頁面質(zhì)量之間做了一個(gè)折衷

2.對現(xiàn)存的頁面做美化 可以從驗(yàn)證W3C開始 這是一個(gè)好的切入點(diǎn)

3.瀏覽器兼容在新頁面的開發(fā)時(shí)就要考慮，完成之后再做成本是完全不一樣的 類似于代碼重構(gòu)

4.有些javascript編寫也要關(guān)注一些敏感的瀏覽器兼容問題

5.多說一句：頁面開發(fā)人員學(xué)一點(diǎn)CSS的知識(shí)對于解決瀏覽器兼容的問題是很有幫助的

回頭再說，現(xiàn)在開始......