Question

我只是在学习jQuery，对此有点困惑：

让我们说我需要提供一个jQuery脚本，它将添加一个类名为＆＃39; ourClass＆＃39;到<div>。我会使用以下代码：

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

以上是否正确？在我为这个特定的<div>添加一个类名后，如果我想将另一个类名添加到另一个特定的<div>，会有冲突吗？

基本问题帮助表示赞赏。

Answer 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（“jkl”，“mno”和“pqr”的直接子项，但不是“stu”）的任何main 。这也相当于$("main").children("div")。
$("main li div")将选择“stu”。

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

Answer 2

任何元素都可以包含任意数量的类。但是同一个id不应该存在于文档中。

Answer 3

根据您的评论使用.filter()：

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

上面的代码段将ourClass css类添加到高度为34px的div。

Answer 4

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

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

操纵没有类或id </div>的特定<div>的CSS

4 个答案: