的jQuery的append（）和数据（）

我有数目不详的div随着ID的：的jQuery的append（）和数据（）

<div id="source-1" data-grab="someURL"/>Content</div> 
<div id="source-2" data-grab="anotherURL"/>Content</div> 
<div id="source-3" data-grab="anddifferentURL"/>Content</div> 
<div id="source-4" data-grab="andthelastoneURL"/>Content</div>

而且我还有一个列表：

<ul> 
    <li id="target-1" class="target"><a href="#"> </a></li> 
    <li id="target-2" class="target"><a href="#"> </a></li> 
    <li id="target-3" class="target"><a href="#"> </a></li> 
    <li id="target-4" class="target"><a href="#"> </a></li> 
</ul>

现在，我想才达到被抓数据抓取网址，并将其作为图像附加到目标1等等。所以最后输出列表看起来就像：

<ul> 
     <li id="target-1"><a href="#"><img src="someURL" /> </a></li> 
     <li id="target-2"><a href="#"><img src="anotherURL" /> </a></li> 
     <li id="target-3"><a href="#"><img src="anddifferentURL" /> </a></li> 
     <li id="target-4"><a href="#"><img src="andthelastoneURL" /> </a></li> 
</ul>

我从第一清单中抢占了所有的数据，但我不知道如何正确的源元素到正确的目标元素追加？

$(document).ready(function(){ 
       $('.target').each(function(){ 
       var URL = jQuery(this).data('grab'); 
       }); 
      });

来源

2011-04-15 Wordpressor

$(document).ready(function(){ 
    $('.target').each(function(){ 
    var $this = $(this); 
    var divID = "source-" + ($this.id()).split("-")[1]; 
    $("a", $this).append('<img src="' + $(divID).data("grab") + '" />'); 
    }); 
});

来源

2011-04-15 21:11:46

为什么有变量$这不是“变种这个” ？ :)我正在处理我的脚本，并说要不要，但我相信它会！ – Wordpressor 2011-04-15 22:54:00

@Wordpressor使用var $ this = $（this）减少了jquery选择器的调用，并使代码比在任何地方不断使用$（this）的效率稍高。 – 2011-04-17 04:41:22

不是divID等于“source1”而不是“source-1”？ – AlxVallejo 2012-10-02 14:41:17

您可以使用索引来选择正确的要素，如果你添加一个类的源元素（如.source）：

$(document).ready(function(){ 
       var targets = $('.target'); 
       $('.source').each(function(index, value){ 
        $(target[index]).children("a").first().append($("<img src=" + value.data('grab') + " />")); 
       }); 
      });

来源

2011-04-15 21:10:28 rockerest

的jQuery的append（）和数据（）

回答

相关问题