从链接或段落或标题或alt标签中提取特定文本，然后在同一页面但位置不同的地方再次显示

Question

我试图在同一页面的另一部分（在图像下方）重复显示文本Java Bean （请访问http://www.miracleflooring.ca/cork.html，以了解其工作原理）。 现在，当您将鼠标悬停在缩略图上时，当鼠标悬停时，信息隐藏，我会看到信息标题和价格显示。

我的客户要求我在每个图片（每个div和班级项目）下显示标题和价格，我想找到一种方法，而不必手动为每个项目重新做事。 有没有办法使用css / javascript / php这样做（我希望我清楚我需要做什么）。

<div class="item">
     <a href="#"><img src="imgs/products/cork/java-bean.jpg" alt="Java Bean" width="132" height="132" /></a>
     <div class="caption">
          <a href="imgs/products/cork/java-bean.jpg" rel="prettyPhoto[cork]" title="Java Bean">Java Bean</a>
          <p class="price">$4.99 sq-ft</p>
     </div>
</div>

我知道某些代码似乎有些过分，但是这样做是完全错误的，将需要很多工作来改变它。

我不知道如何执行此操作，我仍然不确定执行此操作的最佳方法是什么，但是我们非常感谢您的帮助！

编辑：我看到karim79回答了一些可能有帮助的问题，但不确定这是否是我所需要的（如何也实现） 从标记中提取文本

Answer 1

在您的CSS中尝试一下：

.item {position: relative; margin-bottom: 30px;}
.item .caption {position: absolute; bottom: -20px;}

那应该足够接近，可以自己进一步调整。 “ margin-bottom”将扩大每个项目下的可用空间，而较大的负“ bottom”将使字幕文本向下移动。