คุณสมบัติ type ของ Link ใน HTML DOM

คุณสมบัติ type ของอีลีเมนต์ <link> ใช้สำหรับตั้งค่าหรืออ่านประเภท MIME type ของเอกสารที่ลิงก์ไป

ไวยากรณ์ (Syntax)

การอ่านค่า

linkObject.type

การตั้งค่า

linkObject.type = value

ตัวอย่างการใช้งาน

ตัวอย่างด้านล่างแก้ไข type ของ stylesheet ให้ถูกต้อง:

<!DOCTYPE html>
<html>
<head>
<title>Link type</title>
<link id="extStyle" rel="stylesheet" href="style.css" type="myStyle">
</head>
<body>
<form>
  <fieldset>
    <legend>Link-type</legend>
    <input type="button" value="Correct Type" onclick="correctType()">
    <div id="divDisplay"></div>
  </fieldset>
</form>
<script>
  var divDisplay = document.getElementById("divDisplay");
  var extStyle = document.getElementById("extStyle");
  divDisplay.textContent = 'The linked document type: ' + extStyle.type + ' is not compatible';
  
  function correctType() {
    extStyle.type = 'text/css';
    divDisplay.textContent = 'Congrats! The linked document type: ' + extStyle.type + ' is compatible';
  }
</script>
</body>
</html>

ในตัวอย่าง style.css มีเนื้อหา:

form { width:70%; margin: 0 auto; text-align: center; }
* { padding: 2px; margin:5px; }
input[type="button"] { border-radius: 10px; }

ผลลัพธ์

ก่อนคลิกปุ่ม "Correct Type": แสดง "The linked document type: myStyle is not compatible"

หลังคลิกปุ่ม "Correct Type": แสดง "Congrats! The linked document type: text/css is compatible"

หมายเหตุ: รูปภาพตัวอย่างจากต้นฉบับไม่ได้รวมอยู่ในเนื้อหานี้