2017/03

html5中的date-*屬性

發(fā)布時(shí)間：2017-03-03 10:41:36

發(fā)布者：369563174

瀏覽量:

在HTML5中添加了data-*的方式來自定義屬性，所謂data-*實(shí)際上上就是data-前綴加上自定義的屬性名，使用這樣的結(jié)構(gòu)可以進(jìn)行數(shù)據(jù)存放。使用data-*可以解決自定義屬性混亂無管理的現(xiàn)狀。

他的定義和用法：

data-* 屬性用于存儲(chǔ)頁面或應(yīng)用程序的私有自定義數(shù)據(jù)。

data-* 屬性賦予我們?cè)谒?HTML 元素上嵌入自定義 data 屬性的能力。

存儲(chǔ)的（自定義）數(shù)據(jù)能夠被頁面的 JavaScript 中利用，以創(chuàng)建更好的用戶體驗(yàn)（不進(jìn)行 Ajax 調(diào)用或服務(wù)器端數(shù)據(jù)庫查詢）。

data-* 屬性包括兩部分：

屬性名不應(yīng)該包含任何大寫字母，并且在前綴 "data-" 之后必須有至少一個(gè)字符

屬性值可以是任意字符串

比如說獲取自定義屬性的值

如下：

    html5 data-*自定義屬性 age

多了一個(gè)”data-*” 屬性, 如何獲取呢?

     
    var content= document.getElementById('content');
    alert(content.dataset.age)
   
    $('#content').data('age');

上一篇： html5為什么這么火、原因是什么

下一篇： CSS:透明度 opacity與rgba()的區(qū)別

關(guān)鍵詞:

相關(guān)文章

2025-04-18

uniapp怎么組件間傳值的兩種方法查看詳情

2025-04-12

uniapp使用阿里巴巴矢量圖標(biāo)庫查看詳情

2025-03-29

2025-03-21

2025-03-15

2025-03-15

相關(guān)案例

移動(dòng) 詳細(xì) 系統(tǒng)

手術(shù)移動(dòng)護(hù)理系統(tǒng)

手術(shù)護(hù)理系統(tǒng) 手術(shù)移動(dòng)護(hù)理系統(tǒng) 手術(shù)護(hù)理流程化管理系統(tǒng)

紅寶書智慧黨建平臺(tái)

黨建平臺(tái)

欧美成人片一区二区三区,久久碰人妻一区二区三区,久久婷婷激情综合色综合俺也去,狂野欧美性猛交免费视频,久久夜色精品国产亚洲