操作没有 class 或 id 的特定 <div> 的 CSS答案

【问题标题】：Manipulating the CSS of a specific <div> that does not have a class or id操作没有 class 或 id 的特定 <div> 的 CSS
【发布时间】：2026-01-19 14:10:02
【问题描述】：

我刚刚学习 jQuery，对此有点困惑：

假设我需要提供一个 jQuery 脚本，它将类名“ourClass”添加到 <div>。我会使用以下代码：

$("div").addClass('ourClass');

上面说的对吗？在我向这个特定的<div> 添加一个类名之后，如果我想向另一个特定的<div> 添加另一个类名，以后会不会有冲突？

感谢您提供基本问题帮助。

【问题讨论】：

不，我认为不会有问题
它将类添加到所有divs
好的，谢谢。所以该代码将选择所有divs？这真的取决于div 中的内容？例如：$("div[style*="height: 34px"]") 会选择更具体的div?
是的，这很好，但这会为当前页面中当前可用的每个 div 添加类。
顺便说一句：在选择器中使用 ' 和 " 都可以吗？例如：$('div[style*="height: 34px"]') 和 $("div[style*="height: 34px"]") 都可以吗？

标签： jquery css class html

【解决方案1】：

JQuery 选择器$("div") 将选择页面上的所有div 元素。可能不是你想要的。

相反，请查看父元素并尝试找出一个选择器来定位相关元素。

例如...

<header>
  <div>abc</div>
  <div>def</div>
  <div>ghi</div>
</header>
<main>
  <div>jkl</div>
  <div>mno</div>
  <div>pqr</div>
  <ul>
    <li>
      <div>stu</div>
    </li>
  </ul>
</main>

选择器：

选择器$("header div") 将选择前三个div。如果您只需要选择其中之一，您可以使用$("header div").first()、$("header div").last() 或$("header div").eq(1)。（eq() 将按索引选择，其中第一个元素的索引为0）。
$("main div") 将选择最后四个（任何div 元素，它是main 的子元素，包括“stu”）。这也相当于$("main").find("div")。
$("main > div") 将选择任何div，它是main 的直接子代（“jkl”、“mno”和“pqr”，但不是“stu”）。这也相当于$("main").children("div")。
$("main li div") 将选择“stu”。

如果您需要使用 JQuery 来定位元素，通常最好简单地给元素一个类名或 id，但如果您别无选择，总是可以使用您的选择器获得创意。

【讨论】：

【解决方案2】：

任何元素都可以有任意数量的类。但文档中不应存在相同的 id。

【讨论】：

【解决方案3】：

根据您的 cmets 使用 .filter()：

$('div').filter(function(){
   return $(this).css('height') === '34px'
}).addClass('ourClass');

上面的代码sn-p将ourClasscss类添加到高度为34px的div中。

【讨论】：

【解决方案4】：

正如 King King 所指出的，上面会找到页面上的每个 div 并将类 ourClass 添加到其中。 jQuery 的选择器部分就像 CSS 一样工作，所以如果你的 CSS 中有一条规则是 div {background-color: blue;]，它会为页面上的每个 div 应用蓝色背景。通过在选择器中提供更多特异性，您可以缩小或定位页面上的特定元素。

而且，就像您的标准标记可以为单个元素包含多个类一样，您可以使用 jQuery 添加多个类。

【讨论】：