@KUpoom เดินไปตามทางที่ใจอยาก

สมมติเราต้องการชี้ตำแหน่งของข้อความ "Hello world" เราจะสามารถเรียกตำแหน่งของข้อความนี้เป็น

$("div#content div.a") -> ผลที่ได้ออกมาเป็น div.a ซึ่งมี text อยู่ภายในคือ Hello world

หรือ ถ้าต้องการชี้ตำแหน่งที่ "ciao!" จะเรียกเป็น

$("#content .b ul > li")

สรุปง่ายๆจากตรงนี้ก็คือ เราต้องการทำอะไรตรงไหน เราก็ชี้ไปที่ Tag ที่ครอบตัวนั้นอยู่นั่นเองค่ะ ถ้ามีปัญหาเรื่อง Tag ซ้ำซ้อนมีเยอะ ให้แก้ปัญหาด้วยการใส่ id หรือ class เข้าไปเพื่อให้ระบุตำแหน่งได้ง่ายขึ้นค่ะ

จากโจทย์ เราต้องการเปลี่ยน คำว่า "Hello world" ให้เป็นอักษรสีแดง เราสามารถแก้ CSS ได้ โดยเพิ่ม .css() เข้าไปข้างหลัง selector ตัวอย่างนี้คือ

$("#content .a").css('corlor','red'); -> ผลที่ได้จะได้คำว่า Hello World เป็นสีแดง

เราสามารถเรียกใช้ selector ผ่าน ตัวแปรได้ เช่น จากตัวอย่างเดียวกันนี้สามารถเขียนได้เป็น

var selector = "#content .a";

$(selector).css('corlor','red');

หรือ

var id = "#content";

var class = ".a";

$(id+" "+class).css('corlor','red');

ทั้ง 3 แบบนี้จะให้ผลลัพธ์เดียวกันหมด

ถ้าเราเคยเขียน CSS มาก่อน คงจะคุ้นกับการเขียน Selectors ใน Jquery ไม่มากก็น้อย ส่วนฟังชั่นอื่นๆที่ตามมาข้างหลังมาหลากหลายมาก ทั้ง Event เช่น เมื่อกดเม้าส์ เมื่อกดปุ่ม เป็นต้น หรือการดึงค่าต่างๆใน selectors นั้นๆออกมา เพื่ออ่าน หรือแก้ไขมัน

ตัวอย่างง่ายๆเช่น

จากโค้ดข้างบน ถ้าเราต้องการดึงคำว่า "Hello world" ออกมา เราสามารถสั่งได้เป็น

var a = $("#content .a").text();  -> ค่าของ a จะเท่ากับ "Hello world"

ในที่นี้ คำสั่ง text() จะดึงเฉพาะ text ออกมาเท่านั้น ถ้าต้องการดึง HTML ออกมาให้ใช้คำสั่ง html() แทน

var a = $("#content .a").html();  -> ค่าของ a จะเท่ากับ "Hello world"

หรือ ถ้าต้องการดึงโค้ดทั้งหมดใน class b จะต้องสั่งเป็น

var b = $("#content .b").html();  -> ค่าของ b จะเท่ากับ

• ciao!

การดึงโค้ดเป็น html เราสามารถนำโค้ดดังกล่าวไปแปะในส่วนอื่นๆได้

ไม่ได้มาอัพนาน ยุ่งๆ เหนื่อยๆ แต่วันนี้มีเรื่องอยากเล่าให้ฟังกัน

วันนี้ขึ้น BTS ตามปกติประจำวัน ทุกๆวันก็จะเห็นผู้คนกึ่งเดินกึ่งแย่ง เพื่อให้ได้ที่นั่งกัน วันนี้ก็เหลือบไปเห็นฝรั่งตัวใหญ่ ลากรถเข็นเด็กมากับลูกเค้าอีก 2 คน คาดว่าอายุประมาณ 5 ขวบ กำลังน่ารักเลย

แต่ว่า ที่นั่งว่างที่เค้าได้มี 2 ที่สำหรับเด็ก 2 คน และมันอยู่คนละฝั่งของรถ เราก็มองๆห่างๆ(ไม่ได้นั่งติดกับลูกเค้า) สักพักผู้หญิงวัยทำงาน ที่นั่งข้างๆเด็กฝรั่งคนหนึ่ง ก็ถามคุณพ่อหัวทองว่า "Do you want to sit in the same side?" แล้วเธอก็ลุกให้ที่นั่งโดยไม่รอคำตอบจากฝรั่งคนนั้น ฝรั่งงงอยู่ชั่วขณะ แล้วก็แลกที่นั่งกับผู้หญิงคนนั้น จากนั้นผ่านไปไม่นาน ท่ามกลางสายตาของผู้โดยสารรถไฟฟ้า ที่จ้องมองเด็กฝรั่งอยู่นั้น อยู่ๆเด็กฝรั่งคนหนึ่งก็เดินไปหาผู้หญิงคนนั้น แล้วพูดว่า "ขอบคุณขรั๊บ" (ไม่ชัด) พร้อมยืนขนมให้ชิ้นหนึ่ง แล้ววิ่งกลับไปนั่งที่เดิม

ผู้หญิงคนนั้นอึ้งๆ แต่ก็อมยิ้มมีความสุข พร้อมกับถามกลับมาว่า "Thank you, What is it?" จากนั้นเราได้ยินไม่ชัด แต่เธอพูดตอบกลับมาว่า "I like it." แล้วเธอก็เอาขนมชิ้นนั้นเข้าปากไป (เป็นเยลลี่สีแดง) และยิ้มอย่างมีความสุข

เห็นเหตุการณ์เล็กๆ ที่แม้เราเป็นแค่ผู้สังเกตการณ์ ก็ทำให้เรายิ้มได้ สังคมจะน่าอยู่ถ้าเราเริ่มคิดดี ทำดี จากสิ่งเล็กๆ ที่เราสามารถทำได้ง่ายๆ

วันนี้มีความสุขจัง