1、清除浮動有哪些方式？比較好的方式是哪一種？

  1. 父級div定義height
  2. 結尾處加空div標籤clear:both
  3. 父級div定義偽類:after和zoom
  4. 父級div定義overflow:hidden
  5. 父級div定義overflow:auto
  6. 父級div也浮動，需要定義寬度
  7. 父級div定義display:table
  8. 結尾處加br標籤clear:both

比較好的是第3種方式，好多網站都這麼用。

2、box-sizing常用的屬性有哪些？分別有什麼作用？

box-sizing:content-box|border-box|inherit;

  1. content-box:寬度和高度分別應用到元素的內容框。在寬度和高度之外繪製元素的內邊距和邊框（元素默認效果）
  2. border-box:元素指定的任何內邊距和邊框都將在已經設定的寬度和高度內進行繪製。通過從已經設定的寬度和高度分別減去邊框和內邊距才能得到內容的寬度和高度。

3、HTML5 為什麼只需要寫 <!DOCTYPE HTML>？

  1. HTML5不基於SGML，因此不需要對DTD進行引用，但是需要DOCTYPE來規範瀏覽器的行為（讓瀏覽器按照它們應該的方式來運行）。
  2. 而HTML4.0基於SGML，所以需要對DTD進行引用，才能告知瀏覽器文檔所使用的文檔類型。

4、介紹一下對瀏覽器內核的理解

主要分成兩部分：渲染引擎和JS引擎。

  1. 渲染引擎（Layout Engineer或Rendering Engine）：負責取得網頁的內容（HTML、XML、圖像等等）整理信息（例如加入CSS等等），以及計算網頁的顯示方式，然後會輸出至顯示器或印表機，瀏覽器的內核不同，對於網頁的語法解釋也會有所不同，所以渲染的效果也會不同，所有網頁瀏覽器，電子郵件客戶端以及其他需要編輯、顯示網路內容的應用程序都需要內核。
  2. JS引擎（能夠將 Javascript代碼處理並執行的運行環境）：解析和執行JavaScript來實現網頁的動態效果。最開始渲染引擎和JS引擎並沒有區分的很明確，後來JS引擎越來越獨立，內核就傾向於只指渲染引擎。

5、簡述一下HTML語義化的理解

用正確的標籤寫正確的代碼。

  1. HTML語義化讓頁面的內容結構化，結構更清晰，便於對瀏覽器、搜索引擎解析；
  2. 即使在沒有樣式CSS的情況下也可以以一種文檔格式顯示，並且是容易閱讀的；
  3. 搜索引擎的爬蟲也依賴於HTML標記來確定上下文和各個關鍵字的權重，利於SEO；
  4. 便於閱讀源代碼的人對網站更容易將網站分塊，便於閱讀維護理解。

6、HTML5有哪些新特性？如何處理HTML5新標籤的瀏覽器兼容問題？如何區分 HTML 和 HTML5？

HTML5現在已經不是SGML的子集，主要是關於圖像，位置，存儲，多任務等功能的增加。

  1. 繪畫Canvas
  2. 用於媒體介紹回訪的video和audio元素
  3. 本地離線存儲localStorage長期存儲數據，瀏覽器關閉後數據不丟失
  4. SessionStorage的數據在瀏覽器關閉後自動刪除
  5. 語義化更好的內容元素，比如article、footer、header、nav、section
  6. 表單控制項，calendar、date、time、email、url、search
  7. 新的技術webworker、websocket、Geolocation

IE8/IE7/IE6支持通過Document.createElement方法產生的標籤，可以利用這一特性讓這些瀏覽器支持HTML5新標籤，瀏覽器支持新標籤後，還需要添加標籤的默認樣式。

當然也可以直接使用成熟的框架，比如Html5Shim

<!--[if lt IE 9]>
<![endif]-->

7、JS有哪些內置對象？

JS的全稱為JavaScript（JavaScript一種直譯式腳本語言，是一種動態類型、弱類型、基於原型的語言，內置支持類型。它的解釋器被稱為JavaScript引擎，為瀏覽器的一部分，廣泛用於客戶端的腳本語言，最早是在HTML（標準通用標記語言下的一個應用）網頁上使用，用來給HTML網頁增加動態功能）

數據封裝類對象

Object、Array、Boolean、Number和String

其他對象

Function、Arguments、Math、Date、RegExp、Error

8、eval是做什麼的？

我們在做開發的時候盡量避免使用eval函數，它的功能是把對應的字元串解析成JS代碼並執行，這對於網站來說是不安全的，而且非常消耗伺服器的性能當遇到一個eval函數時，它會執行兩次，一次解析成JS語句，一次用於執行。

由JSON字元串轉換為JSON對象的時候可以用eval

var obj=eval（(+ Str +)）

9、DOM怎樣添加、移除、移動、複製、創建和查找節點

創建新節點

createDocumentFragment() //創建一個DOM片段
createElement() //創建一個具體的元素
craeteTextNode() //創建一個文本節點

添加、移除、替換、插入

appendChild() //添加一個新的節點
removeChild() //移除一個節點
replaceChild() //替換對應的節點
insertBefore() //在已有的節點前插入一個新的節點

查找

getElementsByTagName() //方法可返回帶有指定標籤名的對象的集合
getElementsByName() //通過元素的Name屬性的值(IE容錯能力較強，會得到一個數組，其中包括ID等於Name值)
getElementByiD() //方法可返回對擁有指定 ID 的第一個對象的引用

10、new操作符具體幹了什麼呢?

  1. 創建一個空對象，並且this變數引用該對象，同時還繼承了該函數的原型
  2. 屬性和方法被加入到this引用的對象中
  3. 新創建的對象由this所引用，並且最後隱式的返回this

11、call() 和 apply() 的區別和作用？

apply()函數有兩個參數：第一個參數是上下文，第二個參數是參數組成的數組。如果上下文是null，則使用全局對象代替。

例如:

fucntion.apply(this,[1,2,3]);

call()的第一個參數是上下文，後續是實例傳入的參數序列。

例如:

function.call(this,1,2,3);

12、null和undefined的區別？

null是一個表示"無"的對象，轉換數值時為0；undefined是一個表示"無"的原始值，轉換數值時為NaN。

undefined：

  1. 當變數被聲明了，但沒有賦值時，就等於undefined
  2. 調用函數時，應該提供的參數沒有提供，該參數就等於undefined
  3. 對象沒有賦值的屬性，該屬性的值為undefined
  4. 函數沒有返回值時，默認返回undefined

null：

  1. 作為函數的參數，表示該函數的參數不是對象
  2. 作為對象原型鏈的終點

推薦閱讀：

相关文章