jQuery學習筆記(五)JQ複習整理

2021-08-15 07:06:13 字數 2732 閱讀 2413

jq層級選擇器

1,find

找到索引的子代

2,children

找到一級子代

3,next 找到下乙個兄弟元素

4,nextall

找到下面所有的兄弟

5,prev

找到上乙個兄弟

6,prevall

找到上面所有的兄弟

7,nextuntil 找到下面的所有兄弟,知道乙個元素為止

8,prevuntil 找到上面所有的兄弟直到乙個元素為止

9,siblings 找到所有的兄弟

基本過濾選擇器

過濾器主要通過特定的過濾規則來篩選所需要的dom元素,和css中的偽類語法相似:使用冒號(:)開頭.

:first 選取第乙個元素

:last  選取最後乙個元素

:not   選擇class不是red的元素

:even  選取索引是偶數的元素

:odd   選擇索引是奇數的元素

:eq    選擇索引等於index的元素

:gt    選擇索引大於index的元素

:lt    選擇索引小於index的元素

:header 選擇標題元素,h1-h6

:annimated 選擇正在執行動畫的元素

:focus     選擇當前誒焦點的元素

/-----------------------------/

內容html()          獲取元素中的html內容

html(value)     設定元素中的html內容

text()          獲取元素中文字內容

text(value)     獲取元素中文字內容

val()           獲取表單中的文字內容

val(value)      獲取表單中的文字內容                    

/-----------------------------/

/-----------------------------/

屬性attr();

removeattr();

/-----------------------------/

/-----------------------------/

樣式css();

addclass();

removeattr();

toggleclass();

/-----------------------------/

/-----------------------------/

設定大小

width();

height();

innerwidth();

innerheight();

outerwidth();

outerheight();

/-----------------------------/

/-----------------------------/

位置offset();

scrolltop();

/-----------------------------/

判斷li裡面是否有box,一般用於表單驗證

alert($("li").is("#box")); 

判斷li裡面是否包h1這個class,必須是class

alert($("li").hasclass("h1")); 

通過所有找出某一部分元素

$("li").slice(2,6).css("background","#ccc");

找出li中的第2-6個元素,背景色灰色

過濾出class為h1的元素

$("li").filter(".h1").css("color","red");

找到所有的兒子節點

$("ul").contents().css("color","green");

輸出標籤裡面的內容

alert($("#box").html());

獲取標籤裡面的值

alert($("#box").html());

jq的樣式操作css

addclass()      向被選元素新增乙個或多個類

removeclass()   從備選元素刪除乙個或多個類

toggleclass()   對備選元素進行新增/刪除類的切換操作

css()           設定或者返回樣式屬性

jq的節點操作

a,父子:

b,兄弟

after

before

insertafter

insertbefore

c,包裹節點

wrap

unwarp

wrapall

wrapinner

d,刪除節點

remove

detach()  保留事件

e,替換節點

replacewidth()

f,清空節點

empty()

jQuery學習筆記 五

負責解釋html和css 並在瀏覽器的視窗裡顯示 視窗就是為訪問者顯示內容的視窗 firefox使用gecko布局引擎 microsoft internet explorer 用的trident.hide show toggle 動態改變css屬性,讓頁面的變化就在使用者的眼前發生。fadein 將...

初步學習jquery學習筆記(五)

從某個標籤開始,按照某種規則移動,直到找到目標標籤為止 講解 元素是 的父元素,同時是其中所有內容的祖先。元素是 元素的父元素,同時是 的子元素 左邊的 元素是 的父元素,的子元素,同時是 的後代。元素是 的子元素,同時是 和 的後代。兩個 元素是同胞 擁有相同的父元素 右邊的 元素是的父元素,的子...

我的jQuery學習之路 筆記(五)

1,empty方法 嚴格的講,empty 方法並不是刪除節點,而是清空節點,它能清空元素中的所有後代節點 empty不能刪除自己本身這個節點 2,remove方法 該節點與節點所含的所有後代節點將同時被刪除 提供傳遞乙個篩選的表示式,用來指定刪除選中和集合中的元素 方法名引數 事件及資料是否也被移除...