The HTML DOM KeyboardEvent metaKey property returns the Boolean value (true/false) corresponding to if meta key was pressed using an event or not.SyntaxFollowing is the syntax −Returning booleanValue −event.metaKeyExampleLet us see an example for KeyboardEvent metaKey property − Live Demo KeyboardEvent metaKey    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } KeyboardEvent-metaKey Editor: I Dare you ... Read More

The HTML DOM KeyboardEvent loaction property returns the number corresponding to location of key pressed on the keyboard.SyntaxFollowing is the syntax −Returning location of pressed key −event.locationNumbersHere, number returned can be the following −numberDescriptions0It represents almost all values on the keyboard. (every key in the middle section of keyboard, eg: ‘Q’, ’\’, ’spacebar’)1It represents the values on the left-keyboard. (every key in the left section of keyboard, eg: ‘left ctrl’, ’left Shift’, ’left alt’)2It represents the values on the right-keyboard. (every key in the right section of keyboard, eg: ‘right ctrl’, ’right Shift’, ’right alt’)3It represents the values on the ... Read More

The KeyboardEvent keyCode property returns the unicode character codes corresponding to character that was pressed using an event.Note − Use key property instead for accurate resultsSyntaxFollowing is the syntax −Returning latest typed character’s keyCode −event.keyCodeExampleLet us see an example for KeyboardEvent keyCode property − Live Demo KeyboardEvent keyCode    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } KeyboardEvent-keyCode ... Read More

The KeyboardEvent key property returns the key identifier corresponding to the key pressed using an event.SyntaxFollowing is the syntax −Returning latest typed character’s identifier −event.keyExampleLet us see an example for KeyboardEvent key property − Live Demo KeyboardEvent key    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } KeyboardEvent-key Fill in the blanks: ... Read More

The getModifierState() method returns true/false if the provided modifier key was pressed or not.SyntaxFollowing is the syntax −Calling getModifierState() with parameter as modifier keyevent.getModifierState(“modifierKey”)Modifier KeysHere, “modifierKey” can be the following −modifierKeyAltAltGraphCapsLockControlMetaNumLockScrollLockShiftExampleLet us see an example for getModifierState() method − Live Demo KeyboardEvent getModifierState()    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } KeyboardEvent getModifierState( ) Password: ... Read More

The KeyboardEvent code property returns the key identifier corresponding to the key pressed using an event.Note − Use key property instead for accurate resultsSyntaxFollowing is the syntax −Returning latest typed character’s code −event.codeExampleLet us see an example for KeyboardEvent code property − Live Demo KeyboardEvent code    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } KeyboardEvent-code Press a ... Read More

The KeyboardEvent charCode property returns the unicode character codes corresponding to character that was pressed using an event.Note − Use key property instead for accurate resultsSyntaxFollowing is the syntax −Returning latest typed character’s charCode −event.charCodeExampleLet us see an example for KeyboardEvent charCode property − Live Demo KeyboardEvent charCode    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } KeyboardEvent-charCode Fill ... Read More

The Kbd Object represents an inline element which displays monospace font by default.SyntaxFollowing is the syntax −Creating a elementvar kbdObject = document.createElement(“KBD”)ExampleLet us see an example for Kbd object element − Live Demo Kbd Object    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } Kbd Object Keyboard Input:    var divDisplay = document.getElementById("divDisplay");    var textSelect = document.getElementById("textSelect");    function convertKBD() {       var kbdObject = document.createElement("KBD");       var kbdText = document.createTextNode(textSelect.value);       kbdObject.appendChild(kbdText);       divDisplay.appendChild(kbdObject);    } OutputThis will produce the following output −Before clicking ‘Check’ button −After clicking ‘Check’ button −

The HTML DOM item() method returns a node from a node list object.Note − The item() method is used to provide index value in a node list object. It is same as getting node by passing index value in ‘[index]’ on node list object.SyntaxFollowing is the syntax −Calling item(index), where index starts from 0nodeListObject.item(index)ExampleLet us see an example for item() method − Live Demo item()    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;   ... Read More

The HTML DOM Italic Object represents an element which displays text in italic.SyntaxFollowing is the syntax −Creating an elementvar italicObject = document.createElement(“I”)ExampleLet us see an example for Italic object element − Live Demo Italic Object    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } Italic Object Formatter:    var divDisplay = document.getElementById("divDisplay");    var textSelect = document.getElementById("textSelect");    function convertItalic() {       var italicObject = document.createElement("I");       var italicText = document.createTextNode(textSelect.value);       italicObject.appendChild(italicText);       divDisplay.appendChild(italicObject);    } OutputThis will produce the following output −Before clicking ‘Check’ button −After clicking ‘Check’ button −