html5規定可以為元素新增非標準型的屬性,只需新增字首data-,這些屬性可以隨意新增,隨意命名,目的是為元素提供與渲染無關的資訊,或提供語義資訊。
iefirefox
chrome
safari
opera
支援支援
支援支援
支援所有主流瀏覽器都支援 data-* 屬性。
下面就詳細介紹四種方法獲取data-*
屬性的值
獲取id需要獲取的就是
data-id
和dtat-vice-id
的值
一:getattribute()方法
const getid = document.getelementbyid('getid');二:dataset()方法// //getattribute()取值屬性
console.log(getid.getattribute("data-id"));//12
console.log(getid.getattribute("data-vice-id"));//11
// //setattribute()賦值屬性
getid.setattribute("data-id","48");
console.log(getid.getattribute("data-id"));//48
//data-字首屬性可以在js中通過dataset取值,更加方便三:jquery data()方法console.log(getid.dataset.id);//12
//data-vice-id連線取值使用駝峰命名法取值
console.log(getid.dataset.viceid);//11
//賦值
getid.dataset.id = "113";//113
getid.dataset.viceid--;//10
//新增data屬性
getid.dataset.id2 = "100";//100
//刪除,設定成null,或者delete
getid.dataset.id2 = null;//null
delete getid.dataset.id2;//undefind
var id = $("#getid").data("id"); //12四:jquery attr()方法var viceid = $("#getid").data("vice-id"); //11
//賦值
$("#getid").data("id","100");//100
var id = $("#getid").attr("data-id"); //122以上內容來自多個部落格總結,多謝博主的幫助var viceid = $("#getid").attr("data-vice-id"); //11
//賦值
$("#getid").attr("data-id","100");//100
jquery 獲取data 屬性值
html5規定可以為元素新增非標準型的屬性,只需新增字首data 這些屬性可以隨意新增,隨意命名,目的是為元素提供與渲染無關的資訊,或提供語義資訊。getid data id 122 data vice id 11 獲取id const getid document.getelementbyid g...
獲取data 屬性值
下面就詳細介紹四種方法獲取data 屬性的值 getid data id 122 data vice id 11 獲取id 需要獲取的就是data id和dtat vice id的值 一 getattribute 方法 const getid document.getelementbyid geti...
jquery獲取html屬性值
jquery獲取html標籤自定義屬性值或data值 獲取屬性值 1 id text value 帥帥的男神 jquery取值 text attr value 獲取自定義屬性值 2 id text value 123 data obj 帥帥的男神 jquery取值 text attr data ob...