How to set the alt attribute value of an image in JavaScript?

Question

In my website, I want to check if the alt attribute for all images has not been set or an empty string and give it a default value.

How to set the alt attribute value of an img tag?

Answer 1

To set the alt attribute value of an image

1 ) In JavaScript

<script type="text/javascript">

var imageTag = document.getElementsByTagName('img');

 for (var i = 0; i < imageTag.length; i++) {
 if (imageTag[i].alt == "" || imageTag[i].alt == null) {
            imageTag[i].setAttribute("alt", "your defualt text");
   }
}
</script>

---

2 ) In JQuery

<!-- reference jQuery link -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function () {
$('img').each(function () {
 const alt = $(this).attr('alt'); //Get the alt value
       if (!alt) {
            $(this).attr('alt', 'your default text'); //Set your desired alt text
         }
    });
});
</script>

---

3) Optimize jQuery script, to reduce the need for an explicit loop and make the code simpler

$(document).ready(function () {

$('img[alt=""], img:not([alt])').attr('alt', 'default alt text');

});