四 使用jQuery操作頁面

2021-08-08 16:20:56 字數 2197 閱讀 7456

修改元素的樣式主要由兩種方法:

一、通過新增或者刪除class屬性來對元素的樣式重新設定。

二、直接給dom元素新增樣式定義

方法描述

addclass(names)為集合中的元素新增指定的樣式名

removeclass(names)jquery集合中刪除每個元素指定的樣式名

toggleclass([names][, switch])為沒有樣式的元素新增指定的樣式名,或者刪除已經存在的樣式

hasclass(name)確定集合中的元素是否包含指定的樣式

方法描述

css(name,value)css(properties)為每個匹配元素命名的css樣式屬性設定指定的值

css(name)根據指定的name查詢集合中首個元素的css屬性的計算值

width() height()設定或查詢集合中每個匹配元素的高度和寬度

方法描述

html()獲取匹配集合中第乙個元素的html內容

html(content)為匹配的元素設定傳入的html**塊內容

text()獲取匹配元素集合的每個元素的內容,包括其後代節點

text(content)設定集合中所有元素的內容為傳遞的引數值

方法描述

每個匹配或新建立的元素的內部的結尾處新增內容,主加賓

每個匹配或新建立的元素追加到指定的元素中的內部的結尾處,賓加到主

prepend()每個匹配或新建立的元素的內部的開始處插入內容

prependto()每個匹或新新建立的元素插入到指定的元素的開始處

方法描述

after()向每個匹配的元素的之後插入內容

insertafter()將每個匹配的元素插入到指定的元素之後

before()向每個匹配的元素的之前插入內容

insertbefore()將每個匹配的元素插入到指定的元素之前

方法描述

remove([selector])從頁面中刪除集合中的所有元素及其內容,包括***和存的資料,返回乙個被刪除的節點的引用

detach([selector])從頁面中刪除集合中的所有元素及其內容,但是保留***和存的資料

empty()清空節點-清空元素中的所有後代節點(不包含屬性節點)

方法描述

clone()轉殖匹配的dom元素包括子節點,返回值為轉殖後的副本,但此時複製的新節點不具備任何行為

clone(true)複製元素的同時會複製其行為,包括子節點

clone(true,false)複製元素的同時會複製其行為,但不包括子節點

方法描述

replacewith(content)將所有匹配的元素都替換為指定的htmldom元素,前面的替換成後面的

replaceall(target)顛倒了的replacewith()方法,後面的替換成前面的

方法描述

wrap()將指定節點用其他標記包裹起來,有多個單獨包裝

wrapall()將所有匹配的元素用乙個元素來包裹

wrapinner()將每乙個匹配的元素的子內容(包括文字節點)用其他結構化標記包裹起來

unwrap()刪除集合內元素的父元素

jQuery屬性操作(四)

通過閱讀jquery為屬性操作封裝的基本方法和為處理相容性問題提供的hooks,發現jquery在屬性操作方面並沒有做過多的設計,只是處理一下相容性問題,然後呼叫基礎的dom操作方法。以下是對jquery提供的基礎方法的閱讀 jquery.fn.extend 遍歷jquery物件中的所有元素,對每乙...

jquery頁面焦點動態使用

這次給大家帶來jquery頁面焦點動態使用,jquery頁面焦點動態使用的注意事項有哪些,下面就是實戰案例,一起來看一下。使用者在輸入文字時,如果能高亮顯示正在輸入的那個文字框的話,會更人性化些,下面就使用jquery來實現。實現原理 在document載入完成後 ready 新增input的foc...

使用jquery操作select

jquery獲取select選擇的text和value 語法解釋 1.select id change function 為select新增事件,當選擇其中一項時觸發 2.var checktext select id find option selected text 獲取select選擇的tex...