ตัวอย่างการเขียน
<div data-lole = page data-lest-value = 43 data-hidden = true data-options = '{ชื่อ: john}'> </div> 1. คำจำกัดความ:แอตทริบิวต์ Data-* ใช้เพื่อจัดเก็บข้อมูลที่กำหนดเองส่วนตัวสำหรับหน้าจัดเก็บข้อมูลหรือแอปพลิเคชัน
ข้อมูล-* แอตทริบิวต์ให้ความสามารถในการฝังแอตทริบิวต์ข้อมูลที่กำหนดเองในองค์ประกอบ HTML ทั้งหมด
2. ให้ความสนใจ:ข้อมูล-* แอตทริบิวต์ประกอบด้วยสองส่วน:
ใช้ค่าแอตทริบิวต์ data-*เพื่อใช้ฟังก์ชัน. data () ใน jQuery
console.log ($ (div) .data ('lastValue')); คือ: หน้าคือ: หน้า ข้อควรระวังข้อมูล-** ชื่อแอตทริบิวต์รูปแบบชื่อ hump rewriting
แอตทริบิวต์ข้อมูลไม่สามารถเข้าถึงหรือเปลี่ยนแปลงได้อีกต่อไปหลังจากใช้แอตทริบิวต์ข้อมูลนี้เป็นครั้งแรก (ค่าข้อมูลทั้งหมดจะถูกเก็บไว้ใน jQuery)
สาธิต:
console.log ($ (div) .data ('lastValue')); DIV ที่สามในเอกสารเราเอาต์พุต DOM // เอาต์พุตนี้: <div data-lole = page data-last-value = 43 data-highden = true data-options = '{ชื่อ: john}'>อย่ากลัวคุณส่งออกอีกครั้ง
console.log ($ (div) .data ('lastValue'));ค่าถูกเก็บไว้ใน jQuery
ใช้ค่าแอตทริบิวต์ data-*ด้วยฟังก์ชัน. attr () ใน jQuery
console.log ($ ('div'). attr ('data-Role')); ; // ค่าเอาต์พุตคือ 43ตั้งค่า Data-*ค่าแอตทริบิวต์ด้วยฟังก์ชัน. attr () ใน jQuery
$ ('div')หมายเหตุ: หมายเลขที่แตกหักจะต้องถูกแปลงเป็นชื่อโคก
สรุปข้างต้นคือการโต้ตอบระหว่าง HTML5 แอตทริบิวต์ใหม่ข้อมูล-*และ JS/JQuery แนะนำโดยบรรณาธิการให้คุณ ในเวลา ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Vevb Wulin!