Question

我只想通过反向属性名称选择项目：

我用a [^ safe]或a [！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：

https://jsfiddle.net/Lpr4tow1/1/

Answer 1

您可以使用: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>

jQuery如何通过逆名称属性选择元素

1 个答案: