编辑器:网页不常用的功能,但却又是不可少的功能,如果要造个编辑器轮子,它可以把人玩死!!前端几大禁忌就有富文本, 为什么都说富文本编辑器是天坑?

下面记录一下常见的一些编辑器,该文随时更新:

富文本编辑器

Tinymce

tinymce 是一家老牌做富文本的公司,它的产品经受了市场的认可,不管是文档还是配置的自由度都很好。

tinymce 的去格式化相当的好,它还有一些增值服务(付费插件),最好用的就是powerpaste,非常的强大,支持从 word 里面复制各种东西,而且还帮你顺带格式化了。

quill

一个非常火的富文本,长相很不错。基于它写插件也很简单,api 设计也很简单。楼主不选择它的原因是它对图片的各种操作不友善,而且很难改。如果对图片没什么操作的用户,推荐使用。

slate

一个 完全 可定制的富文本编辑框架。通过 Slate,你可以构建出类似 Medium、Dropbox Paper 或者 Canvas 这样使用直观、富交互、体验业已成为 Web 应用标杆的编辑器。

同时,你也无需担心在代码实现上陷入复杂度的泥潭之中。

ckeditor

一家老牌做富文本的公司,楼主旧版后台用的就是这个,今年也出了 5.0 版本,ui 也变美观了不少,相当的不错,而且它号称是插件最丰富的富文本了。推荐大家可以试用一下。

wangEditor

一个国人写的富文本,用过感觉还是不错的。不过毕竟是个人的,不像专门公司做富文本的,配置型和丰富性不足。

squire

一个比较轻量的富文本,压缩完才 11.5kb,相对于其它的富文本来说是非常的小了,推荐功能不复杂的建议使用。

UEditor

百度出品,ui 真的不好看,不符合当今审美了,官方也已经很久没跟新过了。

medium-editor

大名鼎鼎的 medium 的富文本(非官方出品),但完成度还是不很不错,拓展性也不错。不过我觉得大部分用户还是会不习惯 medium 这种写作方式的。

summernote

一个对不推荐的富文本。这是一个韩国人开源的富文本(当然不推荐的理由不是因为这个),它对很多富文本业界公认的默认行为理解是反其道而行的,

而且只为用了一个 dialog 的功能,引入了 bootstrap,一堆人抗议就是不改。格式化也是差劲。。反正不要用!不要用!不要用!

当然你也可以选择一些付费的富文本编辑器,如:froala-editor 这款编辑器。不管是美观和易用性都是不错的,公司买的是专业版,一年也就 $349 ,价格也是很合理的,但其实省去的程序员开发成本可能远不止这个价钱。 # Tinymce

代码编辑器

codemirror

Markdown 编辑器

tui.editor

simplemde-markdown-editor (已经很久不更新)

引用:https://panjiachen.github.io/vue-element-admin-site/zh/feature/component/rich-editor.html

常见网页编辑器(富文本,Markdown,代码编辑等)的更多相关文章

  1. Django1.9开发博客(11)- 富文本与代码高亮

    TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,支持目前流行的各种浏览器,由JavaScript写成. 功能配置灵活简单(两行代码就可以将编辑器嵌入网页中),支持AJAX.另一特点是加载速度 ...

  2. OC-加载h5富文本的代码,并计算高度

    参考文章: 加载富文本的h5代码:https://zhidao.baidu.com/question/1510839173546014340.html 计算富文本的高度:https://zhidao. ...

  3. H5页面设计器,仿有赞商城页面在线设计器,比富文本框更友好的内容编辑器

    基本上每个web应用,都会牵扯到内容编辑,尤其是移动的web应用,微信开发之类的.页面内容自定义是最常用的功能了,之前大部分解决方案都是采用富文本框编辑器kindeditor,ueditor,cked ...

  4. keystonejs富文本问题及思考过程

    上一篇讲了keystonejs的环境搭建,helloworld跑起来之后,实际运用中会发现各种问题,今天就说下富文本编辑器的问题(针对后端不熟的同学). 不太熟悉网页嵌入富文本编辑器的同学可能和我一样 ...

  5. Qt 富文本处理(QTextDocument和QTextBlock和QTextFrame和QTextTable和QTextList和QTextDocument)

    最近使用 Qt 做一个离线博客编辑器,因而用到了 Qt 的富文本处理.参考 Qt 的文档,记录下 Qt 的富文本处理的相关技术.文档地址是 http://doc.qt.nokia.com/4.7/ri ...

  6. WP&Win10开发: RichTextBlock实现富文本并处理换行

    思路:1.构建字典.2.在字符串中匹配字典的key,将匹配到的key转换成对应的value3.将替换后的字符串,转化成xaml形式,加载该xaml以实现富文本. 代码如下: private Parag ...

  7. 修改一个Label上字体的大小(富文本)

    假如修改上面的Label上价格30000的大小,那么需要用到富文本 上代码 // 字符串30000 NSString * priceNumber = @"30000"; [pric ...

  8. iOS - 富文本直接设置文字的字体大小和颜色

    富文本效果图: 富文本实现代码: UILabel *orderSureLabel = [Common lableFrame:CGRectZero title:] textColor:[UIColor ...

  9. 【WP8】富文本功能实现

    2014年8月1日更新:修复如果有多个相同链接解析失败的Bug,谢谢 @Walsh 提供的问题 富文本在移动APP上应用的最多的就是表情了,类似微博,QQ,微信都有对提供对表情和链接的支持,富文本一般 ...

随机推荐

  1. linux centos7下源码 tar安装mysql5.7.22或mysql5.7.20 图文详解

    之前用的rpm安装的每次安装都是最新的,,,导致每次版本不统一... 现在用tar包安装5.7.22和5.7.20一样的   5.7.20之后的和之前的版本还是有点不一样的 官网地址 https:// ...

  2. centos7.x下环境搭建(五)—nginx搭建https服务

    https证书获取 十大免费SSL证书 https://blog.csdn.net/ithomer/article/details/78075006 如果我们用的是阿里云或腾讯云,他们都提供了免费版的 ...

  3. MonkeyDev安装--逆向开发

    MonkeyDev是原有iOS OpenDev的升级,非越狱插件的开发集成神器! 可以使用Xcode开发CaptainHook Tweak.Logos Tweak 和 Command-line Too ...

  4. 简要介绍Active Learning(主动学习)思想框架,以及从IF(isolation forest)衍生出来的算法:FBIF(Feedback-Guided Anomaly Discovery)

    1. 引言 本文所讨论的内容为笔者对外文文献的翻译,并加入了笔者自己的理解和总结,文中涉及到的原始外文论文和相关学习链接我会放在reference里,另外,推荐读者朋友购买 Stephen Boyd的 ...

  5. maven的pom.xml用<exclusion>解决版本问题

    用maven管理库依赖,有个好处就是连同库的依赖的全部jar文件一起下载,免去手工添加的麻烦,但同时也带来了同一个jar会被下载了不同版本的问题,好在pom的配置里面允许用<exclusion& ...

  6. MVC+Ninject+三层架构+代码生成 -- 总结(五、Ninject)

    1.在寫邏輯層前,需要弄好反轉控制,因框架沒有寫接口,所以Ninject只負責返回當前實例,有點類似共享設計模式. public sealed class IOCHelper { private st ...

  7. ASP.NET MVC 过滤、异常过滤器

    记录下过滤器的学习—_— APS.NET MVC中的每一个请求,都会分配给相应的控制器和对应的行为方法去处理,而在这些处理的前后如果想再加一些额外的逻辑处理,这样会造成大量代码的重复使用,这不是我们希 ...

  8. layui提示框事件

    使用layui提示框的时候遇到个问题,点击“确定”“取消”之类的按钮会执行里面的方法,但点击×就不会执行,所以在添加数据的时候出现个BUG,就是保存数据后点击弹出提示框的×,继续保存,如此循环,就可以 ...

  9. c#ADO.NET 执行带参数及有返回数据

    直接上代码,这个过程中有个数据SqlDataReader转为 DataTable的过程,当中为什么这样,是应为我直接绑定DataSource的时候没有数据,网人家说直接绑定但是没效果,我就转换了一下. ...

  10. 对Haskell这门语言的基本认识

    Haskell语言的核心特征: 1. 函数式,而且是纯函数式(purely functional) 首先,引用一下维基百科上对“典型的函数式编程语言”的划分: 一: 纯函数式 1. 强静态类型: Mi ...