วิธีดึงส่วน Query String ของ href ในแท็ก area ด้วย JavaScript

บทนำ

เมื่อแท็ก <area> มี href ที่ประกอบด้วย query string เช่น about.htm?id=company สามารถดึงเฉพาะส่วน query string ได้โดยใช้ property search ของ HTMLAreaElement

ตัวอย่างโค้ด

<!DOCTYPE html>
<html>
<body>
  <img src="/images/html.gif" alt="HTML Map" border="0" usemap="#html"/>
  <map name="html">
    <area id="myarea" shape="circle" coords="154,150,59" 
          href="about.htm?id=company" alt="Team" target="_self">
  </map>
  <script>
    var x = document.getElementById("myarea").search;
    document.write("<br>Querystring: " + x);
  </script>
</body>
</html>

ผลลัพธ์

Querystring: ?id=company

คำอธิบาย

• .search - คืนค่าส่วน query string รวมเครื่องหมาย ? นำหน้า
• ใช้งานได้กับ HTMLAnchorElement (<a>) และ HTMLAreaElement (<area>) พร้อมกัน
• หากไม่มี query string จะคืนค่า empty string ""

Properties ที่เกี่ยวข้องของ URL