首先認(rèn)識認(rèn)識幾種編碼方式
ASCII
全稱美國標(biāo)準(zhǔn)信息交換代碼（American Standard Code for Information Interchange）的縮寫, 為美國英語通信所設(shè)計(jì)。它由128個(gè)字符組成，包括大小寫字母、數(shù)字0-9、標(biāo)點(diǎn)符號、非打印字符（換行符、制表符等4個(gè)）以及控制字符（退格、響鈴等）組成，每個(gè)字符占7位（1字節(jié)是8位）。
ISOLatin-1
可以認(rèn)為ASCII是美國發(fā)明針對英語設(shè)計(jì)的，但歐洲人在用的時(shí)候出現(xiàn)了問題。對于一些特殊的拉丁字符，比如法文德文里某些字符，ASCII字符集就不包括。于是歐洲人發(fā)明了一種8位字符集是ISO 8859-1Latin 1，也簡稱為ISOLatin-1。它對ASCII做了個(gè)擴(kuò)充，對于0-127之間的字符還使用ASCII里的字符不變， 把位于128-255之間的字符表示拉丁字母表中特殊語言字符。
UNICODE
后來計(jì)算機(jī)不斷發(fā)展擴(kuò)展到亞洲非洲，如何用計(jì)算機(jī)使用的二進(jìn)制表示這些語言又成了問題。ISOLatin-1的8位字符集只能表示256個(gè)字符，而僅漢語就有80000以上個(gè)字符。如何把地球上絕大多數(shù)語言用一種編碼方式表示出來呢？ 于是發(fā)明了UNICODE編碼，只用2個(gè)字節(jié)(16位)就可以編碼地球上幾乎所有地區(qū)的文字。
但是，UNICODE只是理論上的編碼方式，相當(dāng)于給世界上每個(gè)文字打了個(gè)編號，但這編號具體如何在計(jì)算機(jī)里面存儲(chǔ)，可以有多種實(shí)現(xiàn)方式。比如utf-8和gbk。
前面說了UNICODE只是給每個(gè)文字打了個(gè)編號，為啥不把這個(gè)編號直接轉(zhuǎn)化成二進(jìn)制存儲(chǔ)在計(jì)算機(jī)里面呢？ 比如英文字母s的編號是115, 用二進(jìn)制表示是00000000 1110011, 中文日的編號是26085 (16進(jìn)制是65e5) ，二進(jìn)制是11001011 1100101。老外才沒那么傻，對于老外這種日常純粹是用英文字符的人來說明明之前1個(gè)字節(jié)就能存儲(chǔ)一個(gè)字母，現(xiàn)在為了全球大一統(tǒng)非要存儲(chǔ)為2個(gè)字節(jié)，相當(dāng)于一個(gè)之前一個(gè)1M的文檔，現(xiàn)在變?yōu)?M。于是老外耍了賴，英文字母s是115沒錯(cuò)，但我就用1個(gè)字節(jié)1110011表示，而你中文日是26085號也沒錯(cuò)，但是你不能在使用2個(gè)表示，而是用2個(gè)甚至6個(gè)字節(jié)表示。（為了英文的特權(quán)，犧牲其他語言的存儲(chǔ)空間的便利），這個(gè)編碼方式就是UTF-8。
UTF-8
utf-8（8-bit Unicode Transformation Format）是一種針對Unicode的可變長度字符編碼，又稱萬國碼。UTF-8用1到6個(gè)字節(jié)編碼UNICODE字符。用在網(wǎng)頁上可以同一頁面顯示中文簡體繁體及其它語言（如英文，日文，韓文）。
那GBK又是如何產(chǎn)生的呢？
GBK
這時(shí)候中國不干了，為啥你制定了全球大一統(tǒng)的規(guī)則，卻為了自己的便利又破壞規(guī)則，把方便留給自己不便留給別人呢？ 明明用2個(gè)字節(jié)就能表示中文一個(gè)漢字，現(xiàn)在UTF-8編碼中文竟然需要2個(gè)甚至4個(gè)字節(jié)來表示。于是中國制定一套自己的規(guī)則，于是用2個(gè)字節(jié)來表示一個(gè)漢字，總共可以覆蓋2萬多個(gè)文字。 對于英文，好吧讓一步，還保留和你UTF-8同樣的方式使用一個(gè)字節(jié)來表示。
記?。篣NICODE只是給字符一個(gè)代號，而GBK和UTF-8使用不同的規(guī)則來表示同一個(gè)代號。
網(wǎng)頁亂碼如何產(chǎn)生
下面這個(gè)流程是我們寫入文件到展示文件的簡單描述：
1、我們使用編輯器編寫 HTML 文件
2、保存編寫的HTML文件
3、使用瀏覽器打開HTML文件
4、HTML文件在瀏覽器展示
亂碼產(chǎn)生的根源就在與第2步驟和第4步。
在第2步保持文件時(shí)會(huì)把我們寫入的文字使用編輯器默認(rèn)的編碼方式進(jìn)行保存。如果大家使用的是Sublime編輯器，默認(rèn)的編碼方式是utf-8。當(dāng)然也可以安裝GBK Encoding support插件，在保存文件時(shí)可選擇保存為GBK
在第4步瀏覽器打開網(wǎng)頁時(shí)，它并不知道你的這個(gè)文件是使用什么編碼方式，于是自作主張使用了默認(rèn)解碼方式。如下圖所示，文件保存為GBK格式，在Chrome打開時(shí)默認(rèn)使用 ISO -8859的解碼方式，導(dǎo)致編碼和解碼不匹配，產(chǎn)生亂碼。
那如何規(guī)避這個(gè)問題呢？即如何通知瀏覽器用什么方式解碼呢？
首頁，在文件保存的時(shí)候你自己要清楚是用哪種編碼方式保存的（sublime默認(rèn)保存方式是utf-8，如果安裝了插件也可另存為gbk，其它IDE可以做設(shè)置保存格式）。如果你的文件是保存為utf-8格式，那么一定要在html 的 <head>
里添加<meta charset="utf-8">
，這句話的意思是告訴瀏覽器在打開這個(gè)頁面的時(shí)候不要去猜了，直接用utf-8去解碼。 同理，如果你的文件保存為gbk格式，一定在文件里添加<meta charset="gbk">
。
記住，
亂碼產(chǎn)生的根本原因是你保存的編碼格式和瀏覽器解析時(shí)的解碼格式不匹配導(dǎo)致的。
亂碼一般是英文以外的字符才會(huì)出現(xiàn)。
為啥純粹的英文不會(huì)出現(xiàn)亂碼問題，即使編碼方式和解碼方式不一致？那是因?yàn)榍懊嬷v過了 utf-8、gbk對英文都是采用1個(gè)字節(jié)的編碼方式，并且使用了相同的碼字。
