Javascript 在多个相同ID上具有addEventListener

我需要添加一个事件监听器到我的转发，喜欢和不喜欢按钮。他们都有相同的ID，所以现在只有最上面的tweet有计数器增加。这是一个学校的项目，所以我只能使用原始JS。以下是小提琴的链接：

下面是我的JS的样子

var retweets;
retweets = 0;

var likes;
likes = 0;

var dislikes;
dislikes = 0;

document.getElementById("retweet").addEventListener("click", retweetClicked);

function retweetClicked(){
    document.getElementById("retweet").innerHTML = retweets += 1;
};

document.getElementById("likes").addEventListener("click", likeClicked);

function likeClicked(){
    document.getElementById("likes").innerHTML = likes += 1;
};

document.getElementById("dislikes").addEventListener("click", dislikeClicked);

function dislikeClicked(){
    document.getElementById("dislikes").innerHTML = dislikes += 1;
};

---

元素ID在整个文档中应该是唯一的。如果有多个元素具有相同的ID，则HTML无效

资料来源：

我建议您，它支持在同一个类中有多个元素

---

然后可以使用

document.getElementsByClassName（“名称”）

获取该类中所有元素的列表。

元素ID在整个文档中应该是唯一的。如果有多个元素具有相同的ID，则HTML无效

资料来源：

我建议您，它支持在同一个类中有多个元素

---

然后可以使用

document.getElementsByClassName（“name”）

获取该类中所有元素的列表。

可以使用

document.queryselectoral（'[id=yourId]'）

文档中可能只有一个id。不是两个，也不是三个，而是一个。您必须重新排列HTML，以便id=“likes”只出现一次。否则它不是有效的HTML。如果希望有多个相同类型的项，请使用类。可以使用

document.querySelectorAll（'[id=yourId]'）

文档中只能有一个id。不是两个，也不是三个，而是一个。您必须重新排列HTML，以便id=“likes”只出现一次。否则它不是一个有效的HTML。如果你想有多个相同类型的项目，请使用一个类。简短而准确。该id不能重复+1@torazaburo谢谢，蒂尔。答案已更新。而且，简短而准确。该id不能重复+1@torazaburo谢谢，蒂尔。答案已更新。和。