jquery如何通过反向名称属性选择元素

【问题标题】：jquery how select element by inverse name attributejquery如何通过反向名称属性选择元素
【发布时间】：2019-03-05 20:36:42
【问题描述】：

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

我用 [^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：

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

【问题讨论】：

您正在寻找没有安全属性的元素？ $('a:not([safe])') 或 $('a').not('[safe]')
旁注；你不需要明确的 each。 css() 和大多数 jQuery 方法在结果堆栈上执行一个隐式的 each
谢谢@Taplar，已经解决了。 :)

标签： jquery attributes tags inverse

【解决方案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>

【讨论】：

感谢您的宝贵时间和宝贵的帮助。 :)