Автоматическое добавление атрибута «alt» к каждому изображению на странице - PullRequest
3 голосов
/ 27 апреля 2011

У меня есть требование добавить атрибут alt к каждому из изображений на каждой из моих веб-страниц. Проблема в том, что на некоторых из этих веб-страниц сотни изображений.

Может кто-нибудь предложить подход с использованием JavaScript или jQuery, который для каждого изображения на странице копирует имя изображения (без расширения) в новый атрибут alt?

До:

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

После (исключая ".jpg") :

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

Ответы [ 3 ]

12 голосов
/ 27 апреля 2011

В jQuery:

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

Вы могли бы спросить раньше, если атрибут alt уже не существует , добавив:

var attr = $(this).attr('alt');
    if (typeof attr == typeof undefined || attr == false) {
3 голосов
/ 27 апреля 2011

Вот подход JavaScript:

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

Запустите функцию runScript() после загрузки страницы!

0 голосов
/ 18 сентября 2014

Этот скрипт может помочь вам справиться с работой.Он добавит имя файла изображения в атрибут 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>
...