Found 10483 Articles for Web Development

Passing parameters to callback functions JavaScript

AmitDiwan
Updated on 17-Jul-2020 11:35:38

441 Views

Following is the code for passing parameters to callback functions in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result{       font-size: 20px;       font-weight: 500;       color: blueviolet;    } Passing parameters to callback functions CLICK HERE Click on the above button to pass parameter to callback function add2 and call it    let resEle = document.querySelector(".result");    function add2(a) {       return a + 2;    }    function multiply9(fn, num) {       return fn(num) * 9;    }    document.querySelector(".Btn").addEventListener("click", () => {       resEle.innerHTML = "The number returned = " + multiply9(add2, 8);    }); OutputOn clicking the ‘CLICK HERE’ button −

No. of ways to empty an array in JavaScript

AmitDiwan
Updated on 17-Jul-2020 11:33:16

203 Views

To empty an array in JavaScript, there are four ways −Setting to new Array − In this we set our array variable to a new empty array.Using length property − In this we set the length property of our array to 0.Using pop − In this we continuously pop the array elements till the length reaches to 0.Using splice − In this we put the start index as 0 and the no of elements to removed as array.length-1.Following is the code to display no. of ways to empty an array in JavaScript −Example Live Demo Document ... Read More

How to implement asynchronous loop in JavaScript?

AmitDiwan
Updated on 17-Jul-2020 11:31:59

187 Views

Following is the code to implement asynchronous loop in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;       color: blueviolet;    } Asynchronous loop in JavaScript CLICK HERE Click on the above button to start our asynchronous loop    let resEle = document.querySelector(".result");    async function waitTime(time) {       return new Promise((resolve) => {          setTimeout(resolve, time);       });    }    async function someFunction() {       for (let i = 0; i < 10; i++) {          await waitTime(2000);          resEle.innerHTML += "i = " + i + "";       }    }    document.querySelector(".Btn").addEventListener("click", () => {       someFunction();    }); OutputOn clicking the ‘CLICK HERE’ button the loop will print 1 to 10 −

What is the best way to add an event in JavaScript?

AmitDiwan
Updated on 17-Jul-2020 09:12:58

140 Views

The best way to add an event to any element is to use the addEventListener() method.Following is the code to add an event in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result{       font-size: 20px;       font-weight: 500;       color: rebeccapurple;    } Adding event in JavaScript CLICK HERE Click on the above button to increment the font size of above text    let resEle = document.querySelector(".result");    document.querySelector(".Btn").addEventListener("click", () => {       resEle.style.fontSize = "34px";    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

JavaScript program to decrement a date by 1 day

AmitDiwan
Updated on 17-Jul-2020 09:11:04

263 Views

Following is the code to decrement a date by 1 day in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result,.sample {       font-size: 20px;       font-weight: 500;       color: rebeccapurple;    } JavaScript program to decrement a date by 1 day Decrement Click on the above button to decrement the date by one day    let resEle = document.querySelector(".result");    let sampleEle = document.querySelector(".sample");    let date = new Date();    sampleEle.innerHTML = date;    document.querySelector(".Btn").addEventListener("click", () => {       date.setDate(date.getDate() - 1);       resEle.innerHTML = "New Date = " + date;    }); OutputThe above code will produce the following output −On clicking the ‘Decrement’ button −

How to find keys of a hash in JavaScript?

AmitDiwan
Updated on 17-Jul-2020 09:09:10

422 Views

Following is the code for finding keys of a hash in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;    } Find keys of a hash in JavaScript DISPLAY Click on the above button to display the hash keys    let resEle = document.querySelector(".result");    let obj = {       firstName: "Rohan",       lastName: "Sharma",       age: 22,    };    document.querySelector(".Btn").addEventListener("click", () => {       resEle.innerHTML += "object keys are " + Object.keys(obj);    }); OutputThe above code will produce the following output −On clicking the ‘DISPLAY’ button −

JavaScript regex program to display name to be only numbers, letters and underscore.

Alshifa Hasnain
Updated on 27-Feb-2025 19:27:31

554 Views

In this article, we will learn the regex program to display names to be only numbers, letters, and underscores In Java. Validating user input is essential for maintaining data integrity and security in web applications.  JavaScript Regex for Name Validation Regular expressions regex is probably more powerful in defining patterns to search for in the text validations. A typical validation is confirming a name consists of only letters (A-Z, a-z), digits (0-9), and underscore (_). To ensure that a name contains only letters we can use the following regex − /^\w+$/ ^: Start of the string ... Read More

How can we validate decimal numbers in JavaScript?

AmitDiwan
Updated on 17-Jul-2020 09:02:49

523 Views

Following is the code to validate decimal numbers in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;    } Validate decimal numbers in JavaScript CHECK Click the above button to check if a valid decimal number is entered or not    let resEle = document.querySelector(".result");    document.querySelector(".Btn").addEventListener("click", () => {       var str = document.querySelector(".num").value;       var regex = /^[-+]?[0-9]+\.[0-9]+$/;   ... Read More

How can I remove a child node in HTML using JavaScript?

AmitDiwan
Updated on 17-Jul-2020 08:58:54

202 Views

Following is the code to remove a child node in HTML using JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;    } Removing a child node in HTML using JavaScript Cow Lion Tiger Buffalo CLICK HERE Click the above button to remove the first list element from the above list    let resEle = document.querySelector(".result");    let animalList = document.querySelector(".animal");    document.querySelector(".Btn").addEventListener("click", () => {       animalList.removeChild(animalList.childNodes[0]);       animalList = animalList;    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

How to load a JavaScript file Dynamically?

AmitDiwan
Updated on 17-Jul-2020 08:56:27

640 Views

Following is the code to load a JavaScript file dynamically −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;    } Load a JavaScript file Dynamically CLICK HERE Click the above button to load external JavaScript    let resEle = document.querySelector(".result");    document.querySelector(".Btn").addEventListener("click", () => {       var jsRef = document.createElement("script");       jsRef.setAttribute("src", "sample.js");       document.getElementsByTagName("head")[0].appendChild(jsRef);    }); script.jsresEle.innerHTML='JavaScript has been loaded';OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

Advertisements