❤
npm
Sign UpSign In

get-element

0.1.1 • Public • Published

get-element logo

Build Status Coverage Status

About | Why | Installation | Usage | License

About

A tiny Node.js module for quickly selecting HTML elements. Bundle it with browserify/webpack/etc. Requires Node.js > 4.0.

Why

  • Because using jQuery just to select elements is like using a flamethrower to light a birthday candle
  • Because document.querySelector() is slow
  • Because HTMLCollections are cool and all, but I usually want an actual Array to iterate over
  • Because I don't want to type Array.prototype.slice.call(document.getElementsByClassName('aVeryNiceClassName')) over and over again

Installation

Install and save to package.json from terminal:

$ npm install --save get-element

get-element is primarily intended for use with a bundler like webpack or browserify:

var getElement = require('get-element')

If you need a standalone <script>, though, a minified browser build that attaches to the global namespace as getElement is provided here:

<script src="get-element.min.js"></script>

Usage

get-element exports two methods:

getElement.withClass(class, [from])

Returns an array of elements with the specified class. from is an optional parameter to specify a root element other than document.

<!--index.html-->
<!doctype html>
<html>
  <head></head>
  <body>
    <div class="foo">
      <div class="bar"></div>
    </div>
    <section class="bar"></div>
    <section class="bar"></div>
    <script src="main.js"></script> 
  </body>
</html>
// main.js (pre-bundle)
var el = require('get-element')
 
var foo = el.withClass('foo')
  // => [ <div.foo> ]
 
var bar = el.withClass('bar')
  // => [ <div.bar>, <section.bar>, <section.bar> ]
 
var fooBar = el.withClass('bar', foo[0])
  // => [ <div.bar> ]
 

getElement.withTag(tag, [from])

Returns an array of elements with the specified tag. from is an optional parameter to specify a root element other than document.

<!--index.html-->
<!doctype html>
<html>
  <head></head>
  <body>
    <div class="foo">
      <div class="bar"></div>
    </div>
    <section class="bar"></div>
    <section class="bar"></div>
    <script src="main.js"></script> 
  </body>
</html>
// main.js (pre-bundle)
var el = require('get-element')
 
var body = el.withTag('body')
  // => [ <body> ]
 
var divs = el.withTag('div')
  // => [ <div.foo>, <div.bar> ]

License

MIT

Readme

Keywords

Package Sidebar

Install

npm i get-element

Repository

github.com/codekirei/get-element

Homepage

github.com/codekirei/get-element#readme

Weekly Downloads

1

Version

0.1.1

License

MIT

Last publish

Collaborators

  • codekirei
Try on RunKit
Report malware