如何使用每篇博文的 id 创建锚链接？

Question

我认为这是一个简单的问题。

我想自动为一系列博客文章创建锚链接 - 我一直在尝试使用 each() 命令循环遍历父 div 中的子项，但我只是无法使其正常工作，现在很困惑，我不知道自己在做什么。 ((@_@))

博客内容的结构如下：

<div id="content">
 <div class="list-journal-entry-wrapper">
  <div class="post-text">
    <div id="item101" class="journal-entry">...</div>
   </div><div class="post-text">
    <div id="item102" class="journal-entry">...</div>
   </div><div class="post-text">
    <div id="item103" class="journal-entry">...</div>
   </div>
  </div>
 </div>
</div>

我想要做的是使用每个 .journal-entry 帖子的唯一项目编号 (id="item101") 来创建锚链接列表，如下所示：

<div id="news-links">
  <a href="#item101">Post 101</a><br/>
  <a href="#item102">Post 102</a><br/>
  <a href="#item103">Post 103</a><br/>
</div>

我找不到每个帖子的id="xxxxx"：

一旦我有了那个 id，使用id 值作为href 写出锚链接应该很简单

<a href="#xxxxx">Post xxxxx</a>

我非常感谢一个示例，这样我就可以了解 each() 命令。

或者有更好的方法吗？

---

解决了！感谢来自 adeneo 和 theCodeParadox 的示例，我在此过程中设法学到了一些东西，并从两者中学到了一些东西解决方案 - 为了帮助他人，这是我用于我的特定应用程序的最终完成的解决方案：

http://jsfiddle.net/mDSWE/3/

注意在实际的 HTML 中还有额外的 div，最终的 jQuery 例程查找文章标题 h2.title 以用作链接文本，然后使用 parents() 函数，找到第一个包装器 div 的 id 属性@ 987654332@ 用于锚链接href。

$('h2.title a').each(function() {
   var el = $(this);
    var id = el.parents('div.journal-entry:first').attr('id');
   var insert = '<a href="#' + id + '">' + el.text() + '</a></br>';
   $('#news-anchors').append(insert);
});

工作得很好，所以感谢您抽出时间来帮助我。

Answer 1

var newsLinks = '<div id="news-links">';

$(".journal-entry").each(function(index, item) {
    newsLinks += '<a href="#'+item.id+'">Post '+item.id.replace('item', '')+'</a><br/>';
});

newsLinks += '</div>';

FIDDLE

也可以这样：

var newsLinks = '<div id="news-links">';

$.each($(".journal-entry"), function() {
    newsLinks += '<a href="#'+this.id+'">Post '+this.id.replace('item', '')+'</a><br/>';
});

newsLinks += '</div>';

FIDDLE

Answer 2

$(".journal-entry").each(function(index, value) {
  $('#news-links').append('<a href="#'+this.id+'">Post '+ this.id.replace('item', '')+'</a>');
});