<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
li {
list-style-type: none;
cursor: pointer;
}
</style>
</head>
<body>
<ul id="uu">
<li>张三</li>
<li>李四</li>
<li>王五</li>
<li>赵六</li>
<li>小明</li>
</ul>
<script src="common.js"></script>
<script>
//根据id获取ul标签,并且获取该标签中所有的li
var list = my$("uu").getElementsByTagName("li");
for (var i = 0; i < list.length; i++) {
//先为每个li标签添加自定义属性
//list[i].score = (i+1)*10;//此方式,自定义属性在DOM对象上,不在标签中
list[i].setAttribute("score", (i + 1) * 10);
//点击每个li标签,显示对应的自定义属性值
list[i].onclick = function () {
alert(this.getAttribute("score"));
};
}
</script>
</body>
</html>
JavaScript DOM操作案例自定义属性的设置跟获取
Stella981
• 阅读
719
点赞
收藏
