1.0.0 • Published 7 years ago

@grebaldi/dom-ops v1.0.0

Weekly downloads
-
License
MIT
Repository
-
Last release
7 years ago

dom-ops

functional dom operations

Installation

npm:

npm install --save @grebaldi/dom-ops

yarn:

yarn add @grebaldi/dom-ops

Usage

find

import {find} from '@grebaldi/dom-ops';

const allSectionsOnPage = find(document, 'section');
const allButtonsInSections = find(allSectionsOnPage, 'button');

Signature: find: (element: HTMLElement|[HTMLElement], selector: string) -> result: [HTMLElement]

Uses querySelectorAll internally, but converts the result into a regular Array.

findOne

import {findOne} from '@grebaldi/dom-ops';

const firstSectionOnPage = find(document, 'section');
const firstButtonInSection = find(firstSectionOnPage, 'button');

Signature: findOne: (element: HTMLElement|[HTMLElement], selector: string) -> result: HTMLElement

listen

import {findOne, listen} from '@grebaldi/dom-ops';

const button = findOne(document, 'button');

listen(button, 'click', () => alert('Button clicked!'));

Signature: listen: (element: HTMLElement|[HTMLElement], eventName: string, handler: function) -> unsubscribe: function

listenOnce

import {findOne, listenOnce} from '@grebaldi/dom-ops';

const button = findOne(document, 'button');

listenOnce(button, 'click', () => alert('Will fire just once!'));

Signature: listen: (element: HTMLElement|[HTMLElement], eventName: string, handler: function) -> unsubscribe: function

License

MIT, see LICENSE.md