選擇器——jq的核心
基本選擇器
多項選擇器
層級選擇器
屬性選擇器
過濾器表單相關
查詢和過濾
由於優先順序的層級問題：id更高，class少一些
選擇器
// #id ：根據給定的id匹配乙個元素
//demo;注意在剛開始應用jq時，要在head裡面引用first
second
third
元素選擇器；根據給定的元素標籤名匹配所有的元素
//由於標籤名不是唯一的，有和陣列類似的功能 ，通過 $(this).index()可確定第幾個
$(document).ready(function()
)選擇器
$('classname');
//4.*:all萬用字元選擇器，很少用到
$(document).ready(function
)
$("selector1,selector2,……selectorn")；
//可指定任意多個型別；每個選擇器匹配到乙個之後一起返回
$(document).ready(function
)
空格：$(『ancestor descendant』):在給定的祖先元素下匹配所有的後代元素
波浪號：$(『pre ~ brother』)表示獲取pre節點的後面的所有兄弟節點，相當於nextall()方法
屬性選擇器
[attribute] :匹配具有指定屬性的元素
[attribute=value] :匹配屬性為指定值的元素
[attribute!=value] :匹配屬性值不等於指定值的元素
[attribute^=value] :匹配屬性值以指定值開始的元素，如tool_vs這裡就是以tool開頭有，以vs結尾
[attribute$=value] :匹配屬性值以指定值結束的元素
[attribute*=value] :匹配屬性值中包含指定值的元素，如tool_vscode,這裡的vs就是包含在裡面
[selector1] [selector2][selectorn] :就像是同時匹配多個條件，可以用到上面不同型別的屬性選擇器；如下
"lang_jquery">jquery
$('[class][class*=lang][class$=y]'
)
如：對於detail>p:first-child 而言，他直接找detail下面的所有節點，然後再判斷節點的型別是不是p，如果是p的話返回該節點，不是的話就找不到；但是對於type而言，重點在type 直接忽略掉不是p的標籤進行查詢
過濾器之child系列：
:first-child
:last-child
:nth-child(n | even | odd | formula)
:nth-last-child(n | even | odd | formula)：倒著數
:only-child：標籤下必須只有乙個子標籤並且為p標籤才會被選擇
過濾器之type系列
:first-of-type
:last-of-type
:nth-of-type (n | even | odd | formula):注意這裡是選到了型別才開始數
:nth-last-of-type (n | even | odd | formula)
:only-of-type
表單相關
：input，可以選擇,
:text,匹配所有的單行文字
其他input的type： ：password/:radio/:checkbox/：image/:reset/:botton/:file
:enabled、:disabled,:enabled匹配所有可用元素；而disabled匹配所有不可用元素
：checked,匹配所有選中元素（核取方塊、單選框、select中的option）
:selected,匹配所有選中的option元素
下拉框可以用 ：checked 和：selected來選擇；建議是單選框和核取方塊用checked來選擇，而下拉框用selected
查詢和過濾
find(expr|object|element):搜尋所有與指定表示式匹配的元素
children([expr]):取得乙個包含匹配的元素集合中每乙個元素的所有子元素的元素集合
parent([expr]):取得乙個包含著所有匹配元素的唯一父元素的元素集合
next([expr]):所選元素的下乙個元素
prev([expr]):上乙個
eq(index|-index)；eq如果是負值就是倒數第幾個；
siblings([expr]):找的是除了他本身的其他兄弟元素；
filter(expr|object|element|fn):篩選出與指定表示式匹配的元素集合
var lis = $(
'li'
).eq
(8);
var python = allis.filter
('.python'
);
$(document).ready(function()
)$(document).ready(function()
)
"cursor: pointer;"
οnclick="test()">點這裡觸發事件
床前明月光
疑是地上霜
舉頭望明月
低頭思故鄉
古詩
"cursor: pointer;"
οnclick="test()">點這裡觸發事件
床前明月光
疑是地上霜
舉頭望明月
低頭思故鄉
古詩
新增鏈結描述
jq常用選擇器
jquery 使用 css 選擇器來選取 html 元素。div 選取 元素。p.intro 選取所有 class intro 的 元素。p demo 選取所有 id demo 的 元素。jquery 使用 xpath 表示式來選擇帶有給定屬性的元素。href 選取所有帶有 href 屬性的元素。h...
jq選擇器總結
js選擇 var test document.getelementbyid test var parent test.parentnode 父節點 var chils test.childnodes 全部子節點 var first test.firstchild 第乙個子節點 var last te...
jQuery過濾選擇器 基本過濾選擇器
過濾選擇器主要是通過特定的過濾規則來篩選出所需的dom元素，過濾規則與css中的偽類選擇器語法相同，即選擇器都以乙個冒號 開頭。按照不同的過濾規則，過濾選擇器可以分為基本過濾 內容過濾 可見性過濾 屬性過濾 子元素過濾和表單物件屬性過濾選擇器。基本過濾選擇器 選擇器 描述 返回 示例 first 選...