簡単なJavaScriptクエリ

Question

私はちょうどJavascriptを学び始めています。私は現在、これを使ってアンカータグのHTMLを変更しようとしています。私は最終的に同じアンカーのいくつかを持っているので、私はクラスごとにそれをやりたかったので、各IDでこれをやっていません。

<div class="testing2"> 
      <a href="http://802.f5f.myftpupload.com/11550-2/design/11544/" class="wpc-customize-product">Customize</a> 
     </div> 

     <script type="text/javascript"> 

      var test = document.getElementsByClassName('testing2'); 
      var anchors = test.getElementsByTagName('a'); 
      if (anchors[0]) { 
       anchors[0].innerHTML="Blank"; 
} 


     </script> 

問題は、クラスを使用しているとき、私はIDを使用している場合、この作業を行うことはできませんが、ある - 私はエラーがキャッチされない例外TypeErrorを受け取る：test.getElementsByTagNameは関数ではありません。

私には何が欠けていますか？

Answer 1

あなたは、単に

document.querySelectorAll('.testing2 a')[0].innerHTML 

Answer 2

ここでの問題は、testが配列を含むが、あなたは一人としてそれを呼び出していないということであるとして、これを達成するためにquerySelectorを使用することができます。クラス.testing2

第二とあなたは要素内のすべてのa要素を選択するquerySelectorAll('.testing2 a')を必要とする第一

var anchors = test[0].getElementsByTagName('a'); 

Answer 3

あなたは空白にinnerHTMLプロパティを更新するために、すべての要素を選択し、プロセスをループforeachループを必要としています。

<div class="testing2"> 
 
    <a href="http://802.f5f.myftpupload.com/11550-2/design/11544/" class="wpc-customize-product"> Customize1</a> 
 
    <a href="http://802.f5f.myftpupload.com/11550-2/design/11544/" class="wpc-customize-product"> Customize2</a> 
 
    <a href="http://802.f5f.myftpupload.com/11550-2/design/11544/" class="wpc-customize-product"> Customize3</a> 
 
    <a href="http://802.f5f.myftpupload.com/11550-2/design/11544/" class="wpc-customize-product"> Customize4</a> 
 
</div> 
 

 
<script type="text/javascript"> 
 
    var testing2 = document.querySelectorAll('.testing2 a'); 
 
    Array.prototype.forEach.call(testing2, function(el) { 
 
    el.innerHTML = "Blank"; 
 
    }); 
 
</script>