如何跨刷新页面保存文档正文编辑？

Question

我有一个 JavaScript 书签，可以让我编辑页面正文：

document.body.contentEditable = true;

我想制作一个小书签，允许我保存这些编辑，这样如果我刷新页面，它将保留它们，或者当我单击小书签时显示它们。

我知道本地存储存在，但我不确定如何使用本地存储更新相应的元素。

有什么想法吗？

Answer 1

我找到了办法。使用 JavaScript，我可以保存整个 HTML 正文，然后加载它并用保存的 HTML 替换页面原始内容。

它使用 IF 检查来查看页面当前是否可编辑，然后它将保存数据。如果它不可编辑，那么将加载该数据。

JavaScript：

javascript:(function() {
  // Check if content is editable
  if (document.body.isContentEditable) {
    // Save the edited content to localStorage
    localStorage.setItem('editedContent', document.body.innerHTML);
    alert('Changes saved!');
  } else {
    // Load saved content from localStorage
    var savedContent = localStorage.getItem('editedContent');
    if (savedContent !== null) {
      // Set the saved content to the page's body
      document.body.innerHTML = savedContent;
      document.body.contentEditable = true;
    } else {
      alert('No saved content found.');
    }
  }
})();

实际的书签：

javascript:(function()%7Bjavascript%3A(function() %7B%0A  %2F%2F Check if content is editable%0A  if (document.body.isContentEditable) %7B%0A    %2F%2F Save the edited content to localStorage%0A    localStorage.setItem('editedContent'%2C document.body.innerHTML)%3B%0A    alert('Changes saved!')%3B%0A  %7D else %7B%0A    %2F%2F Load saved content from localStorage%0A    var savedContent %3D localStorage.getItem('editedContent')%3B%0A    if (savedContent !%3D%3D null) %7B%0A      %2F%2F Set the saved content to the page's body%0A      document.body.innerHTML %3D savedContent%3B%0A      document.body.contentEditable %3D true%3B%0A    %7D else %7B%0A      alert('No saved content found.')%3B%0A    %7D%0A  %7D%0A%7D)()%3B%7D)()%3B```

Answer 2

javascript:(function()%7Bfunction save() %7BlocalStorage.setItem('SavedState'%2C document.body.innerHTML)%3Balert('State saved!')%3B%7Dfunction load() %7Bvar savedContent %3D localStorage.getItem('SavedState')%3Bif (savedContent !%3D%3D null) %7Bdocument.body.innerHTML %3D savedContent%3Balert('State loaded!')%3B%7D else %7Balert('No saved state found.')%3B%7D%7Dvar saveorload %3D prompt('save or load%3F It must be exactly save or load.')%3Bif (saveorload %3D%3D 'save') %7Bsave()%3B%7Dif (saveorload %3D%3D 'load') %7Bload()%3B%7D%7D)()

这应该可行，我自己做的。 =[)