关于:js怎么获取元素的自定义属性的问题(原生JavaScript)

发布时间:2024-12-03 07:32

问题定义:确保理解正确的问题是什么 #生活技巧# #学习技巧# #解决问题的思考技巧#

最新推荐文章于 2023-03-29 17:59:47 发布

野生猿rang 于 2018-07-12 21:52:15 发布

版权声明:本文为博主原创文章,遵循 CC 4.0 BY 版权协议,转载请附上原文出处链接和本声明。

        最近项目需要把后端传过来的数据隐藏的保存在页面中,方便后边做事件处理时使用。鉴于之前总是在后端处理后的页面中看到元素里除了常见的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("属性")

网址:关于:js怎么获取元素的自定义属性的问题(原生JavaScript) https://www.yuejiaxmz.com/news/view/356792

相关内容

js获取属性的值
IE8 添加href=javascript:;和click事件,响应完click事件后会导致页面离开,解决方案是去掉href属性
Javascript基础第六天知识点以及案例:作用域、JS预解析、对象
jquery1.8 在IE8 下面报错:对象不支持此属性或方法 return b.getAttribute(“id”)===a
javascript中等于(==)与全等(===)的区别说明
聊聊JS DOM变化的监听检测与应用 « 张鑫旭
JavaScript常用优化分享(三)
如何优化网页运行JS脚本性能提高用户体验和加载速度的有效方法
有个开发者总结这 15 优雅的 JavaScript 个技巧
TabIndex 属性:Tabindex='

随便看看