JSFiddle - React, Tailwind, and code Playground
by sanford
HTML
<div id="fixture" class="one two three four "></div>
JavaScript
Element.implement({
hasClassPlus: function(className) {
var classNamesString = this.className;
var classNames = classNamesString ? classNamesString.split(/\s/) : [];
return className instanceof RegExp ? classNames.containsMatch(className) : classNames.contains(className);
},
hasClassPlusPlus: function(className) {
var classNamesString = this.className;
if (!classNamesString) return false;
var classNames = classNamesString.split(/\s/);
return className instanceof RegExp ? classNames.containsMatch(className) : classNames.contains(className);
},
hasClassPlusPlusPlus: function(className) {
var classNamesString = this.className;
if (!classNamesString) return false;
var classNames = classNamesString.split(/\s/);
return className instanceof RegExp ? classNames.containsMatch(className) : (classNames.indexOf(className) != 1);
},
hasClassPlusPlusPlusPlus: function(className) {
var classNames = this.classList;
return classNames.contains(className);
}
});
var el = $('fixture');
var t=new Date().getTime();
for (var i=1000;i--;) {
el.hasClassPlusPlusPlus('three');
el.hasClassPlusPlusPlus('four');
el.hasClassPlusPlusPlus('not-there');
}
console.log (new Date().getTime() - t);