jQuery Syntax : jQuery Basic Syntax

jQuery Syntax รูปแบบคำสั่งพื้นฐานของ jQuery Library Framework
jQuery การทำงานส่วนมากใน Web Form จะให้ความสำคัญในการอ้างถึง (Selectors) element ในรูปแบบต่าง ๆ หากจะเข้าใจง่าย ๆ ในระบบการเขียน JavaScript แบบดังเดิมจะใช้ document.form.element หรือ document.getElementById ในการอ้างถึง element เช่น

ถ้าในระบบเดิมของ JavaScript เราจะเรียกใช้ element นี้ได้โดยการใช้คำสั่ง

แต่ใน Syntax ของ jQuery คำสั่งพวกนี้จะไม่ได้ถูกเรียกใช้อีกเลย โดย ใช้สั้น ๆ เพียง

นอกจากนี้ jQuery ยังมีความสามารถอ้างถึง (Selectors) element ได้หลายหลายรูปแบบมาก เช่น 
สามารถ Selectors จาก id="test" , แท็ก HTML ต่าง ๆ <p> <span> <div> หรือ class="test" และอื่น ๆ อีกมาก
ซึ่งสามารถศึกษาได้จากหัวข้อถัดไป

Selectors ที่พบเจอเป็นประจำ

$(this).action()
ใช้ Selectors อ้างถึง element ใน ปัจจุบัน

$("#test").action()
ใช้ Selectors อ้างถึง element ที่อยู่ภายใต้ id="test"

$("p").action()
ใช้ Selectors อ้างถึง element ที่อยู่ภายใต้ แทกทั้งหมด <p>หรือ <div> หรือ <span>

$(".test").action()
ใช้ Selectors อ้างถึง element ที่อยู่ภายใต้ แทกทั้งหมด ที่เรียกใช้ css style sheet เช่น class="test"

ตัวอย่างการใช้งาน Selectors ในการอ้างถึง element แบบง่าย ๆ 

Code (jQuery)

Screenshot



คำอธิบาย
จากตัวอย่างบรรทัด $("#btnClick").click(function() มีการอ้างถึง element id="btnClick" ของปุ่ม button โดยเมื่อ event มีการ click จะเปลี่ยนข้อความใน button เป็นคำว่า Hello


สำหรับการใช้งาน Selectors เบื้องต้น สามารถศึกษาได้จากหัวข้อถัดไป

Tweet