什麼是事件流呢
事件：事件是文件和瀏覽器視窗中發生特定互動的瞬間，當我們與瀏覽器中的web頁面進行某些型別互動的時候，事件就發生了
事件流：事件流描述的是頁面中接受事件的順序，微軟為事件冒泡，網景為事件捕獲
事件冒泡：事件開始時由最具體的元素接收，然後逐級向上傳播到較為不具體的節點
阻止事件冒泡和事件捕獲dom增刪改查e.stoppropagation 阻止冒泡 vue中是 @click.stop
e.preventdefault 阻止捕獲 vue中是 .prevent
節點查詢api
document.getelementbyid ：根據id查詢元素，大小寫敏感，如果有多個結果，只返回第乙個；
document.getelementsbyclassname ：根據類名查詢元素，多個類名用空格分隔，返回乙個 htmlcollection 。注意相容性為ie9+（含）。另外，不僅僅是document，其它元素也支援 getelementsbyclassname 方法；
document.getelementsbytagname ：根據標籤查詢元素， * 表示查詢所有標籤，返回乙個 htmlcollection 。
document.getelementsbyname ：根據元素的name屬性查詢，返回乙個 nodelist 。
document.queryselector ：返回單個node，ie8+
(含），如果匹配到多個結果，只返回第乙個。
document.queryselectorall ：返回乙個 nodelist ，ie8+
(含）。
document.forms ：獲取當前頁面所有form，返回乙個 htmlcollection ；
1.
createelement
() 建立標籤
2.createtextnode
() 建立文字
3.createdocumentfragment
() 建立文件碎片,所有的操作是在記憶體中進行的
為了避免重繪和回流：咱們插入dom時可採用createdocumentfragment，最後一次性的再新增到頁面的dom中
//先建立li，然後插入到ul中
var oul=document.
queryselector
('.list'
)//先建立乙個文件碎片
var fragment=document.
createdocumentfragment()
;for
(var i=
0;i<
100;i++)`
fragment.
(newli)
//已經將100個li新增到fragment上了
} oul.
(fragment);4.
clonenode
(true
) 轉殖 //新增true代表深度轉殖，包括子節點的所有內容也可以轉殖過來
例如：//需求：建立乙個div，並新增文字，追加到頁面上
var odiv=document.
createelement
('div');
var otext=document.
createtextnode
('1906a'
)odiv.
(otext)
;//再將div追加到body上
document.body.
(odiv)
parent.
removechild
(child)，刪除元素必須知道其父元素
"div1" style=
'background:pink'
>
"p1"
>這是乙個段落。<
/p>
"p2"
>這是另外乙個段落。<
/p>
<
/div>
var parent = document.
getelementbyid
("div1");
var child = document.
getelementbyid
("p1");
parent.
removechild
(child)
;<
/script>
父節點.
(子節點) 尾追加
父節點.
insertbefore
(新節點,參考節點) 前追加
父級節點.
removechild
(要刪除的子級節點) 移除節點
replacechild
(新節點，舊節點) 替換節點
getelementbyid
() 獲取id ，如果頁面上有多個相同id，只返回第乙個
getelementsbytagname
() 獲取標籤名 返回是類陣列
getelementsbyname
() 獲取表單中name名稱 返回類陣列
getelementsbyclassname 只能獲取class名稱 返回類陣列
queryselector 只獲取匹配的第乙個css選擇器 //特別適合移動端
queryselectorall 獲取匹配的css選擇器類陣列 //特別適合移動端
//封裝乙個$
function $(selector)
DOM操作 JS事件 節點增刪改查
習慣是社會的巨大的飛輪和最可貴的維護者。威 詹姆斯 day 49 value屬性操作 節點的增刪改查 一 展示 刪除節點 歡迎刪除,聖誕快樂 替換節點 p.innerhtml 深圳歡迎您 舊節點 let title document.getelementsbyclassname title 0 pe...
JS的DOM操作（增刪改查）
1.通過id屬性獲取乙個元素節點物件 document.getelementbyid id1 2.通過name屬性獲取一組元素節點物件 document.getelementsbyname name1 3.通過標籤名獲取一組元素節點物件 document.getelementsbytagname l...
dom增刪改查
一 建立節點 document.createelement tag tag必須是合法的 html 元素二 dom新增 刪除節點的方法 將newnode新增成當前節點的最後乙個子節點 insertbefore newnode,refnode 將refnode 節點之前插入 newnode 節點repl...