整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
智能手機(jī)成為當(dāng)下最為主要的個(gè)人終端設(shè)備時(shí)，盡管大家已經(jīng)越來越習(xí)慣于使用APP，但瀏覽器作為曾經(jīng)帶領(lǐng)用戶接觸互聯(lián)網(wǎng)世界的窗口，也依然還在繼續(xù)發(fā)光發(fā)熱。日前，谷歌、微軟、蘋果和Mozilla基金會(huì)共同宣布。將努力提高瀏覽器的互操作性，以確保Chrome、Edge、Safari和Firefox帶來同樣可靠和一致的Web體驗(yàn)，為此推出了被稱為Interop 2022的互操作性標(biāo)準(zhǔn)。
據(jù)悉，Interop 2022是一個(gè)為Web開發(fā)者服務(wù)的通用測(cè)試標(biāo)準(zhǔn)，其將以“瀏覽器引擎在15個(gè)重點(diǎn)領(lǐng)域和3個(gè)聯(lián)合調(diào)查中的表現(xiàn)”為不同瀏覽器提供評(píng)分，分別為CSS層疊層、色彩空間和功能、C對(duì)話框元素、CSS子網(wǎng)格、排版和編碼、滾動(dòng)條控件、表單控件等。目前，這四方也公布了各自旗下Chrome、Edge、Safari和Firefox的一致性進(jìn)展，以及具體的兼容性成績(jī)。
蘋果方面在WebKit的開發(fā)者博客中透露，“Interop 2022是一個(gè)不斷發(fā)展的指標(biāo)，由一組自動(dòng)化測(cè)試生成，旨在評(píng)估對(duì)某些對(duì)Web開發(fā)人員最重要的Web標(biāo)準(zhǔn)的支持。Interop 2022將全年不斷更新，顯示瀏覽器工程師修復(fù)錯(cuò)誤、實(shí)施新功能和改進(jìn)測(cè)試的進(jìn)展”。由此不難發(fā)現(xiàn)，目前的主流瀏覽器在兼容性問題“折磨”了開發(fā)者與用戶二十年余年后終于達(dá)成一致，要坐下來解決問題了。
“可靠和一致的Web體驗(yàn)”，其實(shí)指的是瀏覽器之間互相不兼容的現(xiàn)象。相信大家或多或少都用過360、搜狗、QQ等瀏覽器，并且這些產(chǎn)品基本都是在IE 6于2006年被評(píng)為“有史以來第八糟糕科技產(chǎn)品”后，一到兩年內(nèi)誕生的。而這一批瀏覽器在宣傳推廣時(shí)所打出的一個(gè)共同的口號(hào)就是“雙核瀏覽器”，通常都主打的是兼容IE與Chrome內(nèi)核，可面對(duì)老的Web應(yīng)用使用IE內(nèi)核，面向新的網(wǎng)頁(yè)則使用Chrome內(nèi)核。
相信很多朋友在使用瀏覽器時(shí)，多少都遇到過各式各樣的兼容性問題。比如說，某個(gè)網(wǎng)頁(yè)在IE上是一個(gè)顏色，在Chrome上就變?yōu)榱肆硪粋€(gè)顏色，或是網(wǎng)頁(yè)的比例發(fā)生了變化；又或者說，許多學(xué)生朋友可能在填報(bào)志愿時(shí)，就遇到過網(wǎng)站上出現(xiàn)“瀏覽器不兼容，請(qǐng)使用IE11/IE10/IE9瀏覽器訪問”的提示。
而所謂的瀏覽器兼容性問題，是指因?yàn)椴煌瑸g覽器對(duì)同一段代碼有著不同的解析，所造成頁(yè)面顯示效果不統(tǒng)一的情況。為此，解決瀏覽器兼容，也成為了跨瀏覽器開發(fā)的一個(gè)核心問題。而Web瀏覽器的架構(gòu)，可以實(shí)現(xiàn)為一個(gè)進(jìn)程包含多個(gè)線程，也可以實(shí)現(xiàn)為很多進(jìn)程包含少數(shù)線程通過IPC通信。但如何做一款瀏覽器，卻并沒有統(tǒng)一的標(biāo)準(zhǔn)。
這一切的根源，其實(shí)是在互聯(lián)網(wǎng)早期，也就是上世紀(jì)90年代主導(dǎo)瀏覽器市場(chǎng)的微軟，與負(fù)責(zé)web技術(shù)標(biāo)準(zhǔn)的W3C組織并不是一條心、雙方各自奉行不同的標(biāo)準(zhǔn)所致。要知道，在新興市場(chǎng)形成的早期通常都是建立標(biāo)準(zhǔn)的最佳時(shí)機(jī)，但當(dāng)時(shí)最終的結(jié)果卻是微軟憑借著Windows的超高市占率，讓IE的標(biāo)準(zhǔn)成為了用戶的事實(shí)標(biāo)準(zhǔn)。
由于當(dāng)初微軟放棄了進(jìn)入W3C，導(dǎo)致這一組織在Web技術(shù)標(biāo)準(zhǔn)上空有權(quán)威性、卻基本不存在強(qiáng)制力，而2004年誕生的WHATWG（網(wǎng)頁(yè)超文本技術(shù)工作小組），也更是讓W(xué)3C的權(quán)威性大損。早在2004年時(shí)，W3C試圖拋棄HTML轉(zhuǎn)向XHTML，導(dǎo)致了蘋果、Opera、Mozilla的不滿，三家甩開W3C建立WHATWG開發(fā)了Web Applications 1.0，也就是現(xiàn)在的HTML 5。
雖然到了2007年W3C接納了WHATWG，并同時(shí)將HTML 5作為Web技術(shù)的新標(biāo)準(zhǔn)，但W3C也就此失去了制定“標(biāo)準(zhǔn)瀏覽器”的能力。
當(dāng)初微軟不加入W3C，使得后者不采用IE的方案，而在IE掉隊(duì)，Chrome與Firefox崛起后，已經(jīng)有大量開發(fā)者基于IE標(biāo)準(zhǔn)開發(fā)了大量的Web產(chǎn)品，讓瀏覽器不得不用兼容模式來解決這一問題。再加上不同瀏覽器采用的內(nèi)核不同，由于缺乏統(tǒng)一的開發(fā)標(biāo)準(zhǔn)，以及各大瀏覽器廠商為了凸顯產(chǎn)品的特色，更是使得整個(gè)瀏覽器行業(yè)出現(xiàn)了百花齊放的狀態(tài)。
在過去很長(zhǎng)的一段時(shí)間里，跨瀏覽器開發(fā)、并解決瀏覽器的兼容問題，成為了前端開發(fā)者最為頭疼卻必須要解決的問題。而他們所要面臨的問題，就是開發(fā)者的代碼運(yùn)行環(huán)境本身并不掌控在自己手中（服務(wù)器端）、而是在客戶端（用戶的瀏覽器），因此也不得不盡一切可能去協(xié)調(diào)各式各樣的瀏覽器。
眾所周知，在PC互聯(lián)網(wǎng)時(shí)代，瀏覽器市場(chǎng)有四大內(nèi)核，即微軟IE瀏覽器的Trident內(nèi)核、蘋果Safari和谷歌Chrome的Webkit內(nèi)核、Firefox瀏覽器的Gecko內(nèi)核，以及Opera瀏覽器的Presto內(nèi)核。不同內(nèi)核代表著瀏覽器的渲染引擎不同，而渲染引擎又是負(fù)責(zé)取得網(wǎng)頁(yè)內(nèi)容（HTML、XML、圖像）、整理信息（加入CSS樣式等），以及計(jì)算網(wǎng)頁(yè)顯示方式，然后輸出至顯示設(shè)備的關(guān)鍵。
不同瀏覽器內(nèi)核不同的情況下，渲染邏輯自然也就不一樣，就會(huì)導(dǎo)致同一份代碼有的瀏覽器顯示的正常、有的就不正常。例如，不同瀏覽器對(duì)HTM標(biāo)記所具有的內(nèi)外邊距屬性就有著不同的定義，對(duì)同一個(gè)網(wǎng)頁(yè)元素重復(fù)設(shè)置多種樣式時(shí)、處理優(yōu)先級(jí)不一樣，圖片的位置設(shè)置在不同瀏覽器中顯示效果不同等等，都是極為常見的。
目前，業(yè)界最主流的解決方案是“css hack”，而css （層疊樣式表）則是用來表現(xiàn)HTML或XML等文件樣式的計(jì)算機(jī)語(yǔ)言，是控制網(wǎng)站樣式和布局的關(guān)鍵，也就是大家在瀏覽器上看到的網(wǎng)頁(yè)顯示效果，其實(shí)就是由css負(fù)責(zé)。由于不同廠商瀏覽器或某瀏覽器的不同版本對(duì)css的支持、解析不一樣，就要求開發(fā)者來編寫相應(yīng)的css code。簡(jiǎn)單來說就是大力出奇跡，用因地制宜來解決問題。
css hack將壓力拋給了開發(fā)者，為此部分開發(fā)者會(huì)在網(wǎng)頁(yè)上設(shè)置瀏覽器檢測(cè)，針對(duì)某些（IE）瀏覽器甚至直接拒絕服務(wù)，以至于沒有兼容模式的Edge（Trident內(nèi)核）在遇到網(wǎng)頁(yè)檢測(cè)瀏覽器時(shí)，干脆就聲稱自己是Chrome。顯然這不是一個(gè)完美的解決方案，但奈何W3C組織不給力、瀏覽器廠商又各有各的算盤，所以解決瀏覽器之間的兼容性問題也就被束之高閣了。
那么，為什么在移動(dòng)互聯(lián)網(wǎng)時(shí)代、APP已經(jīng)動(dòng)搖了瀏覽器市場(chǎng)地位的當(dāng)下，谷歌、微軟、蘋果和Mozilla又要攜手來解決這一問題呢？
其實(shí)這是因?yàn)閷?dǎo)致瀏覽器兼容性問題的歷史包袱，現(xiàn)在已經(jīng)不存在了。微軟的IE11以及Edge已經(jīng)徹底“壽終正寢”了，同時(shí)Mozilla的Firefox市場(chǎng)份額已不到4%，Opera瀏覽器更是放棄了自己的Presto內(nèi)核、改用Webkit內(nèi)核，并且Webkit內(nèi)核也基本上已經(jīng)一統(tǒng)整個(gè)市場(chǎng)了。至于說，谷歌與Opera合力研發(fā)的Blink內(nèi)核，則是Webkit內(nèi)核的硬分叉產(chǎn)物，兩者擁有同一個(gè)源流。
換句話來說就是，當(dāng)初瀏覽器兼容性問題的出現(xiàn)，是因?yàn)闉g覽器廠商太多、瀏覽器內(nèi)核太多，各家的標(biāo)準(zhǔn)讓開發(fā)者無所適從。但現(xiàn)在隨著微軟Edge加入谷歌的Chromium生態(tài)、Firefox式微，以及蘋果Safari圈地自萌，開放的生態(tài)讓Chromium的標(biāo)準(zhǔn)成為了全球開發(fā)者都在遵循的行業(yè)標(biāo)準(zhǔn)。
簡(jiǎn)單來說，就是Chromium生態(tài)在事實(shí)上已經(jīng)壟斷了瀏覽器市場(chǎng)，只需要4家廠商就可以制定瀏覽器的事實(shí)標(biāo)準(zhǔn)了。
(1) cookie 數(shù)據(jù)??不能超過4k
(2) sessionStorage 和 localStorage 雖然也有存儲(chǔ)??的限制，但? cookie ?得 多，可以達(dá)到5M或更?
(1) localStorage 存儲(chǔ)持久數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失除?主動(dòng)刪除數(shù)據(jù)
(2) sessionStorage 數(shù)據(jù)在當(dāng)前瀏覽器窗?關(guān)閉后?動(dòng)刪除
(3) cookie 設(shè)置的 cookie 過期時(shí)間之前?直有效，即使窗?或?yàn)g覽器關(guān)閉
說得簡(jiǎn)單點(diǎn)，在線HTML編輯器就是在網(wǎng)上發(fā)帖子、寫博客的那個(gè)帶編輯功能的框框，可以進(jìn)行圖文排版等操作。
當(dāng)年本菜鳥做網(wǎng)站的時(shí)候，曾經(jīng)自己用javascript編寫過一個(gè)比較簡(jiǎn)單的在線HTML編輯器，用于文本內(nèi)容的排版。但是因?yàn)樗接邢蓿芏喙δ芏紵o法實(shí)現(xiàn)。后來有了eWebEditor，功能確實(shí)強(qiáng)大，但這個(gè)編輯器是個(gè)收費(fèi)的軟件，并且正因?yàn)楣δ軓?qiáng)大，也就顯得過重，一些輕量的場(chǎng)合不是太適用。那有沒有既免費(fèi)、又功能強(qiáng)大、還能適應(yīng)輕量場(chǎng)合的在線HTML編輯器呢？
答案肯定是有的。這首先要感謝這些年來有一批奉獻(xiàn)精神的程序猿們不斷推進(jìn)共享軟件的開發(fā)，讓我們得以享受他們的成果。
UEditor是由百度web前端研發(fā)部開發(fā)所見即所得富文本web編輯器，具有輕量，可定制，注重用戶體驗(yàn)等特點(diǎn)，開源基于MIT協(xié)議，允許自由使用和修改代碼。特別要說的是，頭條號(hào)后臺(tái)發(fā)布文章的編輯器就是用的UEditor!
百度UEditor
UEditor還有一個(gè)輕量版的，叫做UMeditor，簡(jiǎn)稱UM。UM是為滿足廣大門戶網(wǎng)站對(duì)于簡(jiǎn)單發(fā)帖框，或者回復(fù)框需求所定制的在線HTML編輯器。 主要特點(diǎn)是容量和加載速度上的改變，主文件的代碼量為139k，而且放棄了使用傳統(tǒng)的iframe模式，采用了div的加載方式， 以達(dá)到更快的加載速度和零加載失敗率。UM的第一個(gè)使用者是百度貼吧，以經(jīng)受貼吧每天幾億的pv的考驗(yàn)，功能設(shè)計(jì)應(yīng)當(dāng)是最優(yōu)化的了。 當(dāng)然隨著代碼的減少，UM的功能對(duì)于UE來說還是有所減少，但也有增加，比如拖拽圖片上傳，chrome的圖片拖動(dòng)改變大小等。
百度UEditor界面
xhEditor是一個(gè)基于jQuery開發(fā)的簡(jiǎn)單迷你并且高效的可視化HTML編輯器，基于網(wǎng)絡(luò)訪問并且兼容IE 6.0+,Firefox 3.0+,Opera 9.6+,Chrome 1.0+,Safari 3.22+。
xhEditor完全基于Javascript開發(fā)，可以應(yīng)用在任何的服務(wù)端語(yǔ)言環(huán)境下，例如：PHP、ASP、ASP.NET、JAVA等。可以在CMS、博客、論壇、商城等互聯(lián)網(wǎng)平臺(tái)上完美的嵌入運(yùn)行，能夠非常靈活簡(jiǎn)單的和您的系統(tǒng)實(shí)現(xiàn)完美的無縫銜接。
主要特點(diǎn)：
精簡(jiǎn)迷你：初始加載4個(gè)文件，包括：1個(gè)js(50k)+2個(gè)css(10k)+1個(gè)圖片(5k)，總共65k。若js和css文件進(jìn)行g(shù)zip壓縮傳輸，可以進(jìn)一步縮減為24k左右。
使用簡(jiǎn)單：簡(jiǎn)單的調(diào)用方式，加一個(gè)class屬性就能將textarea變成一個(gè)功能豐富的可視化編輯器。
無障礙訪問：提供WAI-ARIA全面支持，全鍵盤精細(xì)操作，全程語(yǔ)音向?qū)В峁┩昝罒o障礙訪問體驗(yàn)，充分滿足殘疾人的上網(wǎng)需求。
內(nèi)置Ajax上傳：內(nèi)置強(qiáng)大的Ajax上傳，包括HTML4和HTML5上傳支持(多文件上傳、真實(shí)上傳進(jìn)度及文件拖放上傳)，剪切板上傳及遠(yuǎn)程抓取上傳。
Word自動(dòng)清理：實(shí)現(xiàn)Word代碼自動(dòng)檢測(cè)并清理，生成代碼最優(yōu)化精簡(jiǎn)，卻不丟失細(xì)節(jié)效果。
UBB可視化編輯：支持UBB可視化編輯，在獲得安全高效代碼存儲(chǔ)的同時(shí)，又能享受可視化編輯的便捷。
KindEditor 也是一個(gè)開源的在線HTML編輯器， 使用 JavaScript 編寫，可以無縫地與 Java、.NET、PHP、ASP 等程序集成，比較適合在 CMS、商城、論壇、博客、Wiki、電子郵件等互聯(lián)網(wǎng)應(yīng)用上使用。本菜鳥感覺這個(gè)編輯器上手比較容易，功能也很強(qiáng)大，界面比較友好，很適合菜鳥使用。可惜的是最近好像停止更新了，官網(wǎng)好象也能不正常訪問。
KindEditor界面
主要特點(diǎn)：
快速：體積小，加載速度快
開源：開放源代碼，高水平，高品質(zhì)
底層：內(nèi)置自定義 DOM 類庫(kù)，精確操作 DOM
擴(kuò)展：基于插件的設(shè)計(jì)，所有功能都是插件，可根據(jù)需求增減功能
風(fēng)格：修改編輯器風(fēng)格非常容易，只需修改一個(gè) CSS 文件
兼容：支持大部分主流瀏覽器，比如 IE、Firefox、Safari、Chrome、Opera
嚴(yán)格來說，KISSY不僅僅是一個(gè)在線HTML編輯器，而是由阿里集團(tuán)前端工程師們發(fā)起創(chuàng)建的一個(gè)開源 JS 框架，具有跨終端、模塊化、使用簡(jiǎn)單的特點(diǎn)。里面帶有HTML編輯器這個(gè)模塊。
阿里的KISSY
正因?yàn)镵ISSY采取模塊化設(shè)計(jì)，因此具有高擴(kuò)展性、組件齊全，接口一致、自主開發(fā)、適合多種應(yīng)用場(chǎng)景等優(yōu)點(diǎn)。KISSY 除了完備的工具集合諸如 DOM、Event、Ajax、Anim 等，KISSY 還面向團(tuán)隊(duì)協(xié)作做了獨(dú)特設(shè)計(jì)，提供了經(jīng)典的面向?qū)ο蟆?dòng)態(tài)加載、性能優(yōu)化解決方案。作為一款全終端支持的 JavaScript 框架，KISSY還 為移動(dòng)終端做了大量適配和優(yōu)化，搞移動(dòng)web開發(fā)的可以好好研究一下KISSY的運(yùn)用。
關(guān)于菜鳥手記：
菜鳥最怕就是看大神的攻略，全是術(shù)語(yǔ)看頭就頭大！本人作為一名對(duì)啥都感興趣的資深菜鳥，潛心研究各類技術(shù)二十余年，做網(wǎng)站、寫程序、搞美工、練書法、學(xué)畫畫、作文章、抓管理、裝逼格，屬于搞IT里面最懂美工的，搞HR里面最懂畫畫的，搞文字里面最懂程序的，最終一事無成，博而不精，徒留一堆手記。從菜鳥角度寫手記，同樣的”白”更易懂，你值得擁有！感興趣的，請(qǐng)別忘點(diǎn)右角關(guān)注菜鳥手記。
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
