关于：js怎么获取元素的自定义属性的问题（原生JavaScript）

        最近项目需要把后端传过来的数据隐藏的保存在页面中，方便后边做事件处理时使用。鉴于之前总是在后端处理后的页面中看到元素里除了常见的id、name属性外的data-xxx，就想到：元素的属性必然是可以自定义并获取到的，百度了下，原来JavaScript本来就自带有函数getAttribute( )用于获取只定义属性，于是迫不及待的写了个demo：

 
<input type="button" id="data" data-id=1 data-url="http://localhost" name="" value="data" onclick="getdata(this,['data-id','data-url'])">

<script type="text/javascript">
function getdata(agr,arr){
	data = new Array();
	for(i=0;i<arr.length;i++){
		data[i]=document.getElementById(agr.id).getAttribute(arr[i]);
	}
	console.log(data);
}
</script>	data = new Array();
	for(i=0;i<arr.length;i++){
		data[i]=document.getElementById(agr.id).getAttribute(arr[i]);
	}
	console.log(data);
}
</script>

没错，控制台输出了：["1", "http://localhost"]   美滋滋…

顺便测了下兼容性：

现代浏览器（火狐、QQ、IE>=9）都支持，可以将属性加载input、li、span甚至XML等任意标签上，IE8即以下会报错：SCRIPT438: 对象不支持此属性或方法

 

获取、设置元素的属性：

1-原生JS

       设置属性 .setAttribute("属性","值")
       获取属性 .getAttribute("属性")

2-jquery

       设置属性 .attr("属性","值")
       获取属性 .attr("属性")