javascript : domElement .addClass(className)

 

javascript : domElement .addClass(className)

Target:

Applicable with any DOM element.

  • getElementById
  • getElementsByTagName
  • getElementsByClassName
  • getElementsByName
  • querySelector
  • querySelectorAll

Description :

add givent className to element(s) classList.


Note: after adding class of element/elements list it return itself for further processing.

Syntax:

DOMElement.addClass('className')

DOMNodeList.addClass('className')

HTMLCollection.addClass('className')

Usase:

  1. document.getElementById('firstDiv').addClass('myClass')
    it add 'myClass' to the div having id firstDiv and return firstDiv element
  2. document.getElementsByTagName('div').addClass('myClass')
    the getElementsByTagName selects all div and addClass() method add class name 'myClass' to all divs and return getElementsByTagName result for further processing you do not need to execute selector again.
  3. document.getElementsByClassName('FirstDiv').addClass('myClass')
    the getElementsByClassName selects all div having class "FirstDiv" and addClass() method add class name 'myClass' to all divs and return getElementsByClassName result for further processing you do not need to execute selector again.
  4. document.getElementsByName('FirstDiv').addClass('myClass')
    the getElementsByName selects all elements having name attribute "FirstDiv" and addClass() method add class name 'myClass' to all elements and return getElementsByName result for further processing you do not need to execute selector again.
  5. document.querySelector('.FirstDiv').addClass('myClass')
    the querySelector selects first div having class "FirstDiv" and addClass() method add class name 'myClass' to it and return querySelector result for further processing you do not need to execute selector again.
  6. document.querySelectorAll('.FirstDiv').addClass('myClass')
    the querySelectorAll selects all div having class "FirstDiv" and addClass() method add class name 'myClass' to all divs and return querySelectorAll result for further processing you do not need to execute selector again.


Download MYJS.js

MyJs is a collection of java script extension methods that enhances the JavaScript objects, class object, DOM element, domElementsCollections, Date, String, Number and other data type. 

Include in you project landing page (master page) and it will extends your DOM and JavaScript Objects.

Comments

Post a Comment

Popular posts from this blog

javascript : String.right

  javascript : String .right( n ) Target: Applicable with  String  Data Type. Description : return last n number of charector from string. Syntax: String .right( n ) Usase: "abcdefghijklmnopqrstuvwxyz".right(7) It return string "tuvwxyz" Download MYJS.js MyJs is a collection of java script extension methods that enhances the JavaScript objects, class object, DOM element, domElementsCollections, Date, String, Number and other data type.  Include in you project landing page (master page) and it will extends your DOM and JavaScript Objects.
Read more

javascript : String.left

  javascript : String .left( n ) Target: Applicable with  String  Data Type. Description : return first n number of charector from string. Syntax: String .left( n ) Usase: "abcdefghijklmnopqrstuvwxyz".left(7) It return string "abcdefg" Download MYJS.js Include in you project landing page (master page) and it will extends your DOM and JavaScript Objects.
Read more

javascript : .nextAll()

  javascript : .nextAll() Target: Applicable with any DOM element. getElementById getElementsByTagName getElementsByClassName getElementsByName querySelector querySelectorAll select etc. Description : return DOMNodeList of next all sibling elements of selected element. Note: if selector is DOM Elements List then first node element's next all sibling nodes return as DOMNodeList. Syntax: DOMElement.nextAll() DOMNodeList.nextAll() HTMLCollection.nextAll() Usase: document.getElementById('firstDiv').nextAll() it search element having id firstDive and return all elements next to it in same parent as DOMNodeList. document.getElementsByTagName('div').nextAll() the getElementsByTagName selects all div and nextAll() method return first div's next all sibling nodes as DOMNodeList document.getElementsByClassName('FirstDiv').nextAll() the getElementsByClassName selects all div having class "FirstDiv" and nextAll() method return first element's next all ...
Read more