Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML
HTML
  1. แอตทริบิวต์ headers: ผูกเซลล์ตารางกับ Header Cells ใน HTML

    แอตทริบิวต์ headers ใช้ใน <td> หรือ <th> เพื่อระบุ id ของ Header Cell (<th>) ที่เซลล์นี้เกี่ยวข้อง ช่วย Screen Readers อ่าน Header ก่อน Data Cell ทำให้ Accessibility ดีกว่า (Section 508, WCAG) ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <head> <style>

  2. เหตุการณ์ oncut: รันสคริปตเมื่อผู้ใช้قص (Cut) ข้อความ

    เหตุการณ์ oncut จะถูกกระตุ้นเมื่อผู้ใช้قص (Cut) เนื้อหาขององค์ประกอบ (มักใช้กับ Input, Textarea, หรือ ContentEditable) คล้าย oncopy แต่ข้อมูลจะถูกลบออกจากต้นทางหลังคัดลอก ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <input type=text oncut=display() value=قصฉันได้>

  3. เหตุการณ์ ondblclick: รันสคริปตเมื่อดับเบิลคลิกองค์ประกอบ

    เหตุการณ์ ondblclick จะถูกกระตุ้นเมื่อผู้ใช้ดับเบิลคลิก (Double-click) บนองค์ประกอบ HTML เกิดขึ้นหลังจากลำดับ: mousedown → mouseup → click → mousedown → mouseup → click → dblclick ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <button ondblclick=display() style=padding: 10

  4. แอตทริบิวต์ hidden: ซ่อนองค์ประกอบที่ไม่เกี่ยวข้องใน HTML5

    แอตทริบิวต์ hidden (Boolean Attribute) ใช้ระบุว่าองค์ประกอบ ยังไม่เกี่ยวข้อง/ไม่ควรแสดง ในปัจจุบัน เบราว์เซอร์จะซ่อนองค์ประกอบนี้ (เทียบเท่า display: none) แตกต่างจาก display: none ที่เป็น CSS เพราะ hidden เป็น Semantic (บอกความหมาย) ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body>

  5. แอตทริบิวต์ id: ระบุ ID เฉพาะตัวสำหรับองค์ประกอบใน HTML

    แอตทริบิวต์ id ใช้ระบุ ตัวระบุเฉพาะตัว (Unique Identifier) ให้กับองค์ประกอบ HTML ในหน้าเว็บเดียวกัน ต้องไม่ซ้ำกัน (Unique) ใช้สำหรับ CSS Selector, JavaScript DOM Access, Anchor Links, ARIA, และ Form Labels กฎการตั้งชื่อ ID ต้อง ไม่ซ้ำกัน ในหน้าเว็บเดียวกัน (Duplicate ID = Invalid HTML) ต้องมีอย่าง

  6. แอตทริบิวต์ high: กำหนดช่วงค่าสูงใน Meter/Gauge ใน HTML

    แอตทริบิวต์ high ใช้ในแท็ก <meter> เพื่อกำหนดค่าที่ถือว่าเป็น สูง (High Threshold) ช่วยให้เบราว์เซอร์/ผู้ใช้ทราบว่าค่าปัจจุบันอยู่ในช่วงไหน (Low, Optimum, High) โครงสร้าง <meter> และแอตทริบิวต์ที่เกี่ยวข้อง แอตทริบิวต์ คำอธิบาย ตัวอย่าง min ค่าต่ำสุด 0 max ค่าสูงสุด 100 low เ

  7. เหตุการณ์ oncopy: รันสคริปตเมื่อผู้ใช้คัดลอกข้อความ

    เหตุการณ์ oncopy จะถูกกระตุ้นเมื่อผู้ใช้คัดลอก (Copy) เนื้อหาขององค์ประกอบ (มักใช้กับ Input, Textarea, หรือ Element ที่มี ContentEditable) ใช้สำหรับ Tracking, ป้องกันการคัดลอก, หรือปรับเปลี่ยนข้อมูลที่คัดลอก ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <input type=text o

  8. แอตทริบิวต์ kind: ระบุประเภท Text Track ใน HTML (Subtitles, Captions, Chapters)

    แอตทริบิวต์ kind ใช้ในแท็ก <track> เพื่อระบุประเภทของ Text Track (ข้อความประกอบ) สำหรับวิดีโอ/เสียง เช่น Subtitles, Captions, Descriptions, Chapters, Metadata ค่าของ kind (Enumerated) ค่า คำอธิบาย ใช้สำหรับ subtitles ภาษาต่างประเทศ (Translation) ผู้ชมเข้าใจภาพแต่ไม่เข้าใจภาษา caption

  9. แอตทริบิวต์ ismap: ทำให้รูปภาพเป็น Server-side Image Map

    แอตทริบิวต์ ismap (Boolean Attribute) ใช้ในแท็ก <img> ที่อยู่ภายใน <a> เพื่อทำให้รูปภาพเป็น Server-side Image Map เมื่อผู้ใช้คลิกที่รูปภาพ พิกัด (x,y) จะถูกส่งไปยัง Server ผ่าน Query String ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <a href=/process-click&g

  10. แอตทริบิวต์ data: ระบุ URL ทรัพยากรสำหรับ Object ใน HTML

    แอตทริบิวต์ data ใช้ในแท็ก <object> เพื่อระบุ URL ของทรัพยากร (Resource) ที่จะฝังในหน้าเว็บ เช่น ไฟล์ Flash (SWF), PDF, ภาพ, วิดีโอ, หรือหน้าเว็บอื่น ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <h2>สาธิตแท็ก Object</h2> <object width=250 height=300

  11. เหตุการณ์ ondragover: รันสคริปตเมื่อลากองค์ประกอบอยู่เหนือ Drop Target

    เหตุการณ์ ondragover จะถูกกระตุ้นซ้ำๆ ขณะที่องค์ประกอบถูกลาก (Drag) อยู่เหนือพื้นที่ที่รับการวาง (Drop Target) ต้องเรียก event.preventDefault() เพื่ออนุญาตให้ Drop ได้ (Default behavior ของเบราว์เซอร์คือไม่อนุญาต Drop) ตัวอย่างการใช้งาน (ร่วมกับ Drag & Drop ครบวงจร) <!DOCTYPE HTML> <html&g

  12. แอตทริบิวต์ data-*: จัดเก็บข้อมูลกำหนดเองใน HTML (Custom Data Attributes)

    แอตทริบิวต์ data-* (Custom Data Attributes) ใช้สำหรับจัดเก็บข้อมูลส่วนตัว (Private Data) ไว้ในองค์ประกูล HTML เอง โดยไม่ต้องใช้ Global Variables หรือ Hidden Inputs ช่วยให้ JavaScript เข้าถึงข้อมูลได้ง่ายผ่าน dataset API กฎการตั้งชื่อ ขึ้นต้นด้วย data- เสมอ ชื่อหลัง data- ต้องเป็น ตัวพิมพ์เล็ก (low

  13. เหตุการณ์ onemptied: รันสคริปตเมื่อสื่อว่างหรือไม่พร้อมใช้งาน

    เหตุการณ์ onemptied จะถูกกระตุ้นเมื่อสื่อ (วิดีโอ/เสียง) กลายเป็นสถานะว่างเปล่า (Empty) หรือไม่พร้อมใช้งาน กรณีที่อาจเกิดขึ้น: Network Error ระหว่างโหลด Source ถูกลบ/เปลี่ยน (src = ) Media Element ถูกรีเซ็ต (load()) Playlist ว่าง (ไม่มี Source) Connection Lost ขณะโหลด ตัวอย่างการใช้งาน <!DOCTY

  14. เหตุการณ์ onended: รันสคริปตเมื่อสื่อเล่นจบ

    เหตุการณ์ onended จะถูกกระตุ้นเมื่อการเล่นสื่อ (วิดีโอ/เสียง) จบสิ้นสุดถึงตอนท้าย ใช้สำหรับแสดงข้อความขอบคุณ, เล่นวิดีโอถัดไป, แสดง Related Content, หรือบันทึกสถิติการดูจบ ตัวอย่างการใช้งาน <!DOCTYPE HTML> <html> <body> <video width=300 height=200 controls onended=display()

  15. แอตทริบิวต์ dirname: ส่งทิศทางข้อความพร้อมฟอร์มใน HTML

    แอตทริบิวต์ dirname ใช้ใน <input> และ <textarea> เพื่อส่งทิศทางการเขียนข้อความ (Directionality) พร้อมกับข้อมูลฟอร์ม ค่าที่ส่งจะเป็น ชื่อฟิลด์.dir (เช่น sname.dir=ltr หรือ rtl) ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <h2>ฟอร์มติดต่อนักศึกษา</h2>

  16. เหตุการณ์ ondragstart: รันสคริปตเมื่อเริ่มลาก (Drag Start)

    เหตุการณ์ ondragstart จะถูกกระตุ้นเมื่อผู้ใช้เริ่มลาก (Drag) องค์ประกอบที่มี draggable=true ใช้ตั้งค่าข้อมูลที่จะถ่ายโอนผ่าน DataTransfer API ตัวอย่างการใช้งาน: Drag & Drop พื้นฐาน <!DOCTYPE HTML> <html> <head> <style> .drag-zone { float: left;

  17. แอตทริบิวต์ formaction: เปลี่ยนปลายทางส่งฟอร์มสำหรับปุ่ม Submit เฉพาะ

    แอตทริบิวต์ formaction ใช้ใน <button type=submit> หรือ <input type=submit> เพื่อ ออเวอร์ไรด์ แอตทริบิวต์ action ของ <form> สำหรับปุ่มนั้นๆ เฉพาะ ใช้ได้ใน HTML5 ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <head> <title>ตัวอย่าง HTML formaction attribute<

  18. แอตทริบิวต์ for: ผูก Label กับ Form Element ใน HTML

    แอตทริบิวต์ for ใช้ในแท็ก <label> เพื่อผูกกับฟิลด์ Input โดยระบุ id ของ Input นั้น ทำให้คลิกที่ Label จะโฟกัส/ทำงานกับ Input นั้นได้ (Accessibility สำคัญ) ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <p>การศึกษา:</p> <form action=> <la

  19. แอตทริบิวต์ form: ผูกองค์ประกอบกับฟอร์มภายนอกใน HTML

    แอตทริบิวต์ form ใช้ระบุ id ของฟอร์ม (<form>) ที่องค์ประกอบ Input นี้ต้องการเป็นส่วนหนึ่ง แม้จะวางอยู่นอกแท็ก Form นั้นก็ตาม (HTML5 Feature) ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <form action=/submit method=get id=myform> <label>รหัสวิชา: &l

  20. เหตุการณ์ onwaiting: รันสคริปตเมื่อสื่อหยุดรอ Buffering

    เหตุการณ์ onwaiting จะถูกกระตุ้นเมื่อการเล่นสื่อ (วิดีโอ/เสียง) หยุดชั่วคราวเพราะกำลังโหลดข้อมูล (Buffering) และคาดว่าจะเล่นต่อเมื่อโหลดเสร็จ แตกต่างจาก onpause ที่เป็นการหยุดโดยเจตนา ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <h2 id=test>เล่น</h2> <vid

Total 2078 -คอมพิวเตอร์  FirstPage PreviousPage NextPage LastPage CurrentPage:79/104  20-คอมพิวเตอร์/Page Goto:1 73 74 75 76 77 78 79 80 81 82 83 84 85