如何将 innerHTML 保存到 Javascript 变量中,以便在更改实际的 innerHTML 时保持不变

Posted

技术标签:

【中文标题】如何将 innerHTML 保存到 Javascript 变量中,以便在更改实际的 innerHTML 时保持不变【英文标题】:How do I save the innerHTML to a Javascript Variable so that is stays the same when I change the actual innerHTML 【发布时间】:2021-05-31 10:45:43 【问题描述】:

所以我正在开发一个网站,其中包含类似 Buzzfeed 的测验(根据用户回答特定答案的次数计算结果) 我决定处理绑定结果的方式是将所有绑定结果显示在整齐的一排按钮中,用户可以单击这些按钮以在同一 psge 中查看该结果的更多详细信息。单击其中一个按钮会擦除这些按钮,因此我实现了一个“后退”按钮来再次显示这些按钮,它们都具有相同的功能。 我的 javascript 看起来像这样:

var container = document.getElementById("container");
const og = container.innerhtml;
...
function backButton() 
    document.getElementById("back").onclick = function() 
        container.innerHTML = og;
    ;

只要按下其他按钮之一,就会调用backbutton(); 函数来实现该按钮。 ogconst 我设法让后退按钮将页面恢复到原始状态,但随后按钮失去了所有功能 请帮帮我

【问题讨论】:

【参考方案1】:

在元素本身上使用data attribute

var container = document.getElementById("container");
container.data.og = containter.innerHTML;

...
function backButton() 
    document.getElementById("back").onclick = function() 
        container.innerHTML = container.data.og;
    ;

【讨论】:

HTML 语法是什么? container 变量对应一个 id 为容器的 div

以上是关于如何将 innerHTML 保存到 Javascript 变量中,以便在更改实际的 innerHTML 时保持不变的主要内容,如果未能解决你的问题,请参考以下文章

从 .innerHTML 到 Array 或 String 的 NodeList

将确切的 innerHTML 还原到 DOM

PHP:如何获取当前的 innerHTML?

如何将表单数据保存到文本文件?

如何使用 innerHTML 将对象值正确打印到 DIV?

如何使用 innerHTML/innerText 将内容附加到 querySelectorAll 元素?