将某些数据设置为firstChild" data-id" attrbute?

时间:2016-12-17 06:31:50

标签: javascript dom

如何获取/设置firstChild的属性" data-id"? 我可以设置textarea的名称和内部文本:

el.firstChild.name='txt_'+j;
el.firstChild.innerText = 'Textarea '+j;

我要做的是改变" data-id'像这样的值(伪代码):

el.firstChild.data('id')=j; 

只是为了澄清 - 有点HTML:

<div id="5" class="textarea_cloned">
<textarea name="txt_5">Textarea 5</textarea>
<div class="remove" data-id="5"> X </div>
</div>

谢谢

2 个答案:

答案 0 :(得分:1)

试试这个 -

使用firstElementChild代替firstChild

此属性与firstChild之间的区别在于firstChild将第一个子节点作为元素节点,文本节点或注释节点返回(取决于哪个(第一个),而firstElementChild将第一个子节点作为元素节点(忽略文本和注释节点)返回。

 el.firstElementChild.dataset.id=j

样本

https://jsfiddle.net/vikrant47/frcqb42q/

dataset的{​​p} dom属性包含dom的所有数据属性的地图。

答案 1 :(得分:1)

如果您想在HTML代码中反映它,请使用setAttribute方法设置属性。虽然您需要使用firstElementChild来获取元素,否则textNode(开头的空格)可能会变为firstChild

 el.firstElementChild.setAttribute('data-id', j)

var j = 10,
  el = document.getElementById('5');
el.firstElementChild.setAttribute('data-id', j)

console.log(el.innerHTML)
<div id="5" class="textarea_cloned">
  <textarea name="txt_5">Textarea 5</textarea>
  <div class="remove" data-id="5">X</div>
</div>

如果您只想添加dataset属性,请在dataset中设置该属性。

el.firstElementChild.dataset.id = j