1

我想知道动态更改“标题”div的内容以反映与图片库中特定缩略图/链接相对应的信息的最简单方法可能是什么。

更具体地说，如果你访问这个链接——它展示了令人敬畏的 Seadragon 缩放脚本顺便说一句——我想在图像下方有一个小标题，当用户点击上面的不同链接时，它会改变（文本）内容；也许从 alt 或 title 属性中提取文本并放置在一个空的 div 中？

在我的例子中，我将使用缩略图而不是文本链接，因此在单击这些图像时，用户将启动“switchTo”Seadragon 事件并用相应的内容填充空 div。

感谢您在这里的任何指导。

4

1 回答 1

2

如果您有 div 的 id，最简单的方法是使用innerHTML：

document.getElementById(id).innerHTML = "text";

这适用于更简单的情况，例如替换 div 中的所有文本。如果你想做一些更复杂的事情，比如在 div 中包含其他 html 元素，这种方法不是最佳选择。

如果你想在 div 标签中添加一个 html 元素，那么你应该避免innerHTML. 如果你有一个变量img是一个 img 标签，那么使用它来将它添加到 div 中：

document.getElementById(id).appendChild(img);

如果你想做比这更复杂的事情，你可能应该考虑使用像 jQuery 这样的好框架——这样的事情可能太多了，但如果你打算做其他事情，那么框架将值得使用。

如果你想用 jQuery 来做这件事，可以使用以下一些函数来完成：

var div = $("#id");// jQuery uses CSS selectors to get elements.
div.append("New content");// Puts the new content at the end.
div.empty();// Gets rid of everything inside the div.
div.append(element);// You can also append elements.

// For example, you can create and append an image to the div:
var img = $("<img>");
img.attr("src", "images/something.png");
div.append(img);
于 2011-04-14T23:24:49.473 回答