
- HTML Tutorial
- HTML - Home
- HTML - Overview
- HTML - Basic Tags
- HTML - Elements
- HTML - Attributes
- HTML - Formatting
- HTML - Phrase Tags
- HTML - Meta Tags
- HTML - Comments
- HTML - Images
- HTML - Tables
- HTML - Lists
- HTML - Text Links
- HTML - Image Links
- HTML - Email Links
- HTML - Frames
- HTML - Iframes
- HTML - Blocks
- HTML - Backgrounds
- HTML - Colors
- HTML - Fonts
- HTML - Forms
- HTML - Embed Multimedia
- HTML - Marquees
- HTML - Header
- HTML - Style Sheet
- HTML - Javascript
- HTML - Layouts
- HTML References
- HTML - Tags Reference
- HTML - Attributes Reference
- HTML - Events Reference
- HTML - Fonts Reference
- HTML - ASCII Codes
- ASCII Table Lookup
- HTML - Color Names
- HTML - Entities
- HTML - Fonts Ref
- HTML - Events Ref
- MIME Media Types
- HTML - URL Encoding
- Language ISO Codes
- HTML - Character Encodings
- HTML - Deprecated Tags
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"; }
- Related Articles
- HTML DOM Anchor hostname Property
- HTML DOM Anchor protocol Property
- HTML DOM Anchor password Property
- HTML DOM Anchor pathname Property
- HTML DOM Anchor href Property
- HTML DOM Anchor origin Property
- HTML DOM Anchor port Property
- HTML DOM Anchor hreflang Property
- HTML DOM Anchor download Property
- HTML DOM Anchor hash Property
- HTML DOM Anchor rel Property
- HTML DOM Anchor search Property
- HTML DOM Anchor target Property
- HTML DOM Anchor text Property
- HTML DOM Anchor username Property
