Skip to content

Mini DOM manipulations like jquery, simple DOM manipulation to help you to handel basic DOM manipulations.

License

Notifications You must be signed in to change notification settings

yaza-putu/miniDom

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Mini Dom

Mini DOM manipulations like jquery

Features

  • css, rawCss, attr, getAttr, removeAttr, animate, on, addClass, toggleClass, html
  • text, val, insertBefore, insertAfter, insertFirst, insertLast, empty, fetch
  • Total (18)

How to use

for use you can first initialise with

select(document).ready(function(){
    //code here
});
  1. css
select(selector).css(style,textStyle);
// example
select('#idname').css('display','none');
  1. rawCss
select(selector).rawCss(style);
// example
select('.classname').rawCss('display:none;border:1px solid black');
  1. attr
select(selector).attr(attribute_name,value);
// example
select('.classname').attr('value','1234');
  1. getAttr
select(selector).getAttr(attribute_name);
// example
select('.classname').getAttr('value');
  1. removeAttr
select(selector).removeAttr(attribute_name);
// example
select('.classname').removeAttr('value');
  1. animate
select(selector).animate(time, scale, rotate, rotateX, rotateY, translateX, translateY, skewX, skewY, opacity);
// example 
select('.classname').animate('3', '1','0','360','1','0','0', '0','0','1');
  1. on
select(selector).on(event_name,function(){
    // expresion
});
// example
select('button').on('click',function(){
     // expresion
});
  1. addClass
select(selector).addClass(class_name);
// example
select('#lastname').addClass('name');
  1. toggleClass
select(selector).toggleClass(class_name);
// example
select("button").on('click',function(){
    select(selector).toggleClass(class_name);
});
  1. html
select(selector).html(element);
// example
select('.classname').html('<p>paragraf</p>');
  1. text
select(selector).text(text);
// get text value
select(selector).text();
// example
select('.textarea').text('this value');
  1. value
select(selector).val(val);
// get value
select(selector).val();
// example
select('.inputclass').val('this value');
  1. insertBefore
select(selector).insertBefore(beforeBegin);
// example
select('p').insertBefore('<i>before begin</i>');
  1. insertAfter
select(selector).insertAfter(afterEnd);
// example
select('p').insertAfter('<i>after End</i>');
  1. insertFirst
select(selector).insertFirst(afterBegin);
// example
select('p').insertFirst('<i>after Begin</i>');
  1. insertLast
select(selector).insertLast(beforeEnd);
// example
select('p').insertLast('<i>Before End</i>');
  1. empty
select(selector).empty();
// example
select('.classname').empty();
  1. fetch use this template fetch https://github.com/yaza-putu/fetch-template , fetch like ajax jquery

About

Mini DOM manipulations like jquery, simple DOM manipulation to help you to handel basic DOM manipulations.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published