Question

提前感谢您提供的任何帮助！

我有以下HTML代码：

<div class="ProductImage">
   <a href="URL LINK">
      <img src="IMAGE LINK" alt="BLAH BLAH - SALE!" />
   </a>
</div>
<div class="ProductImage">
   <a href="URL LINK">
      <img src="IMAGE LINK" alt="BLAH BLAH - BONUS!" />
   </a>
</div>

我希望，使用Javascript，一旦页面加载，找到类ProductImage的DIV内的所有图像实例，其中ALT值包含单词“SALE”，并按如下方式更改HTML：

<div class="ProductImage">
   <a href="URL LINK">
      <img src="IMAGE LINK" alt="BLAH BLAH - SALE!" />
   </a>
   <img src="MY NEW SALE IMAGE LINK" class="MyClass" />  <!-- NEW inserted HTML statement -->
</div>
<div class="ProductImage">
   <a href="URL LINK">
      <img src="IMAGE LINK" alt="BLAH BLAH - BONUS!" />
   </a>
   <img src="MY NEW BONUS IMAGE LINK" class="MyClass" />  <!-- NEW inserted HTML statement -->
</div>

我被困在引用儿童＆amp;在我的各种代码迭代中的父节点......疯狂正在设置......

请帮助这个（几乎是疯狂的）初学者。

提前致谢！ MarcusL

Answer 1

尝试

var imgs = document.getElementsByTagName('img'), img, newImg;
var regex = /sale/i;
for(var i = 0; i < imgs.length; i++){
    img = imgs[i];
    if(regex.test(img.alt)){
        var parent = img.parentNode.parentNode;
        newImg = document.createElement('img');
        newImg.src='new-img';
        parent.appendChild(newImg)
    }
}

Answer 2

如果你可以/将/将使用jQuery，那么就可以这样做：

jQuery('img[alt*="SALE"]').attr('alt', 'BLAH BLAH - SALE!');

根据IMG的ALT值插入HTML语句

2 个答案: