javascript - 将内容从一个元素复制到另一个元素

Question

我有一个正在使用的图像 slider ，每个图像下面都有一个标题，看起来有点像这样。

<ul class="image-slider">
    <li>
      <img src="img-1.jpg">
      <figcaption>Fig1. - A view of the pulpit rock in Norway.</figcaption>
    </li>
    <li>
      <img src="img-2.jpg">
      <figcaption>Fig2. - A view of lighthouse.</figcaption>
    </li>
    ...
</ul>

使用一些 jQuery，这个图像 slider 滑动，显示一张图像及其标题。

我的网站上有一个描述框，我希望在其中实际显示我的标题。

<div class="description">
  <h3>Image Gallery</h3>
  <p class="caption">This is where I want my caption to appear</p>
</div>

我不能使用任何绝对定位或 CSS，我需要使用其他东西(可能是 Javascript)将标题文本移动到 p 标签。

这可能吗？

感谢任何帮助。提前致谢!

Answer 1

这不可行吗？

$(".caption").text($('li:nth-child('+i+')').text());

其中 i 是一个变量 (INT)，在图像 slider 中向前移动时可以得到 i++ 并减去一个 (i--) 当一个人在图像 slider 中后退一步时。