从课堂上找到第一个div

Question

尝试查找div是否是类中的第一个。 目前，未选择第一个div。

HTML：

<div class="servline_vhc servline_vhc_inspection clearfix"></div> <!--need this one-->
<div class="servline_vhc servline_vhc_inspection clearfix"></div>
<div class="servline_vhc servline_vhc_inspection clearfix"></div>

jquery的：

if ($('div[class="servline_vhc servline_vhc_inspection clearfix"]').is(':first')) {
// do something with first div
} else {
//edit others
}

Answer 1

要获取jquery colelction的第一项，请使用.first（）

$('div.servline_vhc.servline_vhc_inspection.clearfix').first()

请参阅：https://api.jquery.com/first/

工作示例：

var $div = $('div.servline_vhc.servline_vhc_inspection.clearfix').first();
$div.text("I'm first");

div {
  border: 1px solid blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div class="servline_vhc servline_vhc_inspection clearfix">X</div>
<!--need this one-->
<div class="servline_vhc servline_vhc_inspection clearfix">X</div>
<div class="servline_vhc servline_vhc_inspection clearfix">X</div>

Answer 2

你的选择器匹配所有三个。

＆＃13;

＆＃13;

$('div[class="servline_vhc servline_vhc_inspection clearfix"]').append(' - match');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="servline_vhc servline_vhc_inspection clearfix">1</div>
<div class="servline_vhc servline_vhc_inspection clearfix">2</div>
<div class="servline_vhc servline_vhc_inspection clearfix">3</div>

＆＃13;

＆＃13;

＆＃13;

如果您只想选择第一个元素，请在查询中附加:first选择器或使用.first()方法。另外，要通过css类进行查询，您只需将查询编写为element.class1.class2：

＆＃13;

＆＃13;

$('div.servline_vhc.servline_vhc_inspection.clearfix:first').append(' :first');
$('div.servline_vhc.servline_vhc_inspection.clearfix').first().append(' .first()');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="servline_vhc servline_vhc_inspection clearfix">1</div>
<div class="servline_vhc servline_vhc_inspection clearfix">2</div>
<div class="servline_vhc servline_vhc_inspection clearfix">3</div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

if($(".servline_vhc:first")){
}