Found 10483 Articles for Web Development

Explain JavaScript text alert

AmitDiwan
Updated on 21-Jul-2020 07:32:54

225 Views

The JavaScript alert() function is used to display a popup message to the user.Following is the code for the JavaScript alert() function −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    } Javascript text alert CLICK HERE Click on the above button to trigger the alert popup    let BtnEle = document.querySelector(".Btn");    BtnEle.addEventListener("click", () => {       alert("You pressed the button");    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

The image() object in JavaScript.

AmitDiwan
Updated on 21-Jul-2020 07:31:25

3K+ Views

The image object represents the HTML  element.Following is the code for image object in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } The image() object in JavaScript CLICK HERE Click on the above button to display an image    let resEle = document.querySelector(".result");    let BtnEle = document.querySelector(".Btn");    let newImage = new Image(500, 300);    newImage.src = "https://i.picsum.photos/id/195/536/354.jpg";    BtnEle.addEventListener("click", () => {       resEle.appendChild(newImage);    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

How to apply the reduce method for objects in JavaScript?

AmitDiwan
Updated on 21-Jul-2020 07:28:49

182 Views

Following is the code to apply reduce method to objects 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;    } Reduce method for objects in JavaScript { a:6, b:2, c:9, d:5, } CLICK HERE Click on the above button to multiply the above object values together    let resEle ... Read More

Can we convert two arrays into one JavaScript object?

AmitDiwan
Updated on 21-Jul-2020 07:26:34

207 Views

Following is the code to convert two arrays into one JavaScript object −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;    } Convert two arrays into one JavaScript object ["firstName", "lastName", "age"]["Rohan", "Sharma", 21] CLICK HERE Click on the above button to create an object from the above two arrays ... Read More

How to assign values to an array with null/empty objects in JavaScript?

AmitDiwan
Updated on 21-Jul-2020 07:24:10

914 Views

Following is the code to assign values to an array with null/empty objects using JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Assign values to an array with null/empty objects CLICK HERE Click on the above button to assign values to empty object inside arrObj    let resEle = document.querySelector(".result");    let BtnEle = document.querySelector(".Btn");    let obj = ... Read More

How to create a multidimensional JavaScript object?

AmitDiwan
Updated on 21-Jul-2020 07:22:08

4K+ Views

Following is the code to create a multidimensional JavaScript object −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple; } Create a multidimensional JavaScript object CLICK HERE Click on the above button to create and display a multidimensional object    let resEle = document.querySelector(".result");    let BtnEle = document.querySelector(".Btn");    BtnEle.addEventListener("click", () => {       let obj = {          firstName: "Rohan",          lastName: "Sharma",          school: {             name: "St Marks",             address: {                city: "Dwarka",                state: "Delhi",             },          },       };       console.log(obj);    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button and inspecting the output in console −

How to access an object through another object in JavaScript?

AmitDiwan
Updated on 21-Jul-2020 07:20:15

478 Views

Following is the code to access an object through another object in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Access an object through another object in JavaScript CLICK HERE Click on the above button to display obj2    let resEle = document.querySelector(".result");    let BtnEle = document.querySelector(".Btn");    let obj = {       firstName: "Rohan",   ... Read More

How to create a unique ID for each object in JavaScript?

AmitDiwan
Updated on 21-Jul-2020 07:17:53

1K+ Views

Following is the code to create a unique ID for each object −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Create a unique ID for each object CLICK HERE {       if (obj.id === obj1.id) {          resEle.innerHTML = "The id generated are not unique ";       }       else {          resEle.innerHTML = "The id generated is unique for each object";       }    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

How to draw a circle in JavaScript?

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

2K+ Views

Following is the code to draw a circle in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .circleCanvas {       border: 3px solid #110101;    } Draw a circle in JavaScript CLICK HERE Click on the above button to create a circle in the above canvas element    let canvasEle = document.querySelector(".circleCanvas");    let BtnEle = document.querySelector(".Btn");    BtnEle.addEventListener("click", () => {       var circle = canvasEle.getContext("2d");       circle.beginPath();       circle.arc(180, 100, 90, 0, 2 * Math.PI);       circle.stroke();    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

Single dimensional array vs multidimensional array in JavaScript.

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

716 Views

Following is the code for single and multidimentsional array 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;    } Single dimensional array vs multidimensional array Single dimensional Array Multidimensional Array CLICK HERE Click on the above button to display single and multidimensional array    let resEle = document.querySelector(".result");    let ... Read More

Advertisements