Question

我需要使用JQUERY检查元素是否包含某个子类。

我试过了：

if ($('#myElement').has('.myClass')) {
   do work son
}

没用。

我的html代码如下所示：

<div id="myElement">
    <img>
    <span>something</span>
    <span class="myClass">Hello</span>
</div>

Answer 1

最简单的方法是将.myClass作为#myElement的孩子进行搜索：

if($('#myElement .myClass')).length > 0)

如果您只想要一级孩子，则可以使用>

if($('#myElement > .myClass')).length > 0)

另一种方法是将选择器传递给find并检查任何结果：

if($('#myElement').find('.myClass').length > 0)

或仅限一级儿童：

if($('#myElement').children('.myClass').length > 0)

Answer 2

只需使用QS

var hasClass = document.getElementById("myElement").querySelector(".myClass");

或者你可以对孩子们进行递归

var element = document.getElementById("myElement");

var hasClass = recursivelyWalk(element.childNodes, function hasClass(node) {
  return node.classList.contains("myClass");
});

function recursivelyWalk(nodes, cb) {
    for (var i = 0, len = nodes.length; i < len; i++) {
        var node = nodes[i];
        var ret = cb(node);
        if (ret) {
            return ret;
        }
        if (node.childNodes && node.childNodes.length) {
            var ret = recursivelyWalk(node.childNodes, cb);
            if (ret) {
                return ret;
            }
        }
    }
}

使用recursivelyWalk和.classList（可以填充）。

或者你可以使用jQuery

$("#myElement .myClass").hasClass("myClass");

或者如果你想要没有jQuery的复合操作，那么试试NodeComposite

NodeComposite.$("#myElement *").classList.contains("myClass");

Answer 3

尝试：

if($('#myElement').children('.myClass').length) {
    // Do what you need to
}

jQuery对象返回一个具有.length属性的数组。上面的代码检查.myClass中是否有#myElement个子项，如果有（.length不为0时），则执行if()语句中的代码。

这是一个更明确的版本：

if($('#myElement').children('.myClass').length > 0) {
    // Do what you need to
}

您也可以始终使用$('#myElement .myClass').length，但$.children()对某些人来说更清晰。要查找非直接子元素的元素，请使用$.find()代替$.children()。

Answer 4

if($.contains($('#myElement'), $('.myClass'))){
    alert("True");
}
else{alert("False")};

如何查找元素是否包含特定类？

4 个答案: