jQuery內(nèi)容選擇器
- :empty 找到既沒(méi)有文本內(nèi)容也沒(méi)有子元素的指定元素
- :parent 找到有文本內(nèi)容或者有子元素的指定元素
- :contains(text) 找到包含指定文本內(nèi)容的指定元素
- :has(selector) 找到包含指定子元素的指定元素
屬性和屬性節(jié)點(diǎn)
- 對(duì)象身上保存的變量就是屬性
- 操作屬性
- 對(duì)象.屬性名稱 = 值;
- 對(duì)象.屬性名稱;
- 對(duì)象["屬性名稱"] = 值;
- 對(duì)象["屬性名稱"];
- 在編寫(xiě)HTML代碼時(shí),在HTML標(biāo)簽中添加的屬性就是屬性節(jié)點(diǎn)
- 在瀏覽器中找到DOM元素之后,展開(kāi)看到的都是屬性
- 在attributes屬性中保存的所有內(nèi)容屬性節(jié)點(diǎn)
- 操作屬性節(jié)點(diǎn)
- DOM元素.setAttribute("屬性名稱","值");
- DOM元素.getAttribute("屬性名稱");
- 屬性和屬性節(jié)點(diǎn)區(qū)別
- 任何對(duì)象都有屬性,但是只有DOM對(duì)象才有屬性節(jié)點(diǎn)
jQuery屬性和屬性節(jié)點(diǎn)方法
- attr
- 獲取或者設(shè)置屬性節(jié)點(diǎn)的值
- 可以傳遞一個(gè)參數(shù),也可以傳遞兩個(gè)參數(shù)
- 如果傳遞一個(gè)參數(shù),代表獲取屬性節(jié)點(diǎn)的值,無(wú)論找到多少個(gè)元素,都只會(huì)返回第一個(gè)元素指定的屬性節(jié)點(diǎn)的值
- 如果傳遞兩個(gè)參數(shù),代表設(shè)置屬性節(jié)點(diǎn)的值,找到多少個(gè)元素就會(huì)設(shè)置多少個(gè)元素,如果設(shè)置的屬性節(jié)點(diǎn)不存在,那么系統(tǒng)會(huì)新增
- removeAttr
- 刪除所有找到元素指定的屬性節(jié)點(diǎn)
- 如果要?jiǎng)h除多個(gè)屬性節(jié)點(diǎn) 屬性名稱用空格隔開(kāi)
- prop
- 特點(diǎn)和attr方法一致
- removeProp
- 特點(diǎn)和removeAttr方法一致
- 注意點(diǎn)
- prop方法不僅能夠操作屬性,還能操作屬性節(jié)點(diǎn)
- 官方推薦在操作屬性節(jié)點(diǎn)時(shí),具有true和false兩個(gè)屬性的屬性節(jié)點(diǎn),如checked,selected或者disable使用prop(),其他的使用attr()
CSS類(lèi)
- addClass 添加一個(gè)類(lèi),如果要添加多個(gè),多個(gè)類(lèi)名之間用空格隔開(kāi)即可
- removeClass 刪除一個(gè)類(lèi),如果要?jiǎng)h除多個(gè),多個(gè)類(lèi)名之間用空格隔開(kāi)即可
- toggleClass 切換類(lèi),有就刪除,沒(méi)有就添加
jQuery文本操作
- html 和原生JS中的innerHTML一樣
- text 和原生JS中的innerText一樣
- val 和原生JS的value屬性差不多
CSS樣式
-
逐個(gè)設(shè)置
$("div").css("width","100px"); $("div").css("height","100px"); $("div").css("background","red");
-
鏈?zhǔn)皆O(shè)置(鏈?zhǔn)讲僮魅绻笥?步,建議分開(kāi))
$("div").css("width","200px").css("height","200px").css("background","blue");
-
批量設(shè)置(推薦)
$("div").css({ width:"100px", height:"100px", background:"pink", })
jQuery位置和尺寸
width/height:設(shè)置的width/height
innerWidth/innerHeight:width/height + padding
outerWidth/outerHeight:width/height + padding + 邊框
offset:獲取或者設(shè)置元素距離窗口的偏移位
position:獲取元素距離定位元素的偏移位,不能設(shè)置
-
scrollTop:獲取或者設(shè)置滾動(dòng)的偏移位
//為了保證瀏覽器的兼容,獲取網(wǎng)頁(yè)滾動(dòng)的偏移位需要按如下寫(xiě)法 console.log($("html").scrollTop() +$("body").scrollTop()); //為了保證瀏覽器的兼容,設(shè)置網(wǎng)頁(yè)滾動(dòng)的偏移位需要按如下寫(xiě)法 $("html,body").scrollTop(300);