普通的文本框（如input, text）只能输入纯文本以及 Emoji（只不过是特殊编码的文本），如果只是简简单单写些纯文本的内容（比如表单，简单的评论等），这是一个非常不错的选择，但是如果需要让用户输入包括但不限于图片、视频、加粗文本等内容，这种方式就行不通了。这是时候就可以使用富文本编辑器来实现。
富文本编辑器，Multi-function Text Editor, 简称 MTE, 是一种可内嵌于浏览器，所见即所得的文本编辑器。功能强大的富文本编辑器可以实现文本编辑、格式设置、排版设置、媒体文件编辑上传、超链接、文本导出、打印等等功能。
常见的富文本编辑器现实方式可以分成三类，分别是用textarea 、 contenteditable 和Canvas。
l Textarea
最早的编辑器实现，起始阶段，最简单的如多行文本，结构简单使用方便，一些文本格式和复杂的样式难以实现，推荐仅在对编辑要求不高的场景使用。
l Contenteditable
HTML中的contentEditable的属性可以打开某些元素的可编辑状态（ div, table ,p ,span ,body），将元素的contenteditable 属性设为 true时，该元素则成为了编辑器的主体。配合着 document.execCommand 能够实现绝大多数功能，当前主流编辑器都是基于 contenteditable 来设计的。
contentEditable使dom变得可编辑，那么execCommand则提供了从外部修改DOM的api。可以操作dom内容的变化。两者进行组合，即可实现一个最简单的富文本编辑器。
但是单纯依赖contenteditable 直接产出 html 会带来一些问题，例如相同的输入在不同浏览器下的输出可能不一致，相同的输出在不同浏览器中展示存在差异，同时 html 使用具有局限性，不方便在跨平台间使用。因此更好的方案是制定一套数据结构 + 文档模型，所有的输入都经过编辑器生成约定的产物，这样在不同的平台均可解析并且保证得到预期的效果。
l contenteditable + Selection + Range
这种方式比上面的execCommand 好处就在可以不过度依赖浏览器的行为，使用 Selection 获取用户选区，使用 Range API 来操控选区（比如简单的加粗操作），不过用这种方式就需要你自己去处理各种选区情况了（比如节点内操作、跨节点操作等），
相较于上面的方式，开发难度提高。但是开发自由度也提升了。
l Canvas
这种方式差不多就是浏览器给你提供绘图能力和监听用户输入的能力，除此之外其他全部你自己实现。因为完全不使用contenteditable，也就完全摆脱了对浏览器行为的依赖。当时难度也就成倍增长。相当于在浏览器里面在开发一个浏览器了。
UEditor
适用浏览器：IE6+、FireFox、Chrome...
UEditor是由百度WEB前端研发部开发的所见即所得的开源富文本编辑器，开源基于BSD协议，所有源代码在协议允许范围内可自由修改和使用。UEditor 在设计上采用了经典的分层架构设计理念，尽量做到功能层次之间的轻度耦合。具体来讲，整个系统分为了核心层、命令插件层和UI层这样三个低耦合的层次。
1、核心层提供了编辑器底层的一些方法和概念
2、在核心层之上覆盖的是命令插件层。之所以叫命令插件层，是因为UEditor中所有的功能型实现都是通过这一层中的命令和插件来完成的，并且各个命令和插件之间基本互不耦合
3、在命令插件层之上则是UI层。UEditor的UI设计与核心层和命令插件层几乎完全解耦，简单的几个配置就可以为编辑器在界面上添加额外的UI元素和功能。
优点：
1、体积小巧，性能优良，使用简单、开源免费
2、功能比较全面，插件很多，还可以很方便插入百度地图，接入十分简单
3、支持中文文档
4、界面美观
缺点：
1、2016年后，百度基本已经很少对编辑器和文档的维护更新。
2、虽然支持中文文档，但是内容少，可查询资料少。
3、图片只能上传到本地服务器，如果需要上传到其他服务器需要改动源码
中文文档：http://fex.baidu.com/ueditor/
GitHub： https://github.com/fex-team/ueditor
CKEditor
适用浏览器：IE6+、FireFox、Chrome、Safari、Opera...
CKEditor 是一款功能强大的开源在线文本编辑器。它所见即所得的特点，使你在编辑时所看到的内容和格式，能够与发布后看到的效果完全一致。CKEditor 完全是基于 JavaScript 开发的，因此不必在客户端进行任何安装，并且兼容各大主流浏览器。
由于CKEditor的整体架构是建立在灵活的插件机制之上的。因此我们可以将特定的自定义功能独立于编辑器的核心代码之外。实际上包括许多CKEditor已有的预置功能，都是利用插件的形式开发的。因为不同的插件位于各自的文件，所以管理维护都很方便。
优点：
1、功能齐全，拥有丰富的样式和插件
2、定制性强，提供较多的扩展性API
3、由IBM支持的开发团队进行维护，社区活跃，仍在更新和修复bug
4、高性能的实时预览，行内编辑功能，使得编辑内容更加直观
缺点：
1、只有英文文档，需要额外的开发时间。
官方文档：WYSIWYG HTML Editor with Collaborative Rich Text Editing
GITHub：https://github.com/ckeditor/ckeditor5
BraftEditor
使用浏览器：IE6+、FireFox、Chrome...
Brafteditor是一个美观易用的React富文本编辑器。这个编辑器开箱即用，不用重复早轮子。其底层逻辑是基于Facebook的draft-js开发的，draft-js需要各种配置才能使用，而Brafteditor使用起来则非常简单。其有两种数据结构，分别是raw（用于数据的编辑操作）和 html （用于数据的展示）。他们之间可以进行转换，但是可能导致一些属性的缺失。所以一般需要将两种数据都进行存储。
优点：
1、使用简单，不需要额外配置、安装即可使用
2、基于react开发，和react项目有非常好的兼容性
3、中文开发文档，文档用例清晰明确
4、具有高度可扩展性和可定制性；
缺点：
1、当需要表格这样复杂的内容结构时，编辑器将会变慢，代码也会变得复杂
2、文档少，查阅不方便。
3、提供的基础插件较少，需要定制开发
4、缺乏官方的移动端支持
中文文档：Braft Editor | 基于DraftJS的强扩展性React富文本编辑器
GITHub：https://github.com/facebook/draft-js
TinyMCE
适用浏览器：IE6+、FireFox、Chrome、Safari、Opera...
功能方面虽然不能称得上是最强，但绝对能够满足大部分网站的需求，并且功能配置灵活简单。另一特点是加载速度非常快，如果你的服务器采用的脚本语言是PHP，那还可以进一步优化。它支持市面上所有流行的浏览器，包括 IE6+ 和 Firefox1.5+，
该编辑器由JavaScript 编写而成，功能配置灵活简单，同时 TinyMCE 可以很方便的在可视化模式与 HTML 模式进行切换，TinyMCE 是一个根据 LGPL license 协议发布的自由软件，你可以把它用于商业应用。
优点：
1、插件丰富，可扩展性强，有能力可以无限拓展功能
2、界面好看，符合现代审美， 提供经典、内联、沉浸无干扰三种模式
3、多语言支持，官网可下载几十种语言。
4、开源免费的，目前一直有人维护。
缺点：
1、部分文档为中文，但是官方文档为英文，定制和扩展开发需要花费时间
2、需要付费订阅才能使用其高级功能
中文文档：TinyMCE中文文档中文手册
英文文档：The Most Advanced WYSIWYG HTML Editor | Trusted Rich Text Editor | TinyMCE
GITHub：https://github.com/tinymce/tinymce
适用浏览器：IE6+、FireFox、Chrome、Safari、Opera...
Quill 是一个免费的，开源的 WYSIWYG （What You See Is What You Get）编辑器，专为现代网络而打造。凭借其模块化架构和富有表现力的 API，你可完全自定义以满足任何需求。
Quill 专为编辑和字符设计的，并在这些以自然文本为中心的单元之上构建其API。要找出某些文字是否是粗体，Quill 不需要遍历 DOM 查找 <b> 或者 <strong> 节点或者一个 font-weight 样式属性，只需调用 getFormat(5, 1)。它的所有核心 API 调用都允许任意索引和长度进行访问或修改。其事件 API 还会以直观的 JSON 格式报告更改。而无需解析 HTML 或者比较 DOM 树差异
优点：
1、易于设置和使用，简洁轻便，真正做到了开箱即用。
2、预设编辑器样式的主题支持。
3、由于其 API 驱动的设计，无需像在其他文本编辑器中那样解析 HTML
缺点：
1、有限的定制功能
2、更新和补丁较少
3、可能存在 XSS 安全漏洞
4、官方文档为英文，开发需要花费时间
英文文档： Quill - Your powerful rich text editor
GITHub：https://github.com/quilljs/quill/tree/develop/docs/docs/quickstart.md
我想将html转换为纯文本。不过，我不想只删除标签，我想智能地保留尽可能多的格式。为插入换行符标签，检测段落并格式化它们等。输入非常简单，通常是格式良好的html(不是整个文档，只是一堆内容，通常没有anchor或图像)。我可以将几个正则表达式放在一起，让我达到80%，但我认为可能有一些现有的解决方案更智能。 最佳答案 首先，不要尝试为此使用正则表达式。很有可能你会想出一个脆弱/脆弱的解决方案，它会随着HTML的变化而崩溃，或者很难管理和维护。您可以使用Nokogiri快速解析HTML并提取文本:require'nokogiri'h
我得到了一个包含嵌套链接的表单。编辑时链接字段为空的问题。这是我的表格:Editingkategori{:action=>'update',:id=>@konkurrancer.id})do|f|%>'Trackingurl',:style=>'width:500;'%>'Editkonkurrence'%>|我的konkurrencer模型:has_one:link我的链接模型:classLink我的konkurrancer编辑操作:defedit@konkurrancer=Konkurrancer.find(params[:id])@konkurrancer.link_attrib
?博客主页：https://xiaoy.blog.csdn.net?本文由呆呆敲代码的小Y原创，首发于CSDN??学习专栏推荐：Unity系统学习专栏?游戏制作专栏推荐：游戏制作?Unity实战100例专栏推荐：Unity实战100例教程?欢迎点赞?收藏⭐留言?如有错误敬请指正！?未来很长，值得我们全力奔赴更美好的生活✨------------------❤️分割线❤️-------------------------
我有这个代码:context"Visitingtheusers#indexpage."dobefore(:each){visitusers_path}subject{page}pending('iii'){shouldhave_no_css('table#users')}pending{shouldhavecontent('Youhavereachedthispageduetoapermissionic错误')}它会导致几个待处理，例如ManagingUsersGivenapractitionerloggedin.Visitingtheusers#indexpage.#Noreason
我一直在玩一个脚本，它在Chrome中获取选定的文本并在Google中查找它，提供四个最佳选择，然后粘贴相关链接。它以不同的格式粘贴，具体取决于当前在Chrome中打开的页面-DokuWiki打开的DokuWiki格式，普通网站的HTML，我想要我的WordPress所见即所得编辑器的富文本。我尝试使用pbpaste-Preferrtf来查看没有其他样式的富文本链接在粘贴板上的样子，但它仍然输出纯文本。在文本编辑中保存文件并进行试验后，我想出了以下内容text=%q|{\rtf1{\field{\*\fldinst{HYPERLINK"URL"}}{\fldrsltTEXT}}}|te
我使用“newapp_name”创建了一个新的Rails应用程序，我正在尝试编辑.gitignore文件，但在我的应用程序文件夹中找不到它。我在哪里可以找到它？我安装了Git。 最佳答案 .gitignore位于项目的root中，而不是app子目录中。首先打开终端并进入您的目录。您需要使用ls-a来显示stash文件。然后使用打开.gitignore 关于ruby-on-rails-尝试打开.gitignore以在文本编辑器中对其进行编辑，但在OSXMountainLion上找不到文件位
我想获取任意的ASCII文本字符串，例如“Helloworld”，并将其压缩为字符数较少(尽可能少)的版本，但要采用可以解压缩的方式。压缩版本应仅由ascii字符组成。有没有一种方法可以做到这一点，尤其是在Ruby中？ 最佳答案 如果知道只会使用ASCII字符，那就是每个字节的低7位。通过位操作，您可以将每8个字节混合成7个字节(节省12.5%)。如果您可以将其放入更小的范围(仅限64个有效字符)，则可以删除另一个字节。但是，因为您希望压缩形式也只包含ASCII字符，所以会丢失一个字节-除非您的输入可以限制为64个字符(例如，有损压
多年来，我在各种网站上遇到过各种问题，用户在字符串和文本字段的开头/结尾放置空格。有时这些会导致格式/布局问题，有时会导致搜索问题(即搜索顺序看起来不对，但实际上并非如此)，有时它们实际上会使应用程序崩溃。我认为这会很有用，而不是像我过去所做的那样放入一堆before_save回调，向ActiveRecord添加一些功能以在保存之前自动调用任何字符串/文本字段上的.strip，除非我告诉它不是，例如do_not_strip:field_x,:field_y或类定义顶部的类似内容。在我去弄清楚如何做到这一点之前，有没有人看到更好的解决方案？明确一点，我已经知道我可以做到这一点:befor
我正在尝试使用nokogirigem提取页面上的所有url及其链接文本，并将链接文本和url存储在散列中。FooBar我想回去{"Foo"=>"#foo","Bar"=>"#bar"} 最佳答案 这是一个单行:Hash[doc.xpath('//a[@href]').map{|link|[link.text.strip,link["href"]]}]#=>{"Foo"=>"#foo","Bar"=>"#bar"}拆分一点可以说更具可读性:h={}doc.xpath('//a[@href]').eachdo|link|h[link.t
目录H2数据库入门以及实际开发时的使用1.H2数据库的初识1.1H2数据库介绍1.2为什么要使用嵌入式数据库？1.3嵌入式数据库对比1.3.1性能对比1.4技术选型思考2.H2数据库实战2.1H2数据库下载搭建以及部署2.1.1H2数据库的下载2.1.2数据库启动2.1.2.1windows系统可以在bin目录下执行h2.bat2.1.2.2同理可以通过cmd直接使用命令进行启动：2.1.2.3启动后控制台页面：2.1.3spring整合H2数据库2.1.3.1引入依赖文件2.1.4数据库通过file模式实际保存数据的位置2.2H2数据库操作2.2.1Mysql兼容模式2.2.2Mysql模式
