jquery如何select元素通过反名称属性
jquery how select element by inverse name attribute
我只想 select 项目的反向属性名称:
我select用了一个[^safe]或者一个[!safe],错了
我的HTML:
<ul>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a safe href="#">Link Base</a>
<a safe href="#">Link Base</a>
</ul>
我的jQuery代码:
$("a[^safe]").each(function(){
$(this).css({"color": "red", "border": "2px solid gold"});
});
我的 jsFiddle:
您可以使用 :not()
选择器进行修改,或者只为它创建一个 css 规则而不使用 javascript。
不过,如果您选择纯粹的 css 方式,您很可能希望缩小选择器的范围,使其不那么全局。
$('a:not([safe])').addClass('not-safe')
.not-safe {
color: red;
border: 2px solid red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a safe href="#">Link Base</a>
<a safe href="#">Link Base</a>
</ul>
a:not([safe]) {
color: red;
border: 2px solid red;
}
<ul>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a safe href="#">Link Base</a>
<a safe href="#">Link Base</a>
</ul>
我只想 select 项目的反向属性名称:
我select用了一个[^safe]或者一个[!safe],错了
我的HTML:
<ul>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a safe href="#">Link Base</a>
<a safe href="#">Link Base</a>
</ul>
我的jQuery代码:
$("a[^safe]").each(function(){
$(this).css({"color": "red", "border": "2px solid gold"});
});
我的 jsFiddle:
您可以使用 :not()
选择器进行修改,或者只为它创建一个 css 规则而不使用 javascript。
不过,如果您选择纯粹的 css 方式,您很可能希望缩小选择器的范围,使其不那么全局。
$('a:not([safe])').addClass('not-safe')
.not-safe {
color: red;
border: 2px solid red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a safe href="#">Link Base</a>
<a safe href="#">Link Base</a>
</ul>
a:not([safe]) {
color: red;
border: 2px solid red;
}
<ul>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a href="#">Link Base</a>
<a safe href="#">Link Base</a>
<a safe href="#">Link Base</a>
</ul>