クリックされた要素のみのgetElementsByClassName（ 'class'）

私はクラスで一連のdivを持っています。私は、ユーザーがクリックしたdiv内のテキストを選択したいと思います。以下のコード例でクリックされた要素のみのgetElementsByClassName（ 'class'）

、最初のdivをユーザーがクリックすると、テキストがあるべき出て慰めた場合：ユーザーが第二のdivをクリックすると、「サンプルテキストONE」

すると、それは「サンプルテキストTWOする必要があります「

は、私はIDとgetElementByIdを（『ID』）。innerHTMLの

を持つdivタグで欲しいものを達成することができますが、私は動作しないクラスとそれを達成するために強制しています。さらに掘り

：私はのgetElementsByClassNameは、オブジェクトのような配列を返すことを理解し、document.getElementsByClassName作業の[0] .innerHTML意志種類、それが最初の要素だけを返しています（「sample_div。」）。おそらく、0をクリックしたdivのインデックスに置き換える方法がありますか？

これを行うには、クラスでこれを行う方法は素晴らしいでしょう。ありがとうございました。

<!DOCTYPE html> <html> 

<div class='sample_div'>Sample text ONE</div> 
<div class='sample_div'>Sample text TWO</div> 

</html> 

<script type="text/javascript">  

const divs = document.querySelectorAll('.sample_div'); 

divs.forEach(divSelect => divSelect.addEventListener('click', notice)); 

function notice() { 
    let text = document.getElementsByClassName('.sample_div').innerHTML; 
    console.log(text); 
}

出典

2017-08-25 PolarisTLX

this jQueryを使ってクリックした要素

が含まれています、あなたはすべての.sample_divに耳を傾けイベントリスナーを作成し、this変数とそれを参照することができます。 jQueryのなし

$(".sample_div").click(function(){ 
 
    console.log(this.innerHTML) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class='sample_div'>Sample text ONE</div> 
 
<div class='sample_div'>Sample text TWO</div>

それは次のようにする必要があります：これは私で動作するように多くを与え

//Get all the elements with the class "sample_div" 
 
var sampleDivs = document.getElementsByClassName("sample_div") 
 

 
//Iterate over the sampleDivs node array 
 
for(var x=0, sampleDivsLength = sampleDivs.length; x<sampleDivsLength;x++){ 
 
    //Add an event listener for each DOM element 
 
    sampleDivs[x].addEventListener("click",function(){ 
 
    console.log(this.innerHTML) 
 
    }) 
 
}

<div class='sample_div'>Sample text ONE</div> 
 
    <div class='sample_div'>Sample text TWO</div>

出典

2017-08-25 01:09:54 Frankusky

。ありがとうございました！ – PolarisTLX

クリックされた要素のみのgetElementsByClassName（ 'class'）

答えて

関連する問題