2020 09 28jQuery之屬性過濾選擇器

2021-10-09 21:08:49 字數 1387 閱讀 6162

基本選擇器是jquery中最常用也是最簡單的選擇器,它通過元素的id、class和標籤名等來查詢dom元素。

1、id選擇器 #id

描述:根據給定的id匹配乙個元素, 返回單個元素(注:在網頁中,id名稱不能重複)

示例:$("#test") 選取 id 為 test 的元素

2、類選擇器 .class

描述:根據給定的類名匹配元素,返回元素集合

示例:$(".test") 選取所有class為test的元素

3、元素選擇器 element

描述:根據給定的元素名匹配元素,返回元素集合

示例:$("p") 選取所有的元素

4、*描述:匹配所有元素,返回元素集合

示例:$("*") 選取所有的元素

5、selector1,selector2,...,selectorn

描述:將每個選擇器匹配到的元素合併後一起返回,返回合併後的元素集合

示例:$("p,span,p.myclass") 選取所有,和class為myclass的標籤的元素集合

1:包含屬性過濾器

用於選擇包含給定屬性的所有元素

格式:$("selector[attribute]")

2:屬性等於過濾器

用於篩選給定屬性等於某特定值的所有元素

$("selector[attribute=value]");

例子:$("input[name=accept]").attr("checked", "true");  //將name為accept的核取方塊選中  

3:屬性包含過濾器

用於選擇指定屬性值包含給定字串的所有元素

格式:$("selector[attribute*=value]")   

例子:$("input[name*='news']").val("name中包含有news的元素");  //將name中包含'news'的文字框新增文字值

4:屬性包含單詞過濾器

用於選擇指定屬性值中包含給定單詞(由空格分隔)的元素

格式:$("selector[attribute~=value]");

例子:$('input[name~='news']').val("name中包含news單詞的元素");

5:屬性不等於過濾器

用於選擇不包含指定屬性,或者包含指定屬性但該屬性不等於某個值的所有元素

格式:$("selector[attribute!=value]")

6:屬性開始過濾器

用於選擇給定屬性是以某特定值開始的所有元素

格式:$("selector[attribute^=value]")   

7:屬性結尾過濾器

用於選擇給定屬性是以某特定值結尾的所有元素

格式:$("selector[attribute$=value]") 

jQuery基礎之DOM和jQuery之間的轉換

引言 jquery物件 通過jquery包裝dom物件後產生的物件。dom物件不可使用jquery物件的方法。同理jquery物件也不可使用dom物件的方法。例如 foo html 這是jquery物件的使用 它的功能等同於 document.getelementbyid foo innerhtml...

JQuery學習之jQuery尺寸

1.width 和height 方法 width 設定或返回元素的寬度 不包括內邊距,邊框或外邊距 height 設定或返回元素的高度 不包括內邊距,邊框或外邊距 button click function var txt txt width div1 width txt height div1 h...

jQuery學習筆記(二)之jQuery選擇器

html頁面元素就一些html標籤 元素 和對應的html元素屬性組成,屬性包括id,class,獲取css樣式屬性等,其中通過css樣式屬性獲取jquery,這裡的css樣式屬性就可以稱為jquery的css選擇器 另外jquery還支援xpath選擇,其實跟css差不多。下面就這對各種常用的選擇...