使用PHP将HTML标记附加到图像

我试图在WordPress电子商务网站上为产品缩略图添加标题，方法是拉动每个图像的“alt”标记，并在其周围添加标记，以使我能够将CSS应用于标题

我发现了一个JQuery脚本（实际上，我发现了几个），它成功地将“alt”文本提取为标题，但它没有添加任何HTML，甚至没有将标题插入到页面源代码中。所以它就在前端，但我没有办法选择或设计它

<script type="text/javascript">
$(document).ready(function(){
$(".thumbnails img.attachment-shop_thumbnail").each(function() {
var caption = $(this).attr("alt");
$(this).before('<figure>');
$(this).after('<figcaption>' + caption + '</figcaption></figure>'
);
});
});
</script>

$（文档）.ready（函数（）{
$（“.thumbnails img.attachment-shop_thumbnails”）。每个（函数（）{
var caption=$（this.attr（“alt”）；
$（本）。在（''）之前；
$（此）。在（“”+标题+“”）之后
);
});
});

---

如果我能找到一个有效的脚本，我愿意在这里使用JQuery；但我突然想到PHP可能是一种更好的方法。唯一的问题是，我还没有找到任何能让我吃的东西

如果它位于前端，那么此时您应该能够在css文件中添加标记并显示：

figcaption {
  border: 1px solid red;
  font-weight: bold;
}

等等。。。 或者，更好的办法是将figure和figcaption更改为divs，并给它们起类名

它没有显示在源代码中的原因可以从以下堆栈溢出问题中看出：

---

Ya，您应该在服务器端生成相关的标记，而不是与wolff达成一致。更好的性能和页面加载和谷歌..谢谢@rgilligan。我被标签没有出现在源代码中这一事实弄糊涂了，而且似乎不可能使用CSS有效地瞄准目标。事实证明，CSS只是对选择什么/如何选择有点挑剔；它现在工作得很好（我确实更改了divs，而不是使用and）。