Question

我想知道如何在鼠标悬停的alt元素内显示img的{{1}}文字。

这是 HTML：

JS：

<img src="img1.jpg" alt="one"/>
<img src="img2.jpg" alt="two"/>
<img src="img3.jpg" alt="three"/>

<p id="text"> </p>

和JSfiddle：here

Answer 1

您可以使用p DEMO

更改textContent元素的文字

var img = document.getElementsByTagName("img");
var text = document.getElementById("text");

for (var i = 0; i < img.length; i++) {
  img[i].addEventListener("mouseover", function() {
    var alt = this.alt;
    text.textContent = alt;
  });
}

如果您要删除mouseleave上的文字，可以添加其他事件并将文字更改为空字符串DEMO

Answer 2

我不确定这个的上下文，但title =“”属性通常显示为图像的工具提示。应该适用于所有桌面浏览器，所以我不确定你是否需要JS来做这件事。

在悬停时显示图像Alt属性文本

2 个答案: