0.0.0 • Published 6 years ago
mgn-utility v0.0.0
mgn-utility ( Don't Need jQuery )
Compiling function that can utilize descriptors similar to jQuery such as addClass, removeClass.
- Target browser : IE9+
Install
npm i mgn-utility -S
Or Download raw data
Import
import { AddClass, RemoveClass, ... } from "mgn-utility"
Property
Property | If jQuer |
---|---|
AddClass( element, className ) *1 | $(element).addClass(className) |
RemoveClass( element, className ) | $(element).removeClass(className) |
HasClass( element, className ) | $(element).hasClass(className) |
SetCss( element, object ) *2 | $(element).css(object) |
GetParents( element, ".className or #id or tagName" ) | $(element).parents(".className") |
GetSiblings( element, ".className or #id or tagName" ) | $(element).siblings(".className") |
GetOffset( element ).topGetOffset( element ).left | $(element).offset().top$(element).offset().left |
GetWidthData( element ).outerWidth | $(element).outerWidth() |
GetHeightData( element ).outerHeight | $(element).outerHeight() |
Not( element, ".className or #id" ) *3 | $(element).not( “.className or #id” ) |
Demo
https://frontend-isobar-jp.github.io/mgn-utility/
import { AddClass, SetCss, Not } from "mgn-utility"
/**
* AddClass
*/
( () => {
let element = document.getElementById('example'),
element2 = document.getElementsByClassName('example');
AddClass( element, "addClass");
for (var i = 0; i < element2.length; i++) {
AddClass( element2[i], "addClass");
}
})();
/**
* SetCss
*/
( () => {
let element = document.getElementById('example2');
SetCss( element, {
"background": "#000",
"color": "#FFF",
"font-size": "20px"
});
})();
/**
* Not
*/
( () => {
let element = document.getElementsByClassName('example3');
for (var i = 0; i < element.length; i++) {
element[i].onclick = (e) => {
let not = Not( e.currentTarget, ".ignore" ); // true or false
if( !not ) {
alert("success !!")
} else {
alert("!! ignored element !!")
}
}
}
})();
0.0.0
6 years ago