jQuery 操作 / each() - 为什么这不针对单个元素？答案

【问题标题】：jQuery manipulation / each() - why is this not targeting individual elements?jQuery 操作 / each() - 为什么这不针对单个元素？
【发布时间】：2012-03-08 17:06:08
【问题描述】：

我有一些图像（在其他地方生成），我想使用 jQuery 进行操作和增强。

我有一个脚本来执行我需要的一切，除了个人操作；我的脚本在所有元素上执行，而不是单独执行。我错过了什么？

这就是我所拥有的：

这种格式的多张图片：

<p>
  <a href="">
    <img src="" />
  </a>
</p>
<p>
  <a href="">
    <img src="" />
  </a>
</p>

jQuery：

  $('p').each(function(){

        //grab img's SRC
        var imgLinkMerge = $('p img').attr('src');

          //find the a tag, change HREF for imgLinkMerge value
          $(this).find('a').attr('href', imgLinkMerge).each(function(){
            //set css BG IMG
            $(this).css('background-image', 'url(' + imgLinkMerge + ')');
          });

        });

【问题讨论】：

您能否更具体地说明发生的与您想要的不同的事情？
我认为 var imgLinkMerge = $('p img').attr('src');在这你可能想要 var imgLinkMerge = $(this).find('img').attr('src');

标签： jquery foreach

【解决方案1】：

使用$('p img')，您将选择页面上每个p 中的所有img。您想在each() 循环中关注这个 p。

改变这个：

var imgLinkMerge = $('p img').attr('src');

到这里：

var imgLinkMerge = $(this).find('img').attr('src');

【讨论】：

并声明 var _this = $(this);开始重用
谢谢你们 - 太棒了！现在我明白了。

【解决方案2】：

 $('p').each(function(){

        //grab img's SRC
        var imgLinkMerge = $(this).find('img').attr('src');

          //find the a tag, change HREF for imgLinkMerge value
          $(this).find('a').attr('href', imgLinkMerge).each(function(){
            //set css BG IMG
            $(this).css('background-image', 'url(' + imgLinkMerge + ')');
          });

        });

【讨论】：

【解决方案3】：

这种变化

var imgLinkMerge = $('p img').attr('src');

到

var imgLinkMerge = $('img',$(this)).attr('src');

这将使用当前上下文选择img，即当前p

【讨论】：