jQuery ตอนที่ 5 ใช้งานแบบไม่ต้องดาวน์โหลดก็ได้นะ(อ่าน8770ครั้ง)

หมวดหมู่ jQuery on Sep.14, 2009

title_jquery

จากตอนที่แล้วว (ตั้งแต่กุมภาเลยพี่) ได้บอกวิธีการดาวน์โหลดไฟล์ jquery library มาใช้งาน และได้ลองเขียนสคริปต์สั้น ๆ ง่าย ๆ กันบ้าง ก่อนจะไปลุยกันต่อ ขอแวะมาบอกวิธีที่ค้างเอาไว้ คือ เราไม่จำเป็นต้องดาวน์โหลด ก็สามารถใช้งาน jQuery ได้เหมือนกัน มันก็มีัทั้งข้อดีและข้อเสีย

ข้อเสีย

ทำให้ระบบทำงานล้าช้า ลองนึกถึงเวลาเราไปยืมอุปกรณ์กับเพื่อนดูสิ จะใช้ทีก็ต้องเดินทางไปเอาซะไกลเลย มันก็อาจจะส่งผลถึงเวลาด้วยไง เข้าใจเปล่า?

ข้อดี

เวลาเขาอัพเดตเวอร์ชั่นใหม่ ๆ เราก็ไม่ต้องไปสนใจรอใช้อย่างเดียว ฮา

ไปเอาได้จากที่ไหน

google.com

รายละเอียด

jquery-latest.js

http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js

jquery-latest.pack.js

http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js

jquery-latest.min.js

http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js

jquery.js

http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js

jquery-1.3.2.min.js

http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js

jquery-1.3.2.js

http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js

jquery-1.3.1.min.js

http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js

jquery-1.3.1.js

http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.js

jquery-1.3.min.js

http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js

jquery-1.3.js

http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.js

jquery-1.2.6.min.js

http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js

jquery-1.2.6.pack.js

http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js

jquery-1.2.6.js

http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js

jquery-1.2.3.min.js

http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js

jquery-1.2.3.pack.js

http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js

jquery-1.2.3.js

http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.js

มีให้เลือกหลายเวอร์ชั่นเลย เลือเอาตามสะดวกนะ
หรือแบบนี้ก็ได้

<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
// <![CDATA[
    google.load("jquery", "1.3.2");
    google.setOnLoadCallback(function() {
        //โค๊ดของ jQuery
    });
// ]]>
</script>

จะเลือกเอาแบบไหนก็สุดแล้วแต่ท่านนะครับ

ตัวอย่างโค๊ดเต็ม

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Hello jQuery</TITLE>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function(){
        alert('Hello jQuery');
    });
</script>
</HEAD>
<BODY>
</BODY>
</HTML>

ผลลัพธ์

คนที่มีความเข้มแข็งจะเป็นคนที่สุขได้ง่ายทุกข์ได้ยาก
ส่วนคนที่อ่อนแอจะมีความสุขที่เปราะบาง
คือจะมีความสุขที่เปลี่ยนเป็นความทุกข์ได้ง่ายและสุขได้ยาก/ปอ.ปยุตโต

อ้างอิง

http://blog.jquery.com/2009/08/20/codejquerycom-redirected-to-google-ajax-apis/

http://code.google.com/intl/th-TH/apis/ajaxlibs/documentation/index.html#jquery

Tags: Load