Javascript使用纯Javascript在悬停时显示图像alt

我的页面上有很多图像，我想用javascript而不是jquery在鼠标悬停时显示我的图像

我的图像代码是

<a href="<?php echo $displayData['href']; ?>" class="group">
    <div class="relative">
        <div class="absolute pin bg-black-50 group-hover:bg-black-10 transition"></div>
        <div class="absolute pin-b pin-l h4 pb-2 lg:pb-4 border-b-8 border-primary mb-10 mx-6 text-white z-10 leading-tight">
            <?php echo $displayData['name']; ?>
        </div>
        <img src="<?php echo $displayData['thumb']; ?>" title="<?=$displayData['name']?> alt="<?=$displayData['txt']?>">
    </div>
</a>

---

我使用了title和alt，但如果您有更多图像，它们都不会显示在鼠标悬停上

   <script>
    function set_alt_attribute(image) {

      image.setAttribute("alt", image.src); 
    }
    </script>

    <img src="my_image.jpg" onload="set_alt_attribute(this);">
    </img>

---

查看onmouseover和onmouseout事件

let img=document.querySelector("#imgid");

img.addEventlistener("mouseover",function(e)
{
     e.target.setAttribute('alt','blabla');
});

---

这些行为主要依赖于浏览器，是现成的。我会更新你的例子，使之成为纯HTML，这样其他人就可以100%准确地复制你的问题。（PHP代码与您的问题无关）您是否在源代码中检查了title属性是否已创建？控制台日志显示未定义

let img=document.querySelector("#imgid");

img.addEventlistener("mouseover",function(e)
{
     e.target.setAttribute('alt','blabla');
});