13 HTML Attributes You Should Know About

20-Mar-24

คัมภีร์เทพ IT

See the original english version Click here!

 

เมื่อพูดถึง HTML แล้ว Attributes มักจะถูกใช้เพื่อให้ข้อมูลเพิ่มเติมเกี่ยวกับ HTML Elements ซึ่งในบทความนี้ จะมาแนะนำ 13 HTML Attributes ที่ Web Developers ควรรู้จักเอาไว้ ซึ่งพวกมันสามารถช่วยให้ Website ของคุณสามารถดึงดูดสายตาของผู้เยี่ยมชมได้

1. Accept Attribute

คุณสามารถใช้ accept attribute กับ <input> element (สำหรับประเภทที่เป็น file เท่านั้น) เพื่อระบุประเภทของ files ที่ server สามารถยอมรับได้

2. Alt Attribute

คุณสามารถใช้ alt attribute กับ <img> element เพื่อระบุ alternate text ในกรณีที่ไม่สามารถแสดงรูปภาพบน web page ได้

3. Autocomplete Attribute

คุณสามารถใช้ autocomplete attribute กับ <form><input> และ <textarea> element เพื่อควบคุม autocomplete feature ของ browser

4. Contenteditable Attribute

คุณสามารถใช้ contenteditable attribute เพื่อกำหนดว่า content ของ element จะสามารถแก้ไขได้หรือไม่ เนื่องจากมันจะอนุญาตให้ users สามารถแก้ไข content ภายใน element

*** นี่คือ global attribute ซึ่งหมายความว่า คุณสามารถใช้ attribute นี้กับ HTML element ทั้งหมดได้

5. Download Attribute

คุณสามารถใช้ download attribute กับ <a> element เพื่อระบุว่า เมื่อ users คลิกที่ link แล้ว linked resource ควรจะถูก download แทนที่จะเพียงแค่ navigate มัน

6. Hidden Attribute

คุณสามารถใช้ hidden attribute เพื่อซ่อน element บน web page สิ่งนี้มีประโยชน์สำหรับการควบคุมการมองเห็นผ่าน JavaScript หรือ CSS

*** นี่คือ global attribute ซึ่งหมายความว่า คุณสามารถใช้ attribute นี้กับ HTML element ทั้งหมดได้

7. Loading Attribute

คุณสามารถใช้ loading attribute กับ <img> element เพื่อควบคุมวิธีที่ browsers ทำการ load รูปภาพ โดยทั่วไปจะมีค่าอยู่ 3 ค่า ได้แก่ “eager,” “lazy,” และ “auto”

8. Multiple Attribute

คุณสามารถใช้ multiple attribute กับ <input> และ <select> element เพื่อให้ users สามารถเลือก/ป้อน ค่าหลาย ๆ ค่าได้พร้อมกันในคราวเดียว

9. Poster Attribute

คุณสามารถใช้ poster attribute กับ <video> element เพื่อแสดงรูปภาพจนกว่า users จะทำการเล่น video 

10. Readonly Attribute

คุณสามารถใช้ readonly attribute กับ <input> element เพื่อระบุว่า element นั้น สามารถ read-only (อ่านได้อย่างเดียว) ไม่สามารถแก้ไขได้

11. Srcset Attribute

คุณสามารถใช้ srcset attribute กับ <img> และ <source> (in <picture>) element เพื่อเป็นการจัดเตรียมรายการของ image sources มันจะช่วยให้ browsers สามารถเลือกรูปภาพที่แตกต่างกัน สำหรับหน้าจอที่มีขนาดแตกต่างกันได้

12. Spellcheck Attribute

คุณสามารถใช้ spellcheck attribute กับ <input> element (ที่ไม่ใช่ passwords), element ที่แก้ไขเนื้อหาได้ และ <textarea> element เพื่อ “เปิด” หรือ “ปิด” การตรวจสอบการสะกดโดย browser

13. Title Attribute

คุณสามารถใช้ title attribute เพื่อให้ข้อมูลเพิ่มเติมเกี่ยวกับ element ได้ โดยทั่วไปข้อมูลนี้จะแสดงเมื่อ user วาง mouse เหนือ element

*** นี่คือ global attribute ซึ่งหมายความว่า คุณสามารถใช้ attribute นี้กับ HTML element ทั้งหมดได้

ที่มา: https://blog.stackademic.com/

 

 

รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert

 

อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ

เพิ่มเพื่อน

 

บทความล่าสุด