บล็อกนี้จะกล่าวถึงฟังก์ชันการทำงานของนิพจน์ href ที่ระบุไว้ “ ”
href Expression “ ” ทำอะไร
แอตทริบิวต์ href ใน HTML “ แท็ก ” โดยทั่วไปจะระบุ URL หรือหน้าเว็บที่ลิงก์ถูกนำไป
ในกรณีของ ' ” แอตทริบิวต์ href ถูกตั้งค่าเป็น “ จาวาสคริปต์:; ” ซึ่งเป็นค่าตัวยึดตำแหน่งที่ไม่ทำอะไรเลยเมื่อคลิก มักใช้เมื่อลิงก์ถูกใช้สำหรับฟังก์ชันหรือเหตุการณ์ JavaScript และไม่จำเป็นต้องเปลี่ยนเส้นทางผู้ใช้ไปยังหน้าใหม่
“ จาวาสคริปต์:; ” เป็นคุณสมบัติที่น่าประทับใจที่สุดของ JavaScript ในการรวมเข้ากับ HTML และ CSS ช่วยในการเรียกใช้ฟังก์ชัน JavaScript ใน HTML href หรือแท็กสมอเรือ
ตัวอย่าง
ในตัวอย่างที่กำหนด ให้แสดงภาพในหน้าปัจจุบันโดยคลิกที่ลิงค์โดยใช้ “ จาวาสคริปต์:; ” ในแอตทริบิวต์ href ที่จะป้องกันไม่ให้เบราว์เซอร์ออกจากหน้าปัจจุบัน:
< รหัส div = 'อิมเมจของฉัน' > แผนก >
< แท็ก = 'จาวาสคริปต์: img = document.createElement ('img');
img.src = 'sun.jpg';
src = document.getElementById('myImg');
src.appendChild(img);' > แสดงรูปภาพ ก >
ในรหัสด้านบน:
- ขั้นแรก สร้างองค์ประกอบ div ในไฟล์ HTML และกำหนด id “ อิมเมจของฉัน '.
- ตั้งค่าแอตทริบิวต์ href เป็น “ จาวาสคริปต์:; ” และสร้าง “ img ” องค์ประกอบที่ใช้ “ สร้างองค์ประกอบ () ' วิธี.
- “ src แอตทริบิวต์ ” จะระบุเส้นทางของรูปภาพ
- รับข้อมูลอ้างอิงขององค์ประกอบรูปภาพในไฟล์ HTML เพื่อแสดงรูปภาพโดยใช้ปุ่ม ' getElementById() ' วิธี.
- ต่อท้ายรูปภาพเป็นองค์ประกอบย่อยโดยใช้ปุ่ม “ ภาคผนวก () ' วิธี.
ผลลัพธ์ระบุว่ารูปภาพจะแสดงในหน้าเดียวกันในขณะที่คลิกที่ลิงค์:
คุณยังสามารถเข้าถึงฟังก์ชันในแท็ก href ด้วย “ จาวาสคริปต์:; ” ตัวยึดตำแหน่ง:
< รหัส div = 'อิมเมจของฉัน' > แผนก >< แท็ก = 'จาวาสคริปต์: myFunction();' > คลิกฉัน ก >
กำหนดฟังก์ชัน “ ฟังก์ชันของฉัน() ” ในแท็ก