基本脚本问题...动态修改div内容？

发布于 2024-11-01 15:54:26 字数 393 浏览 5 评论 0原文

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

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

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

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

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

記憶穿過時間隧道 2024-11-08 15:54:26

如果您有 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);

If you have the id of the div, the simplest way would be to use innerHTML:

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

This is fine for simpler cases, like replacing all of the text in a div. If you want to do something more complicated, like having other html elements inside the div, this method is not the best choice.

If you want to add an html element to the div tag, then you should avoid innerHTML. If you have, say, a variable img that is an img tag, then use this to add it to the div:

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

If you want to do anything more complicated than this, you should probably consider using a nice framework like jQuery--it might be too much for something like this, but if you plan to do anything else, then a framework would be worth using.

If you want to do this with jQuery, it can be done using some of the following functions:

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);

回复收藏 0 原文

~没有更多了~