也许我遗漏了什么,但它们看起来很相似。例如,如果您使用...
a[alt~="thumb"]
或者...
a[alt*="thumb"]
我可以将选择范围缩小到哪些不同?我的理解是 ~ 在引号中给你一个部分匹配,而 * 给你一个部分匹配。我打算稍微修改一下代码,但由于我在这里找不到关于这个主题的问题,所以我认为无论哪种方式它都会成为一个很好的主题。
最佳答案
来自 JQuery 帮助(支持标准选择器):
a[alt~="thumb"]
Description: Selects elements that have the specified attribute with a value containing a given word, delimited by spaces. This selector matches the test string against each word in the attribute value, where a "word" is defined as a string delimited by whitespace. The selector matches if the test string is exactly equal to any of the words.
a[alt*="thumb"]
Description: Selects elements that have the specified attribute with a value containing the a given substring. This is the most generous of the jQuery attribute selectors that match against a value. It will select an element if the selector's string appears anywhere within the element's attribute value. Compare this selector with the Attribute Contains Word selector (e.g. [attr~="word"]), which is more appropriate in many cases.
基本上,选择器 ~=
只有在值被空格包围时才匹配。如果在任何地方找到该值,选择器 *=
匹配。
<div alt='heading navigation'>
<div alt='head'>
div[alt~='head']
将仅匹配第二个 div,但 div[alt*='head']
将匹配两者。
关于html - [att~=val] 与 CSS 属性选择器中的 [att*=val] 究竟有何不同?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10442963/