https://github.com/borracciablu/dh-classlist
Helpers functions to manipulate the DOM element css classes
https://github.com/borracciablu/dh-classlist
browser classlist dom javascript utility
Last synced: about 1 year ago
JSON representation
Helpers functions to manipulate the DOM element css classes
- Host: GitHub
- URL: https://github.com/borracciablu/dh-classlist
- Owner: borracciaBlu
- License: bsd-3-clause
- Created: 2020-01-11T12:07:11.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2025-01-21T22:08:21.000Z (over 1 year ago)
- Last Synced: 2025-04-12T12:08:11.206Z (about 1 year ago)
- Topics: browser, classlist, dom, javascript, utility
- Language: JavaScript
- Homepage:
- Size: 3.28 MB
- Stars: 3
- Watchers: 2
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
Helpers functions to manipulate the DOM element css classes.
## Installing
`npm install @borracciablu/dh-classlist`
```js
import {addClass} from '@borracciablu/dh-classlist';
var {addClass, removeClass, toggleClass} = require('@borracciablu/dh-classlist');
```
## API Reference
### addClass(itmList, clsList)
```js
var itm = document.querySelectorAll('.btn');
var cls = ['d-none'];
addClass(itm, cls);
```
### removeClass(itmList, clsList)
```js
var itm = document.querySelectorAll('.btn');
var cls = ['d-none'];
removeClass(itm, cls);
```
### toggleClass(itmList, clsList)
```js
var itm = document.querySelectorAll('.btn');
var cls = ['d-none'];
toggleClass(itm, cls);
```
### addClassThunk(itmList, clsList)
```js
var itm = document.querySelectorAll('.btn');
var cls = ['d-none'];
var thunk = addClassThunk(itm, cls);
setTimeout(thunk, 3000);
```
### removeClassThunk(itmList, clsList)
```js
var itm = document.querySelectorAll('.btn');
var cls = ['d-none'];
var thunk = removeClassThunk(itm, cls);
setTimeout(thunk, 3000);
```
### toggleClassThunk(itmList, clsList)
```js
var itm = document.querySelectorAll('.btn');
var cls = ['d-none'];
var thunk = toggleClass(itm, cls);
setTimeout(thunk, 3000);
```
## Deprecated API Reference
### execClass(itmList, opList)
```js
var docList = document.querySelectorAll('.doc');
execClass(docList, [{'add': 'd-block'}, {remove: 'd-none'}]);
// replace with
( addClass(docList, 'd-block')
, removeClass(docList, 'd-none'));
```
### execClassThunk(itmList, opList)
```js
var docList = document.querySelectorAll('.doc');
var thunk = execClassThunk(docList, [{'add': 'd-block'}, {remove: 'd-none'}]);
setTimeout(thunk, 3000);
// replace with
var thunk = () => ( addClass(docList, 'd-block')
, removeClass(docList, 'd-none'));
setTimeout(thunk, 3000);
```
## CDN
Recommended CDN:
https://unpkg.com/@borracciablu/dh-classlist@latest/dist/dh-classlist.min.js
```js
var {addClass} = window.dhClasslist;
// Alternative syntax
var addClass = window.dhClasslist.addClass;
```