命令API
最后更新于：2022-04-01 23:43:11
####命令API
以下是编辑器命令操作相关的API，**使用以下API，最好先要了解浏览器的`document.execCommand`的相关知识**
-----
- **`editor.command`**
对`document.execCommand`执行浏览器基础命令的封装。在二次开发中，如果遇到这种情况，尽量用分装好的`edtior.command`。例如：
```js
$('#btn').click(function (e) {
// 注意，下面的 e 参数尽量要传，否则可能导致其他问题
// 等同于 document.execCommand('bold')
editor.command(e, 'bold');
// 等同于 document.exexCommand('BackColor', false, '#003399')
editor.command(e, 'BackColor', '#003399');
});
```
-----
- **`editor.commandForElem`**
针对当前选中的元素，向上查找，得到符合传入条件的父元素。然后把这个父元素当做选区，来执行命令。除了第一个参数之外，后面的参数和`editor.command`相同。例如：
```js
$('#btn').click(function (e) {
// 注意，下面的 e 参数尽量要传，否则可能导致其他问题
// 针对当前选区所处于的 b strong 元素，然后执行命令
editor.command('b,strong', e, 'bold');
// 为所处的整个 p 元素设置背景色
editor.command('p', e, 'BackColor', '#003399');
});
```
-----
- **`editor.customCommand`**
用于自定义的命令操作，而非`document.execCommand`提供的基础命令。
**注意，建议你对编辑内容的所有修改，都使用命令的方式。如果基础命令满足不了要求，一定要使用这里的自定义命令。不要忽略命令，自己写代码来修改。那样会出现各种问题！！！**如果觉得好奇，可以搜索源码中的`E.fn.customCommand`来看看，自定义命令中那些复杂的操作过程。
程序举例：
```js
$('#btn').click(function (e) {
// 注意，下面的 e 参数尽量要传，否则可能导致其他问题
editor.command(e, function () {
// 这里的 this 指向 editor 对象本身
var editor = this;
editor.$txt.append('
';
自定义命令追加的内容
'); }); }); ``` ----- - **`editor.queryCommandValue`** 对`document.queryCommandValue`的封装，使用方法和`document.queryCommandValue`一样。分装中，规避了`IE8`异常错误。 ----- - **`editor.queryCommandState`** 对`document.queryCommandState`的封装，使用方法和`document.queryCommandState`一样。分装中，规避了`IE8`异常错误。 ----- - **`editor.queryCommandSupported`** 对`document.queryCommandSupported`的封装，使用方法和`document.queryCommandSupported`一样。分装中，规避了`IE8`异常错误。 ---- - **`editor.commandHooks`** 当遇到浏览器的`document.execCommand`不支持的命令时，就需要自定义一个命令，放在`editor.commandHooks`中。例如，IE浏览器的`document.execCommand`不支持`insertHtml`命令，为了保证IE浏览器的可用性，就需要增加这样的hook ```js editor.commandHooks.insertHtml = function (html) { var $elem = $(html); var rangeElem = editor.getRangeElem(); var targetElem; targetElem = editor.getLegalTags(rangeElem); if (!targetElem) { return; } $(targetElem).after($elem); }; ```