Window innerWidth and innerHeight Properties in JavaScript

AmitDiwan
Updated on 16-Jul-2020 07:37:06

181 Views

The innerWidth property returns the width of the window content area and the innerHeight property returns the width of the window content area.Following is the code for window innerWidth and innerHeight properties in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result{       font-size: 20px;       font-weight: 500;    } Window innerWidth and innerHeight Properties CLICK HERE Click on the above button get the innerWidth and innerHeight of the window.    let ... Read More

Highlight Text Every Time Page Loads with JavaScript

AmitDiwan
Updated on 16-Jul-2020 07:33:13

308 Views

To highlight a text, every time page loads, use the for loop and the concept of −Example Live Demo Document    .yellow {       color: yellow;    }    .blue {       color: blue;    } My yellow Words, your blue Words    var ids = document.getElementById("pageLoads");    var loadColorWords = ids.innerHTML.split(" ");    for(var i = 0; i < loadColorWords.length; i++) {       if(loadColorWords[i] == "blue") {          loadColorWords[i] = "" + loadColorWords[i] + "";       } ... Read More

Add Class Odd and Even in HTML via JavaScript

AmitDiwan
Updated on 16-Jul-2020 07:26:08

616 Views

To add class, use nth-child(odd) and nth-child(even). Following is the code −Example Live Demo Document MongoDB Javascript Java MySQL    .subjectName:nth-child(odd) {       color: blue;    }    .subjectName:nth-child(even) {       color: purple;    } 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.Output

Type Casting in JavaScript

AmitDiwan
Updated on 16-Jul-2020 07:20:08

8K+ Views

Type casting means conversion of one data type to another explicitly. In JavaScript some of the most common methods to convert a datatype to either string using String(), to boolean using Boolean(), or to number using Number().Following is the code for type casting in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result, .sample {       font-size: 20px;       font-weight: 500;    } Type casting in JavaScript. 44 CLICK HERE Click on the above button ... Read More

What is JavaScript Type Coercion

AmitDiwan
Updated on 16-Jul-2020 07:17:18

220 Views

Type coercion means conversion of a datatype to another automatically or implicitly.Following is the code for JavaScript type coercion −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result,.sample {       font-size: 20px;       font-weight: 500;    } JavaScript type coercion 22 CLICK HERE Click on the above button to add the above number with 5.    let sampleEle = document.querySelector('.sample');    let resEle = document.querySelector(".result");    document.querySelector(".Btn").addEventListener("click", () => {       resEle.innerHTML = ' "22" + 5 = ' + sampleEle.innerHTML+5;    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

Explain the Finally Statement in JavaScript with Examples

AmitDiwan
Updated on 16-Jul-2020 07:12:21

174 Views

The finally statement always executes after try and catch block regardless of if there was an error or not.Following is the code for the finally statement in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result, .sample {       font-size: 20px;       font-weight: 500;    } Finally in Javascript CLICK HERE Click on the above button to call a variable before it is defined    let sampleEle = document.querySelector(".sample");    let ... Read More

Returning Values from a Constructor in JavaScript

AmitDiwan
Updated on 16-Jul-2020 07:10:03

185 Views

Following is the code for returning values from a constructor in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;    } Returning value from constructor CLICK HERE Click on the above button to return a object from constructor    let resEle = document.querySelector(".result");    function Human(){       this.firstName = 'Rohan';       this.lastName = 'Sharma';       this.age = 22;     ... Read More

Creating JavaScript Constructor Using the New Operator

AmitDiwan
Updated on 16-Jul-2020 07:07:23

152 Views

Following is the code for creating a JavaScript constructor using the ‘new’ operator −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;    } JavaScript constructor using new CLICK HERE Click on the above button to create JavaScript constructor using new operator    let resEle = document.querySelector(".result");    function Human(firstName, lastName, age){       this.firstName = firstName;       this.lastName = lastName;       this.age ... Read More

Add Property Method to JavaScript Constructor

AmitDiwan
Updated on 16-Jul-2020 07:05:10

224 Views

Following is the code to add a property, method to a JavaScript constructor −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;       } Add property, method to javaScript constructor CLICK HERE Click on the above button to add property, method to constructor    let resEle = document.querySelector(".result");    function Human(firstName, lastName){       this.firstName = firstName;       this.lastName = lastName;    } ... Read More

Stop a Function During Its Execution in JavaScript

AmitDiwan
Updated on 16-Jul-2020 07:04:12

5K+ Views

To stop a function during its execution, use the concept of −document.getElementById().addEventListener().Example Live Demo Document Call the function Stop the function execution    document.getElementById("call").addEventListener("click", callFunction);    document.getElementById("halt").addEventListener("click", haltFunction);    var timeValue = null;    function callFunction() {       timeValue = setInterval(function() {          console.log("The call() is being executed....");       }, 1000);    }    function haltFunction() {       clearInterval(timeValue);    } To run the above program, save the file name anyName.html(index.html) and right click on the file and select ... Read More

Advertisements