2016-12-01 5 views
3
<body> 

<p class="initial">Number One!</p> 
<p class="initial">Number Two!</p> 
<p class="initial">Number Three!</p> 

<script> 
var x = document.getElementsByClassName("initial"); 
x[0].innerHTML = "<span class=\"fix\">super duper</span>"; 
</script> 

</body> 

x[0].innerHTMLは、最初の要素を指します。しかし、配列内のいくつかの要素のinnerHTMLを変更したいのですが?例えば、第1および第3。 x[0, 2].innerHTMLは機能しません。私は構文をオンラインで探していて、何も見つけられません。JavaScript Arrayの複数の要素を指す正しい構文は何ですか?

+0

あなたはそのように行うことはできません。個々に個別に声明が必要です。 – putvande

+0

あなたが答えに満足しているときは、[*私の質問に答えるときはどうすればよいですか?*](http://stackoverflow.com/help/someone-answers)を読むことを忘れないでください。あなたは1つしか受け入れることはできませんが、あなたは「感謝」と言ってもいいと思われる回答をアップヴォートすることができます。 – Aurora0001

答えて

3

は、コードを複数回実行するfor loopを考えてみましょう:

for (var i = 0; i < 3; i++) { 
    x[i].innerHTML = "<span class=\"fix\">super duper</span>"; 
} 

したい特定の要素、配列を作成し、forEach loopで反復処理がある場合:

var desiredElems = [1, 3, 7, 9]; 
desiredElems.forEach(function(element) { 
    x[element].innerHTML = "<span class=\"fix\">super duper</span>"; 
}); 
+0

おかげさまでオーロラ!それはそれを解決する良い方法です。しかし、私はすべてのインスタンスを修正したくない場合はどうすればいいですか? 99の場合と同様に、ページ全体にランダムに散在する5を修正したかったのです。それは簡略化されていませんか? – DR01D

+0

@ DR01Dはそれをあなたのために追加しました。 – Aurora0001

3

割り当てが式では、割り当てられた値を返すので、次の操作を実行できます。

var indices = [0, 2]; 
 

 
var x = document.getElementsByClassName("initial"); 
 
indices.forEach(function(i) { 
 
    x[i].innerHTML = "<span class=\"fix\">super duper</span>"; 
 
})
<p class="initial">Number One!</p> 
 
<p class="initial">Number Two!</p> 
 
<p class="initial">Number Three!</p>

:あなたは一握り指数以上のものを変更したい場合は10
var x = document.getElementsByClassName("initial"); 
 
x[0].innerHTML = x[2].innerHTML = "<span class=\"fix\">super duper</span>";
<p class="initial">Number One!</p> 
 
<p class="initial">Number Two!</p> 
 
<p class="initial">Number Three!</p>


、あなたはループを配列としてインデックスを定義して使用することができます

+1

それは素晴らしい作品です!しかし、「イニシャル」のインスタンスが99件あり、#3、17、35、36、89、91で作業したい場合はどうすればよいですか?省略形はありませんか?ありがとうティモ! – DR01D

+1

私の編集を見てください。創造的な時間! – Timo

+0

ゴールド!!!ありがとうTimo – DR01D

2

で配列を反復処理できます。:

var x = document.getElementsByClassName("initial"); 
 
for (var i of [0,2]) 
 
    x[i].innerHTML = "<span class=\"fix\">super duper</span>";
<p class="initial">Number One!</p> 
 
<p class="initial">Number Two!</p> 
 
<p class="initial">Number Three!</p>

+0

ありがとうオリオール、私はそれだと思う!それは金です! – DR01D

+0

'for ... of'はES6機能であり、すべての対象ブラウザでサポートされていない可能性があります(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for ... of#Browser_compatibility)、たとえばIE12(Edge)以前のバージョンのInternet Explorer。 – Timo

関連する問題