Jquery เกริ่น........

200921 May

กระแส Jquery กำลังมาแรง ผมคงไม่ต้องไปบรรยายอะไรมากมายว่า Jquery มันเทพหรือดีอย่างไรเพราะ search ไปใน google ก้อจะเวบไทย หรือ blog บ้างทีบอกว่ามันดีๆ และก้อมีตัวอย่างให้ดู แต่สุดท้ายแล้ว การใช้ก้อควรจะเข้าใจการเขียนและที่สำคัญก้อไม่ควรจะลืม Basic Javascript function ต่าง ๆ เพราะ Jquery ก้อมาจาก JavaScript ตัวมันเองก้อเป็นแค่ Framework ไม่ได้ Promote ให้ Jquery แต่ผมเองเป็นคนที่ใช้ Jquery เห็นหลายๆคนบอกว่า jquery ดีไปซะทุกอย่าง ข้อดีคิดว่าการใช้ Jquery เหมาะกับคนที่เขียน CSS เป็นเพราะลักษณะการ selector นั้นค่อยข้างไปทาง CSS ข้อดีคือ

1) Cross browser ทำงานได้หลาย Browser
2) CSS3 Compliant การเขียนสอดคล้องกับ CSS
3) Lightweight Footprint มีขนาดเล็กในการเรียกใช้

ทั้งหมดคำโฆษณาจากเวบ www.jquery.com ผมขออีกข้อล่ะกัน
4) useful Plugin and great community. การมีปลั๊กอินให้เลือกใช้เยอะแยะและมีผู้ใช้มากมาย ถ้าเป็น beginner ก้อเริ่มอ่านจาก jQuery API Reference แล้วก้อลองอ่านในหมวด Selectors จะได้เข้าใจ ตาม Links นี้ด้านล้างนี้จากนั้นก้อคงเป็นเรื่อง
# Traversing แล้วต่อด้วย # Manipulation , #CSS จะได้จัดการ content ได้
คงไม่อะไรจะบอกน่ะคับเคยลองมาหมดแล้วก้อคงคิดว่า Jquery คงเหมาะสมและลงตัวกับยุคนี้
ยังมี Frame work ตัวอื่นอีกน่ะว่ามี Moo tools , Dojo , Yui อีกมากมายให้เลือกใช้
อยากรู้ว่า Jquery เร็วแค่ไหนก้อลองไปตรวจสอบได้ที่ http://mootools.net/slickspeed/
Test ขำ ๆ อย่าไปซีเรียสว่าใครเหนือกว่ากัน
http://docs.jquery.com/Main_Page

ตัวอย่าง code jquery แบบง่ายโดยใช้ API Effect

<style>

  div.jb { background:#de9a44; margin:3px; width:80px; 

        height:40px; display:none; float:left; }

  </style>

<script>

$(document).ready(function(){

    $(document.body).click(function () {

      if ($("div.jb:first").is(":hidden")) {

        $("div.jb").slideDown("slow");

      } else {

        $("div.jb").slideUp("slow");

      }

    });

  });

  </script>

Click Me right now .... !!!!

<div class="jb"></div>

<div class="jb"></div>

<div class="jb"></div>