如果element没有父类具有特定类

问题描述 投票:15回答:7

我试图在jQuery中为具有父类具有特定类的元素创建一个if语句。

这是我到目前为止所提出的,但它不对。

if(!$(".myElem").parents(".myDiv")) {
    console.log("test")
};

任何人都可以指出我正确的方向。

javascript jquery parent
7个回答
25
投票

使用length来检查选择器中是否有元素,并且closest()会比parents()更好,因为它会在找到匹配后停止:

if(! $(".myElem").closest(".myDiv").length ) {
    console.log("has no parent with the class .myDiv")
}

6
投票

如果您正在测试具有类myElem的元素是否具有类myDiv的直接父级,请使用以下测试

if(!$(".myElem").parent().hasClass("myDiv")) {
    console.log("test")
};

3
投票
if($(".myElem").parent().hasClass(".myDiv")) {
    console.log("has a parent with the class .myDiv")
}
else
{
    console.log("no parent class .myDiv found")
}

1
投票

这应该选择那些具有myElem类的元素,其父类具有myDiv类:

$(".myElem").filter(function(elem) {
    return $(this).parents(".myDiv").length
});

或者这应该选择那些已经有类myElem并且没有父类具有myDiv类的元素:

$(".myElem").filter(function(elem) {
    return !$(this).parents(".myDiv").length
});

1
投票

如果$('。myElem')有多个元素的唯一解决方案是来自Zoltan的解决方案

看这里的例子

 var takeElements = $('.myElement').filter(function(){
   return $(this).closest('.bannedAncestors').length === 0
 });
 
 takeElements.css('color','green');
 
 var bannedElements = $('.myElement').filter(function(){
   return $(this).closest('.bannedAncestors').length !== 0
 });
 
 bannedElements.css('color','red');
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="bannedAncestors">
  <div> number of nested element don't matters
    <div class="myElement">
      don't take this child since it has an ancestor we don't want
    </div>
  </div>
</div>
<div>
  <div>
    <div class="myElement">
      but this one is ok
    </div>
  </div>
</div>

0
投票

试试这个吧。

   if($("#child").parent("span#parent").length > 0)
   {
          console.log("parent is span");

   }
   else {
          console.log("parent is not span or no parent");
   }

0
投票

如果您知道孩子的类名,更好的方法是使用.closest()

if(!$('yourtag.childClass').closest('yourParentTag').hasClass('classname')){
    console.log('does not exist');
}
© www.soinside.com 2019 - 2024. All rights reserved.