elementjs
Create and interact with HTML elements easily with javascript.
Elementjs is simply a wrapper for html elements that includes convenient methods to interact with them, as well as an easy way to access them without using selectors.
Each El object holds all of it's children, which can be accessed easily by traversing the object.
Read Docs
Installation
NPM
npm install --save elementjs
Dist
Usage
Simple
const mydiv = 'div'; documentbody;
Set ids/classes
// Shortcut method:const mydiv = 'div#myid.myclass'; // Or if you prefer:const mydiv = 'div' id: 'myid'; documentbody;
Set text and attributes
const mydiv = 'div#myid.myclass' myattribute: 'myattributevalue'; documentbody;
Set children elements
const mydiv = 'div#mydiv' myattribute: 'myattributevalue' 'ul' 'li' 'li' 'li' ;
Object traversal
Child elements are accessible through their parents by traversing the created object. Items are bound by a _key property. This can be assigned by setting the _key in the attributes parameter (2nd). If the _key is not present, the element's ID will be used. If no id exists, the item will named with the tag name followed by the index (See example below).
const myList = 'ul#myul' 'li#item1' _key: 'firstitem' 'li#item2' 'li#item3'; // If a _key is assignedmyListfirstitem; // If an ID exists, but no _key is assignedmyListitem1; // If neither a _key or id is assignedmyListli1;
Child elements are also pushed into an array that is accessible through the 'children' property.