execCommand()所有命令详解及实例展示

`execCommand()` 方法可以执行多种命令，下面是常用的命令、其作用及对应的参数：

- 格式化样式类命令
- `bold`：将选中的文本加粗。
- `italic`：将选中的文本变为斜体。
- `underline`：给选中的文本添加下划线。
- `strikeThrough`：给选中的文本添加删除线。
- `subscript`：将选中的文本变为下标。
- `superscript`：将选中的文本变为上标。
- 对齐方式类命令
- `justifyLeft`：将选中的文本左对齐。
- `justifyCenter`：将选中的文本居中对齐。
- `justifyRight`：将选中的文本右对齐。
- `justifyFull`：将选中的文本两端对齐。
- 列表类命令
- `insertOrderedList`：插入有序列表。
- `insertUnorderedList`：插入无序列表。
- 插入类命令
- `createLink`：创建一个链接。
- `unlink`：移除一个链接。
- `insertImage`：插入一个图片。
- 撤销、恢复类命令
- `undo`：撤销上一次操作。
- `redo`：恢复上一次操作。

下面是一个实现了上述所有命令的文本编辑器示例代码：

<textarea id="editor"></textarea>
<button onclick="bold()">加粗</button>
<button onclick="italic()">斜体</button>
<button onclick="underline()">下划线</button>
<button onclick="strikeThrough()">删除线</button>
<button onclick="subscript()">下标</button>
<button onclick="superscript()">上标</button>
<button onclick="justifyLeft()">左对齐</button>
<button onclick="justifyCenter()">居中对齐</button>
<button onclick="justifyRight()">右对齐</button>
<button onclick="justifyFull()">两端对齐</button>
<button onclick="insertOrderedList()">有序列表</button>
<button onclick="insertUnorderedList()">无序列表</button>
<input type="text" placeholder="请输入链接地址" id="linkUrl">
<button onclick="createLink()">插入链接</button>
<button onclick="unlink()">移除链接</button>
<input type="text" placeholder="请输入图片地址" id="imageUrl">
<button onclick="insertImage()">插入图片</button>
<button onclick="undo()">撤销</button>
<button onclick="redo()">恢复</button>

<script>
  const editor = document.getElementById('editor');
  const linkUrl = document.getElementById('linkUrl');
  const imageUrl = document.getElementById('imageUrl');

  function bold() {
    document.execCommand('bold', false, null);
  }

  function italic() {
    document.execCommand('italic', false, null);
  }

  function underline() {
    document.execCommand('underline', false, null);
  }

  function strikeThrough() {
    document.execCommand('strikeThrough', false, null);
  }

  function subscript() {
    document.execCommand('subscript', false, null);
  }

  function superscript() {
    document.execCommand('superscript', false, null);
  }

  function justifyLeft() {
    document.execCommand('justifyLeft', false, null);
  }

  function justifyCenter() {
    document.execCommand('justifyCenter', false, null);
  }

  function justifyRight() {
    document.execCommand('justifyRight', false, null);
  }

  function justifyFull() {
    document.execCommand('justifyFull', false, null);
  }

  function insertOrderedList() {
    document.execCommand('insertOrderedList', false, null);
  }

  function insertUnorderedList() {
    document.execCommand('insertUnorderedList', false, null);
  }

  function createLink() {
    const url = linkUrl.value;
    document.execCommand('createLink', false, url);
  }

  function unlink() {
    document.execCommand('unlink', false, null);
  }

  function insertImage() {
    const url = imageUrl.value;
    document.execCommand('insertImage', false, url);
  }

  function undo() {
    document.execCommand('undo', false, null);
  }

  function redo() {
    document.execCommand('redo', false, null);
  }
</script>

以上是常用的 `execCommand()` 命令及其作用。根据具体需求，我们可以选择合适的命令来实现文本编辑器中的各种功能。