jquery - 如何使用jquery在重复链接旁边插入一个小图像图标

Question

我是 Jquery 的初学者，我希望在他们的名字旁边添加一个人的小图片，这是博客文章上方的 href 链接。该链接是博主的名字，我想在它旁边添加他们的图片，但我不知道该怎么做。我知道如何插入图片，但是我不确定如何在博主创建新帖子时重复插入图片？任何帮助将不胜感激

例如。 (图片在这里)比尔·史密斯 | 2014 年 11 月 22 日

所以每当那个人创建一个帖子时，他们的图像就会出现在帖子之前 这是我到目前为止所拥有的，但它什么也没做。作者是作者姓名所在的类。

$('<img src="https://www.people.com/bill.jpg" />').insertBefore('author');

html:

 <article class="blogpost">
   <p class="author">
    <a href="https://people.com/billsmith">Bill Smith</a>
 </p>
</article>

Answer 1

您需要遍历作者段落的每个实例:

$('p.author').each(function() {
    $('<img src="http://placehold.it/30x30" />').insertBefore($(this));
});

Demo

问题是将特定图像与每个作者相关联。为此，您需要解析该段落中的文本字符串并根据您的图像命名约定对其进行处理。这一切都变得非常麻烦和脆弱，并且gibberish's answer提供更好的解决方案。