我可以获得的值,id
但data-id
显示此错误,
Uncaught ReferenceError: id is not defined
我的代码,
<ul id="highscores"></ul>
<script>
var hst = document.getElementById("highscores");
var highScores = [
{ id: "1",name: "Maximillian", score: 1000 },
{ id: "2",name: "The second guy", score: 700 },
{ id: "3",name: "The newbie!", score: 50 }
];
function deleteById ( self ){
console.log(self.id);
console.log(self.data-id);
}
for (var i = 0; i < highScores.length; i++) {
hst.innerHTML +=
"<li >" +"<a data-id='test' id="+highScores[i].id + " href='#' onclick='deleteById(this)'>x</a>" +
highScores[i].name +
" -- " +
highScores[i].score +
"</li>";
}
</script>
属性和属性是两个不同的东西。您定义的data-id
属性不会自动关联到该元素上的属性。类似地,例如 an<input type="text">
可以有一个value
属性,但value
它的属性并不一定会给您该属性的值,因为该value
属性指向当前输入中的内容,而该value
属性是它的初始值。尝试分离这两个概念。
不过,要回答您的问题;有两种方法。一是使用element.getAttribute('data-id')
。这适用于任何属性。但是,data-*
属性有自己的奇特方式来读取和写入其值。财产dataset
。例如,要访问该data-id
属性,您可以使用element.dataset.id
. 同样,要访问该data-foo-bar
属性,您可以使用element.dataset.fooBar
.
TLDR:使用element.dataset.id
或element.getAttribute('data-id')
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句