js事件的分類
事件的類型:有鼠標事件，鍵盤事件，HTML事件，變化事件
注意：js中的事件前面要加on （如：onclick onmouseover），但jquery中的事件不需要加on 如（ [圖片上傳失敗...(image-39e6ec-1547189649195)]
("Element").mouseover ）
鼠標事件:（最常用）
click,dblclick,mousedown,,mouseupmouseout,mouseover,mousemove;
事件屬性:
type:表明是什么事件;
target(DOM)或srcElement(IE):表明觸發事件的對象;
shiftKey,ctrlKey,altKey,metaKey(DOM):是否按下了Shift,Ctrl,Alt,Meta鍵;
button:0-未按下鍵;1-按左鍵;2-按右鍵;3-同時按下左右;4-按下中鍵;5-按下左和中;6-按下右和中;7-同時按下左中右;
鍵盤事件:
keydown,keypress,keyup
事件屬性:
keyCode:按下的鍵的代碼(等于Unicode值)
charCode(DOM):鍵對應的代碼和字符會有一個分離;
target(DOM)或srcElement(IE):表明觸發事件的對象;
shiftKey,ctrlKey,altKey,metaKey(DOM):是否按下了Shift,Ctrl,Alt,Meta鍵;
HTML事件:（窗口，文檔，表單）
load,upload,abort,error,select,change,submit,reset,resize,scroll,focus,blue
與window有關的有resize窗口調大調小事件,scroll滾動事件,
JS的冒泡事件
什么是冒泡事件？
在一個對象上觸發某類事件（比如單擊onclick事件），如果此對象定義了此事件的處理程序，那么此事件就會調用這個處理程序，如果沒有定義此事件處理程序或者事件返回true，那么這個事件會向這個對象的父級對象傳播，從里到外，直至它被處理（父級對象所有同類事件都將被激活），或者它到達了對象層次的最頂層，即document對象（有些瀏覽器是window）
阻止事件冒泡的幾種方法
第一種： event.stopPropagation();
第二種： return false;
第三種： event.preventDefault();
jQuery節點操作
1、查找元素節點
$("ul li:eq()");
2、查找屬性節點
$("selector").attr("title")
3、創建節點
var ("<li></li>");
var ("<li></li>");
li_1);
4、創建文本節點、創建屬性節點
除節點，而是清空節點
2、復制節點
clone():復制節點后，被復制的新元素并不具有任何i行為
clone(true):復制元素的同時同時復制所綁定的事件
3、替換節點
replaceWith()、replaceAll():
$("p").replaceWith("<strong></strong>");
4、包裹節點
$("strong").wrap("<b></b>");warp譯為用...包裹（之前搞不清楚誰包裹誰，總是搞混，單詞不過關┭┮﹏┭┮）
<p></p>
<p></p>
<p></p>
wrapAll():$("p").wrapAll("<b></b>")——<b><p></p><p></p><p></p></b>
wrap()單獨包裹每個元素，<b><p></p></b> <b><p></p></b>
wrapInner():$("p").wrapInner("<b></b>")——<p><b></b></p>
5、屬性操作
（1）為同一個元素設置多個屬性：$('p').attr({"title":"title","name","test"});
$('p').css({"color":"red","font-style":"italy"});
=========({"鍵"："值","":"",})===========
（2）刪除屬性
$('p').removeAttr();
6、樣式操作和設置樣式
get:class:$("selector").attr("class")
set:class:$("selector").attr("class","addclass")
追加樣式：addClass(),removeClass(),
切換樣式：$().toggle(function(){//show},function(){//hide});
$().toggleClass()
判斷是否含有某個樣式
hasClass():return false/true<=>(等價于)$("selector").is(".class");
設置和過去html,文本和值
get:var selector_html=("selector")元素的html代碼
set:$("selector").html("<b></b>");
text():<=>javascript的innerText屬性：用來讀取或者設置某個元素中的文本內容
set:$("selector").html("innerText");
val():<=>javascript的value屬性
Jquery:focus() blur()
javascript:onfocus() onblur()
設置網頁中默認選中的元素
<select id="siggle"><option></option></select>
$("#single").val("");//設置列表的默認選中項
<select id="multiple"><option></option></select>
========標簽的value值=========
$("#multiple").val(["",""])//以數組形式賦值
$(":checkbox").val(["",""]);
$(":radio").val(["radio"]);
遍歷節點
children():return $("selector")的子元素集合
*children():只考慮子元素而不考慮其他后代元素
next()用于匹配元素后面緊鄰的同輩元素
pre()用于匹配元素前面緊鄰的同輩元素
siblings()用于取得匹配元素前后所有的同輩元素
closest()用于取得最近的匹配元素，如果不匹配則向上查找父元素，逐級向上直到找到匹配選擇器的元素，否則返回一個空的jquery對象
parent()、parents()、closest()的區別
parent():匹配元素的父級元素，返回一個
parents():匹配元素的祖先元素，返回多個
closest():從元素本身開始，逐級向上級元素匹配，并返回第一個最先匹配的祖先元素
CSS-DOM
獲取樣式屬性
$("selector").css("屬性鍵")//獲取值
css()設置多個樣式屬性
$("selector").css({"鍵":"值","鍵":"值",});
獲取元素的height屬性
$("selector").css("height");
$("selector").height();
一：什么是事件委托？
事件委托是利用事件冒泡，只指定一個事件處理程序來管理某一類型的所有事件。
二：為什么要用事件委托？
1.在JavaScript中添加到頁面上的事件處理程序的個數直接關系到頁面的整體運行性能。為什么呢？因為，每個事件處理函數都是對象，對象會占用內存，內存中的對象越多，性能就越差。此外，必須事先指定所有的事件處理程序而導致的DOM訪問次數，會延遲整個頁面的交互就緒時間。
2.對有很多個數據的表格以及很長的列表逐個添加事件，簡直就是噩夢。所以事件委托，能極大地提高頁面的運行性能，減少開發人員的工作量。