javascript - 在 html 标签中添加自定义键

Question

假设我们有一组 html 标签，例如

<div id="slide1" class="slide"></div>
<div id="slide2" class="slide"></div>
<div id="slide3" class="slide"></div>

我试图在 div 标签中添加一个额外的属性，例如来自哈希 {"post": ["0","1"], 的 key='post'分别为每个标签的“get”:[“0”，“2”]，“search”:[“2”，“1”]}。所以它看起来像，

<div id="slide1" class="slide" key="post"></div>
<div id="slide2" class="slide" key="get"></div>
<div id="slide3" class="slide" key="search"></div>

可以使用 javascript 做到这一点吗？

我想出的代码看起来像

for(key in hashArray){
var el = document.getElementsByID('slide' + (slideNumber));
el.setAttribute('key', key);
slideNumber++;
}

但我收到错误 document.getElementByID 不是函数

Answer 1

使用custom data attributes [例如。 data-key]，那么你是完全正确的。

编辑:您的代码将如下所示:

var slideNumber = 1;

for(key in hashArray){
    var el = document.getElementById('slide' + (slideNumber));
    el.setAttribute('data-key', key);
    slideNumber++;
}

Working fiddle here .