Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
JavaScript treats functions as objects and allow us to pass functions as parameter to another function and even return functions from other functions. In JavaScript, the functions are first class functions i.e. we can store them in variable, objects and array. The higher order arrow functions can take function, return them or do both.Following is the code for higher order arrow functions in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result, .sample { font-size: 18px; ... Read More
Following is the code for disabling arrow key in text area in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-weight: 500; font-size: 18px; color: blueviolet; } Disabling arrow keys in a text area Hello world this is some sample text inside the text area element Disable arrows Click on the above button to disable scrolling using arrows in the above textArea let ... Read More
Following is the code for setting full screen iframe in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-weight: 500; font-size: 18px; color: blueviolet; } .fullScreen { width: 100vw; height: 100vh; } Setting full screen iframe Fullscreen Click on the above button to make the iframe go fullscreen let BtnEle = document.querySelector(".Btn"); let frameEle = document.querySelector(".frame"); BtnEle.addEventListener("click", () => { frameEle.className = "fullScreen"; }); OutputOn clicking the ‘Fullscreen’ button −
The page load events in JavaScript are fired when the page loads or unloads. Following are the events −EventDescriptionDOMContentLoadedThis is fired when the dom tree has been built but external resources like stylesheets ,images, etc are still not loaded.LoadIt is fired when the browser fully loads all the resources.BeforeunloadIt is fired before the page and resources are being unloaded and can be used to confirm if the user really wants to leave.UnloadIt is fired when the page is fully unloaded.Following is the code for load events in JavaScript −Example Live Demo Document body { ... Read More
The scroll event in JavaScript is fired when the user interacts with a scrollbar by moving it up or down.Following is the code for scroll events in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; height: 150vh; /*To have a scrollbar*/ } .result{ font-size: 18px; color: blueviolet; font-weight: 500; } Scroll events in JavaScript Scroll the scrollbar to see some text in the above paragraph let resEle = document.querySelector(".result"); window.addEventListener("scroll", () => { resEle.innerHTML = "The scroll event has fired"; }); OutputOn scrolling down a little −
The touch events in JavaScript are fired when a user interacts with a touchscreen device.Following are the pointer event propertiesEventDescriptiontouchstart.It is fired when the touch point is placed on the touch surface.touchmoveIt is fired when the touch point is moved along the touch surface.touchendIt is fired when the touch point is removed from the touch surface.touchcancelIt is fired when the touch point has been disruptedFollowing is the code for touch events in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result, .sample ... Read More
The key-events happen whenever a user interacts with keyboard. There are mainly three key event types − keydown, keypress and keyup.EventDescriptionOnkeydownThis event fires when the user is pressing a keyOnkeypressThis event fires when the user presses the keyOnkeyupThis event fires when the user releases the key.Following is the code for key events in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 18px; color: blueviolet; font-weight: 500; } ... Read More
Following is the code for looping over regular expression matches in javaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result, .sample { font-size: 18px; color: blueviolet; font-weight: 500; } .sample { color: red; } Looping over regex matches There is a cat lying besides the cricket bat and chasing the rat CLICK HERE Click on the above button to match words ... Read More
You can use the concept of value(). Following is the JavaScript code −Example Live Demo Document FirstNumber SecondNumber: Add Two Nnumbers The addition is: function add() { var f = parseInt(document.getElementsByName('input1')[0].value);` var s =parseInt(document.getElementsByName('input2')[0].value); var result = f+s; document.getElementsByName('display')[0].value= result; } To run the above program, save the file name anyName.html(index.html) and right click on the file and select the option open with live server in VS code editor.OutputOn clicking the button, the value will be displayed in the textbox. The snapshot is as follows −
Following is the code to override derived properties in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result, .sample { font-size: 18px; font-weight: 500; color: rebeccapurple; } .result { color: red; } Override derived properties Before overriding After overriding CLICK HERE Click on the above button to override the above properties let sampleEle = document.querySelector(".sample"); let resEle ... Read More