如何在 JavaScript 中检查元素是否包含类?
问题:
验证元素是否拥有特定类是 JavaScript 中的常见要求。然而,如所提供的示例所示,仅依靠 className 属性比较,当元素包含多个类时,就会出现问题。
解决方案:
有效地确定是否存在特定类,无论分配给元素的类总数如何,都使用 classList.contains方法。
element.classList.contains(className);
此方法可以在现代浏览器中完美运行,并且可以使用 Polyfill 来满足旧版浏览器的需求。
替代方法:
为了获得更广泛的兼容性,请考虑使用稍微修改的indexOf:
function hasClass(element, className) { return (' ' + element.className + ' ').indexOf(' ' + className+ ' ') > -1; }
This调整可确保部分类名匹配不会产生错误结果。
演示:
var test = document.getElementById("test"), classes = ['class1', 'class2', 'class3', 'class4']; test.innerHTML = ""; for(var i = 0, j = classes.length; i < j; i++) { if(hasClass(test, classes[i])) { test.innerHTML = "I have " + classes[i]; break; } }
在此示例中,代码有效地识别并显示其中存在的类该元素,即使它伴随着其他类。
以上是如何可靠地检查 JavaScript 元素是否包含特定类?的详细内容。更多信息请关注PHP中文网其他相关文章!