向所有图片添加Alt属性-香草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();