Question

我有一个场景，我需要检查dom中的元素是否是第一个类型

这是html

<dl class="accordion">
        <dt>Select Category</dt>
        <dd></dd>

        <dt>select product</dt>
        <dd></dd>
</dl>

这是脚本

(function($) {
        jQuery('.accordion > dt').on('click', function() {
            $this = $(this);
            $target = $this.next(); 
            if (!$this.hasClass('accordion-active')) {
                $this.parent().children('dd').slideUp();
                jQuery('.accordion > dt').removeClass('accordion-active');
                $this.addClass('accordion-active');
                $target.addClass('active').slideDown();
            }    
            return false;
        });

我需要知道的是被点击的元素是否是第一个类型。这可能是检查这种方式谢谢

Answer 1

jQuery在其查询方法和:first-of-type selector中都支持is。

所以：

if ($this.is(":first-of-type")) {
    // ...
}

示例：

$("dt, dd").on("click", function() {
  console.log(
    ($(this).is(":first-of-type") ? "IS" : "Is NOT") +
    " the first of its type (" + this.tagName + ")"
  );
});

<dl class="accordion">
  <dt>Select Category</dt>
  <dd>category data</dd>

  <dt>select product</dt>
  <dd>product data</dd>
</dl>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 2

您可以获取所有dt元素，然后使用.index()查找返回集合中当前元素的索引。如果它是0那么该元素是完整DOM中的第一个类型：

if($('dt').index($(this)) == 0){
   //code for first-of-type dt 
}

检查第一个类型元素

2 个答案: