HTML DOM Anchor type Property
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.
Syntax
Following is the syntax for −
Returning the type property −
anchorObject.type
Setting the type property −
anchorObject.type = MIME-type
Example
Let us see an example for anchor text property −
<!DOCTYPE html>
<html>
<body>
<p><a id="Anchor" type="text/html" href="https://www.examplesite.com">example site</a></p>
<p><a id="Anchor2" href="https://www.example.com">example</a></p>
<p>Click the buttons to set and get the type attribute.</p>
<button onclick="getType1()">GetType</button>
<button onclick="setType2()">SetType</button>
<p id="Type1"></p>
<script>
function getType1() {
var x = document.getElementById("Anchor").type;
document.getElementById("Type1").innerHTML = x;
}
function setType2(){
document.getElementById("Type1").innerHTML="Type has been set";
document.getElementById("Anchor2").type="text/html";
}
</script>
</body>
</html>Output
This will produce the following output −
On clicking GetType button −
On clicking SetType button −
In the above example −
We have taken two links with id Anchor and Anchor2 respectively. Anchor1 has MIME type text/html associated with it while Anchor2 doesn’t have any MIME type associated with it.
<p><a id="Anchor" type="text/html" href="https://www.examplesite.com">example site</a></p>
<p><a id="Anchor2" href="https://www.example.com">example</a></p>
We then have two buttons GetType and SetType to execute functions getType1() and getType2() respectively.
<button onclick="getType1()">GetType</button>
<button onclick="setType2()">SetType</button>
The getType1() function returns the type of the anchor tag with id “Anchor” associated with it. The setType2() function sets the type of the anchor tag with id “Anchor2” to text/html.
function getType1() {
var x = document.getElementById("Anchor").type;
document.getElementById("Type1").innerHTML = x;
}
function setType2(){
document.getElementById("Type1").innerHTML="Type has been set";
document.getElementById("Anchor2").type="text/html";
}
Published on 06-Aug-2019 12:29:53
