选择未在 Javascript 中应用 CSS 类的所有 HTML 元素（标签）[重复]答案

【问题标题】：Selecting all the HTML elements (label) where a CSS class not applied in Javascript [duplicate]选择未在 Javascript 中应用 CSS 类的所有 HTML 元素（标签）[重复]
【发布时间】：2015-11-28 23:32:09
【问题描述】：

我想从未应用特定 CSS 类的视图中选择所有标签。

CSS

.ondemand-field[readonly]
{
    color: #848284;
    background-color:#FFFFFF;
}

查看

<table>
     <tr>
          <td class="display-label">@Html.LabelFor(t => t.ProductId, new { @class = "ondemand-field" })</td>
          <td class="display-field">@Html.DisplayFor(t => t.ProductId)</td>
     </tr>
     <tr>
          <td class="display-label">@Html.LabelFor(t => t.ISBN)</td>
          <td class="display-field">@Html.DisplayFor(t => t.ISBN)</td>
     </tr>
     <tr>
          <td class="display-label">@Html.LabelFor(t => t.Title)</td>
          <td class="display-field">@Html.DisplayFor(t => t.Title)</td>
     </tr>

</table>

JavaScript

$('#OnDemandData').change(function () {
    if ($(this).val() == 1) {
       //Select all the HTML elements where ondemand-field CSS class not applied

    }
    else {
        //TODO
    }
});

想法是一旦所有元素都被选中，我可以添加带有“只读”属性的 ondemand-field CSS 类，以便更改标签颜色。

-艾伦-

【问题讨论】：

为什么要重开这个问题？这是一个副本。如果操作员用谷歌搜索，他可能会找到该链接。

标签： javascript jquery html css

【解决方案1】：

试试这个：您可以使用:not 获取非需求字段元素。

$('#OnDemandData').change(function () {
    if ($(this).val() == 1) {
       //Select all the HTML elements where ondemand-field CSS class not applied
       var nonOnDemand = $(document).find(':not(.ondemand-field)');
    }
    else {
        //TODO
    }
});

【讨论】：

【解决方案2】：

Yuu 可以使用 not() 或 :not 伪类。

$('yourElements').not('.ondemand-field');

【讨论】：

【解决方案3】：

使用.not() 选择器从匹配的元素集中排除特定类：

var notOnDemand = $('.element').not('.ondemand-field');
notOnDemand.css({ 'color':'red' });

.element {
  width:100%;
  float:left;
  border:1px solid #d8d8d8;
  margin:2px 0;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h1>Apply red color to all exept '.ondemand-field'</h1>
<div class='element'>Element</div>
<div class='element ondemand-field'>Element (ondemand-field)</div>
<div class='element'>Element</div>
<div class='element ondemand-field'>Element (ondemand-field)</div>
<div class='element'>Element</div>

【讨论】：

如果视图是局部视图，这会起作用吗？