更改图像 alt 标签实际上并没有反映在浏览器中答案

【问题标题】：changing image alt tag does not actually reflect in browser更改图像 alt 标签实际上并没有反映在浏览器中
【发布时间】：2018-08-13 03:42:55
【问题描述】：

这是我的 ajax 查询。它从服务器检索一些数据，淡出图像，更改图像，然后将其淡入。

$(document).ready(function() {
    setInterval(function() {
        $.ajaxSetup({ cache: false });

        //alert("launching...");
        const rvtoken = $("input[name='__RequestVerificationToken']").val();
        const moduleId = @Dnn.ModuleContext.ModuleId;
        const tabId = @Dnn.ModuleContext.TabId;

        $.ajax({
            cache: false,
            dataType: 'json',
            url: "/DesktopModules/MVC/LH.Home/Home/GetAssociation",
            method: "Post",
            headers: {
                "ModuleId": moduleId,
                "TabId": tabId,
                "RequestVerificationToken": rvtoken,
                "AssociationID": $("#hfAssociationID").val()
            },
            success: function(data) {
                $("#associationDiv").fadeOut(3000,
                    function() {
                        $('#discoverLink').attr("href", `/Association/${data.Title}`);
                        $('#SelectedAssociationLink').attr("href", `/Association/${data.Title}`);
                        $('#SelectedAssociationImg').attr("src",
                        `/portals/@Dnn.ModuleContext.PortalId/assets/associations/${data.Slug}/images/img1.png`);
                        $('#SelectedAssociationImg').attr("alt", `${data.Title} icon`);
                    });
                    $("#associationDiv").fadeIn(3000);
                    $("#hfAssociationID").val(data.AssociationID);

                },
                error: function(jqXHR, textStatus, errorThrown) {
                    console.log(textStatus);
                    console.log(errorThrown);
                    console.log(jqXHR);
                }
            });
        },
        30000
    );
})

一切都按预期进行。 href链接变了，图片也变了。

问题在于图片的替代文字。当我检查元素时，我可以看到它的变化，但是当我翻转图像时，显示的 alt 标记文本就是加载文档时的任何内容。

如何让鼠标悬停替代文本正确显示？

【问题讨论】：

标签： jquery html image alt

【解决方案1】：

这可能是因为浏览器在页面加载时存储了 alt 标签，然后不反映对其所做的任何更改，如果是这种情况，解决此问题的一种方法是简单地删除图像，并使用新属性重新插入它。

$('#SelectedAssociationImg').replaceWith("<img id='SelectedAssociationImg' src='newSrc' alt='newAlt'/>")

请记住将newSrc 和newAlt 替换为您想要的任何内容。

【讨论】：

将此标记为答案。它让我走上了正轨： $('#SelectedAssociationImg').attr("title", ${data.Title} icon);鼠标悬停时显示的是标题，而不是替代文字。

【解决方案2】：

alt 不是鼠标悬停图像时显示的内容，title 是。

【讨论】：

【解决方案3】：

确保清除 Web 浏览器的缓存并在之后进行完全刷新您对您的 javascript 进行了编辑。

【讨论】：