คุณสมบัติประเภท HTML DOM ที่เชื่อมโยงกับแท็กสมอใช้เพื่อตั้งค่าหรือรับค่าของแอตทริบิวต์ type ของลิงก์ คุณลักษณะนี้ถูกนำมาใช้ใน HTML 5 คุณลักษณะนี้มีขึ้นเพื่อเหตุผลเชิงชี้นำเท่านั้นและไม่จำเป็นต้องรวมไว้ ประกอบด้วยค่า MIME (Multipurpose Internet Mail Extensions) ประเภทเดียว
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์สำหรับ −
ส่งคืนคุณสมบัติประเภท -
anchorObject.type
การตั้งค่าคุณสมบัติประเภท −
anchorObject.type = MIME-type
ตัวอย่าง
เรามาดูตัวอย่างคุณสมบัติ anchor text กัน −
<!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> ผลลัพธ์
สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -
เมื่อคลิกปุ่ม GetType -
เมื่อคลิกปุ่ม SetType -
ในตัวอย่างข้างต้น −
เราได้เชื่อมโยงสองลิงก์กับ id Anchor และ Anchor2 ตามลำดับ Anchor1 มีข้อความ/html ประเภท MIME เชื่อมโยงอยู่ ในขณะที่ Anchor2 ไม่มีประเภท MIME ที่เกี่ยวข้อง
<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>
จากนั้นเรามีปุ่มสองปุ่ม GetType และ SetType เพื่อใช้งานฟังก์ชัน getType1() และ getType2() ตามลำดับ
<button onclick="getType1()">GetType</button> <button onclick="setType2()">SetType</button>
ฟังก์ชัน getType1() ส่งคืนประเภทของแท็กสมอที่มี id “Anchor” ที่เชื่อมโยงอยู่ ฟังก์ชัน setType2() กำหนดประเภทของแท็ก anchor ที่มี id “Anchor2” เป็น 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";
} 