了解如何將網頁內容設置為可供網站訪問者編輯

使用Contenteditable屬性

讓用戶編輯的網站上的文字比您預期的要容易。 HTML為此提供了一個屬性：contenteditable。

contenteditable屬性於2014年首次推出，並發布了HTML5 。 它指定它所管理的內容是否可以由瀏覽器中的網站訪問者更改。

支持Contenteditable屬性

大多數現代桌面瀏覽器都支持該屬性。

這些包括：

大多數移動瀏覽器也是如此。

如何使用Contenteditable

只需將該屬性添加到要編輯的HTML元素即可。 它有三個可能的值：真，假和繼承。 Inherit是默認值，表示該元素具有其父級的值。 同樣，除非您將它們的值更改為false，否則新編輯的內容中的任何子元素也都是可編輯的。 例如，要使DIV元素可編輯，請使用：

用Contenteditable創建一個可編輯的待辦事項列表

將內容與本地存儲配對時，可編輯內容最有意義，因此內容在會話和網站訪問之間保持不變。

  1. 在HTML編輯器中打開您的頁面。
  2. 創建一個名為myTasks的項目符號列表，無序列表：

    • 某項任務
    • 另一項任務
  1. 將contenteditable屬性添加到
      元素中：
      您現在有一個可編輯的待辦事項列表 - 但如果您關閉瀏覽器或離開頁面，您的列表將消失。 解決方案：添加一個簡單的腳本將任務保存到localStorage。
    • 在文檔的中添加一個jQuery鏈接。