什么是 wysihtml？
wysihtml（What You See Is What You Get HTML Editor）是一个基于 JavaScript 的 HTML 编辑器，它使用 contenteditable 属性来实现实时编辑效果。
wysihtml 提供了丰富的 API 和插件，可以很容易地扩展其功能。因此，它成为了许多网站和应用程序所使用的首选编辑器之一。
如何在项目中使用 wysihtml？
你可以通过 npm 安装 wysihtml：
npm install wysihtml
然后，你需要引入 wysihtml 的 CSS 和 JS 文件：
<link rel="stylesheet" href="/path/to/wysihtml.css" /> <script src="/path/to/wysihtml.js"></script>
接下来，你需要创建一个 textarea 元素，并在 JS 中将其转换为 wysihtml 编辑器：
<textarea id="editor"></textarea>
var editor = new wysihtml.Editor('editor', {
// 配置项
});wysihtml 的配置项
以下是一些常用的配置项：
toolbar: 工具栏上显示的按钮。默认为空数组。parserRules: 解析器规则。默认为 WYSIWYG 规则。stylesheets: 样式表。默认为空数组。useLineBreaks: 是否使用换行符而不是<br>标签。默认为 false。contentEditableMode: 内容可编辑模式。可取值为 'DIV' 或 'Iframe'。默认为 'DIV'。contentEditableModeFull: 是否使用全屏编辑器。默认为 false。
wysihtml 的插件
wysihtml 提供了许多插件，可以扩展其功能。以下是一些常用的插件：
emphasis: 强调文字（粗体、斜体等）。lists: 列表（有序列表、无序列表等）。link: 超链接。image: 图片。table: 表格。
你可以通过以下方式引入这些插件：
<script src="/path/to/wysihtml-emphasis.js"></script> <script src="/path/to/wysihtml-lists.js"></script> <script src="/path/to/wysihtml-link.js"></script> <script src="/path/to/wysihtml-image.js"></script> <script src="/path/to/wysihtml-table.js"></script>
然后在配置项中启用它们：
-- -------------------- ---- -------
--- ------ - --- ------------------------- -
-------- -
-------
---------
----------------
--------------
-------
--------
-------
--
------------ --------------------
------------ -
--------------------
--
-------------- ------
-------------------- ------
------------------------ -----
-------- -
--------- -----
------ -----
----- -----
------ -----
------ ----
-
---示例代码
以下是一个完整的示例代码：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------------- ------------
----- ---------------- -----------------------------
-------
------- -
------- ------
------- --- ----- -----
-------- -----
-
--------
-------
------
--------- -----------------------
------- ------------------------------------
------- ---------------------------------------------
------- ------------------------------------------
------- -----------------------------------------
------- ------------------------------------------
------- ------------------------------------------
--------
--- ------ - --- ------------------------- -
-------- -
-------
---------
----------------
--------------
-------
--------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------