是否有 document.execCommand 的替代品？ （或者使用 document.execCommand 是否安全？）

Question

我正在使用 vanilla JavaScript 構建一個業余富文本編輯器，而 document.execCommand() 對於啟用文本編輯器的核心功能至關重要。

例如粗體、斜體和無序列表命令：

Array.from(toolbarBtn).forEach(btn => {
  btn.addEventListener('click', (e) => {
    e.preventDefault();
    if (e.target.id === "toolbar__btn--bold") {
      format('bold');
    }
    if (e.target.id === "toolbar__btn--italic") {
      format('italic');
    }
    if (e.target.id === "toolbar__btn--unorderedlist") {
      format('insertunorderedlist');
    }
});
});

但是，在 MDN Web Docs 上查找此命令時，我看到此命令被認為已過時：

已過時此功能已過時。 盡管它在某些瀏覽器中可能仍然有效，但不鼓勵使用它，因為它可能隨時被刪除。 盡量避免使用它。

所以，我想知道香草 JavaScript 中是否有任何替代方法，可以創建像 execCommand() 這樣的所有富文本編輯器功能？

谷歌搜索沒有給我任何結果，所以同時我想知道，該方法怎么可能被宣布過時，但沒有建議替代方案。

Answer 1

對 MDN 將document.execCommand()標記為過時的更改和https://github.com/mdn/browser-compat-data/commit/2d3890a的相關更改部分是由於https://w3c。 github.io/editing/ActiveDocuments/execCommand.html帶有大紅色警告，並帶有以下語句：

該規范不完整，預計不會超出草案狀態。 作者不應直接使用這些功能中的大部分，而應使用 JavaScript 編輯庫。 本文檔中描述的功能並未由用戶代理一致或完全實現，並且預計在可預見的將來不會改變。

至於香草 JavaScript 中的任何替換方法，相同的警告框表示：

預測在未來這兩個規范都將被 Content Editable 和 Input Events 取代

......但遺憾的是，我們還沒有到那里。 因此，不幸的當前 state 是，即使我們還沒有替代品，我們知道document.execCommand()現在不能跨瀏覽器互操作 - 瀏覽器項目不會修復它。 這就是為什么 MDN 警告說：

不鼓勵使用它……盡量避免使用它。

因此，正如上面的評論所說，它類似於拖放的情況：眾所周知，它會以多種方式被破壞，而且這種方式已經存在很長時間了，因為修復它基本上不切實際。

這就是為什么規范中的紅色警告框還說開發人員和作者：

不應該直接使用這些功能中的大部分，而是使用 JavaScript 編輯庫

CKEditor 和 TinyMCE 等在線富文本編輯器工具中可用的 JavaScript 編輯庫為您“覆蓋”了document.execCommand()中的所有潛在缺陷。 如果您要嘗試從頭開始在 vanilla JavaScript 中為document.execCommand()編寫自己的強大處理，那么您基本上 - 經過大量工作和時間 - 最終會重復創建 JavaScript 庫所做的工作這些工具的基礎。

所以底線是：為了節省大量時間和工作，請使用可用的庫之一。

Answer 2

看起來新標准將是Input Events Level 2 。

在我看來，它試圖解決 execCommand 的痛點。