Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

HTML DOM Anchor ค้นหาคุณสมบัติ


คุณสมบัติการค้นหา HTML DOM ที่เชื่อมโยงกับแท็ก anchor () ส่งคืนส่วนสตริงการสืบค้นของค่าคุณสมบัติ href ส่วนสตริงการสืบค้นอยู่หลัง ? ใน url และมักใช้เพื่อส่งข้อมูลไปยังเซิร์ฟเวอร์ ใช้เมื่อมีการส่งคำขอรับไปยังเซิร์ฟเวอร์และข้อมูลถูกฝังอยู่ในข้อความธรรมดาในลิงก์

ไวยากรณ์

ต่อไปนี้เป็นไวยากรณ์สำหรับ

  • ก) การส่งคืนคุณสมบัติการค้นหา

anchorObject.search
  • b) การตั้งค่าคุณสมบัติการค้นหา

anchorObject.search = querystring

ตัวอย่าง

ให้เราดูตัวอย่างของคุณสมบัติการค้นหาจุดยึด HTML DOM -

<!DOCTYPE html>
<html>
<body>
<p><a id="myAnchor" target="_blank"
href="https://www.examplesite.com/ex.htm?id=Username">Example Site</a></p>
<p>Click the button to change the querystring part of the above website</p>
<p>Inspect the url before clicking the button to inspect the changes</p>
<button onclick="demo()">Change Search</button>
<script>
   function demo() {
      document.getElementById("myAnchor").search = "program=Sample";
   }
</script>
</body>
</html>

ผลลัพธ์

สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -

ก่อนทำเครื่องหมายที่ช่องทำเครื่องหมาย "แสดงรหัสแบบฟอร์ม" -

HTML DOM Anchor ค้นหาคุณสมบัติ

โดยไม่ต้องคลิกที่ปุ่ม "เปลี่ยนการค้นหา" ลิงก์จะเป็นดังนี้ -

www.examplesite.com/ex.htm?id=Username

หลังจากคลิกที่ปุ่ม “เปลี่ยนการค้นหา” ลิงค์จะเป็น −

www.examplesite.com/ex.htm?prog=Sample

ในตัวอย่างข้างต้น −

เราได้นำแท็กสมอพร้อมคุณสมบัติการค้นหาเพื่อจัดการค่าคุณสมบัติการค้นหาเพื่อตั้งค่าหรือส่งคืนค่าสตริงการค้นหา

<p><a id="myAnchor" target="_blank"
href="https://www.examplesite.com/ex.htm?id=Username">Example Site</a></p>

เราได้สร้างปุ่มชื่อ “เปลี่ยนการค้นหา” เพื่อดำเนินการ myFunction() -

<button onclick="demo()">Change Search</button>

myFunction() จะเปลี่ยนส่วนของสตริงการค้นหาจาก id=”Username” เป็น program=Sample

function demo() {
   document.getElementById("myAnchor").search = "program=Sample";
}