为所有图像添加 Alt 属性 - Vanilla Javascript

Question

我如何才能遍历所有图像，检索图像标题，然后将其添加到 alt 属性？


function addAltAtrr() {
    //get the images
    let grabImage = document.querySelectorAll("img"); 
     
    //loop through all images
    for (let i = 0; i < grabImage.length; i++) {  
        grabImage[i].setAttribute("alt", "test");   
    }

}

addAltAtrr();

这当前将字符串“text”添加为 alt 属性

Answer 1

可以使用alt和title属性，它们反映了同名的属性。这是假设“标题”是指 title 属性，它显示为悬停工具提示。如果你指的是文件名，你可以使用图像元素的 src，但你可能想要处理它，例如删除文件扩展名。

另请注意，屏幕阅读器可能同时读出 alt 和 title，如果其中一个基于另一个，则这将是多余的。

function addAltAttrs() {
    //get the images
    let images = document.querySelectorAll("img"); 
     
    //loop through all images
    for (let i = 0; i < images.length; i++) {
        //add alt text if missing (but title is present)
        if (images[i].title && !images[i].alt) {
            images[i].alt = images[i].title;
        }
    }

}

addAltAttrs();

为所有图像添加 Alt 属性 - Vanilla Javascript

add Alt Attribute to all Images - Vanilla Javascript

javascript

attributes

alt