我试图在jQuery中为具有父类具有特定类的元素创建一个if语句。
这是我到目前为止所提出的,但它不对。
if(!$(".myElem").parents(".myDiv")) {
console.log("test")
};
任何人都可以指出我正确的方向。
使用length
来检查选择器中是否有元素,并且closest()
会比parents()
更好,因为它会在找到匹配后停止:
if(! $(".myElem").closest(".myDiv").length ) {
console.log("has no parent with the class .myDiv")
}
如果您正在测试具有类myElem
的元素是否具有类myDiv的直接父级,请使用以下测试
if(!$(".myElem").parent().hasClass("myDiv")) {
console.log("test")
};
if($(".myElem").parent().hasClass(".myDiv")) {
console.log("has a parent with the class .myDiv")
}
else
{
console.log("no parent class .myDiv found")
}
这应该选择那些具有myElem类的元素,其父类具有myDiv类:
$(".myElem").filter(function(elem) {
return $(this).parents(".myDiv").length
});
或者这应该选择那些已经有类myElem并且没有父类具有myDiv类的元素:
$(".myElem").filter(function(elem) {
return !$(this).parents(".myDiv").length
});
如果$('。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>
试试这个吧。
if($("#child").parent("span#parent").length > 0)
{
console.log("parent is span");
}
else {
console.log("parent is not span or no parent");
}
如果您知道孩子的类名,更好的方法是使用.closest()
。
if(!$('yourtag.childClass').closest('yourParentTag').hasClass('classname')){
console.log('does not exist');
}