Edom.js is a JavaScript library that allows you to interact with the DOM easily.
Navigate to your project directory:
mkdir my-project
cd my-project
Clone this repository:
git clone https://github.com/eric-fahendrena/Edom
Load edom.js
into your HTML file followed by your JavaScript code:
<script src="Edom/edom.js"></script>
<script>
// Your code here ...
</script>
Edom.js is easy to use.
Write "Hello, world!" in an h1
element:
// Create h1 element
const h1 = create('h1');
// Write a text
write(h1)('Hello, world!');
// Add the element to the body
append(h1)(document.body);
// Or create many elements
const elements = create(['h2','h3','h4']);
// Write a text to all elements
write(elements)('Hello, world!');
// Add all elements to the body
append(elements)(document.body);
const element = create('div'); // create an element
// write text to an element
write(element)("Your text here");
// set html (this completely changes the html inside the element)
setHTML(element)('<span>HTML code</span>');
// add html (this adds an html code in the element)
addHTML(element)('<span>HTML code</span>');
// inserting element
append(element)(parent); // append element to a parent element
insertBefore(element)(newElement);
insertAfter(element)(newElement);
// add attribute
addAttr(element)({'prop': 'value', 'prop1': 'value'});
// add style to an element
addCSS(element)({color: 'red', fontSize: '12px'});
// get computed css
const compCSS = getComputedCSS(element)('width');
// classes utilities
addClass(element)('my-class'); // add class
removeClass(element)('my-class'); // remove class
toggleClass(element)('my-class'); // toggle class
// event handling
addEvent(element)(eventType)(handler); // add event listener
removeEvent(element)(eventType)(handler); // remove event listener
// apply css animation
applyAnimation(element)({
name: animationName,
duration: animationDuration,
timingFunction: animationTimingFunction
});
// ajax get
ajaxGet(url)(callback);
const promise = fetchGet(url);
// serialize form data
const jsonObject = serializeForm(formElement);
// multiply an element
const p = create('p');
write(p)('Hello!');
append(p)(document.body);
multiply(p)(5);
We welcome contributions from the community! Please follow the guidelines outlined in the GitHub documentation on contributing to projects.
Thank you for your interest in contributing!
Mozilla Public License Version 2.0