Nietzsche's Preposterous Moustache
Unleash awesomeness. Private packages, team management tools, and powerful integrations. Get started with npm Orgs »

@srhazi/simpledom

1.1.0 • Public • Published

simpledom

A tiny, simple, strict, typescript-oriented DOM manipulation API.

  • Zero dependencies
  • Requires ES6 runtime (for Array.from())
  • Library size: 1,975 bytes minified (861 bytes gzip-compressed)
  • Works well with tsc --strict

Installation

npm install @srhazi/simpledom

Building

  • Note: Minified standalone build depends on closure-compiler.
  • Version 1.0.1 built with
    • typescript version: 2.6.2
    • node version: 4.1.1
    • amdclean version: 2.7.0
    • Closure Compiler version: 20130227 (Built on: 2017/09/14 12:51)
  1. git clone https://github.com/sufianrhazi/simpledom.git
  2. cd simpledom
  3. npm install
  4. s/dist

Usage

All functions are named exports with concise names:

import * as dom from '@srhazi/simpledom';
 
// Typesafe document.querySelector()
let form: HTMLFormElement = dom.one(HTMLFormElement, 'form.login');
 
// Typesafe document.querySelectorAll()
let buttons: HTMLButtonElement[] = dom.all(HTMLButtonElement, 'button.primary');
 
// Typesafe el.querySelector()
let submit: HTMLButtonElement = dom.oneFrom(form, HTMLButtonElement, 'button.submit');
 
// Typesafe el.querySelectorAll()
let formCheckboxes: HTMLInputElement[] = dom.allFrom(form, HTMLInputElement, 'input[type="checkbox"]');
 
// Typesafe jQuery.on-lookalike
dom.on(form, 'keypress', HTMLInputElement, 'input[type="text"][name="dotcom-2.0-name"]', (event, el) => {
    // event inferred as KeyboardEvent
    // el inferred as HTMLInputElement
    if ('aeiou'.indexOf(e.key) !== -1) {
        event.preventDefault();
    }
});
 
// String to Element constructor
let container = dom.build(`
    <ul>
        <li>One</li>
        <li>Two</li>
    </ul>
`);
 
document.body.appendChild(container);
 
// String to DocumentFragment constructor
let moreItems = dom.buildMany(`
    <li>Three</li>
    <li>Four</li>
`);
 
container.appendChild(moreItems);

install

npm i @srhazi/simpledom

Downloadsweekly downloads

0

version

1.1.0

license

MIT

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability