Posts

Showing posts with the label remove

javascript : .one(eventName,eventHandlerFunction)

  javascript : .one( eventName,eventHandlerFunction ) Target: Applicable with any DOM element. getElementById getElementsByTagName getElementsByClassName getElementsByName querySelector querySelectorAll Description : It register  eventHandlerFunction  only for one time execution with element on triggering of  eventName.  After executing eventHandlerFunction it automatically removed. eventName  : name of event that trigger the event handler function. eventHandlerFunction  : function that register with event and executes when event fired. The [ this ] refer to the object with that eventName is register within the eventHandlerFunction. The [ e ] argument of eventHandlerFunction received the event object of event. Note: It register only one eventHandlerFunction with one event with one element. Syntax: DOMElement.one( eventName, eventHandlerFunction ) DOMNodeList.one( eventName, eventHandlerFunction ) HTMLCollection.one( eventName, eventHandlerFunction ) Us...

javascript : .off(eventName.NameSpace)

  javascript : .off( eventName ) .off( eventName.NameSpace ) Target: Applicable with any DOM element. getElementById getElementsByTagName getElementsByClassName getElementsByName querySelector querySelectorAll Description : It remove  eventHandlerFunction  with element of  eventName.   It is the reverse of  on()  method. It is the easy way of  removeEventListener  method. eventName  : name of event that was registered with on() method. .NameSpace  : if event is register with NameSpace then for removing eventHandlerFunction NameSpace is used. Note: It clears the eventHandlerFunction from element register with on() method. Syntax: DOMElement.off( eventName ) DOMNodeList.off( eventName ) HTMLCollection.off( eventName ) Usase: document.getElementById('firstDiv').off( "click" ) It remove click eventHandlerFunction from element having id firstDiv. document.getElementsByTagName('div').off( "click" ) it remove click eventHandlerFunction fro...

javascript : Array.distinct()

  javascript : Array .distinct() Target: Applicable with  Array  Data Type. Description : It remove duplicate items from array and create new array having distinct values/objects. It is an extension method of array object defined in array prototype. Note: logic behind it is create a new array and push only that items which are not contains in array. Syntax: [] .distinct() return new array having unique and distinct values. Usase: [1,2,5,8,4,2,6,3,5,1,3,4,5].distinct() It return new array [1, 2, 5, 8, 4, 6, 3] "Welcome in myjs tutorials".toArray().distinct() It return new array ["W", "e", "l", "c", "o", "m", " ", "i", "n", "y", "j", "s", "t", "u", "r", "a"] "Welcome in myjs tutorials".toCharCodeArray().distinct() It return new array [{"char":"W","code":87},{"char":"...

javascript : domElement .remove()

  javascript : domElement .remove() Target: remove selected element from DOM. getElementById getElementsByTagName getElementsByClassName getElementsByName querySelector querySelectorAll Description : remove all element and it's children from DOM. Note: it return nothing. Syntax: DOMElement.remove() DOMNodeList.remove() HTMLCollection.remove() Usase: document.querySelector('container').remove() it remove container element from document document.querySelectorAll('ul').remove() it remove all UL elements from DOM. document.getElementsByClassName('output').remove() it remove all elements having class name output. 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.

javascript domElement .toggleClass(className)

  javascript domElement .toggleClass( className ) Target: Applicable with any DOM element. getElementById getElementsByTagName getElementsByClassName getElementsByName querySelector querySelectorAll Description : Toggle givent className with element(s) classList. That's mean if not exists then add and if exist then remove. Note: after toggling class of element/elements list it return itself for further processing. Syntax: DOMElement.toggleClass(' className ') DOMNodeList.toggleClass(' className ') HTMLCollection.toggleClass(' className ') Usase: document.getElementById('firstDiv').toggleClass(' myClass ') it toggle 'myClass' with the div having id firstDiv and return firstDiv element document.getElementsByTagName('div').toggleClass(' myClass ') the getElementsByTagName selects all div and toggleClass() method toggle class name 'myClass' with all divs and return getElementsByTagName result for further processing...

javascript : domElement .removeClass(className)

  javascript : domElement .removeClass( className ) Target: Applicable with any DOM element. getElementById getElementsByTagName getElementsByClassName getElementsByName querySelector querySelectorAll Description : remove givent className from element(s) classList if exists. Note: after removing class of element/elements list it return itself for further processing. Syntax: DOMElement.removeClass(' className ') DOMNodeList.removeClass(' className ') HTMLCollection.removeClass(' className ') Usase: document.getElementById('firstDiv').removeClass(' myClass ') it remove 'myClass' from the div having id firstDiv and return firstDiv element document.getElementsByTagName('div').removeClass(' myClass ') the getElementsByTagName selects all div and removeClass() method remove class name 'myClass' from all divs and return getElementsByTagName result for further processing you do not need to execute selector again. document....