The HTML DOM Input Text disabled property is used for setting or returning if the text field should be disabled or not. It uses boolean values with true representing the element should be disabled and false otherwise. The disabled property is set to false by default. The disabled element is greyed out by default and is unclickable.SyntaxFollowing is the syntax for −Setting the disabled property −textObject.disabled = true|false;Here, true=the text field is disabled and false=the text field is not disabled. It is false by default.ExampleLet us look at an example for the Input Text disabled property −Live Demo ... Read More
The HTML DOM Input Text form property is used for returning the form reference that contains the input text field. If the input text field is outside the form then it will simply return NULL. This property is read-only.SyntaxFollowing is the syntax for input text form property.textObject.formExampleLet us look at an example for the Input text form property −Live Demo Input Text form Property USERNAME: Get the form id by clicking on the below button GET FORM function formId() { var P=document.getElementById("TEXT1").form.id; document.getElementById("Sample").innerHTML = "The id ... Read More
The HTML DOM Input Text maxLength property is used for setting or returning the maxlength attribute of the input text field. The maxLength property specifies the maximum number of characters you can type in a text field.SyntaxFollowing is the syntax for −Setting the maxLength property −textObject.maxLength = integerHere, integer specifies the maximum number of characters that can be typed in the text field.ExampleLet us look at an example for the maxLength property −Live Demo Input Text maxLength Property USERNAME: Increase the maximum number of characters to be entered for the above field by clicking below button CHANGE ... Read More
The HTML DOM Input Text name property is used for setting or returning the name attribute of an input text field. The name attribute helps in identifying the form data after it has been submitter to the server.SyntaxFollowing is the syntax for −Setting the name property −textObject.name = nameHere, name is for specifying the text field name.ExampleLet us look at an example for the text name property −Live Demo Input Text name Property USERNAME: Change the name of the text field by clicking the below button CHANGE NAME function changeName() { ... Read More
The HTML DOM input Text required property is associated with the required attribute of an element. The required property is used for setting and returning if it is necessary to fill some text field or not before the form is submitted to the server. This allows the form to not submit if a text field with required attribute is left empty by the user.SyntaxFollowing is the syntax for −Setting the required property −textObject.required = true|falseHere, true represents the text field must be filled while false represents its optional to fill the field before submitting the form.ExampleLet us look at ... Read More
The HTML DOM source object is associated with the HTML element. We can create and access source element using the createElement() and getElementById() method respectively.SyntaxFollowing is the syntax for −Creating a source object −var p= document.createElement("SOURCE");ExampleLet us look at an example for the source object −Live Demo Source object example Add a audio source for the above element by clicking the below element. CREATE function createSrc() { var s = document.createElement("SOURCE"); s.setAttribute("src", "sample.mp3"); s.setAttribute("type", "audio/mpeg"); document.getElementById("AUDIO_1").appendChild(s); document.getElementById("Sample").innerHTML="The ... Read More
The HTML DOM span object is associated with the HTML element. We can create and access span element using the createElement() and getElementById() method respectively.SyntaxFollowing is the syntax for −Creating a span object −var a = document.createElement("SPAN");ExampleLet us look at an example for the span object −Live Demo Span object example Create a span element by clicking the below button CREATE This is some text inside a p element function createSpan() { var s = document.createElement("SPAN"); var txt = document.createTextNode("This is some text inside the span element"); ... Read More
The HTML DOM stopPropagation() event method is used for stopping the propagation of the given element. This means that clicking on the parent element won’t propagate to children and clicking on the children elements won’t propagate to parent using the stopPropagtion() method. The event propagation is also called event bubbling.SyntaxFollowing is the syntax for the stopPropagation() event method −event.stopPropagation()ExampleLet us look at the example for the stopPropagation() event method −Live Demo #DIV_1 { background: lightpink; width:130px; height:130px; margin-left:40%; text-align:center; } ... Read More
The HTML DOM Storage getItem() method is used for obtaining a storage object by passing a given key name. It will return the key’s values and if there is no key with that given name then NULL will be returned.SyntaxFollowing is the syntax for Storage getItem() method −localStorage.getItem(keyname);ORsessionStorage.getItem(keyname);Here, keyname is of type string and represents the name of the item to be obtained.ExampleLet us look at an example for the HTML DOM Storage getItem() method −Live Demo Storage getItem() method example Create a localStorage item with the name CLICKS to count the number of clicks on the create ... Read More
The HTML DOM Storage length property is used for getting the number of items that are present inside the browser’s storage object. The storage object can be a localStorage object or a sessionStorage object.SyntaxFollowing is the syntax for −Storage length property using localStorage object −localStorage.length;Storage length property using sessionStorage objectsessionStorage.length;ExampleLet us look at the example for the Storage length property −Live Demo Storage length property example Get how many storage items are stored in the local storage object by clicking the below button GET NUMBER function itemNum() { var num = localStorage.length; ... Read More