我有点卡住了。
当图像添加到我页面的帖子中时，它会显示如下
<p>
<img title="Some image title" src="img.jpg" alt="someALt" width="656" height="210" />
</p>
我设法使用Jquery抓取title attribue，并像我想要的那样将其显示在图像下方。
var title = $('img').attr('title');
$('img').after(title);
我的问题是我希望能够修改文本，例如将其包装在<small>标签中并通过此 jquery 片段更改"颜色"等。
我不确定该怎么做，我试图在$('img').after(title);中添加.append()、.html()和更多内容，但没有任何结果。
有人可以引导我走上正确的道路吗？
为了实现这一点，你可以提供一个函数来after()，该函数在当前img元素的作用域下运行。因此，您可以从this关键字访问title属性。该函数需要返回要添加到 DOM 中的 HTML 字符串，因此您可以将所需的任何元素连接到该字符串中。
这样做的好处是，它可以适用于无限数量的img元素，而无需任何修改。
请注意，在下面的示例中，我添加了一个属性选择器，以确保所有选定的img元素都具有要读取的title属性。
完成此操作后，可以使用CSS从JS外部完成样式。试试这个：
$('img[title]').after(function() {
return `<small>${this.title}</small>`;
});img + small {
color: #C00;
display: block;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>
<img title="Some image title" src="img.jpg" alt="Some image alt" width="656" height="210" />
</p>
<p>
<img title="foo bar" src="img.jpg" alt="foo bar alt" width="656" height="210" />
</p>
<p>
<img title="fizz buzz" src="img.jpg" alt="fizz buzz alt" width="656" height="210" />
</p>