Use document.getElementById().innerHTML for this. Following is the JavaScript code −Example Document function display(){ var storedValue = document.getElementById('getValue').innerHTML.value="This is the value"; console.log("The value is==="+storedValue); } 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.Following is the output. When you will click the mouse and place the arrow key, you will get the following output.The snapshot is as follows −
The onchange event triggers when an element changes. You need to use below syntax.onchange="yourFunctionName(this);"Example Live Demo Document Choose Color function showValue(c){ console.log(c.value); } 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.OutputAfter clicking the input type color, you will get the color value in console −
Following is the JavaScript code to make a format like ABC-1234 −Example Live Demo Document ABC1234 function joinTheDashSymbol(m, r1,r2,r3,r4,r5) { if (r1) return [r1,r2,r3].join('-'); else return [r4,r5].join('-'); } $(".formatting").text(function(i, words) { words = words.replace(/^(\d{3})(\d{3})(\d{4})|([A-Z]{3})(\d{4})$/, joinTheDashSymbol); return words; }); 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
Display in alert by using alert(window()). Following is the syntax −alert(window['yourVariableName' + 'yourVariableName' + otherVariableName]);Example Live Demo Document var globalVariablelocal_print100=100; print100=1; alert(window['globalVariable' + 'local_' + print100]); 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
Following is the code for object de-structuring in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample, .result { font-size: 18px; font-weight: 500; color: red; } .result { color: rebeccapurple; } Object de-structuring in JavaScript. CLICK HERE Click on the above button to destructure the object above let sampleEle = document.querySelector(".sample"); let resultEle = document.querySelector(".result"); let obj = { ... Read More
The JavaScript Array.prototype.sort() method is used for sorting an array. The order of sorting can be alphabetic, numeric, ascending or descending.Following is the code for the Array.prototype.sort() method −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample, .result { font-size: 18px; font-weight: 500; color: red; } .result { color: rebeccapurple; } JavaScript Array.prototype.sort() method CLICK HERE Click on the above button to sort the ... Read More
The JavaScript Array.prototype.flat() method is used to flatten an array recursively up to a specified depth. It doesn’t manipulate the original array but creates a new flattened array.Following is the code for the Array.prototype.flat() method −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result,.sample { font-size: 20px; font-weight: 500; } Array.prototype.flat() method { let store = arr.flat(1); store.forEach((item,index) => { resEle.innerHTML += index + ' : ' + item + ''; }); }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −
The JavaScript Array.prototype.flatMap() function flattens the given nested array into a new flat array.Following is the code for the Array.prototype, flatMap() method −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 20px; font-weight: 500; } JavaScript Array flatMap() CLICK HERE Click on the above button to convert the nested array to flat array let fillEle = document.querySelector(".sample"); let arr = ["cow", ["bull", "lion", "tiger"], "sheep"]; for (x ... Read More
The optional catch binding introduced in ES2019 allows us to remove the surrounding parentheses of a catch binding i.e. we don’t need to use a variable to store the error object. It is useful especially if we know about the error in advance or even if want to react to an error without knowing about it.Following is the code for the optional catch binding in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 20px; ... Read More
The String.trimStart() method is used to remove whitespace from the string beginning while the String.trimEnd() method removes whitespace from the end of the string.Following is the code for the String.trimStart() and String.trimEnd() methods −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result,.sample { font-size: 20px; font-weight: 500; } String.trimStart() and String.trimEnd() methods { resEle.innerHTML = "trimStart() :" + str.trimStart() + "|"; resEle.innerHTML += "trimEnd() :" + str.trimEnd() + "|"; }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −
 
 Data Structure
 Data Structure Networking
 Networking RDBMS
 RDBMS Operating System
 Operating System Java
 Java MS Excel
 MS Excel iOS
 iOS HTML
 HTML CSS
 CSS Android
 Android Python
 Python C Programming
 C Programming C++
 C++ C#
 C# MongoDB
 MongoDB MySQL
 MySQL Javascript
 Javascript PHP
 PHP