關於H5的自定義屬性data

2022-07-25 13:03:13 字數 1429 閱讀 7561

data-* 是h5的新屬性,用來讓開發者對標籤新增自定義屬性的。

其讀寫方式有如下幾種:

如果是data-abc的格式,則採用正常格式abc來讀寫該屬性值

html5 data-*自定義屬性 age

// 原生 js 方式讀寫

var content= document.getelementbyid('content');

console.log(content.dataset.age);//讀

content.dataset.name ="小白」;//寫

console.log(content.dataset.name);//讀

// jquery 方式讀寫

console.log($('#content').data('age'));//讀

$('#content').data('name', "小黑");//寫

console.log($('#content').data('name'));//讀

若果是data-abc-abc-abc的格式,則採用首字母小寫的駝峰式abcabcabc讀寫該自定義屬性值

data-user-list自定義屬性

var list = [,]

// 原生 js 獲取方式

var content= document.getelementbyid('content');

console.log(content.dataset.userlist);//讀

content.dataset.userlist=list;//寫

console.log(content.dataset.userlist);//讀

// jquery 方式讀寫

console.log($('#content').data('userlist'));//讀

$('#content').data('userlist', list);//寫

console.log($('#content').data('userlist'));//讀

getattribute/setattribute方法的使用

data-user-list自定義屬性

var content= document.getelementbyid('content');

content.dataset.birthdate = '19990619';//寫

content.setattribute('age', 25);//寫

console.log(content.getattribute('data-birth-date')); //讀

console.log(content.getattribute('data-age')); //讀

關於H5的自定義屬性data

data 是h5的新屬性,用來讓開發者對標籤新增自定義屬性的。其讀寫方式有如下幾種 如果是data abc的格式,則採用正常格式abc來讀寫該屬性值 html5 data 自定義屬性 age 原生 js 方式讀寫 var content document.getelementbyid content...

jq獲取h5的自定義data 屬性的問題

1 設定data 屬性 jq name data name name js document.getelementbyid name dataset.name name 2 獲取data 屬性 jq name data name js document.getelementbyid name dat...

H5 自定義資料屬性

html5規定可以為元素新增非標準的屬性,但要新增字首data 目的是為元素提供與渲染無關的資訊,或者提供語義資訊。新增自定義屬性之後,可以通過元素的dataset屬性來訪問自定義屬性的值。dataset屬性的值是domstringmap 物件 的乙個例項。var mydiv document.qu...