html類
1、標準模式（嚴格模式）與怪異模式（混雜模式）
相同：瀏覽器對文件的解析模式
區別：（1）標準模式是指瀏覽器按 w3c 標準解析執行**；怪異模式則是使用瀏覽器自己的方式解析執行**，因為不同瀏覽器解析執行的方式不一樣，所以我們稱之為怪異模式；
（2） 宣告位於文件的最前面，決定瀏覽器解析時到底使用標準模式還是怪異模式，dtd 宣告定義了標準文件的型別，會使瀏覽器使用標準模式解析網頁，忽略 dtd 宣告 , 將使網頁進入怪異模式。
css類
1、overflow:scroll;與overflow:auto;
相同：都用於產生滾動條
區別：引數是scroll時候，必會出現滾動條。
引數是auto時候，子元素內容大於父元素時出現滾動條。
2、display:none;與visibility:hidden;
相同：都能隱藏對應的元素，但隱藏的內容都可以用js獲取
區別：（1）display:none;會讓元素從渲染樹中消失，渲染的時候不佔據任何空間；visibility:hidden;不會讓元素從渲染樹中消失，渲染的時候仍然佔據空間，只是內容不可見。
（2）display:none;改變了dom的結構，所以產生了reflow（回流，回流會引起重繪），而visibility:hidden;沒有改變dom結構，只產生repaint（重繪）。
（3）display:none;是非繼承屬性，子孫節點消失是由於元素從渲染樹中消失造成，通過設定display:inline-block|block;均不能讓子孫節點顯示；visibility:hidden;是繼承屬性，子孫節點消失是由於繼承了hidden，通過設定visibility:visible;，可以讓子孫節點顯示。
（4）讀屏器不會讀取display:none;的元素內容，而會讀取visibility:hidden;的元素內容。
3、border:0;與border:none;
相同：邊框不顯示
區別：border:0; 被解析為 border-width:0; 表示邊框寬度為0。
border:none; 被解析為 border-style:none; 表示邊框樣式無。
（1）效能差異
在標準瀏覽器中，
border:0;瀏覽器對border-width進行渲染，占用記憶體。
border:none;瀏覽器不進行渲染，不占用記憶體。
因此border:0;比border:none;多渲染了乙個border-width:0;也就是說border:none;的效能要比border:0;高。
（2）瀏覽器相容
ie7不支援border:none;
為了少渲染border-width:0，和不占用記憶體，這裡我們寫乙個相容所有瀏覽器的最優寫法：
border：0 none；前面的0是針對ie6和ie7的相容，後面的none是針對標準瀏覽器的。
tips：請始終把border-style屬性宣告到border-color屬性之前，元素必須在改變顏色之前獲得邊框。
4、ie(6)盒子模型與標準盒子模型
相同：都包括 margin、border、padding、content（按照盒模型的圖，我理解為這裡的content指我們css裡設定的width和height，而下面的width和height指內容的預設寬高）
區別：標準盒子模型 ＝ margin + border + padding + content （content = width | height）
ie盒子模型 ＝ margin + content （content = border + padding + width | height）
5、偽元素與偽類
相同：都用於給某些選擇器新增特殊的效果
區別：偽類的效果可以通過新增乙個實際的類來達到，而偽元素的效果則需要通過新增乙個實際的元素才能達到，這也是為什麼他們乙個稱為偽類，乙個稱為偽元素的原因。
下面羅列寫常見的偽類與偽元素——
偽類種類：
偽元素種類：
tips：
css3要求對偽元素使用兩個冒號以便與偽類進行區別。但因為相容性的問題，所以現在大部分還是統一的單冒號，但是拋開相容性的問題，我們在書寫時應該盡可能養成好習慣，區分兩者。
js類
區分前端容易混淆的知識點
1 偽類與偽元素的區別 在css1與css2中沒有特別區分，但是在css3中有區分 偽類 其實就是選擇器，有兩個重要的作用如下 1 選擇dom樹以外的資訊 例如 visited，link等指的是某些指定狀態的元素 2 用簡單選擇器選擇不了的資訊 有邏輯的dom樹中的元素 例如 first child...
Web前端易混淆的一些知識
相同點 都用於瀏覽器端儲存的快取資料 不同點 儲存內容是否傳送到伺服器端 當設定了cookie後，資料會傳送到伺服器端，造成一定的寬頻浪費 storage則會將資料儲存 到本地，不會造成寬頻浪費 資料儲存大小不同 cookie資料不能超過4k，適用於會話標識 storage資料儲存可以達到5m 資料...
在前端學習道路上，容易混淆的幾個知識點！
defer 可選屬性。標識指令碼可以延遲到文件完全被解析和顯示之後再執行。只對外部指令碼檔案有效。script標籤屬性async與defer之間的區別 藍色線代表網路讀取，紅色線代表執行時間，這倆都是針對指令碼的 綠色線代表 html 解析。偽類 沒有創造元素內容，只是選中某些狀態下的已有元素，並附...