javascript : Dom Elements .hide()

 

javascript : DomElements .hide()

Target:

Applicable with any DOM element.

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

Description :

set dom element style display none.


Note: after setting the style display of element/elements list it return itself for further processing.

Syntax:

DOMElement.hide()

DOMNodeList.hide()

HTMLCollection.hide()

Usase:

  1. document.getElementById('firstDiv').hide()
    it hides the div having id firstDiv and return firstDiv element
  2. document.getElementsByTagName('div').hide()
    the getElementsByTagName selects all div and hide() method hides all divs and return getElementsByTagName result for further processing you do not need to execute selector again.
  3. document.getElementsByClassName('FirstDiv').hide()
    the getElementsByClassName selects all div having class "FirstDiv" and hide() method hides all divs and return getElementsByClassName result for further processing you do not need to execute selector again.
  4. document.getElementsByName('FirstDiv').hide()
    the getElementsByName selects all elements having name attribute "FirstDiv" and hide() method hides all elements and return getElementsByName result for further processing you do not need to execute selector again.
  5. document.querySelector('.FirstDiv').hide()
    the querySelector selects first div having class "FirstDiv" and hide() method hide it and return querySelector result for further processing you do not need to execute selector again.
  6. document.querySelectorAll('.FirstDiv').hide()
    the querySelectorAll selects all div having class "FirstDiv" and hide() method hides 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