Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
To check whether a checkbox is checked with JavaScript, the code is as follows −Example Live Demo Displaying textBox when a checkbox is checked Checkbox: Checkbox is checked!!! document.querySelector(".check").addEventListener("click", checkFunction); function checkFunction() { var checkBox = document.querySelector(".check"); var textBox = document.querySelector(".textBox"); if (checkBox.checked == true) { textBox.style.display = "block"; } else { textBox.style.display = "none"; } } OutputThis will produce the following output −On clicking the checkbox −
To create a responsive navigation menu with a login form inside of it, the code is as follows −Example Live Demo Document body { margin: 0px; margin-top: 10px; padding: 0px; } nav { width: 100%; background-color: rgb(39, 39, 39); overflow: auto; height: auto; } .links { display: inline-block; text-align: center; padding: 14px; color: rgb(178, 137, 253); ... Read More
The ArrayBuffer.isView() method tells us if the passed parameter value is an ArrayBuffer view or not.Following is the code for ArrayBuffer.isView() method −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 20px; font-weight: 500; } JavaScript ArrayBuffer.byteLength property CLICK HERE Click on the above button to check the above value is array buffer view or not let fillEle = document.querySelector(".sample"); var buffer = new ArrayBuffer(8); var view1 = new DataView(buffer); view1.setInt16(0, 0x2721); fillEle.innerHTML = view1.getInt16(0).toString(16); document.querySelector(".Btn").addEventListener("click", () => { ... Read More
The byteLength property return the length of an ArrayBuffer in byte. Following is the code for ArrayBuffer.byteLength property −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 20px; font-weight: 500; } JavaScript ArrayBuffer.byteLength property CLICK HERE Click on the above button to see the array buffer size let fillEle = document.querySelector(".sample"); var buffer = new ArrayBuffer(8); var view1 = new DataView(buffer); view1.setInt16(0, 0x2721); fillEle.innerHTML = view1.getInt16(0).toString(16); document.querySelector('.Btn').addEventListener('click',()=>{ fillEle.innerHTML = 'The array buffer size is '+view1.byteLength+' bytes'; }) OutputOn clicking the “CLICK HERE” button −
The JavaScript array.values() return an iterator object that contains all the values of a given array.Following is the code for array.values() function −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 20px; font-weight: 500; } JavaScript array.values() CLICK HERE Click on the above button to see the array values only let fillEle = document.querySelector(".sample"); let arr = ["cow", "bull", "lion", "tiger", "sheep"]; var entries = arr.entries(); for (let x of entries) fillEle.innerHTML += x + ""; document.querySelector(".Btn").addEventListener("click", () => { ... Read More
The JavaScript array.toLocaleString() function returns the elements of an array as a string and are separated by a locale specific string such as comma. It can take locale as parameter which specifies the language tag in which the string is to be converted.Following is the code for the array.toLocaleString() functionExample Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 20px; font-weight: 500; } JavaScript array.toLocaleString() CLICK HERE Click on the above button to convert the array to UK locale string let ... Read More
The JavaScript arrayBuffer.slice() method returns a new arrayBuffer whose contents are copy of the another arrayBuffer from begin, inclusive till end, exclusive.Following is the code for the arrayBuffer.slice() 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: black; } JavaScript arrayBuffer.slice() property Original array buffer: Sliced array buffer: CLICK HERE Click on the above button to slice the array buffer to make ... Read More
The JavaScript date.@@toPrimitive() function converts the date object into a primitive value.Following is the code for date formats in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 18px; font-weight: 500; } JavaScript date.@@toPrimitive() functiont CLICK HERE Click on the above button to see the date as primitive value let fillEle = document.querySelector(".sample"); let date = new Date(); let primitiveDef = date[Symbol.toPrimitive]("default"); let primitiveNum = date[Symbol.toPrimitive]("number"); document.querySelector(".Btn").addEventListener("click", () => { fillEle.innerHTML += "Hint = default :" + primitiveDef + ""; fillEle.innerHTML += "Hint = number :" + primitiveNum; }); OutputOn clicking the “CLICK HERE” button −
The JavaScript File WebAPI file.type property indicated the media type of the file.Following is the code for the File WebApi File.type property −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 18px; font-weight: 500; color: red; } JavaScript file.type property Upload a file using the above input type to get its file type let resultEle = document.querySelector(".result"); document .querySelector(".fileInput") .addEventListener("change", (event) => { resultEle.innerHTML += "File name = " + event.target.files[0].name + ""; resultEle.innerHTML += "File type = " + event.target.files[0].type; }); OutputOn clicking the “Choose file” button −
The JavaScript File WebAPI file.size property returns the size of file in bytes.Following is the code for the File WebApi File.size property −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 18px; font-weight: 500; color: red; } JavaScript file.size property Upload a file using the above input type to get its file size let resultEle = document.querySelector(".result"); document .querySelector(".fileInput") .addEventListener("change", (event) => { resultEle.innerHTML += "File name = " + event.target.files[0].name + ‘; resultEle.innerHTML ... Read More