我正在尝试选择所有具有data-go-to
不为空的属性。
我试过了$('[data-go-to!=""]')
但奇怪的是,如果我这样做,它似乎会选择页面上的每个元素。
Just as further reference, and an up-to-date (may'14) (aug'15) (sep'16) (apr'17) (mar'18) (mar'19) (may'20) (jan'22)...
Answer that works with:
###Empty strings:
If the attr
must exist & could have any value (or none at all)
jQuery("[href]");
###缺少的属性:
如果attr
could存在并且如果存在的话must有一定的价值
jQuery("[href!='']");
###或两者:
如果attr
must存在并且必须有一些价值...
jQuery("[href!=''][href]");
PS: more combinations are possible...
###检查此测试jsFiddle https://jsfiddle.net/举些例子:
-
jQuery v1.9.1 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/138/
-
jQuery v1.11.0 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/37/
-
jQuery v2.1.0 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/38/
-
jQuery v2.1.3 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/39/
-
jQuery v2.2.4 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/139/
-
jQuery v3.2.1 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/42/
-
jQuery v3.3.1 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/71/
-
jQuery v3.4.1 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/137/ Last jQuery version available in jsFiddle at jan 10'22
-
jQuery Edge ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/43/ jQuery edge version https://stackoverflow.com/questions/7035328/what-is-jquery-edge-in-jsfiddle-net (use with caution)
-
jQuery v3.0.0-alpha1 ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/40/
-
jQuery v3.1.1 Slim ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/36/
-
jQuery v3.2.1 Slim ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/140/
-
jQuery v3.3.1 Slim ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/141/
-
jQuery v3.4.1 Slim ->
jsFiddle online test https://jsfiddle.net/gmolop/SPb84/142/ Last jQuery Slim version available in jsFiddle at jan 10'22
###Or here in SO with this Code Snippet https://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/.
* Snippet is running jQuery v2.1.1
jQuery('div.test_1 > a[href]').addClass('match');
jQuery('div.test_2 > a[href!=""]').addClass('match');
jQuery('div.test_3 > a[href!=""][href]').addClass('match');
div,a {
display: block;
color: #333;
margin: 5px;
padding: 5px;
border: 1px solid #333;
}
h4 {
margin: 0;
}
a {
width: 200px;
background: #ccc;
border-radius: 2px;
text-decoration: none;
}
a.match {
background-color: #16BB2A;
position: relative;
}
a.match:after {
content: 'Match!';
position: absolute;
left: 105%;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test_1">
<h4>Test 1: jQuery('a[href]')</h4>
<a href="test">href: test</a>
<a href="#">href: #</a>
<a href="">href: empty</a>
<a>href: not present</a>
</div>
<div class="test_2">
<h4>Test 2: jQuery('a[href!=""]')</h4>
<a href="test">href: test</a>
<a href="#">href: #</a>
<a href="">href: empty</a>
<a>href: not present</a>
</div>
<div class="test_3">
<h4>Test 3: jQuery('a[href!=""][href]')</h4>
<a href="test">href: test</a>
<a href="#">href: #</a>
<a href="">href: empty</a>
<a>href: not present</a>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)