我有一个跨度和 5 个不同的 html 结构,它们基本上涉及列表和 div。
我有 5 个按钮。单击每个按钮应将跨度的内容更改为这些结构之一。
我知道它可以像使用一样容易地完成
document.getElementById("a").innerHTML = "<div> A </div>";
但是如果我有一个 20-30 行的 html 结构,这是最好的方法吗?或者有没有更好的方法?
我有一个跨度和 5 个不同的 html 结构,它们基本上涉及列表和 div。
我有 5 个按钮。单击每个按钮应将跨度的内容更改为这些结构之一。
我知道它可以像使用一样容易地完成
document.getElementById("a").innerHTML = "<div> A </div>";
但是如果我有一个 20-30 行的 html 结构,这是最好的方法吗?或者有没有更好的方法?
如果你要拥有一堆这样的按钮,你应该使用一个你可以用传递的数据调用的函数,这样就不必重写东西 voer 和类似的东西
function insertHTML(id, content) {
document.getElementById(id).innerHTML = content;
}
然后你可以像这样在你的按钮项目上放置一个 onclick 函数:
<div class="button" onclick="insertHTML('idoftarget', '<div>html</div>')"></div>
首先你的例子是无效的。div 标签不应进入a
标签或span
标签内。
我将获取您要注入的 5 个 HTML 样本中的每一个,并将它们制作成 JS 中的字符串,然后当用户单击其中一个按钮时,只需使用 innerHTML 将它们放入相应的容器中。