js基礎

1.javaScript的數據類型有什么

基本數據類型：Undefined、Null、Boolean、Number、String

復雜數據類型：object，array，function

區別：基本數據類型把數據名和值直接存儲在棧當中；復雜數據類型在棧中存儲數據名和一個堆的地址，在堆中存儲屬性及值，訪問時先從棧中獲取地址，再到堆中拿出相應的值

2.檢測數據類型有什么方法

typeof

typeof xxx得到的值有以下幾種類型：undefined boolean number string object function、symbol ，比較簡單，不再一一演示了。

這里需要注意的有三點：

typeof null結果是object ，實際這是typeof的一個bug，null是原始值，非引用類型

typeof [1, 2]結果是object，結果中沒有array這一項，引用類型除了function其他的全部都是object

typeof Symbol() 用typeof獲取symbol類型的值得到的是symbol，這是 ES6 新增的知識點

instanceof

用于實例和構造函數的對應。例如判斷一個變量是否是數組，使用typeof無法判斷，但可以使用[1, 2] instanceof Array來判斷。因為，[1, 2]是數組，它的構造函數就是Array。

同理：

functionFoo(name) {

????this.name = name

?}

var foo =newFoo('bar’)

console.log(foo instanceof Foo) // true

3.介紹js有哪些內置對象？

Object 是 JavaScript 中所有對象的父對象?

數據封裝類對象：Object、Array、Boolean、Number 和 String?

其他對象：Function、Arguments、Math、Date、RegEx、Error

4.如何區分數組和對象？

（1）從原型入手，Array.prototype.isPrototypeOf(obj); ?利用isPrototypeOf()方法，判定Array是不是在obj的原型鏈中，如果是，則返回true,否則false。Array.prototype.isPrototype([]) //true?

（2）也可以從構造函數入手，利用對向的constructor屬性?

（3）根據對象的class屬性(類屬性)，跨原型鏈調用toString()方法。Object.prototype.toString.call(Window);?

（4）Array.isArray()方法。

5.null，undefined 的區別？

null ? ? ? ?表示一個對象被定義了，值為“空值”；?

undefined ? 表示不存在這個值。?

typeof undefined ? ? ? ? ? ? ? ? ? ? ?//"undefined"?

undefined :是一個表示"無"的原始值或者說表示"缺少值"，就是此處應該有一個值，但是還沒有定義。當嘗試讀取時會返回 undefined；?

例如變量被聲明了，但沒有賦值時，就等于undefined

typeof null ? ? ? ?//"object"?

null : 是一個對象(空對象, 沒有任何屬性和方法)；?

例如作為函數的參數，表示該函數的參數不是對象；

注意：

在驗證null時，一定要使用　=== ，因為 == 無法分別 null 和　undefined?

undefined表示"缺少值"，就是此處應該有一個值，但是還沒有定義。典型用法是：?

1）變量被聲明了，但沒有賦值時，就等于undefined。?

2) 調用函數時，應該提供的參數沒有提供，該參數等于undefined。?

3）對象沒有賦值的屬性，該屬性的值為undefined。?

4）函數沒有返回值時，默認返回undefined。

null表示"沒有對象"，即該處不應該有值。

典型用法是：?

1） 作為函數的參數，表示該函數的參數不是對象。?

2） 作為對象原型鏈的終點。

6.聲明變量和聲明函數的提升有什么區別?

(1) 變量聲明提升：變量申明在進入執行上下文就完成了。?

只要變量在代碼中進行了聲明，無論它在哪個位置上進行聲明， js引擎都會將它的聲明放在范圍作用域的頂部；?

(2) 函數聲明提升：執行代碼之前會先讀取函數聲明，意味著可以把函數申明放在調用它的語句后面。?

只要函數在代碼中進行了聲明，無論它在哪個位置上進行聲明， js引擎都會將它的聲明放在范圍作用域的頂部；?

(3) 變量or函數聲明：函數聲明會覆蓋變量聲明，但不會覆蓋變量賦值。?

同一個名稱標識a，即有變量聲明var a，又有函數聲明function a() {}，不管二者聲明的順序，函數聲明會覆蓋變量聲明，也就是說，此時a的值是聲明的函數function a() {}。注意：如果在變量聲明的同時初始化a，或是之后對a進行賦值，此時a的值變量的值。

var a;

var c = 1;

a = 1;

function a() {

????????return true;

}

console.log(a);

原型，原型鏈

1.JavaScript原型，原型鏈 ? 有什么特點？

原型

每個對象都會在其內部初始化一個屬性，就是prototype(原型)?

使用hasOwnProperty() 可以判斷這個屬性是不是對象本身的屬性

問題：Javascript中，有一個函數，執行時對象查找時，永遠不會去查找原型，這個函數是？

hasOwnProperty?

javaScript中hasOwnProperty函數方法是返回一個布爾值，指出一個對象是否具有指定名稱的屬性。此方法無法檢查該對象的原型鏈中是否具有該屬性；該屬性必須是對象本身的一個成員。

使用方法：?

object.hasOwnProperty(proName)?

其中參數object是必選項。一個對象的實例。?

proName是必選項。一個屬性名稱的字符串值。

如果 object 具有指定名稱的屬性，那么JavaScript中hasOwnProperty函數方法返回 true，反之則返回 false。

原型鏈

當我們在訪問一個對象的屬性時，如果這個對象內部不存在這個屬性，那么他就會去prototype里找這個屬性，這個prototype又會有自己的prototype，于是就這樣一直找下去，找到Object.__proto__為止，找不到就返回unde也就是我們平時所說的原型鏈的概念。?

關系：instance.constructor.prototype = instance.__proto__?

特點：?

JavaScript對象是通過引用來傳遞的，我們創建的每個新對象實體中并沒有一份屬于自己的原型副本。當我們修改原型時，與之相關的對象也會繼承這一改變。?

當我們需要一個屬性的時，Javascript引擎會先看當前對象中是否有這個屬性， 如果沒有的話，就會查找他的Prototype對象是否有這個屬性，如此遞推下去，一直檢索到 Object 內建對象。

所有的引用類型（數組、對象、函數），都具有對象特性，即可自由擴展屬性（null除外）?

所有的引用類型（數組、對象、函數），都有一個__proto__屬性，屬性值是一個普通的對象?

所有的函數，都有一個prototype屬性，屬性值也是一個普通的對象?

所有的引用類型（數組、對象、函數），__proto__屬性值指向它的構造函數的prototype屬性值

原型鏈中的this

所有從原型或更高級原型中得到、執行的方法，其中的this在執行時，就指向了當前這個觸發事件執行的對象。

閉包

閉包的形成與變量的作用域以及變量的生存周期有密切的關系

1.變量的作用域

在js中我們把作用域分為全局作用域和局部作用域，全局作用域就是window，在沒有塊級作用域概念的時候，每一個函數都是一個局部作用域。

其實變量的作用域，就說指變量的有效范圍。我們最長說的就是在函數中聲明的變量作用域。

當在函數中聲明一個變量的時候，如果改變量沒有用var關鍵字去定義那么該變量就是一個全局變量，但是這樣做最容易造成命名沖突。

另一種情況就是使用var聲明的變量，這時候的變量就是局部變量，只有在該函數內部可以訪問，在函數外面是訪問不到的

在javascript中，函數可以用來創造函數作用域。在函數中搜索變量的時候，如果該函數當中沒有這個變量，那么這次搜索過程會隨著代碼執行環境創建的作用域鏈往外層逐層搜索，一直搜索到window對象為止，找不到就會拋出一個為定義的錯誤。而這種從內到外逐層查找的關系在js中我們稱為作用域鏈

2.變量的生存周期

除了變量作用域之外，另外一個跟閉包有關的概念就是變量的生存周期，對于全局變量來說，全局變量的生存周期是永久的，除非我們主動銷毀這個全局變量，而對于函數內部的使用var聲明的變量來說，當退出函數是，這些變量就會隨著函數的結束而銷毀。

3.閉包的形成

Javascript允許使用內部函數，可以將函數定義和函數表達式放在另一個函數的函數體內。而且，內部函數可以訪問它所在的外部函數聲明的局部變量、參數以及聲明的其他內部函數。當其中一個這樣的內部函數在包含它們的外部函數之外被調用時，就會形成閉包。常見的閉包寫法就是簡單的函數套函數，通過另一個函數訪問這個函數的局部變量,利用閉包可以突破作用域鏈，將函數內部的變量和方法傳遞到外部，延續變量的生命。使用閉包可以減少全局環境的污染，也可用延續變量的生命。

4.閉包的適用場景

閉包的適用場景非常廣泛，首先從閉包的優點出發就是：?

減少全局環境的污染生成獨立的運行環境

模塊化就是利用這個特點對不同的模塊都有自己獨立的運行環境，不會和全局沖突，模塊和模塊之間通過拋出的接口進行依賴使用?

以及像我們常用的jquery類庫（避免和全局沖突使用閉包實現自己獨立的環境）

可以通過返回其他函數的方式突破作用域鏈

可以利用這個功能做一些值的緩存工作，例如常見的設計模式（單例模式），以及現在比較火的框架vue中的計算屬性

其實當遇到以下場景的時候都可以使用閉包?

1) 維護函數內的變量安全,避免全局變量的污染。?

2) 維持一個變量不被回收。?

3) 封裝模塊

5.閉包的缺點

由于閉包會使得函數中的變量都被保存在內存中，內存消耗很大。所以在閉包不用之后，將不使用的局部變量刪除，使其被回收。在IE中可能導致內存泄露，即無法回收駐留在內存中的元素，這時候需要手動釋放。

6.內存泄露

內存泄漏指一塊被分配的內存既不能使用，又不能回收，直到瀏覽器進程結束。

出現原因：

1) 循環引用：含有DOM對象的循環引用將導致大部分當前主流瀏覽器內存泄露。循環 引用，簡單來說假如a引用了b,b又引用了a,a和b就構成了循環引用。?

2) JS閉包：閉包，函數返回了內部函數還可以繼續訪問外部方法中定義的私有變量。?

3) Dom泄露，當原有的DOM被移除時，子結點引用沒有被移除則無法回收。

7.JavaScript垃圾回收機制

Javascript中，如果一個對象不再被引用，那么這個對象就會被GC(garbage collection)回收。如果兩個對象互相引用，而不再被第3者所引用，那么這兩個互相引用的對象也會被回收。垃圾回收不是時時的，因為其開銷比較大，所以垃圾回收器會按照固定的時間間隔周期性的執行。

函數a被b引用，b又被a外的c引用，這就是為什么函數a執行后不會被回收的原因。

8.垃圾回收的兩個方法：

標記清除法：

1) 垃圾回收機制給存儲在內存中的所有變量加上標記，然后去掉環境中的變量以及被環境中變量所引用的變量（閉包）。?

2) 操作1之后內存中仍存在標記的變量就是要刪除的變量，垃圾回收機制將這些帶有標記的變量回收。

引用計數法：

1) 垃圾回收機制給一個變量一個引用次數，當聲明了一個變量并將一個引用類型賦值給該變量的時候這個值的引用次數就加1。?

2) 當該變量的值變成了另外一個值，則這個值得引用次數減1。?

3) 當這個值的引用次數變為0的時候，說明沒有變量在使用，垃圾回收機制會在運行的時候清理掉引用次數為0的值占用的空間。

JS運行機制

JavaScript引擎是單線程運行的,瀏覽器無論在什么時候都只且只有一個線程在運行JavaScript程序.瀏覽器的內核是多線程的，它們在內核制控下相互配合以保持同步，一個瀏覽器至少實現三個常駐線程：javascript引擎線程，GUI渲染線程，瀏覽器事件觸發線程。這些異步線程都會產生不同的異步的事件.

1) javascript引擎是基于事件驅動單線程執行的，JS引擎一直等待著任務隊列中任務的到來，然后加以處理，瀏覽器無論什么時候都只有一個JS線程在運行JS程序。

2) GUI渲染線程負責渲染瀏覽器界面，當界面需要重繪（Repaint）或由于某種操作引發回流(reflow)時,該線程就會執行。但需要注意 GUI渲染線程與JS引擎是互斥的，當JS引擎執行時GUI線程會被掛起，GUI更新會被保存在一個隊列中等到JS引擎空閑時立即被執行。

3) 事件觸發線程，當一個事件被觸發時該線程會把事件添加到待處理隊列的隊尾，等待JS引擎的處理。這些事件可來自JavaScript引擎當前執行的代碼塊如setTimeOut、也可來自瀏覽器內核的其他線程如鼠標點擊、AJAX異步請求等，但由于JS的單線程關系所有這些事件都得排隊等待JS引擎處理。（當線程中沒有執行任何同步代碼的前提下才會執行異步代碼）

當程序啟動時, 一個進程被創建，同時也運行一個線程, 即為主線程，js的運行機制為單線程

程序中跑兩個線程，一個負責程序本身的運行，作為主線程； 另一個負責主線程與其他線程的的通信，被稱為“Event Loop 線程" 。每當遇到異步任務，交給 EventLoop 線程，然后自己往后運行，等到主線程運行完后，再去 EventLoop 線程拿結果。

1）所有任務都在主線程上執行，形成一個執行棧（execution context stack）。

2）主線程之外，還存在一個"任務隊列"（task queue）。系統把異步任務放到"任務隊列"之中，然后繼續執行后續的任務。

3）一旦"執行棧"中的所有任務執行完畢，系統就會讀取"任務隊列"。如果這個時候，異步任務已經結束了等待狀態，就會從"任務隊列"進入執行棧，恢復執行。

4）主線程不斷重復上面的第三步。

"回調函數"（callback），就是那些會被主線程掛起來的代碼。異步任務必須指定回調函數，當異步任務從"任務隊列"回到執行棧，回調函數就會執行。"任務隊列"是一個先進先出的數據結構，排在前面的事件，優先返回主線程。主線程的讀取過程基本上是自動的，只要執行棧一清空，"任務隊列"上第一位的事件就自動返回主線程。

主線程從"任務隊列"中讀取事件，這個過程是循環不斷的，所以整個的這種運行機制又稱為Event Loop。

從主線程的角度看，一個異步過程包括下面兩個要素：

發起函數(或叫注冊函數)A

回調函數callbackFn

它們都是在主線程上調用的，其中注冊函數用來發起異步過程，回調函數用來處理結果。

異步進程有:

類似onclick等，由瀏覽器內核的DOM binding模塊處理，事件觸發時，回調函數添加到任務隊列中；

setTimeout等，由瀏覽器內核的Timer模塊處理，時間到達時，回調函數添加到任務隊列中；

Ajax，由瀏覽器內核的Network模塊處理，網絡請求返回后，添加到任務隊列中。

例如setTimeout(fn, 1000)，其中的setTimeout就是異步過程的發起函數，fn是回調函數。用一句話概括：工作線程將消息放到消息隊列，主線程通過事件循環過程去取消息。

消息隊列：消息隊列是一個先進先出的隊列，它里面存放著各種消息。

事件循環：事件循環是指主線程重復從消息隊列中取消息、執行的過程。

流程如下:

1) 主線程讀取js代碼, 形成相應的堆和執行棧, 執行同步任務

2) 當主線程遇到異步任務,，指定給異步進程處理, 同時繼續執行同步任務

3) 當異步進程處理完畢后， 將相應的異步任務推入到任務隊列首部

4) 主線程任務處理完畢后,，查詢任務隊列，則取出一個任務隊列推入到主線程的執行棧

5) 重復執行第2、3、4步，這就稱為事件循環

JS-Web-API 知識點與高頻考題解析

BOM

BOM（瀏覽器對象模型）是瀏覽器本身的一些信息的設置和獲取，例如獲取瀏覽器的寬度、高度，設置讓瀏覽器跳轉到哪個地址。?

navigator：?獲取瀏覽器特性（即俗稱的UA）然后識別客戶端?

location：?獲取網址、協議、path、參數、hash 等?

history： 操作瀏覽器的歷史紀錄，（前進，后退等功能）

1.什么是window對象? 什么是document對象?

window:它是一個頂層對象,而不是另一個對象的屬性，即瀏覽器的窗口。?

document:代表整個HTML 文檔,可用來訪問頁面中的所有元素?

Window 對象表示當前瀏覽器的窗口，是JavaScript的頂級對象。我們創建的所有對象、函數、變量都是 Window 對象的成員。?

Window 對象的方法和屬性是在全局范圍內有效的。?

Document 對象是 HTML 文檔的根節點與所有其他節點（元素節點，文本節點，屬性節點, 注釋節點）?

Document 對象使我們可以通過腳本對 HTML 頁面中的所有元素進行訪問?

Document 對象是 Window 對象的一部分，可通過 window.document 屬性對其進行訪問

2.事件是？IE與火狐的事件機制有什么區別？ 如何阻止冒泡？

1) 我們在網頁中的某個操作（有的操作對應多個事件）。例如：當我們點擊一個按鈕就會產生一個事件。是可以被 JavaScript 偵測到的行為。?

2) 事件處理機制：IE是事件冒泡、Firefox同時支持兩種事件模型，也就是：捕獲型事件和冒泡型事件；?

3) ev.stopPropagation();（舊ie的方法 ev.cancelBubble = true;）

3.解釋一下事件代理

事件代理的原理其實就和作用域鏈的原理差不多，但是事件代理是利用事件的冒泡原理來實現的，事件代理就是通過給祖先元素添加事件，通過事件目標對象開始向上查找找到匹配的子節點為止，如果找不到則到綁定事件的那個祖先元素為止，找到了就觸發事件，并且可以通過js中call和apply來改變觸發事件函數中的this為當前綁定節點，也是通過一層一層逐層向上的方式進行匹配查找而觸發對應事件，好處就是可以使后添加的dom元素也同樣有之前存在元素的事件，jquery中可以使用on，delegate，live實現的，不過在jquery1.7版本以后吧live給廢除了，原因就是live綁定事件的祖先元素是整個html頁面的根節點，所以性能消耗比較大，在后邊的版本中給刪除了，使用on，delegate代替

優點：

使代碼簡潔?

減少瀏覽器的內存占用

缺點：

使用不當會造成事件在不應該觸發時觸發

function? bindEvent (elem, type, selector, fn) {

? ??????// 這樣處理，可接收兩種調用方式?bindEvent(div1, 'click', 'a', function () {...}) 和bindEvent(div1, 'click', function () {...}) 這兩種?

? ??????if(fn ==null) {

? ???????????fn = selector

? ???????????selector =null

? ??????}

? ??????// 綁定事件?

? ??????elem.addEventListener(type,function(e){

? ??????????var target

? ??????????if(selector) {

? ??????????????// 有 selector 說明需要做事件代理

? ???????????????// 獲取觸發時間的元素，即?

? ??????????????e.target target = e.target

? ??????????????// 看是否符合 selector 這個條件?

? ??????????????if(target.matches(selector)) {

? ???????????????????fn.call(target, e)

? ???????????????}

? ??? ? ? ???}else{

? ??????????????// 無 selector ，說明不需要事件代理

? ???????????????fn(e)

? ???????????}

? ???????})

? ???}

? ??// 使用代理，bindEvent 多一個 'a' 參數

?? ??var div1 =document.getElementById('div1')?

? ??bindEvent(div1,'click','a',function(e){

? ??????console.log(this.innerHTML)?

? ??})

? ??// 不使用代理?

? ??var a =document.getElementById('a1')?

? ??bindEvent(div1,'click',function(e){

? ??????console.log(a.innerHTML)

? ???})

4.offsetWidth/offsetHeight,clientWidth/clientHeight與scrollWidth/scrollHeight的區別

offsetWidth/offsetHeight返回值包含content + padding + border，效果與e.getBoundingClientRect()相同?

clientWidth/clientHeight返回值只包含content + padding，如果有滾動條，也不包含滾動條?

scrollWidth/scrollHeight返回值包含content + padding + 溢出內容的尺寸

5.focus/blur與focusin/focusout的區別與聯系

focus/blur不冒泡，focusin/focusout冒泡?

focus/blur兼容性好，focusin/focusout在除FireFox外的瀏覽器下都保持良好兼容性，如需使用事件托管，可考慮在FireFox下使用事件捕獲elem.addEventListener('focus', handler, true)

可獲得焦點的元素：

window?

鏈接被點擊或鍵盤操作?

表單空間被點擊或鍵盤操作?

設置tabindex屬性的元素被點擊或鍵盤操作

6.mouseover/mouseout與mouseenter/mouseleave的區別與聯系

mouseover/mouseout是標準事件，所有瀏覽器都支持；mouseenter/mouseleave是IE5.5引入的特有事件后來被DOM3標準采納，現代標準瀏覽器也支持?

mouseover/mouseout是冒泡事件；mouseenter/mouseleave不冒泡。需要為多個元素監聽鼠標移入/出事件時，推薦mouseover/mouseout托管，提高性能?

標準事件模型中event.target表示發生移入/出的元素,vent.relatedTarget對應移出/如元素；在老IE中event.srcElement表示發生移入/出的元素，event.toElement表示移出的目標元素，event.fromElement表示移入時的來源元素

7.介紹DOM0，DOM2，DOM3事件處理方式區別

DOM0級事件處理方式：

btn.onclick = func;?

btn.onclick = null;

DOM2級事件處理方式：

btn.addEventListener('click',func,false);

btn.removeEventListener('click',func,false);

btn.attachEvent("onclick",func);

btn.detachEvent("onclick",func);

DOM3級事件處理方式：

eventUtil.addListener(input, "textInput", func);?

eventUtil 是自定義對象，textInput 是DOM3級事件

8.事件的三個階段

捕獲、目標、冒泡

js的冒泡(Bubbling Event)和捕獲(Capture Event)的區別

冒泡型事件：事件按照從最特定的事件目標到最不特定的事件目標(document對象)的順序觸發。?

捕獲型事件(event capturing)：事件從最不精確的對象(document 對象)開始觸發，然后到最精確(也可以在窗口級別捕獲事件，不過必須由開發人員特別指定)。?

DOM事件流：同時支持兩種事件模型：捕獲型事件和冒泡型事件，但是，捕獲型事件先發生。兩種事件流會觸及DOM中的所有對象，從document對象開始，也在document對象結束。

事件捕獲

當你使用事件捕獲時，父級元素先觸發，子級元素后觸發，即div先觸發，p后觸發。

事件冒泡

當你使用事件冒泡時，子級元素先觸發，父級元素后觸發，即p先觸發，div后觸發。

阻止冒泡

在W3c中，使用stopPropagation（）方法

在IE下設置cancelBubble = true；

在捕獲的過程中stopPropagation（）；后，后面的冒泡過程也不會發生了。

阻止捕獲

阻止事件的默認行為，例如click?后的跳轉

在W3c中，使用preventDefault（）方法；

在IE下設置window.event.returnValue = false;

9.介紹事件“捕獲”和“冒泡”執行順序和事件的執行次數？

按照W3C標準的事件：首是進入捕獲階段，直到達到目標元素，再進入冒泡階段?

事件執行次數（DOM2-addEventListener）：元素上綁定事件的個數?

注意1：前提是事件被確實觸發?

注意2：事件綁定幾次就算幾個事件，即使類型和功能完全一樣也不會“覆蓋”?

事件執行順序：判斷的關鍵是否目標元素?

非目標元素：根據W3C的標準執行：捕獲->目標元素->冒泡（不依據事件綁定順序）?

目標元素：依據事件綁定順序：先綁定的事件先執行（不依據捕獲冒泡標準）?

最終順序：父元素捕獲->目標元素事件1->目標元素事件2->子元素捕獲->子元素冒泡->父元素冒泡?

注意：子元素事件執行前提 事件確實“落”到子元素布局區域上，而不是簡單的具有嵌套關系?

在一個DOM上同時綁定兩個點擊事件：一個用捕獲，一個用冒泡。事件會執行幾次，先執行冒泡還是捕獲？

該DOM上的事件如果被觸發，會執行兩次（執行次數等于綁定次數）?

如果該DOM是目標元素，則按事件綁定順序執行，不區分冒泡/捕獲?

如果該DOM是處于事件流中的非目標元素，則先執行捕獲，后執行冒泡

10.window.onload 和 document.DOMContentLoaded ?(注：$(document).ready()) ?的區別？

一般情況下，DOMContentLoaded事件要在window.onload之前執行，當DOM樹構建完成的時候就會執行DOMContentLoaded事件，而window.onload是在頁面載入完成的時候，才執行，這其中包括圖片等元素。大多數時候我們只是想在DOM樹構建完成后，綁定事件到元素，我們并不需要圖片元素，加上有時候加載外域圖片的速度非常緩慢。

DOM

講 DOM 先從 HTML 講起，講 HTML 先從 XML 講起。XML 是一種可擴展的標記語言，所謂可擴展就是它可以描述任何結構化的數據，它是一棵樹！

1.documen.write和 innerHTML的區別

document.write只能重繪整個頁面?

innerHTML可以重繪頁面的一部分

2.DOM操作——怎樣添加、移除、移動、復制、創建和查找節點?

1）創建新節點

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

2）添加、移除、替換、插入

appendChild()removeChild()replaceChild()insertBefore()//在已有的子節點前插入一個新的子節點

3）查找

getElementsByTagName()//通過標簽名稱 getElementsByName()//通過元素的Name屬性的值(IE容錯能力較強，會得到一個數組，其中包括id等于name值的) getElementById()//通過元素Id，唯一性

3.attribute和property的區別是什么？

attribute是dom元素在文檔中作為html標簽擁有的屬性；?

property就是dom元素在js中作為對象擁有的屬性。?

所以：?

對于html的標準屬性來說，attribute和property是同步的，是會自動更新的，?

但是對于自定義的屬性來說，他們是不同步的，

4.src和href的區別

src用于替換當前元素，href用于在當前文檔和引用資源之間確立聯系。?

src是source的縮寫，指向外部資源的位置，指向的內容將會嵌入到文檔中當前標簽所在位置；在請求src資源時會將其指向的資源下載并應用到文檔內，當瀏覽器解析到該元素時，會暫停其他資源的下載和處理，直到將該資源加載、編譯、執行完畢，圖片和框架等元素也如此，類似于將所指向資源嵌入當前標簽內。這也是為什么將js腳本放在底部而不是頭部。?

Src source,指向外部資源的位置,如果我們添加瀏覽器會暫停其他資源的下載和處理,直到該資源加載,編譯,執行完畢(圖片和框架也是如此),這也就是為什么js腳本要放在底部。?

src用于替換當前元素,href用于在當前文檔和引入資源之間建立聯系。