得到HTML <TD類「稱號」>並將其安裝到的img

Question

我有HTML：

<table id='ansichttable' class='table appels'> 
    <thead> 
     <tr> 
      <th class='bold'>Afbeelding</th> 
      <th class="bold">Locatie</th> 
      <th class='bold'>Groep</th> 
      <th class='bold'>Soort</th> 
      <th class='bold'>Bijzonderheden</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td><a class="img" href="images/imagesfruit/boomgaard4.jpg"><img src="images/imagesfruit/thumbs/t-boomgaard4.jpg"/></a></td> 
      <td valign="top">Tuin</td> 
      <td valign="top">Appels</td> 
      <td valign="top" class="titel">Dubbele Bellefleur</td> 
      <td valign="top">Zoete stevige appel</td> 
     </tr> 
     <tr> 
      <td><a class="img" href="images/imagesfruit/boomgaard4.jpg"><img src="images/imagesfruit/thumbs/t-boomgaard4.jpg"/></a></td> 
      <td valign="top">Tuin</td> 
      <td valign="top">Appels</td> 
      <td valign="top" class="titel">Dubbele Zoete Aagt</td> 
      <td valign="top">Zoete stevige appel</td> 
     </tr> 
     <tr> 
      <td><a href="images/imagesfruit/boomgaard4.jpg"><img src="images/imagesfruit/thumbs/t-boomgaard4.jpg"/></a></td> 
      <td valign="top">Tuin</td> 
      <td valign="top">Appels</td> 
      <td valign="top" class="titel">Ellisons Orange</td> 
      <td valign="top">Zoete stevige appel</td> 
     </tr> 
    </tbody> 
</table> 

我想創建的是，jQuery的獲取從標題：td class="titel" ，並在創建一個href="......"這樣的標題標籤：

<td><a href="images/imagesfruit/boomgaard4.jpg" titel="Ellisons Orange"><img src="images/imagesfruit/thumbs/t-boomgaard4.jpg"/></a></td> 
<td valign="top">Tuin</td> 
<td valign="top">Appels</td> 
<td valign="top" class="titel">Ellisons Orange</td> 
<td valign="top">Zoete stevige appel</td> 

我曾嘗試以下：

$(document).ready(function(){ 
var gettitle = $("td:eq(3)").html(); 
       $("td a").attr("title", $('td.titel').text()); 

和：

$("td a.img").attr("title", $('.titel').html()); 

和：

$('table').each(function() { 
    var title = $(this).find('td.titel').text(); 
    $(this).find('td a').attr('title', title); 
}); 

他們都是工作，但是從表中收集所有的標題，並將它們連接到的所有圖像。

我需要的是，jQuery收集標題並將其附加到td上方的圖像，以獲得標題。我究竟做錯了什麼？

Answer 1

請參閱jsfiddle。這會將每個td的文本與titel的屬性的a屬性放在同一行上。

$('td.titel').each(function() { 
    $(this).parent().find('a').attr('title', $(this).text()); 
}); 

的這是什麼一樣說明：

• 對於每個選定的td.titel元素
  • 走到樹到父（在這種情況下，它的tr），然後下到的a裏面tr
  • 把td.titel元素的文本放在的title屬性中0

Answer 2

參見：http://jsfiddle.net/dP76b/

$(document).ready(function(){ 
    $('.table tr').each(function(){ 
     var titleText = $(this).find('.titel').text(); 
     $(this).find('a.img img').attr('title', titleText); 
    }); 
}); 

的 「Ellisons橙」 的形象不起作用，因爲相應的a元素沒有class="img"：

<a href="images/imagesfruit/boomgaard4.jpg"><img src="images/imagesfruit/thumbs/t-boomgaard4.jpg"/></a> 

您可以添加class，或將.find('a.img img')更改爲.find('a img')。

Answer 3

這應該工作。你要確保你留下來「的每個」指標的範圍內：

$('table tr').each(function(i,obj){ 
    $('td{0} a',this).attr('title',$('td.titel',this).text()); 
}); 

Answer 4

這是你在找什麼？

$("td.titel").each(function(){ 
    $(this).html('<a href="" title="'+$(this).text()+'">'+$(this).text()+'</a>'); 
}); 

這將獲得與類標題的每個td和周圍的鏈接，標題屬性是td中的文本。

$("td.titel").each(function(){  
    $(this).parent().find('a.img').attr('title',$(this).text()); 
}); 

編輯：哈哈，給予druttka的答案。當他發佈時我正在寫這篇文章。