classList
A helper module for adding and removing classes from DOM nodes in browsers that do not natively support the classList
property on DOM nodes.
Installation
npm
npm install --save @braintree/class-list
This module uses commonjs. You must use a build tool such as Browserify or Webpack to include it in your frontend project.
Usage
var classList = require('@braintree/class-list');
add
Adds a class to specified DOM node.
var element = document.querySelector('#id');
element.className = 'some-class';
classList.add(element, 'any', 'number', 'of', 'classes', 'to', 'add');
element.className === 'some-class any number of classes to add';
remove
Removes a class to specified DOM node.
var element = document.querySelector('#id');
element.className = 'some-class some-other-class another-class';
classList.remove(element, 'some-class', 'another-class');
element.className === 'some-other-class';
toggle
Toggles a class to specified DOM node. The first argument is the DOM node, the second is the class to toggle, and the third argument is a boolean for whether to add the class or remove it.
var element = document.querySelector('#id');
var shouldAdd = function (className) {
return element.className.indexOf(className) === -1;
}
element.className = 'some-class some-other-class';
classList.toggle(element, 'some-class', shouldAdd('some-class'));
element.className === 'some-other-class';
classList.toggle(element, 'some-class', shouldAdd('some-class'));
element.className === 'some-class some-other-class';
Tests
npm test