Selectors-Attribute

Posted on Edited on In Views: Disqus:

 

一、Attribute Contains Prefix Selector [name|=”value”]

找尋指定的屬性其符合的字串開頭後帶有連字號、或內容完全符合指定的屬性值即可。

$("a[class |= 'en']")

 

二、Attribute Contains Selector [name*=”value”]

找尋指定的屬性其內容符合指定的屬性值即可。

$("a[class *= 'en']")

 

三、Attribute Contains Word Selector [name~=”value”]

找尋指定的屬性其內容由空白區隔符合指定的屬性值即可。

$("a[class ~= 'en']")

 

四、Attribute Ends With Selector [name$=”value”]

找尋指定的屬性其字尾符合指定的屬性值即可。

$("a[class $= 'en']")

 

五、Attribute Equals Selector [name=”value”]

找尋指定的屬性其內容完全符合指定的屬性值即可。

$("a[class = 'en']")

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"
        integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
</head>

<body>
    <p class="foo" zoo="monkey">Hello</p>
    <script>
        console.log($("p[zoo='monkey']").text());
    </script>
</body>

</html>

執行結果為

 

六、Attribute Not Equal Selector [name!=”value”]

找尋指定的屬性其內容不符合指定的屬性值即可。

$("a[class != 'en']")

 

七、Attribute Starts With Selector [name^=”value”]

找尋指定的屬性其開頭符合指定的屬性值即可。

$("a[class ^= 'en']")

 

八、Has Attribute Selector [name]

不管屬性值如何，其用來找尋特定的屬性。

$("a[class]")

 

九、Multiple Attribute Selector [name=”value”][name2=”value2″]

找尋符合所有被指定條件的集合。

$("a[class = 'en'] [id]")