JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 8635
  • Score
    100M100P100Q132082F
  • License MIT

Enhanced query selector API

Package Exports

  • tealight

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (tealight) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

tealight

ES2015 module for DOM queries.

Build status Coverage Version 0.4KB min+gzip MIT License

Browser compatibility matrix



Installation

Browser

A simple and fast way to get started is to include this script on your page:

<script src="https://unpkg.com/tealight"></script>

This will create the global variable tealight.

Module

$ npm install tealight

CommonJS

const tealight = require('tealight')

ES2015

import tealight from 'tealight'


Usage

tealight accepts a single argument, target, and will always return an array of 0 or more DOM nodes.

tealight(target) => Array<Node>

For the examples below, assume we have this HTML fragment to query against:

<div id="jar">
    <div class="chocolate-chip cookie"></div>
    <div class="peanut-butter cookie"></div>
    <div class="short-bread cookie"></div>
</div>

tealight(String<Selector>)

String arguments will be used as DOM query selectors.

tealight('#jar')
// => [ <div#jar> ]
tealight('.cookie')
// => [ <div.chocolate-chip.cookie>, <div.peanut-butter.cookie>, <div.short-bread.cookie> ]

Keep in mind that document.querySelectorAll throws an error when passed an invalid selector (requiring a try/catch block), whereas tealight will swallow the error and return an empty array.


tealight(Node)

Node arguments will be wrapped in an Array.

const node = document.querySelector('#jar')

tealight(node)
// => [ <div#jar> ]

tealight(NodeList)

NodeList arguments will be converted to Array.

const nodeList = document.querySelectorAll('.cookie')

tealight(nodeList)
// => [ <div.chocolate-chip.cookie>, <div.peanut-butter.cookie>, <div.short-bread.cookie> ]

tealight(Array)

Array arguments will be filtered, leaving only Node items.

const node = document.querySelector('#jar')
const array = [node, null, '.cookie']

tealight(array)
// => [ <div#jar> ]


© 2018 FISSSION, LLC.
Open source under the MIT License.