使用jQuery获取data-的自定义属性
废话少说,先上代码
jQuery.fn.dataset=function(attr,val){
//获取数据集
if(arguments.length==0){
vardataset={};
jQuery(this).eq(0).each(function(){
varattrs=this.attributes;
for(vari=0,l=attrs.length;i<l;i++){
varattr=attrs[i];
if(/^data-/i.test(attr.name)){
dataset[decode(encode(attr.name.substring(5)))]=autobox(attr.value);
if(decode(encode(attr.name.substring(5)))=="path"){
dataset[decode(encode(attr.name.substring(5)))]=attr.value!=null?String(attr.value):null;
}
if(decode(encode(attr.name.substring(5)))=="name"){
dataset[decode(encode(attr.name.substring(5)))]=attr.value!=null?String(attr.value):null;
}
}
}
});
returndataset;
}
//返回指定数据
if(arguments.length==1&&typeofattr!='object'){
if(encode(attr)=="data-path"){
returnthis.attr(encode(attr));
}
returnautobox(this.attr(encode(attr)));
}
//设置数据集
vardataset=attr;
if(typeofattr!='object'){
dataset={};
dataset[attr]=String(val);
}
vartmp={};
jQuery.each(dataset,function(k,v){
tmp[encode(k)]=autobox(v);
});
returnthis.attr(tmp);
};
通过jQuery制作组件,可以轻松获取到我们data-的自定义属性,也可以给data-属性来赋值。
获取:
$("div").dataset("name")//获取data-name的值
赋值:
$("div").dataset("name","Tezml")//给data-name这个属性赋值为Tezml