การใช้ jQuery selectors API


การเขียน JavaScript มักเริ่มต้นโดยการเลือกออบเจ็คที่จะทำงานด้วย ระบุคำสั่งหรือระบุเหตุการณ์ให้ทำงานต่างๆ การเลือกออบเจ็คในภาษา JavaScript ถ้ามีเงือนไขที่ซับซ้อนก็จะเขียนได้บากเพราะต้องใช้วิธีไต่ Dom เข้าไปที่ละชั้นๆ JQuery เข้ามาแก้ปัญหาส่วนนี้โดยมี API selectors เข้ามาทดแทนให้เขียนได้ง่ายขึ้น อย่างเช่น

<form id="demoF">
  <table class="democlass">
    <tr>
      <td><label for="q0">เพศ</label>
        <select name="prename" id="q0">
          <option value="1">นาย</option>
          <option value="2">นาง</option>
          <option value="3">นางสาว</option>
        </select></td>
    </tr>
    <tr>
      <td><label for="q1">ชื่อ</label>
        <input name="firstname" id="q1" /></td>
    </tr>
    <tr>
      <td><label for="q2">นามสกุล</label>
        <input name="lastname" id="q1" /></td>
    </tr>
    <tr>
      <td><label for="q3">ตกลง</label>
        <input type="checkbox" name="agree" id="q3" value="agree" /></td>
    </tr>
  </table>
</form>
เลือก รูปแบบ JQuery ตัวอย่าง
id $(‘#ชื่อ  id’) $(‘# demoF’)
attribute $ (‘[attribute|=value]’) $ (‘[name|=firstname]’)
Checkbox ที่ถูกเลือก $(“:checkbox”) $(‘:checkbox’)
Selected ที่ถูกเลือก $(“select option:selected”) $(“select option:selected”)
เลือกจาก CSS class $(.ชื่อ class) $(‘.democlass’)
ลูกตัวแรก $(“แม่:first”) $(“tr:first”)

About plusmagic

PHP lover in thailand

Posted on 2010/05/03, in javaScript, jQuery, programming and tagged , , , , , . Bookmark the permalink. ใส่ความเห็น.

ใส่ความเห็น

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / เปลี่ยนแปลง )

Twitter picture

You are commenting using your Twitter account. Log Out / เปลี่ยนแปลง )

Facebook photo

You are commenting using your Facebook account. Log Out / เปลี่ยนแปลง )

Google+ photo

You are commenting using your Google+ account. Log Out / เปลี่ยนแปลง )

Connecting to %s

%d bloggers like this: