javascript - a要素の値にアクセスしようとしているだけです

Question

私は複数の を持っています。これはa elementsfor ループによってページビューで生成され、それらがクリックされたときに をデータベースに送信ajax postし、データベース内のアイテムを ID でマークしますa element。コードが機能していません。理由について誰か洞察がありますか? ありがとう。

<a href='#' value='(loaded from database)' id='markAsRead'>

var element = document.getElementById('markAsRead');

element.addEventListener('click', function() {
   alert(this.value);
});

Answer 1

アンカーには入力のような値はありません。データ属性を使用する必要があります

<a href='#' data-value='(loaded from database)' id='markAsRead'>

var element = document.getElementById('markAsRead');

element.addEventListener('click', function() {
 alert(this.getAttribute("data-value"));
});

Answer 2

id属性は一意である必要があります。

同じ識別子を持つコントロールのグループが必要な場合は、属性を使用できますname。

dom 操作の関数を見ると、次のようになります。

• document.getElementById()- 要素 (単数形)
• document.getElementsByName()- 要素 (複数)

一意の（状況に応じて）ID を追加する例

for (var index = 0; index < 10; index++) {
    var element = document.createElement("a");
    element.setAttribute("data-value", "your value");
    element.setAttribute("id", "markAsRead_" + index);
    element.addEventListener('click', function() {
        alert(this.getAttribute("data-value"));
    });
    document.getElementsByTagName("body")[0].appendChild(element);
}