在 Javascript 中使用连字符获取元素

Question

HTML 片段：

<input title="List" data-id="1698481">

在

IE 11控制台中，我一直在尝试各种命令，没有连字符的所有内容都会正确返回，直到我点击"data-id"。

document.getElementsByTagName("input")[0].title
"List"
document.getElementsByTagName("input")[0].data-id
'id' is undefined

根据有关此主题的其他线程，我尝试了其他语法（驼峰大小写等），但我仍然无法让它返回任何值

document.getElementsByTagName("input")[0].dataId
undefined
document.getElementsByTagName("input")[0].["data-id"]
Expected identifier
document.getElementsByTagName("input")[0].['data-id']
Expected identifier

任何协助将不胜感激。

Answer 1

使用 .getAttribute() ：

document.getElementsByTagName("input")[0].getAttribute("data-id")

Answer 2

data-*属性很特殊：

document.getElementsByTagName("input")[0].dataset.id

data-* 属性从连字符转换为驼峰，因此data-test-attribute="test"等效于：

htmlElement.dataset.testAttribute; // test

有关更多信息，请参阅 数据集上的 MDN。