自动为页面上的每个图像添加'alt'属性

我有要求将alt属性添加到我的每个网页上的每个图像。问题是在这些网页的某些网页上有图像的数百。自动为页面上的每个图像添加'alt'属性

任何人都可以提出一种使用JavaScript或jQuery的方法，对于页面上的每个图像，将图像名称（减去扩展名）复制到新的alt属性中？

前：

<img src="android.jpg width="100" height="50" />

后（排除 “.JPG”）：

<img src="android.jpg width="100" height="50" alt="android" />

来源

2011-04-27 Charles Yeung

在jQuery中：

$(document).ready(function() { 
    $('img').each(function(){ 
    var $img = $(this); 
    var filename = $img.attr('src') 
    $img.attr('alt', filename.substring(0, filename.lastIndexOf('.'))); 
    }); 
});

如果alt属性确实你可以问前通过添加不already exist：

var attr = $(this).attr('alt'); 
    if (typeof attr == typeof undefined || attr == false) {

来源

2011-04-27 07:41:15

感谢您的建议，我如何粘贴一些HTML代码并点击按钮来运行此脚本，最终输出脚本？像这样http://tools.arantius.com/tabifier – 2011-04-27 07:45:24

这将在页面加载时运行。如果你想改变它在一个按钮上运行，点击然后用'$（'＃buttonId'）替换'$（document）.ready（function（）{'）。bind（'click'，function（）{' #buttonId与正确的选择器） – 2011-04-27 07:47:22

我不希望每次用户浏览此页面时都运行此脚本，因此我可以获取此更新的源代码并将其粘贴到页面上吗？ – 2011-04-27 07:52:49

下面是JavaScript的方法：

function runScript() { 
    for (i = 0; i < document.getElementsByTagName("img").length; i++) { 
     document.getElementsByTagName("img")[i].setAttribute(
      "alt", document.getElementsByTagName("img")[i].src); 
    } 
}

加载页面后运行功能runScript()！

来源

2011-04-27 07:37:03

但是，通过JavaScript在客户端添加alt并不能真正帮助您。首先，Google不会看到它们。另一方面，像l text这样的纯文本浏览器（最有可能需要alt）将不会看到它们。你只能在可访问性方面获得一些好处，但即使这样也会失去，除非你有非常好的图像文件名称。 – Amadan 2011-04-27 07:40:43

该脚本可以帮助您让您的工作处理。它会在alt属性中添加图像的文件名

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/> 
<script type='text/javascript'> 
//<![CDATA[ 
$(document).ready(function() { 
    $('img').each(function(){ 
    var $img = $(this); 
    var filename = $img.attr('src') 
    $img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.'))); 
    $img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.'))); 
    }); 
}); 
//]]> 
</script>

来源

2014-09-18 13:53:19

自动为页面上的每个图像添加'alt'属性

回答

相关问题