คุณสมบัติการค้นหา 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>
ผลลัพธ์
สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -
ก่อนทำเครื่องหมายที่ช่องทำเครื่องหมาย "แสดงรหัสแบบฟอร์ม" -
โดยไม่ต้องคลิกที่ปุ่ม "เปลี่ยนการค้นหา" ลิงก์จะเป็นดังนี้ -
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"; }