หากจะคิดให้ดูง่ายก็คิดซะว่า JQuery ก็เป็น Javascript Library ตัวหนึ่งที่ช่วยให้เราเขียนโปรแกรมได้ง่ายโดยไม่ต้องเขียน Hard Code (เขียน code เองทุกอย่างเองส่วนตัวเรียก code เถือก) เองให้มากมาย ซึ่งผมจะสรุปการทำ Hello JQuery มาเป็นขั้นๆ ดังนี้
- เราต้องโหลด JQuery มาจาก http://jquery.com/ โดยคลิกที่ปุ่ม Download
Production คือ code ถูกบีบอัดโดยเอาช่องว่างระหว่าง code ที่ไม่จำเป็นออก
Development หากเปิดดู code จะสามารถอ่าน code ได้ง่าย (เพราะมีการขึ้นบรรทัดใหม่ เว้นวรรค และ tabให้ดู code ได้สะดวกขึ้น) - จากนั้นเราจะเห็น Code เถือก คลิกขวาเลือก Save as... แล้วเลือกที่ Save ไฟล์ไปไว้ที่เดียวกับโปรแกรมของเรา โดยใช้ชื่อเดิมที่เค้าตั้งมาให้ (อย่าเปลี่ยนชื่อไฟล์ถ้าเป็นผู้เริ่มต้น)
- จากนั้นเราได้ Library มาแล้วเราก็มาดูวีธี Load มาใช้งานกันดัง Code
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
(src นั้นจำเป็นต้องอ้างที่ตั้งของ JQuery ให้ถูกนะครับแล้วแต่ว่าเราเอาไปวางไว้ตรงไหน) - แล้วเราก็มาสร้างไฟล์ HelloJQuery.html แล้วใส่ Code ข้างล่างลงไป
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script src="jquery-1.4.4.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function(){ $("a").click(function(){ alert("Hello JQuery"); }); }); </script> </head> <body> <a href="http://jquery.com/">jQuery</a> </body> </html> - ทดลองรันโดยคลิกที่ link เลยครับ
