Web Development Articles - Page 518 of 1049

The JSON parse() method is used for parsing a JSON string and then creating a JavaScript object from it.Following is the code for JSON parse() method −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .sample {       font-size: 18px;       font-weight: 500;       color: red;    } JSON parse() Method {"name":"Rohan", "sports":["Cricket", "Football"], "country":"India"} CLICK HERE Click on the above button to parse the above JSON string    let ... Read More

To generate HTML using JSON data, the code is as follows −Note − JSONPlaceholder is a fake Online REST API for Testing and PrototypingExample Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .sample {       font-size: 18px;       font-weight: 500;       color: red;    } JSON arrays EMPLOYEE NAME CLICK HERE Click on the above button to fill the employee table    let sampleEle = document.querySelector(".employee");    document.querySelector(".Btn").addEventListener("click", () => {       fetch("https://jsonplaceholder.typicode.com/users")       .then((response) => response.json())       .then((result) => {          result.forEach((element) => {             sampleEle.innerHTML += "" + element.name;          });       });    }); OutputOn clicking the ‘CLICK HERE’ button −

Arrays in JSON are similar to Arrays in JavaScript. JavaScript JSON arrays looks like this −let obj = {    name:'Rohan',    sports : ['cricket','Football','volleyball','hockey'] }Following is the code for JSON arrays in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .sample {       font-size: 18px;       font-weight: 500;    } JSON arrays CLICK HERE Click on the above button to access JSON array    let sampleEle = document.querySelector(".sample");    let obj = {       name:'Rohan',  sports : ['cricket','Football','volleyball','hockey']    }    document.querySelector(".Btn").addEventListener("click", () => {       obj.sports.forEach(item=>{          sampleEle.innerHTML += item + '';       })    }); OutputOn clicking the ‘CLICK HERE’ button −

The JavaScript infinity property displays infinity if the upper limit of the floating-point number is exceed and − infinity if the lower limit of the floating point number has has been exceeded.Following is the code for JavaScript infinity property −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .num {       font-size: 18px;       font-weight: 500;    } JavaScript Infinity property 1.797693134862315E+10308 -1.797693134862315E+10308 CLICK HERE Click on the above button to add and subtract the above floating ... Read More

The JavaScript Immediately Invoked Function Expressions (IIFE) is a JavaScript function that executes immediately after it has been defined so there is no need to manually invoke IIFE.Following is the code for Immediately Invoked Function Expressions (IIFE) in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .sample {       font-size: 18px;       font-weight: 500;    } JavaScript Immediately Invoked Function Expressions (IIFE)    let sampleEle = document.querySelector(".sample");    (function () {       sampleEle.innerHTML ="This code is invoked immediately as soon as it is defined";    })(); Output

The global property in JavaScript returns true or false depending upon if the ‘g’ modifier is set or not.Following is the code for JavaScript global property −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .sample, .result {       font-size: 18px;       font-weight: 500;    } JavaScript global Property Some random text inside a div CLICK HERE Click on the above button to check if the 'g' modifier is set or not    let ... Read More

The getTime() method in JavaScript returns the number of milliseconds elapsed since 1st January 1970.Following is the code for getTime() function −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .sample {       font-size: 18px;       font-weight: 500;    } JavaScript getTime() Method CLICK HERE Click on the above button to get the seconds elapsed since January 1st 1970    let sampleEle = document.querySelector(".sample");    let date = new Date();    document.querySelector(".Btn").addEventListener("click", () => {       sampleEle.innerHTML = "Seconds elapsed since 01/01/1970 = " + date.getTime();    }); OutputOn clicking the “CLICK HERE” button −

In JavaScript, the Object.getPrototypeOf() method is used to get the prototype of a specified object. This method is used to check prototype of user created object and is often used to compare if the two given objects have the same prototype or not. This method is important for JavaScript's prototype-based inheritance, helping developers understand and work with the prototype chain of objects. In this article, we will look at into the syntax, usage, and examples of getPrototypeOf(). Syntax of the Object.getPrototypeOf() Function The basic syntax for Object.getPrototypeOf() is as follows: Object.getPrototypeOf(obj) obj(parameter): The object whose prototype is to be ... Read More

To get the text of the span element in JavaScript, the code is as follows −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .sample {       font-size: 18px;       font-weight: 500;    } JavaScript Date Methods This is some sample text inside a span element CLICK HERE Click on the above button to get the span text    let sampleEle = document.querySelector(".sample");    let spanEle = document.querySelector(".test");    document.querySelector(".Btn").addEventListener("click", () => {       sampleEle.innerHTML = "The span text is = " + spanEle.innerHTML;    }); OutputOn clicking the “CLICK HERE” button −

The Advanced Selectors in CSS includes Adjacent Sibling selector, attribute selector, direct child selector, nth-of-type selector, etc. It also includes General Sibling Selector, an example is shown below:h1 ~ h3Example of direct child selector −div > spanFollowing is the code showing advanced selectors in CSS −Example Live Demo #red {    color: red; } .green {    background: green; } ul:nth-of-type(1) {    background: rgb(0, 174, 255); } ul + h3 {    border: 4px solid rgb(19, 0, 128); } a[href="https://www.wikipedia.org"] {    font-size: 25px; } h1 ~ h3 {    font-size: 40px; } div > span {   ... Read More