jQuery對元素的操作,對頁面節點的操作

2021-10-24 18:44:34 字數 2485 閱讀 2587

1.獲取指定屬性名的元素屬性:

$(selector).attr(name)

2.設定元素的屬性值,key為屬性名稱,value為屬性值

$(selector).attr(key,value)

3.設定多個屬性值

$(selector).attr()

4.刪除指定屬性名的元素屬性

$(selector).removeattr(name)

1.獲取元素的html/文字內容

$(selector).html(value)

$(selector).text(value)

兩者的區別是,html()方法僅支援html型別的文件,不支援xml

text()方法不僅支援html型別,也支援xml型別

在jquery中,可以獲取和設定元素的值

1.獲取元素的值:

$(selector).val()

2.設定元素的值:

$(selector).val(value)

tips:通過val().joiin(",")獲取select標籤中的多個選項值

在jquery中,可以直接設定樣式,增加css類別,類別切換,刪除類別等操作

1.為指定name的樣式設定值:

$(selector).css(name,value)

2. 為元素增加樣式類:

$(selector).addclass(class)

3.切換不同的樣式類:

$(selector).toggleclass(class)

4.刪除元素的樣式類:

$(selector).removeclass(class)

按照插入元素的位置區分,可以分為內部和外部插入

1.內部插入節點:

①向所選擇元素內部追加/前置內容:

$(selector).prepend(content)

②向所選擇元素內部追加/前置function方法所返回的內容:

$(selector).prependto(funtion())

③把所選擇元素追加/前置到另乙個指定的元素集合中:

$(selector).prependto(content)

2.外部插入節點:

①向所選擇的元素外部追加/前置內容:

$(selector).after(content)

$(selector).before(content)

②把所選擇的元素追加/前置到另乙個指定的元素

$(selector).insertafter(content)

$(selector).insertbefore(content)

將某個元素節點複製到另乙個節點之後

1.複製匹配的dom元素並且選中複製成功的元素:

$(selector).clone()

2.在複製時將該元素的所有行為也進行複製:

$(selector).clone(true)

1.將所有選擇的元素替換成指定的html或dom元素:

$(selector).replacewith(content)

2.將所有選擇的元素替換成指定selector元素:

$(selector).replaceall(selector)

注:一旦完成替換,被替換元素中的全部事件將會消失

1.刪除指定的元素:

$(selector).remove()

2.刪除指定的元素,但保留被移除元素的事件:

$(selector).detach()

3.清空所選擇的頁面元素的內容,但不移除該元素

$(selector).empty()

這類操作不需要選擇元素就可以直接使用

1.$.trim() //去除字串兩端的空格

2.$.each() //遍歷乙個陣列或物件

3.$.inarray() //返回乙個值在陣列中的索引位置,如果該值不在陣列中,返回-1

4.$.isarray() //判斷某個引數是否為陣列

5.$.makearray() //將物件轉化為陣列

6.$.type() //判斷物件的類別(函式物件,日期物件,陣列物件,正則物件等)

7.$.extend() //將多個物件,合併到第乙個物件

8.$.isemptyobject() //判斷某個物件是否為空(不含任何屬性)

9.$.isfunction() //判斷某個引數是否為函式

10.$.isplainobject() //判斷某個引數是否用「{}」或「new object」建立物件

11.$.support() //判斷瀏覽器是否支援某個特性

12.$.grep() //返回陣列中符合某種標準的元素

jquery操作物件陣列元素方法詳解

如下 如下 ab c1.錯誤方式 不能用方式取jquery物件陣列,如下 如下 function 這樣無效.2.可以用jquery的eq 方法來選擇 如下 for var i 0 i div span.length i 3.可以用each 方法來遍歷 如下 function each 遍歷的時候,如...

JQuery操作物件的屬性

通過jquery去操作前台物件 div,span.的屬性是很常見的事情,本文就簡單的介紹幾種操作情形。1 通過屬性值去獲取物件 2 用jquery去修改物件的屬性值 3 獲取並修改物件的style的屬性值 這裡提供乙個簡單的前台html 後續操作都是對此段html 進行的。html xmlns he...

jQuery對元素內容操作

jquery提供了對元素的內容和值進行操作的方法,其中,元素的值是元素的一種屬性,大部分元素的值都對應value屬性。下面我們再來對元素的內容進行介紹。元素的內容是指定義元素的起始標記和結束標記中間的內容,又可分為文字內容和html內容。那麼什麼是元素的文字內容和html內容?通過下面這段來說明。測...