javascript - jsでdivにデータ属性を設定する

Question

data 属性を適用したい div.textBox がたくさんあります。

これが私が終わらせたいものです：

<div class="text" data-stellar-ratio="2">

私はもう試した：

document.getElementByClassName('text').dataset.stellar.ratio = "2";

しかし、それは機能していません...

ヘルプ！

score 13 · Accepted Answer

DocumentインターフェースのgetElementsByClassNameメソッドは、指定されたすべてのクラス名を持つすべての子要素の配列のようなオブジェクトを返します。

より正確には、NodeListが返され、配列としてアクセスできます。セレクターが最初に見つける要素は、インデックス0を介してアクセスされます。

document.getElementsByClassName('text')[0].setAttribute('data-stellar-ratio', '2')

score 1 · Accepted Answer

スペルがgetElementsByClassName間違っているため、要素のコレクションを繰り返し処理して、に変更する必要がありstellar.rationますstellarRatio。

var eles = document.getElementsByClassName('text');
for (var x = 0; x < eles.length; x++){
  eles[x].dataset.stellarRatio = "2";
}

score 1 · Accepted Answer

setAttribute は、すべてのブラウザーで完全に機能するわけではありません。http://www.w3schools.com/jsref/met_document_createattribute.aspには、確かにうまく機能する例があります。

var att=document.createAttribute("whatever");
att.value="someting";
document.getElementById('mydivid').setAttributeNode(att);

4 に答える 4