的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（）和數據（）

回答

相關問題