使用javascript eventhandler更改html输入图像

我正在为我的个人网站建立一个非常简单的博客工具。我正在研究的一个特性是评论部分。在我的网站上，每一篇博客文章的旁边都有一个按钮，单击该按钮后，会显示该博客文章的评论

注释按钮是使用javascript动态创建的

  var commentLinks = document.createElement("INPUT");
        commentLinks.setAttribute("type", "image");
        commentLinks.setAttribute("src", "linkredacted");
        commentLinks.setAttribute("id", "commentButton"+i);
        commentLinks.addEventListener("onmouseover", function(){
    changeSrc(commentLinks);
}, false);

我面临的问题是鼠标悬停事件从不触发。我已经验证了我的URL路径是正确的，并且成功地创建了原始按钮，但是无论我做什么尝试，我都无法在鼠标悬停事件后调整按钮的大小。下面是上述代码调用的changeSrc函数：

function changeSrc(commentLinks)
{
  commentLinks.src = "linkredacted";
}

---

我还尝试了使用不起作用的setAttribute，以及将整个函数调用放在一个匿名函数中，这也不起作用。任何帮助都将不胜感激

使用鼠标盖。不是onmouseover

commentLinks.addEventListener（“onmouseover”，function（）{

应该是

commentLinks.addEventListener（“mouseover”，function（））{

只需使用背景图像和CSS。现在是2020年，而不是2000年。：p从头开始构建项目的目的是促使自己充分学习Javascript，因此使用CSS不是目标。请参阅回复。感谢您的回答。