The HTML DOM appendChild() method is used to create and add a text node at the end of the list of child nodes. The appendChild() method can also be used to move an element from current position to a new position. Using appendChild() you can add new values to a list and can even add a new paragraph under another paragraph.SyntaxFollowing is the syntax for appendChild() Method −node.appendChild( node )Here, the parameter node is the object that you want to append. It is a compulsory parameter value.ExampleLet us see an example of appendChild() Method − Live Demo Click the ... Read More

The HTML DOM AnimationEvent is an object in JavaScript handling the events that occur when CSS animation runs. It basically provides us information about the events that are related to the animation. It offers us a greater control over the CSS animations. It represents the relation between events and animation by describing which events triggered the animations.PropertiesFollowing are the properties for Animation Event −PropertyDescriptionanimationNameIt will return the name of the animation being executed.elapsedTimeReturns the time elapsed since animation is running in seconds.pseudoElementIt returns the name of the pseudo-element of the animation. Eg: ::before, ::after, ::first-line etc.SyntaxFollowing is the syntax for ... Read More

The HTML DOM Anchor collection is used to return the collection of all the anchor tags() present in our HTML document. It will count the links only if they have name attribute associated with them. The name attribute is however deprecated in the current HTML5. The elements appear in the same order as they are present in the html source document.PropertiesFollowing are the properties of Anchor collection.PropertyDescriptionlengthIt will return the number of links() in our html document.MethodsFollowing are the methods of Anchor collection.MethodDescription[Index]It will return the link at the specified index. The index starts from 0 and from top to ... Read More

The HTML DOM anchor username property associated with anchor tag is used to set or return the value of the username part of the href attribute. The username is entered by the user and is often used in username-password pair. The username value is specified after the protocol and just before the password part of the link.SyntaxFollowing is the syntax for −Returning the username property −anchorObject.usernameSetting the username property −anchorObject.username = UsernameValueExampleLet us see an example of anchor username property − Live Demo ExampleSite Click the button to change username Set User Get User    function changeUser() ... Read More

The HTML DOM type property associated with anchor tag is used to set or get the value of the type attribute of the link. This attribute was introduced in HTML 5. This attribute is also for only suggestive reasons and isn’t compulsory to include. It contains single MIME(Multipurpose Internet Mail Extensions) value type.SyntaxFollowing is the syntax for −Returning the type property −anchorObject.typeSetting the type property −anchorObject.type = MIME-typeExampleLet us see an example for anchor text property − Live Demo example site example Click the buttons to set and get the type attribute. GetType SetType    function getType1() ... Read More

The HTML DOM target property associated with the anchor tag () specifies where the new web page will open after clicking the URL. It can have the following values −_blank − This will open the linked document in a new window._parent − This will open the linked document in the parent frameset._top − This will open the linked document in the full body window._self − This will open the linked document in the same window. This is the default behaviorframename − This will open the linked document in the specified framename.SyntaxFollowing is the syntax for −Returning the target property −anchorObject.targetSetting ... Read More

The HTML DOM search property associated with the anchor tag () returns the query string part of the href property value. The query string part is after the ? in a url and is usually used to pass information to the server. It is used when a get request is sent to the server and information is embedded in cleartext in the link.SyntaxFollowing is the syntax fora) Returning the search propertyanchorObject.searchb) Setting the search propertyanchorObject.search = querystringExampleLet us see an example of HTML DOM anchor search property − Example Site Click the button to change the querystring part ... Read More

The HTML DOM Anchor Rel property returns the rel attribute of a link. The rel attribute describes the association between the running document and the linked document.SyntaxFollowing is the syntax to −a) Return the rel property −anchorObject.relb) Set the rel property &minusanchorObject.rel = "value"ExampleLet us see an example of the HTML DOM anchor rel property −Live Demo Example Anchor Rel Property Click on the button Click me!    function display() {       var docs = document.getElementById("anchorExample").rel;       document.getElementById("show").innerHTML = docs;    } OutputThis will produce the following output −Click ... Read More

The Meter low property returns/sets a number corresponding to the min attribute of a element. Use this with high, max and low attributes for better results.SyntaxFollowing is the syntax −Returning value of the min propertymeterElementObject.minValue of the min property setmeterElementObject.min = numberExampleLet us see an example for Meter min property − Live Demo Meter min    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px; ... Read More

The Meter low property returns/sets a number corresponding to the max attribute of a element. Use this with high, min and low attributes for better results.SyntaxFollowing is the syntax −Returning value of the max propertymeterElementObject.maxValue of the max property setmeterElementObject.max = numberExampleLet us see an example for Meter max property − Live Demo Meter max    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px; ... Read More