Front End Technology Articles - Page 545 of 860

The Link hreflang property sets/returns the language code of a linked document.SyntaxFollowing is the syntax −Returning hreflang attribute valuelinkObject.hreflangSetting hreflang to a language codelinkObject.hreflang = langCodeExampleLet us see an example for Link hreflang property − Live Demo Link hreflang Link-hreflang Spanish    var divDisplay = document.getElementById("divDisplay");    var extStyle = document.getElementById("extStyle");    function changeStyle(){       if(extStyle.hreflang === 'en'){          divDisplay.textContent = 'The linked document is written in english';          document.getElementsByTagName('h3')[0].textContent = 'English'       }    } In ... Read More

The HTML DOM Link href property sets/returns the path/url of a linked document. −SyntaxFollowing is the syntax −Returning href attribute valuelinkObject.hrefSetting href to a stringlinkObject.href = stringBoolean ValuesHere, “string” can be the following −booleanValueDetailspathIt defines the absolute/relative path to a document.urlIt defines the url address of the document to be linked.ExampleLet us see an example for Link href property − Link href Link-href Sales Target Week:    var divDisplay = document.getElementById("divDisplay");    var inputWeek = document.getElementById("WeekSelect");    var extStyle = document.getElementById("extStyle");    divDisplay.textContent = 'Week ... Read More

The HTML DOM Link disabled property sets/returns whether element is enabled or disabled.SyntaxFollowing is the syntax −Returning boolean value - true/falselinkObject.disabledSetting disabled to booleanValuelinkObject.disabled = booleanValueBoolean ValuesHere, “booleanValue” can be the following −booleanValueDetailstrueIt defines that the is disabled.falseIt defines that the is not disabled and it is also the default value.ExampleLet us see an example for Link disabled property − Live Demo Link Disabled Link-disabled Sales Target Week:    var divDisplay = document.getElementById("divDisplay");    var inputWeek = document.getElementById("WeekSelect");    var extStyle = document.getElementById("extStyle");    divDisplay.textContent ... Read More

The Li value property returns/sets the value of the value attribute of a element.SyntaxFollowing is the syntax −Returning value of the value attributeliObject.valueValue of the attribute value setliObject.value = ‘string’Let us see an example for Li value property −Example Live Demo HTML DOM value    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }    ol{       width: 30%;   ... Read More

The HTML DOM Li Object in HTML represents the element.SyntaxFollowing is the syntax −Creating a elementvar liObject = document.createElement(“LI”)PropertiesHere, “LiObject” can have the following properties −PropertyDescriptionvalueIt returns/sets the value of the value attribute of a elementExampleLet us see an example for Li value property − Live Demo HTML DOM value    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }    ol{ ... Read More

The HTML DOM length property returns a number corresponding to the nodes in node list object.SyntaxFollowing is the syntax −Returning number of nodes in nodeList Object.nodeList.lengthExampleLet us see an example for HTML DOM length property − Live Demo HTML DOM length    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }    ul{       width: 30%;       margin: 0 auto; ... Read More

The HTML DOM Legend Object in HTML represents the element.SyntaxFollowing is the syntax −Creating a elementvar legendObject = document.createElement(“LEGEND”)PropertiesHere, “LegendObject” can have the following properties −PropertyDescriptionformIt returns a reference of enclosing form that contains the legend elementExampleLet us see an example for Legend form property − Live Demo Legend form    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } ... Read More

The HTML DOM Legend form property returns the reference of enclosing form for Legend tag.SyntaxFollowing is the syntax −Returning reference to the form objectlegendObject.formExampleLet us see an example for Legend form property − Live Demo Legend form    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } Legend-form Examination Week:    var divDisplay = document.getElementById("divDisplay");    var legendForm = document.getElementById("legendForm");    function showExamination() {       divDisplay.textContent = 'Examinations: '+legendForm.form.id;    } OutputThis will produce the following output −Before clicking ‘What exams are in this week?’ button −After checking ‘What exams are in this week?’ button −

ES6's template strings is a new way to combine strings. We already have methods such as join(), concat() etc to combine strings but the template strings method is the most sophisticated because it’s more readable, no backslash to escape quotes and no more messy plus operators.Using concat() and join()ExampleIn the following example join() and concat() methods are used to combine strings. If we observe carefully the code looks very messy.Live Demo const platform = 'Tutorix'; const joinMethod = ['The', 'best', 'e-learning', 'platform', 'is', platform].join(' '); document.write(joinMethod); ... Read More

In the following example we are going to learn how to set dynamic property keys to an object in JavaScript. To add dynamic property keys to an object in JavaScript, there are three possible ways. There are three possible ways to set dynamic property keys to an object. The first possible way is to create a key and assign it to the object, second possible way is to set the dynamic property keys to an object using the define property method and the third possible way is to set the dynamic property keys to an object using ES6 method. We ... Read More