Found 9291 Articles for Object Oriented Programming

Add oninput attribute to HTML element with JavaScript?

AmitDiwan
Updated on 16-Jul-2020 06:54:17

478 Views

For this, use the concept of document.getElementById() along with addEventListener(). Following is the JavaScript code −Example Live Demo Document Enter the value:    document.getElementById('enterValue').addEventListener("input", function () {       console.log('you have entered the value');    }); To run the above program, save the file nameanyName.html(index.html) and right click on the file and select the option open with live server in VS code editor.OutputWhen user enters a value −

How to create a JSON object in JavaScript? Explain with an example.

AmitDiwan
Updated on 16-Jul-2020 06:54:14

374 Views

Following is the code to create a JSON object in JavaScript.Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;    } JSON object in JavaScript JSON OBJECT CLICK HERE Click on the above button to create a JSON object and display it    let resEle = document.querySelector(".result");    let obj = {       firstName:'Rohan',       lastName: 'Sharma',       Age:14,    }    document.querySelector(".Btn").addEventListener("click", () => {       for(i in obj){          resEle.innerHTML += 'key = '+i+' value = ' + obj[i] + '';       }    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

Get number from user input and display in console with JavaScript

AmitDiwan
Updated on 16-Jul-2020 06:52:55

2K+ Views

You can use # to get the value when user clicks the button using document.querySelector(“”); Following is the JavaScript code −Example Live Demo Document Example: choose a number between 1 to 100 Give a number: Click Me    function example() {       let btn = document.querySelector("#choose");       let randomNumber = Math.ceil(Math.random() * 100);       btn.onclick = function() {          let givenNumber = document.querySelector("#inputNumber").value;          let valueInt = parseInt(givenNumber, 100);   ... Read More

How to create a constant array in JavaScript? Can we change its values? Explain.

AmitDiwan
Updated on 16-Jul-2020 06:51:41

2K+ Views

To create a const array in JavaScript we need to write const before the array name. The individual array elements can be reassigned but not the whole array.Following is the code to create a constant array in JavaScript.Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result, .sample {       font-size: 20px;       font-weight: 500;    } Const array in JavaScript CLICK HERE Click on the above button to change array values and reassign the ... Read More

Random color generator in JavaScript

AmitDiwan
Updated on 16-Jul-2020 06:50:51

1K+ Views

Following is the syntax to generate random color in JavaScript −$("#yourIdName").css("background-color", yourCustomFunctionNameToGetRandomColor());Following is the JavaScript code −Example Live Demo Document Click the button to get random color    //The getColorCode() will give the code every time.    function getColorCode() {       var makeColorCode = '0123456789ABCDEF';       var code = '#';       for (var count = 0; count < 6; count++) {          code =code+ makeColorCode[Math.floor(Math.random() * 16)];       }       return code;    }    //Function ... Read More

Hide div that contains specific text with JavaScript?

AmitDiwan
Updated on 16-Jul-2020 06:46:35

1K+ Views

At first, you need to extract the extract the div class with the help of getElementsByClassName() and iterate over the for loop and use the OR condition to show the specific text.Also, set yourDiv.style.display=’none’.Following is the JavaScript code −Example Live Demo Document header content footer    let attribute = document.getElementsByClassName('block');    for (let i = 0; i < attribute.length; i++) {       let impDiv = attribute[i];       let value = impDiv.innerHTML.trim();       if (value == 'header' || value == ... Read More

How to preview an image before it is uploaded in JavaScript?

AmitDiwan
Updated on 16-Jul-2020 06:43:59

164 Views

To upload an image, use FileReader() in JavaScript. Following is the JavaScript code −Example Live Demo Document    function readImage(fileInput) {       if (fileInput.files && fileInput.files[0]) {          var takingInputFile = new FileReader();          takingInputFile.onload = function(event) {             $('#chooseImage').attr('src', event.target.result);          }          takingInputFile.readAsDataURL(fileInput.files[0]);       }    }    $("#yourImage").change(function() {       readImage(this);    }); 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

Explain the Error Name Values in JavaScript with examples.

AmitDiwan
Updated on 15-Jul-2020 14:14:45

195 Views

The error name value is used for setting or returning the error name. The error name can return the below values.Sl.NoError Name & Description1EvalErrorIt represents an error in the eval() function2RangeErrorIt happens when a numeric value is out of its range3ReferenceErrorIt happens when an illegal reference has occured4SyntaxErrorIt represents a syntax error5TypeErrorIt represents a type error6URIErrorIt represents an error in the encodeURI().ExampleFollowing is the code for the error name values in JavaScript − Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {     ... Read More

Explain try and catch statements in JavaScript with examples.

AmitDiwan
Updated on 15-Jul-2020 14:11:20

118 Views

The try statement allows us execute a block of code and test for errors. Those errors are then caught and handle by the catch statement.Following is the code for try and catch statement in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 20px;       font-weight: 500;    } Try and catch in JavaScript CLICK HERE Click on the above button to call a variable before it is defined ... Read More

How to test and execute a regular expression in JavaScript?

AmitDiwan
Updated on 15-Jul-2020 14:08:31

218 Views

Following is the code for testing and executing a regular expression in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result, .sample {       font-size: 20px;       font-weight: 500;    } Testing and executing regular expressions CLICK HERE Click on the above button to test and execute the regular expression    let sampleEle=document.querySelector('.sample');    let resEle = document.querySelector('.result');    let str = 'Hello world. This is a beautiful world';    sampleEle.innerHTML ... Read More

Advertisements