使用纯JavaScript(不是jQuery),是否有任何方法来检查元素是否包含类?
目前,我正在这样做:
var test = document.getElementById("test");
var testClass = test.className;
switch (testClass) {
例“class1”:
测试。innerHTML = "我有class1";
打破;
例“class2”:
测试。innerHTML = "I have class2";
打破;
例“class3”:
测试。innerHTML = "I have class3";
打破;
“一年级”情况:
测试。innerHTML = "I have class4";
打破;
默认值:
测试。innerHTML = "";
}
<div id="test" class="class1"></div>
问题是,如果我把HTML改成这个…
<div id="test" class="class1 class5"></div>
...不再有一个精确的匹配,所以我得到的默认输出为nothing("")。但我仍然希望输出为I have class1,因为<div>仍然包含。class1类。
这里有一个小片段,如果你试图检查元素是否包含一个类,而不使用jQuery。
function hasClass(element, className) {
return element.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(element.className);
}
这说明元素可能包含多个用空格分隔的类名。
OR
您还可以将此函数分配给元素原型。
Element.prototype.hasClass = function(className) {
return this.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(this.className);
};
并像这样触发它(非常类似于jQuery的.hasClass()函数):
document.getElementById('MyDiv').hasClass('active');
这里有一个小片段,如果你试图检查元素是否包含一个类,而不使用jQuery。
function hasClass(element, className) {
return element.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(element.className);
}
这说明元素可能包含多个用空格分隔的类名。
OR
您还可以将此函数分配给元素原型。
Element.prototype.hasClass = function(className) {
return this.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(this.className);
};
并像这样触发它(非常类似于jQuery的.hasClass()函数):
document.getElementById('MyDiv').hasClass('active');