如何使用jQuery查找元素是否包含特定的类

How do I find if an element contains a specific class with jQuery?

本文关键字:包含特 是否 元素 何使用 jQuery 查找      更新时间:2023-09-26

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

我试过了:

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

没用。

我的html代码如下所示:

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

最简单的方法是搜索.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)

只需使用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");

尝试:

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

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

这里有一个更明确的版本:

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

你也可以一直使用$('#myElement .myClass').length,但$.children()对一些人来说更清晰。要查找不是直接子级的元素,请使用$.find()代替$.children()

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