如何获取链接内容(innerHTML)并将其作为标题添加到其他链接

How can i get link content (innerHTML) and add it to an other link as title

本文关键字:链接 标题 其他 添加 innerHTML 何获取 获取      更新时间:2024-05-07

我有帖子的div内容。这些帖子存在于<li>中。我想做的是从项目标题类上的链接中获取帖子标题,并将其作为标题添加到项目缩略图类的链接中。

这是html库。

<div class='section' id='popular_posts'>
<div class='widget PopularPosts' id='PopularPosts1'>
<h2>Popular Posts</h2>
<div class='widget-content popular-posts'>
<ul>
<li>
<div class='item-content'>
<div class='item-thumbnail'>
<a href='http://test-abdelghafour.blogspot.com/2013/04/blog-post.html' target='_blank'>
<img alt='' border='0' height='72' src='http://2.bp.blogspot.com/-uDob3fWnp6s/UV3LNbgvp5I/AAAAAAAAAVo/9cVpf154Dao/s72-c/Koala.jpg' width='72'/>
</a>
</div>
<div class='item-title'><a href='http://test-abdelghafour.blogspot.com/2013/04/blog-post.html'>the first post title</a></div>
<div class='item-snippet'>loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum </div>
</div>
<div style='clear: both;'></div>
</li>

<li>
<div class='item-content'>
<div class='item-thumbnail'>
<a href='http://test-abdelghafour.blogspot.com/2013/03/blog-post_5093.html' target='_blank'>
<img alt='' border='0' height='72' src='http://2.bp.blogspot.com/-rGSydPkoB1Y/UVXpS-SO9ZI/AAAAAAAAAKM/7kTPOiebTlc/s72-c/Lighthouse.jpg' width='72'/>
</a>
</div>
<div class='item-title'><a href='http://test-abdelghafour.blogspot.com/2013/03/blog-post_5093.html'>the second post title</a></div>
<div class='item-snippet'>loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum </div>
</div>
<div style='clear: both;'></div>
</li>

<li>
<div class='item-content'>
<div class='item-thumbnail'>
<a href='http://test-abdelghafour.blogspot.com/2013/03/blog-post_5192.html' target='_blank'>
<img alt='' border='0' height='72' src='http://2.bp.blogspot.com/-hwvXxxnUkEI/UVXinrWBGrI/AAAAAAAAAJ8/3JJc9wbSSLA/s72-c/Tulips.jpg' width='72'/>
</a>
</div>
<div class='item-title'><a href='http://test-abdelghafour.blogspot.com/2013/03/blog-post_5192.html'>the third post title</a></div>
<div class='item-snippet'>loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum </div>
</div>
<div style='clear: both;'></div>
</li>

<li>
<div class='item-content'>
<div class='item-thumbnail'>
<a href='http://test-abdelghafour.blogspot.com/2013/03/blog-post_29.html' target='_blank'>
<img alt='' border='0' height='72' src='http://4.bp.blogspot.com/-4hpIKXd5iXw/UVXuIC1mCQI/AAAAAAAAAKs/QiMMwRRl0ns/s72-c/Desert.jpg' width='72'/>
</a>
</div>
<div class='item-title'><a href='http://test-abdelghafour.blogspot.com/2013/03/blog-post_29.html'>the forth post title</a></div>
<div class='item-snippet'>loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum loprem ipsum </div>
</div>
<div style='clear: both;'></div>
</li>
</ul>
</div>
</div>
</div>

这是我使用的jQuery代码。

$('#popular_posts .item-title a').each(function(){
var pptitle = $('#popular_posts .item-title a').text();
$('.item-thumbnail a').each(function(){
$(this).attr('title', pptitle);
});
});

我想得到的每个链接的结果。

<a href='http://test-abdelghafour.blogspot.com/2013/04/blog-post.html' target='_blank' title="the forth post title">

每个循环内的var pptitle = $('#popular_posts .item-title a').text();调用将在每个循环迭代中选择相同的文本节点。第二个每个循环将该文本设置为每个.item-thumbnail

这应该做你想做的:

$("#popular_posts li").each(function(){
  var pptitle = $(this).find(".item-title a").text();
  $(this).find(".item-thumbnail a").attr("title", pptitle);
});