文本编辑_文本编辑器 - CSDN
精华内容
参与话题
  • 常用的六个富文本编辑

    万次阅读 2018-05-03 11:12:44
    1::功能齐全 tinymce|TinyMCE | The Most Advanced WYSIWYG HTML Editor官方网址:https://www.tinymce.com/TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,由JavaScript写成。它对IE6+和Firefox1.5+都有着...

    1::功能齐全 tinymce|TinyMCE | The Most Advanced WYSIWYG HTML Editor

    官方网址:https://www.tinymce.com/

    TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,由JavaScript写成。它对IE6+和Firefox1.5+都有着非常良好的支持。


    图片发自简书App

    2:百度 ueditor|UEditor - 首页

    官方网址:http://ueditor.baidu.com/website/

    UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码...


    图片发自简书App

    3:经典的ckeditor|CKEditor.com
    https://ckeditor.com/

    图片发自简书App

    4:经典的kindeditor|在线HTML编辑器
    http://kindeditor.net/demo.php

    图片发自简书App

    5:wysiwyg|微型、开源的Bootstrap所见即所得(WYSIWYG)富文本编辑器 -- 由MindMup贡献

    官方网站http://www.bootcss.com/p/bootstrap-wysiwyg/

    图片发自简书App

    6:html5编辑器|Squire
    官方网站
    http://neilj.github.io/Squire/

    图片发自简书App

    另附三款源码:
    wangEditor|GitHub - wangfupeng1988/wangEditor: wangEditor —— 轻量级web富文本框
    wangEditor—— 轻量级 web 富文本编辑器,配置方便,使用简单。支持 IE10+ 浏览器。
    官网:www.wangEditor.com
    文档:www.kancloud.cn/wangfupeng/wangeditor3/332599
    源码:github.com/wangfupeng1988/wangEditor
    tower用的编辑器|GitHub - mycolorway/simditor: An Easy and Fast WYSIWYG Editor
    github:https://github.com/mycolorway/simditor

    summernote 编辑器|GitHub - summernote/summernote: Super simple WYSIWYG editor
    github :https://github.com/summernote/summernote


    文末福利:

    福利一:前端,Java,产品经理,微信小程序,Python等10G资源合集大放送:jianshu.com/p/e8197d4d9

    福利二:微信小程序入门与实战全套详细视频教程。


    【领取方法】

    关注 【编程微刊】微信公众号:

    回复【小程序demo】一键领取130个微信小程序源码demo资源。

    回复【领取资源】一键领取前端,Java,产品经理,微信小程序,Python等资源合集10G资源大放送。


    展开全文
  • vim 文本编辑

    千次阅读 2019-03-23 16:33:41
    4.2 vim文本编辑器 4.2.1 简介 vim是vi的升级版,最常见的区别是能用多种颜色显示显示系统文件的一些特殊信息。 vi: Visual Interface 文本编辑器,可视化接口 vim:vi iMprove的缩写,即vi的增强版 vim编辑器...

    4.2 vim文本编辑器

    4.2.1 简介

    vim是vi的升级版,最常见的区别是能用多种颜色显示显示系统文件的一些特殊信息。

    • vi: Visual Interface 文本编辑器,可视化接口
    • vim:vi iMprove的缩写,即vi的增强版
      vim编辑器分为三种主要模式:
    1. 命令模式(编辑模式):默认模式,移动光标,剪切/粘贴文本(界面表现:左下角显示文件名或为空)
    2. 插入模式(输入模式):修改文本(界面表现:左下角显示—INSERT–)插入模式下,按ESC按键返回命令模式
    3. 末行模式(扩展模式):保存、退出等(界面表现:左下角显示—VISUAL–)末行模式下连续按两次ESC按键返回末行模式
    • Esc建:退出当前模式
    • Esc建Esc建:总是返回到命令模式
      在这里插入图片描述
      在这里插入图片描述

    4.2.2 语法

    vim [options] [file …]
    vim [options] -
    vim [options] -t tag
    vim [options] -q [errorfile]
    ex
    view
    gvim gview evim eview
    rvim rview rgvim rgview

    • 用vim打开文件用法:
      例如:【vim abc.txt】打开abc.txt文件
      例如:【vim +# abc.txt】打开abc.txt文件,光标定位在abc.txt文件的第#行
      例如:【vim + abc.txt】打开abc.txt文件,光标定位在最后一行
      例如:【vim +/PATTERN abc.txt】打开abc.txt文件,定位第一次被PATTERN(模式)匹配到的行的行首

    • 模式之间的切换
      注意:vim打开文件后,默认进入的模式为:命令模式:
      命令模式下进入插入模式(输入模式)输入:【i】或者【o】或者【a】等
      命令模式下进入末行模式(扩展模式)输入:【:】
      使用vim编辑多个文件
      【vim FILE1 FILE2 FILE3】可以同时编辑FILE1 FILE2 FILE3这三个文件
      【:next】切换至下一个文件
      【:prev】切换至前一个文件
      【:last】切换至最后一个文件
      【:first】切换至第一个文件

    4.2.3 vim的命令模式(编辑模式)常用快捷键

    1) 模式转换
             a) 【i】:在当前光标所在字符的前面,转为输入模式
             b) 【a】:在当前光标所在字符的后面,转换为输入模式
             c) 【o】:在当前光标所在行的下方,新建一行,并转换为输入模式:
             d) 【I】:在当前光标所在行的行首,转换为输入模式
             e) 【A】:在当前光标所在行的行尾,转换为输入模式
             f) 【O】:在当前光标所在行的上方,新建一行,并转换为输入模式;
             g) 【cc】删除当前行并输入新内容,相当于S。扩展【#cc】
             h) 【C】删除当前光标到行尾,并切换成插入模式

    • 改变命令
      【c】修改后切换成插入模式
    • 命令模式–>插入模式
      【c^】删除光标处到行首的字符,并进入插入模式
      【c$】删除光标处到行尾的字符,并进入插入模式
      【c0】(c零)删除光标处到当前行首的第一非空字符,并进入插入模式
      【cb】删除当前第一个单词,并进入插入模式
      【ce】删除下一个单词,并进入插入模式
      【cw】删除光标处到单词词尾,并进入插入模式

    2) 逐字符移动
             a) 【h】向左
             b) 【l】向右(小写的L)
             c) 【j】向上
             d) 【k】向下
             e) 【#COMMAND】移动#个字符
             例如: 【#h】向左移动#个字符
              【#l】向右移动#个字符
              【#j】向上移动#个字符(相当于向上移动#行)
              【#k】向下移动#个字符(相当于向下移动#行)
    3) 当前页跳转
             a) 【H】:当前页的页首
             b) 【M】:当前页的中间行
             c) 【L】当前页的页底

    4) 以单词为单位移动
             a) 【w】移动至下一个单词的词首
             b) 【e】跳至当前或下一个单词的词尾
             c) 【b】跳至当前或前一个单词的词首
             d) 【#COMMAND】跳到第#个单词
             例如: 【#w】跳转到第#个单词的词首
              【#e】向下跳转到第#个单词的词尾
              【#b】向上跳转到第#个单词的词首
    5) 行内跳转
             a) 【0】(零) :绝对行首,光标移动到当前行的行首
             b) 【^】光标移动到当前行首的第一个非空白字符
             c) 【&】光标移动到当前行的行尾
    6) 行间跳转(相当于上下跳转)
             a) 【G】跳转到最后一行(整个文档的最后一行)
             b) 【gg或者1G】跳转到文档的第一行
             c) 【#G】跳转到第#行(文档最上为第一行)
             注意:想要跳转到最后一行可以输入【0G】也是最后一行
    7) 句间移动
             a) 【)】下一句
             b) 【(】上一句
    8) 段落间移动
             a) 【}】下一段
             b) 【{】上一段
    9) 常用快捷键滚动
             a) 【Ctrl + e】向下滚动一行
             b) 【Ctrl + y】向上滚动一行
             c) 【Ctrl + d】向下滚动半屏
             d) 【Ctrl + u】向上滚动半屏
             e) 【Ctrl + f】向下滚动一屏
             f) 【Ctrl + b】向上滚动一屏
    10) 字符编辑

    • 【x】删除光标处的字符
    • 【#x】删除从光标处开始向后#个字符
    • 【xp】光标所在处的字符和光标后面的字符对调位置
    • 【~】转换大小写
    • 【J】删除当前行后的换行符

    11) 替换命令(r,replace)

    • 【r】替换光标所在字符
    • 【R】切换成REPLACE模式

    12) 删除命令(剪切命令)
    注意:d命令删除的字符会默认复制到剪贴板
             a) 【d】删除命令,可以结合光标跳转字符,实现范围删除
             b) 【d$】删除到行尾
             c) 【d^】删除到非空行首
             d) 【d0】删除到行首
             e) 【dd】删除光标所在行
             f) 【#dd】多行删除
             g) 【D】从当前光标位置一直删除到行尾,留空行,等同于【d$】
             h) 【de】
             i) 【dw】
             j) 【db】
             k) 【#COMMAND】
             l) 【Shift + j】删除两行质检的空行,实际上是合并两行
    插入模式(输入模式下的剪切)
        正常模式(默认模式)下按v(逐字)或V(逐行)进入可视模式,然后用【j】【k】【l】【h】命令移动即可选择某些行或字符,再按d即可剪切

    13) 复制命令(y,yank)
             a) 【y】复制,可以结合光标跳转字符,实现范围复制(行为与d有类似之处)
             b) 【y$】复制到行尾
             c) 【y^】复制到非空行首
             d) 【y0】复制到行首
             e) 【yy】复制当前行
             f) 【#yy】复制多行
             g) 【Y】整行复制
             h) 【ye】
             i) 【yw】
             j) 【yb】
             k) 【#COMMAND】

    14) 粘贴命令(p,paste)
             a) 【p】缓冲区存的如果为整行,则粘贴当前光标所在行的下方,否则粘贴至当前光标所在处的后面
             b) 【P】缓冲区存的如果为整行,则粘贴当前光标所在行的上方,否则粘贴至当前光标所在处的前面
    15) 撤销更改
             a) 【u】撤销最近的更改
             b) 【#u】撤销之前多次更改
             c) 【U】撤销光标落在这行后所有此行的更改
             d) 【按Ctrl + r】重做最后的“撤销”更改(相当于取消撤销)
             e) 【.】重做前一个操作
             f) 【#】重复前一个操作#次

    4.2.4 vim的末行模式(扩展模式)

    命令模式下进入末行模式(扩展模式)输入:【:】

    4.2.4.1 退出命令
             【:q】退出
             【:x】保存退出
             【:wq】保存并退出
             【:q!】强制退出并或略所有更改
             【:e!】放弃所有修改,并打开源文件
    注意:在默认模式的退出方法
             【ZZ】保存并退出
             【ZQ】不保存退出
    附加:
    【:!COMMAND】执行COMMAND命令,和shell交互
    【r!COMMAND】读入命令的输出
    【r filename】读取filename文件内容到当前文件中
    【w filename】将当前文件内容下入filename文件中

    4.2.4.2 地址定界(可以用于查找和替换等)
    语法:【:start_pos,end_pos】
    例如:
             【:#】具体第#行,例如2表示第2行
             【#,#】从左侧#表示起始行,到右侧#表示结尾行
             【#,+#】从左侧#表示的起始行,加上右侧#表示的行数
    例如【:2,+3】表示2到5行
             【.】表示当前行
             【$】最后一行
             【%】全文,相当于【1,$】
    例如:【:.,$-1】表示当前行到倒数第二行

    • 扩展命令模式:地址定界
      注意:地址界定默认是从光标位置开始(即在默认模式进入命令模式时的光标位置)向下搜索匹配(如果查到到文件结尾,依旧没找到,会从头开始查找)
      【:/pat1/,/pat2/】从第一次被pat1模式匹配到的行开始,一直到第一次被pat2匹配到的行结束
      【:#,/pat/】从第#行开始,一直到第一次被pat匹配到的行结束
      【:/pat/,$】从第一次被pat匹配到的行开始,一直到最后一行
    • 地址界定后面可跟随的编辑命令
      【d】例如:【:/pat1/,/pat2/d】
          表示,从光标位置开始向下匹配,第一次匹配到“pat1”的位置开始到第一次匹配到pat2结束是的末行,删除末行。(注意:如果匹配结果是多行,只会删除最后一行)
      【y】例如:【:/pat1/,/pat2/y】
          表示,从光标位置开始向下匹配,第一次匹配到“pat1”的位置到第一次匹配到“pat2”的位置直接,复制内容到剪贴板。
      【w file】将范围内的行另存至指定文件中。
      例如:【:/pat1/,/pat2/w ./abc.txt】
          表示从光标位置开始向下匹配,第一次匹配到pat1的位置到第一次匹配到pat2的位置内容写到当前目录下的abc.txt文件中。
      【r file】在指定位置插入指定文件中的所有内容。
      例如:【:/pat1/,/pat2/r ./abc.txt】
              表示从光标位置开始向下匹配,第一次匹配到“pat1”的位置到第一次匹配到“pat2”的位置的行末插入abc.txt文件内容

    4.2.4.3 查找并替换

    • 【:/PATTERN】从当前光标所在处向文件尾部查找匹配“PATTERN”相同的内容。

    • 【:?PATTERN】从当前光标所在处向文件首部查找匹配“PATTERN”相同内容

    • 【n】与命令同方向

    • 【N】与命令反方向
      扩展命令模型:查找并替换

    • 【s】在扩展模式下完成查找替换操作
      格式:【s/要查找的内容/替换为的内容/修饰符】

      • 要查找的内容:可以使用模式
      • 替换为的内容:不能使用模式,单可以使用\1,\2等后向引用符号;还可以使用“&”引用前面查找时查找的整个内容
      • 修饰符:
        • 【i】忽略大小写
        • 【g】管局替换;默认情况下,每行只替换第一次出现
        • 【gc】全局替换,每次替换前询问

      注意:查找替换中的分隔符【/】可用其他符号替代,例如【@】【#】等

    例子:【s/a/Good/g】或者【s@a@Good@g】查找当前光标所在行的“a”字符,全部替换成“Good”字符
    在这里插入图片描述
    替换后:
    在这里插入图片描述
    例如:【s#/boot#/#i】将光标所在行的【/boot】替换成【/】,默认只会替换一个,匹配时会忽略大小写
    例如:【4s@^.*\(你好\).*@\1@ig
            在4行查找匹配“^.*\(你好\).*”这个正则表达式 能匹配到的内容,替换成“你好”
    替换前:
    在这里插入图片描述
    替换后:
    在这里插入图片描述
    如果需要对全文替换可以使用如下命令
    :1,$s/^.*\(你好\).*/\1/ig】其中【1,$】为地址界定。

    4.2.4.4 地址定界与查找替换扩展模式结合使用
    :4,8s/^.*\(你好\).*/\1/ig】这种为只替换第4行到第8行之间的内容,其中【4,8】表示4行到8行之间的内容
    :/par1/,/par2/s/^.*\(你好\).*/\1/ig】这种为从第一次匹配到par1到第一次匹配par2之间的内容中间,
    按照【s/^.*\(你好\).*/\1/ig】命令进行匹配替换

    4.2.4.5 帮助命令

    • 【:help or F1】显示整个帮助
    • 【:help xxx】显示xxx的帮助,比如:【:help I】【:help CTRL-[】即Ctrl+[的帮助
    • 【:help ‘number’】Vim选项的帮助用单引号刮起
    • 【:help 】特殊建的帮助用<>扩起
    • 【:help –t】Vim启动参数的帮助用-
    • 【:help –i_】插入模式下Esc的帮助,某个模式下的帮助用(模式_主题)的模式

    帮助文件中位于||之间的内容是超链接,可以用Ctrl+]进入链接,Ctrl+o(Ctrl + t)返回

    4.2.4.6 其他非编辑命令

    • 【:.】重复前一次命令

    • 【:set ruler?】查看是否设置了ruler,在.vimrc中,使用set命令设置的选项都可以通过这个命令查看

    • 【:scriptnames】查看vim脚本文件的位置,比如.vimrc文件,语法文件及plugin等

    • 显示非打印字符
          【:set list】显示非打印字符,比如tab,空格,行尾等。如果tab无法显示,请确定用set lcs=tab:>-命令设置了.vimrc文件,并确保你的文件中的确有tab,如果开启了expendtab,那么tab将被扩展为空格。
          【:set nolist】关闭非打印字符

    • 行号:
      【:set number】显示行号或者【:set nu】
      【:set nu】关闭行号显示

    • 大小写
      【:set ignorecase】忽略区分大小写或者【:set ic】
      【:set noignorecase】不忽略大小写或者【:set noic】

    • 设置自动缩进
      【:set autoindent】设置自动缩进或者【:set ai】
      【:set noai】取消制动缩进

    • 查找文本高亮显示或取消
      【:set hlsearch】设置高亮显示
      【:set nohlsearch】取消高亮显示

    • 语法高亮显示
      【:syntax on】开启语法高亮显示
      【:synatx off】关闭语法高亮显示

    • 辅助保留格式
      【:set paste】启用复制保留格式
      【:set noPaste】关闭复制保留格式

    • 文件格式
      【:set fileforma=doc】启用windows格式。或者【:set ff=doc】
      【:set fileforma=unix】启用unix格式。或者【:set ff=nuix】

    • 设置文本宽度
      【:set textwidth=65】启用
      【:set wrapmargin=15】禁用

    • 设置光标所在行的标识线
      【:set cursorline】或者【:set cul】启用标识线
      【:set no cursorline】或者【:set not cul】禁用标识线

    • 【:set or】查看set帮助或者【:set all】

    4.2.5 vim可视化模式

    默认模式下输入:

    • 【v】按照字符选取,或者【ctrl + v】
    • 【V】按矩形快选取

    可视化建可用于与移动建结合使用
    【w】【)】【}】箭头灯
    突出显示的文字可被删除,复制,变更,过滤,搜索,替换等

    4.2.6 vim多窗口

    语法:【vim –o|-O FILE1 FILE2 …】
               【-o】水平分割显示
               【-O】垂直分割显示
    命令模式下输入【:qa】关闭所有窗口
    窗口间切换:Ctrl+w,Arrow

    • 单文件窗口分割:
      • 【Ctrl+w,s】split,水平分割
      • 【Ctrl+w,v】vertical,垂直分割
      • 【Ctrl+w,q】取消相邻窗口
      • 【Ctrl+w,o】取消全部窗口
      • 【:wqall】退出

    4.2.7 vim配置文件

    【/etc/vimrc】vim的全局配置文件
    【~/.vimrc】用户的vim配置文件

    4.2.8 相关编辑器

    文本:ASCII,Unicode

    • 文本编辑器种类:
      行编辑器:sed
      全屏编辑器:nano,vi
      vim-Vi Improved
      其他编辑器:
      gedit 一个简单的图形编辑器
      gvim 一个Vim编辑器的图形版本

    4.2.9 帮助(vim --help)

    [root@gdy103 ~]# vim --help
    VIM - Vi IMproved 7.2 (2008 Aug 9, compiled Apr  5 2012 10:17:30)
    
    用法: vim [参数] [文件 ..]       编辑指定的文件
      或: vim [参数] -               从标准输入(stdin)读取文本
      或: vim [参数] -t tag          编辑 tag 定义处的文件
      或: vim [参数] -q [errorfile]  编辑第一个出错处的文件
    
    参数:
       --			在这以后只有文件名
       -v			Vi 模式 (同 "vi")
       -e			Ex 模式 (同 "ex")
       -s			安静(批处理)模式 (只能与 "ex" 一起使用)
       -d			Diff 模式 (同 "vimdiff")
       -y			容易模式 (同 "evim",无模式)
       -R			只读模式 (同 "view")
       -Z			限制模式 (同 "rvim")
       -m			不可修改(写入文件)
       -M			文本不可修改
       -b			二进制模式
       -l			Lisp 模式
       -C			兼容传统的 Vi: 'compatible'
       -N			不完全兼容传统的 Vi: 'nocompatible'
       -V[N][fname]		Be verbose [level N] [log messages to fname]
       -D			调试模式
       -n			不使用交换文件,只使用内存
       -r			列出交换文件并退出
       -r (跟文件名)		恢复崩溃的会话
       -L			同 -r
       -A			以 Arabic 模式启动
       -H			以 Hebrew 模式启动
       -F			以 Farsi 模式启动
       -T <terminal>	设定终端类型为 <terminal>
       -u <vimrc>		使用 <vimrc> 替代任何 .vimrc
       --noplugin		不加载 plugin 脚本
       -P[N]		打开 N 个标签页 (默认值: 每个文件一个)
       -o[N]		打开 N 个窗口 (默认值: 每个文件一个)
       -O[N]		同 -o 但垂直分割
       +			启动后跳到文件末尾
       +<lnum>		启动后跳到第 <lnum> 行
       --cmd <command>	加载任何 vimrc 文件前执行 <command>
       -c <command>		加载第一个文件后执行 <command>
       -S <session>		加载第一个文件后执行文件 <session>
       -s <scriptin>	从文件 <scriptin> 读入正常模式的命令
       -w <scriptout>	将所有输入的命令追加到文件 <scriptout>
       -W <scriptout>	将所有输入的命令写入到文件 <scriptout>
       -x			编辑加密的文件
       --startuptime <file>	Write startup timing messages to <file>
       -i <viminfo>		使用 <viminfo> 取代 .viminfo
       -h  或  --help	打印帮助(本信息)并退出
       --version		打印版本信息并退出
    [root@gdy103 ~]#
    
    展开全文
  • 推荐几个非常不错的富文本编辑

    万次阅读 多人点赞 2020-03-15 11:02:44
    1、wangEditor——基于javascript和css开发的 Web富文本编辑器, 轻量、简洁、界面美观、易用、开源免费。 界面截图:官网地址 2、TinyMCE——TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,由JavaScript...

    1、wangEditor——基于javascript和css开发的 Web富文本编辑器, 轻量、简洁、界面美观、易用、开源免费。

    界面截图:官网地址

    ubang_image_20190810152679.png

    2、TinyMCE——TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,由JavaScript写成。它对IE6+和Firefox1.5+都有着非常良好的支持。功能齐全,界面美观,就是文档是英文的,对开发人员英文水平有一定要求。

    界面截图:官网地址

    ubang_image_20190810307255.png

    3、百度ueditor——UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,功能齐全,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码,缺点是已经没有更新了

    界面截图:官网地址

    ubang_image_20190810334791.png

    4、kindeditor——界面经典。

    界面截图:官网地址

    ubang_image_20190810963511.png

    5、Textbox——Textbox是一款极简但功能强大的在线文本编辑器,支持桌面设备和移动设备。主要功能包含内置的图像处理和存储、文件拖放、拼写检查和自动更正。此外,该工具还实现了屏幕阅读器等辅助技术,并符合WAI-ARIA可访问性标准。

    界面截图:官网地址

    ubang_image_20190810316724.png

    6、CKEditor——国外的,界面美观。

    界面截图:官网地址

    ubang_image_20190810353138.png

    6、quill——功能强大,还可以编辑公式等

    界面截图:官网地址

    ubang_image_20190810756980.png

    7、simditor——界面美观,功能较全。(个人博客考虑使用)

    界面截图:官网地址(网址打开较慢)

    ubang_image_20190810213989.png

    8、summernote——UI好看,精美

    界面截图:官网地址

    ubang_image_20190810530752.png

    9、jodit——功能齐全

    界面截图:官网地址

    ubang_image_20190914841422.png

    10、Editor.md——功能非常丰富的编辑器,左端编辑,右端预览,非常方便,完全免费

    界面截图:官网地址

    ubang_image_20190914403262.png

    11、froala Editor——界面非常好看,功能非常强大,非常好用(非免费,可破解)

    界面截图:官网地址

    ubang_image_20190925148837.png

    12、syncfusion

    界面截图:官网地址

    ubang_image_20191026771553.png

    13、dhtmlxEditor

    界面截图:官网地址

    目前可用的富文本编辑器很多,笔者挑出其中一些常用的,仅供参考。

    原文链接:https://www.qsp.net.cn/art/168.html

    展开全文
  • 文本编辑器  富文本编辑器(Rich Text Editor,RTE)是一种可内嵌于浏览器,所见即所得的文本编辑器。它提供类似于Office Word 的编辑功能,方便那些不太懂HTML用户使用,富文本编辑器的应用非常广泛,它的历史...

    富文本编辑器

     富文本编辑器(Rich Text Editor,RTE)是一种可内嵌于浏览器,所见即所得的文本编辑器。它提供类似于Office Word 的编辑功能,方便那些不太懂HTML用户使用,富文本编辑器的应用非常广泛,它的历史与图文网页诞生的历史几乎一样长。

     作为一个技术人员,手上备上两款富文本编辑器还是很有用的,指不定那个项目就要集成一个进去。到时候现找现用那可就费功夫了,毕竟从开发上讲,每个富文本编辑器的用法都是有区别的。

     下面是我收集的一些业界比较受欢迎的富文本编辑器,喜欢的朋友、用过的朋友可以一起看看,一起探讨。

    1、TinyMCE

     TinyMCE是一个开源的所见即所得的HTML编辑器,界面相当清新,界面模拟本地软件的风格,顶部有菜单栏。支持图片在线处理,插件多,功能非常强大,易于集成,并且拥有可定制的主题。支持目前流行的各种浏览器,它可以达到微软Word类似的编辑体验。

     而且这么好的东西还是开源免费的,目前一直有人维护,这款编辑器使用的人非常多。

     更多介绍及下载:https://www.tiny.cloud/docs/demo/full-featured/

     

    2、CKEditor

     Ckeditor也是一款非常经典的富文本编辑器,官方下载量过千万。它是在非常著名的FCkEditor基础上开发的新版本,FckEditor的用户现在基本都转移到Ckeditor了。

     Ckeditor有高性能的实时预览,它特有行内编辑功能,使得编辑内容更加直观,仿佛是在编辑网页一样,有很强的可扩展性,被各大网站广泛运用。

     更多介绍及下载:https://ckeditor.com/

     

    3、UEditor

     UEditor 是由百度出品的富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源免费。这款编辑器用过的人也非常多,功能非常全面,插件很多,还可以很方便插入百度地图,接入十分简单。

     16年之后百度没有怎么更新了,不过现有的功能也足够用了。UEditor分为UE版(全功能版)和UM版(精简版),大家可以根据自己使用环境选择不同的版本。

     更多介绍及下载:http://ueditor.baidu.com/website/

     

    4、wangEditor

     wangEditor轻量级,小巧实用,配置方便,使用简单。可以自定义皮肤功能,免费开源。用户数量也很多,尤其是用在一些轻型环境,比如论坛社区回帖。wangEditor是国人出品的开源项目。

     更多介绍及下载:http://www.wangeditor.com/

     

    5、kindeditor

     KindEditor历史也很长了,用户数也不少,国内某公司出品。免费开源。界面类似于office word,界面和功能中规中矩,文档齐全,使用还算方便。

     更多介绍及下载:http://kindeditor.net/demo.php

     

    6、simditor

     simditor是Tower平台使用的富文本编辑器,是一款轻量化的编辑器,界面简约,功能实用,插件不是很多,功能要求不高的可以使用。

     虽然是国内出品,但文档是英文的。开源免费。

     更多介绍及下载:https://simditor.tower.im/

     

    7、bootstrap-wysiwyg

     bootstrap-wysiwyg是基于Bootstrap的轻型、免费开源的富文本编辑器,界面简洁大方。使用需要先引入bootstrap。

     个人觉得bootstrap-wysiwyg这一长串像乱码一样的名字影响了它的推广和使用~ ~毕竟轻型使用环境还是很多的。

     更多介绍及下载:http://mindmup.github.io/bootstrap-wysiwyg/

     

    8、summernote

     summernote是一款轻量级的富文本编辑器,比较容易上手,使用体验流畅,支持各种主流浏览器。summernote开源免费,该项目一直比较活跃,一直都有人在维护。

     summernote同样依赖于jquery和bootstrap,使用前先引入这两项。

     更多介绍及下载:https://summernote.org/

     

    9、Froala

     Froala是一款功能丰富的富文本编辑器,界面分类清晰,容易集成,容易升级,支持主流浏览器,具有行内编辑功能。Froala代码示例很多,可以集成在很多js框架里如React.js,Aurelia,Angular,Ionic,Django等。插件很多,易于扩充功能。

     Froala是收费的,不过前端是开源的,如果要使用后台是要交费的(如果你使用国人强大的crack技能那就是另外一回事了~ ~)。目前有三个定价方式:基础版(239美元)、专业版(1199美元)和企业版(1999美元)。

     更多介绍及下载:https://www.froala.com/wysiwyg-editor

     

    10、Quill

     Quill是轻型的编辑器,样式一般(黑白风),功能中等,它的代码高亮功能比较强,同样支持行内编辑模式,工具条可自定义。

     开源免费,项目活跃,一直有人维护。

     更多介绍及下载:https://quilljs.com/

     

    11、FreeTextBox

     FreeTextBox功能强大,前端支持主流浏览器,但后台只支持.NET。它的外观和使用风格都和微软 Word很类似。工具条可以定制,运行速度一般。FreeTextBox分为免费版和pro收费版,一般情况免费版本功能已经足够用了。

     更多介绍及下载:http://freetextbox.com/

     

    12、dhtmlxEditor

     DHTMLX组件是一整套基于JS的UI库,功能强大,其中包含编辑器dhtmlxEditor。该编辑器可以直接集成到Angular,React和Vue.js框架中,该编辑器还同时支持Markdown和富文本。

     支持普通视图和类似word一样的页面视图,支持全屏幕,工具支持自定义,包括工具条颜色和样式等。

     dhtmlxEditor分为免费版和收费版,免费版具有绝大多数功能,而且免费版是开源的你可以在代码级别随便扩充。

     更多介绍及下载:https://dhtmlx.com/docs/products/dhtmlxRichText/

     

    13、eWebEditor

     eWebEditor外观和使用风格都和微软 Word很类似,功能很多。工具条可以定制,运行速度很快。导入文件接口很多,支持word、excel、pdf、ppt直接导入,目前版本不支持代码高亮,不适合纯技术平台使用,适合内容编辑人员使用。

     eWebEditor有很长的历史了,是典型的传统富文本编辑器,不论是界面,还是功能都比较传统。

     eWebEditor是收费的,但也有免费的精简版,精简版没有后台功能。

     更多介绍及下载:http://www.ewebeditor.net/demo/

     

    最后

     富文本编辑器产品真的非常多,以上只是本人接触过的一些,相信还有很多很好的富文本存在,其实也没必要全都试一遍,只有最适合自己的,才是最好的。

     如果你用过其中的一种,或者你用过其他好用的富文本编辑器,欢迎交流分享。

     如果你还喜欢现在流行的markdown编辑器,请看我的另一篇文章《几款主流好用的markdown编辑器介绍》

     如果想了解markdown编辑器和富文本编辑器的区别,请参考《markdown编辑器与富文本编辑器优缺点比较,哪个更好用》

     

    转载请注明原文地址:https://blog.csdn.net/davidhzq/article/details/100842866

     

     

    展开全文
  • 十五种文本编辑

    万次阅读 2019-03-13 19:55:08
    很多时候比如编程查看代码或者打开各种文档下我们都会用到文本编辑器,Windows自带的记事本功能很简陋并且打开大文件很慢,因此很多童鞋都会有自己喜欢的一款文本编辑器。在这里,西西挑选前15个最佳的文本编辑器,...
  • 程序员最喜欢的15款文本编辑器推荐

    万次阅读 热门讨论 2017-09-18 17:32:20
    很多时候比如编程查看代码或者打开各种文档下我们都会用到文本编辑器,Windows自带的记事本功能很简陋并且打开大文件很慢,因此很多童鞋都会有自己喜欢的一款文本编辑器。在这里,西西挑选前15个最佳的文本编辑器,...
  • linux文本编辑

    万次阅读 2018-09-13 14:57:24
    **关于文本编辑文本编辑器有很多,比如图形模式的gedit、kwrite、OpenOffice … … ,文本模式下的编辑器有vi、vim(vi的增强版本)和nano … … vi和vim是我们在Linux中最常用的编辑器。我们有必要介绍一下vi...
  • “刘郎已恨蓬山远,更隔蓬山一万重” 序 现在做的是从web端给眼镜端发送消息,其实就是web端把消息存到数据库,然后眼镜从数据库获取消息即可。...从Word中复制图片、文字、标题、部分带样式的文字编辑器中...
  • (九)C#之WinForm程序设计-升级版文本编辑

    万次阅读 多人点赞 2019-11-20 21:33:20
    C#WinForm程序设计之升级版文本编辑器 前面的那篇博文讲解了一个简单版本的文本编辑器,实现了一些最简单的功能。那么这里我们对那个文本编辑器做一个升级吧!既然是升级版,那么就要做的像Word一点咯!
  • 在网页中添加富文本编辑器——UEditor的使用

    万次阅读 多人点赞 2018-06-01 16:39:40
    利用百度公司的开源项目UEditor实现在jsp页面中加入富文本编辑功能
  • c语言实现简易文本编辑

    万次阅读 热门讨论 2019-01-27 20:39:03
    本程序要求完成一个简易文本编辑器,能够完成文本的录入、编辑、删除、查找,并能够完成文件的存取。 在文本编辑软件中把用户输入的所有文本内容作为一个字符串。虽然各种文本编辑软件的功能有强弱差别,但是基本...
  • 用Java实现文本编辑

    万次阅读 2018-02-14 10:25:06
    源码里有注释:import java.awt.*; import java.awt.event.*; import java.io.*; import javax.swing.*;...//简单的文本编辑器 public class Editor extends JFrame { public JTextPane textPane = new...
  • 文本编辑器快捷键

    千次阅读 2016-05-11 20:12:38
    文本编辑器常用快捷键(notepad++或editplus) Notepad++快捷键 1:文件操作 Ctrl+O 打开文件 ctrl+N 新建文件 Ctrl+S 保存文件 ctrl+alt+s 文件另存为 Ctrl+shift+s 保存所有打开文件 alt+...
  • 强力推荐的文本编辑器 Notepad

    千次阅读 2019-11-12 16:14:31
    notepad(记事本)是代码编辑器或WINDOWS中的小程序,用于文本编辑,在文字编辑方面与Windows写字板功能相当。是一款开源、小巧、免费的纯文本编辑器。 Notepad内置支持多达 27 种语法高亮度显示(囊括各种常见的源...
  • 好用的文本编辑器推荐

    千次阅读 2019-04-14 23:39:33
    Sublime Text 是一个跨平台且具有漂亮用户界面和强大功能的文本编辑器,支持Windows、MacOS、Linux等操作系统。 主要功能包括:拼写检查,书签,完整的 Python API , Goto 功能,即时项目切换,多选择,多窗口等等...
  • 文本编辑插件

    千次阅读 2012-06-01 12:32:19
    KindEditor是一套开源的HTML可视化编辑器,兼容IE、Firefox、Chrome、Safari、Opera等主流浏览器。  KindEditor使用JavaScript编写,可以无缝的于Java、.NET、PHP、ASP等程序接合。 官网:...
  • 网页中插入文本编辑

    千次阅读 2017-04-08 14:01:27
    网页中插入文本编辑器 http://kindeditor.net/demo.php 效果: 编辑器使用方法: 1. 下载编辑器下载 KindEditor 最新版本,下载之后打开 examples/index.html 就可以看到演示。下载页面: ...
  • python学习——使用文本编辑

    万次阅读 2018-08-21 15:57:05
    所以,实际开发的时候,我们总是使用一个文本编辑器来写代码,写完了,保存为一个文件,这样,程序就可以反复运行了。现在,我们就把上次的'hello, world'程序用文本编辑器写出来,保存下来。 有哪些比较适合的文本...
  • JAVA:一个简易的文本编辑

    千次阅读 2019-04-12 19:21:36
    Today,我们来做一个JAVA的文本编辑器,使用的基础知识有AWT,I/O流,异常处理,数组,循环,编辑器是Eclipse IDE,编译环境为javaSE-10,该文本编辑器有以下九项功能 1.可以新建文本文件 2.可以进行页面设置 3....
  • 原生js手撕轻量级文本编辑

    千次阅读 2018-09-14 13:11:13
    原生js实现轻量级文本编辑器 最近使用原生js写了一个轻量级的文本编辑器,那么今天就来说一下 从构想到完成究竟是怎么实现的, 怎么来对他进行使用, 踩到的坑且是怎样解决的 经常 使用Markdown来写博客,一直...
1 2 3 4 5 ... 20
收藏数 802,063
精华内容 320,825
关键字:

文本编辑