编辑器

最近正在研究开发一款在线web编辑器架构，这是一款真正傻瓜式的web编辑器，可以在正常浏览页面的情况进行编辑，经过测试，对于一般网页页面来说非常好用方便，操作更简单。 一般的在线web编辑器虽说提供了可视化操作，但通常只能用于编辑指动态内容部份，如内容文章，对于那些非常复杂的内容发布系统的页面模板，基本是没用的。绝大部份系统对于专业人员来说，操作起来也是比较困难的，对于非专业人员，根本操作不了，非专业人员想管理一个个人网站，如比较简单的个人博客，想修改模板或模板的部分内容，绝大部份人都是无法办到的，只能发发文章，甚至改个博客名称之类的都难弄。为什么就不能直接在页面上修改呢？前阵子突然产生了这样的想法，于是着手研究开发了一下，发现是可行的，对于一般的系统或者配套系统来说非常实用，以下以测试系统为例简单介绍下，下面是创建工程时vs自带的页面，页面是加上了我设计的在线编辑器框架的，后面我会编辑一下. 我的框架经过封装成控件，引用很简单，只需在页面上加上，如我的工程引用如下： <easy:OnLineWebEditor ID="OnLineWebEditor2" runat="server" /> 或者在页面相关程序里new一下对象 protected void Page_Load(object sender, EventArgs e) { new OnLineWebEditor(); }

在入门篇中我们了解到如何使用C#调用hhc.exe来生成CHM文件，而在中篇中，我们进行了CHM反编译和将CHM文件转化为Word。在下篇中，我将简单介绍下这些技术在如何应用在实际项目中。 CHM电子书的优点： 1、CHM最好的地方就是对网页、图片的支持--实际上该格式类似于一个简版的IE浏览器，有目录、索引。 2、CHM的全文检索最为方便的是结果的高亮显示。 同时，CHM格式的电子书同样有一些缺点：首先系统必须是windows系统，而且必须是98以上的系统并装有ie3以上的浏览器，不能加批注。 我们可以看到一般软件的帮助文档一般都是CHM格式的，这也是CHM电子书流行的原因之一。 下面来简略讲讲如何在实际中应用前两篇提到的技术。 1.我们可以制作一个自己的CHM编辑器，当然编译器仍然是hhc.exe，我们只是做了下包装 2.可以定义自己的CHM模板制作出漂亮的CHM电子书，前提是模板是HTML格式的 3.可以结合BHO编程，将自己喜欢的网页内容直接保存为CHM电子书格式，或者先保存在本地，然后统一编译为CHM电子书 4.将现有的CHM电子书反编译为html格式的文件，并可以将CHM转换为word格式。 以上思路仅供参考，如果大家有好的想法，可以留言给我。 下面就第一点进行实现。 缘由 我发现一些编辑器不能插入格式化的代码，即插入的代码不能很好的显示器格式，没有语法着亮功能

原创文章，转载请注明出处并保留地址。原文地址： http://www.cnblogs.com/muge10/p/6723894.html 先放上最后的效果，这是点击图片以前： 这是点击图片以后： 非常清晰，一目了然，就算是小白用户也明白发生了什么。挺好的。 最近在做编辑器相关的东西，遇到一个需求，用户在编辑器中插入或者粘贴的图片要支持点击以后，可以按 Backspace 键或者 Delete 键删除掉。 刚开始拿到这个需求的想法是调用编辑器自带的删除图片方法删掉图片，但后来查看源码发现这个方法是编辑器内部方法，并没有暴露出来，于是第一个思路走不通了。 第二个思路是在编辑器的顶层容器里监听 keyup 事件，然后判断是否是两个删除键，如果是就拦截，然后找到当前点击的图片，手动删掉。 实际上这也是行不通的，原因有二。首先，这个删除是没法阻止的，因为事件的监听是在顶层父元素里，这时候阻止其实是阻止掉事件在顶层容器上的效果，而不是在发生元素上的效果。所有涉及到事件冒泡的地方，在父容器上阻止效果都是不能达到目的的，只能在事件最开始发生的元素上阻止。 然后，当按下删除键的时候，之前点击的图片已经不是点击状态了，已经拿不到了。因为取消选择在前，删除在后。 后来忽然意识到，想要的效果其实就是点击图片的时候选中图片，就像用户自己选中网页中一段内容那样选中那张图片就好了

正所谓“工欲善其事，必先利其器”，对Web开发人员来说，好工具的使用总会给人带来事半功倍的效果。   下面来说一下几种常用的开发工具： HBuilder Atom Sublime Text Visual Studio Code WebStorm   如果是初学者的话，我建议先使用HBuilder（记事本也可以，不过需要你将元素标签属性记牢固），很容易上手，熟练后在使用Visual Studio Code或者是Atom，这两个开发工具功能很强大，支持多种插件的安装，比如C/C++、Python、Java等等。   当下，有三种主流的编辑器，分别为Visual Studio Code、Sublime Text和Atom，WebStorm也挺受欢迎的，下面简单的说一说它们各自的优缺点： Atom的优缺点   首先我们来说一说Atom，Atom代码编辑器支持Windows、MaC、Linux三大桌面平台，完全免费，并且在GitHub上开放了全部的源代码。具有简洁和直观的图形用户界面，它支持宏，自动完成分屏功能，集成了文件管理器。经过开发团队的长时间的迭代开发和不断改进，Atom正式版编辑器在性能和稳定性都有着显著的改善。 主要优点： 开发维护团队强大，而且是开源项目，因此修复bug速度快，生态圈成长速度快。 快捷键支持特别好，熟悉了各种快捷键后可以成吨提高生成效率。 比较稳定，很少出现崩溃

前段时间看到动作编辑器Sprite更新了，名为Spx2011。加了多图和支持透明像素的功能。可是想不到竟然要收费了，听到这个消息，我心里很是愤慨，忍不住要骂一句：卑鄙。我是个文化人，我所能想到的最脏的词语大抵就是这个词了。 Sprite以前的版本我也用了一两年，感觉还不错（应该是我没用过别的编辑器的缘故吧）。但是一大堆的Bug在里面，我们好像还只能默默的忍受，因为据说作者是个高傲的人。 更早之前有认识另一个做动作编辑器的高手，这是个小心的低调的程序员。有跟他小小的交流动作编辑器这一块。我跟他提到Sprite，他一堆的不屑，说：界面差，代码结构差。后来他有给我看他写的游戏编辑器，给我的感觉就是惊艳！（截图如下：） 这是个游戏编辑器，他把动作编辑器，地图编辑器等游戏工具整到这一个工具里了。界面很美观！有资源管理器，管理方便；有控制台输出，有打包，编译，甚至有直接运行的功能！这样的编辑器才有资格在市面上拿出来卖钱吧？那些其他的不入流的工具们，麻烦你们把你们那丑陋的头缩回去吧！ 本来我之前已经在写动作编辑器了，主体结构也搭的差不多了，后来看到这个霸气的工具，心里为之一惊，于是把我的工具重新规划修改了一下。加了项目管理， 日志，网络管理几个大的模块，其实也是跟这个差不多，也是要把动作编辑器，地图编辑器等游戏工具整到一起。不过没这么多细的功能。 我这个编辑器是我利用空闲时间写出来的

常规html查看过程:修改html文件-->浏览器中刷新-->修改html文件-->浏览器中刷新 使用livereload后:修改html文件,浏览器自动刷新 可以简单的理解为livereload就是让浏览器自动帮你刷新html本地文件 也许你会说网络上有很多livereload的使用方法,最开始浏览那些信息花了我一个多小时,但是我的LiveReload依然没有工作 问题出在哪里? 实际上,LiveReload包括两部分内容:你需要同时为编辑器和浏览器安装livereload插件,两个插件的关系是server-client 基本上各大编辑器的插件库中都能找到LiveReload 至于浏览器,你也可以在Chrome和Safari的插件中心找到它 对于初学者而言,Safari的LiveReload并不是那么合适,因为它只支持URL而不支持本地html文件.当然,如果你知道如何使用小型sever工具来发布你的网页,使用Safari也可以 以下是步骤,使用Chrome和VSCode作为示范: 为Chrome安装LiveReload 如果无法打开插件中心,可以去寻找离线安装包.安装完成后,请在扩展管理中确认启用插件并开启本地文件支持(这一点很重要) 点我下载离线安装包 为你的编辑器安装LiveReload插件,在插件中心直接搜索安装即可 如何使用?默认情况下

sed: Stream EDitor 行编辑器 (全屏编辑器: vi) sed: 模式空间 默认不编辑原文件，仅对模式空间中的数据做处理；而后，处理结束后，将模式空间打印至屏幕。 sed [ options ] 'AddressCommand' file ... Options： - n : 静默模式，不再默认显示模式空间中的内容 - i : 直接修改原文件 - i . bak 备份原文件 - e SCRIPT - e SCRIPT : 可以同时执行多个脚本，多点编辑 - f / PATH / TO / SED_SCRIPT 从指定文件中读取脚本 sed - f / path / to / scripts file - r : 表示使用扩展正则表达式 Address： 1 、StartLine , EndLine 比如 1 , 100 $：最后一行 2 、 / RegExp / / ^ root / 匹配以root开头的行 3 、 / pattern1 / , /pattern2/ 第一次被pattern1匹配到的行开始，至第一次被pattern2匹配到的行结束，这中间的所有行 4 、LineNumber 指定的行 5 、StartLine , + N 从startLine开始，向后的 N 行； Command： d : 删除符合条件的行； p : 显示符合条件的行； a

这里写自定义目录标题 欢迎使用Markdown编辑器 新的改变 功能快捷键 合理的创建标题，有助于目录的生成 如何改变文本的样式 插入链接与图片 如何插入一段漂亮的代码片 生成一个适合你的列表 创建一个表格 设定内容居中、居左、居右 SmartyPants 创建一个自定义列表 如何创建一个注脚 注释也是必不可少的 KaTeX数学公式 新的甘特图功能，丰富你的文章 UML 图表 FLowchart流程图 导出与导入 导出 导入 欢迎使用Markdown编辑器 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。 新的改变 我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客： 全新的界面设计 ，将会带来全新的写作体验； 在创作中心设置你喜爱的代码高亮样式，Markdown 将代码片显示选择的高亮样式 进行展示； 增加了 图片拖拽 功能，你可以将本地的图片直接拖拽到编辑区域直接展示； 全新的 KaTeX数学公式 语法； 增加了支持 甘特图的mermaid语法 1 功能； 增加了 多屏幕编辑 Markdown文章功能； 增加了 焦点写作模式、预览模式、简洁写作模式

使用足够简单，功能足够强大，体验足够优秀 之前有一个系列文章介绍我在运维系统开发过程中用到的那些顺手的前端插件，总共发了四篇文章介绍了三个非常棒的插件，分别是 bootstrap-duallistbox 、 select2 和 datatables ，今天再更此系列，让好东西让更多的人知道，受益！ 本次介绍ace.js，这是一个用JavaScript编写的独立代码编辑器。支持超过120种语言的语法高亮，超过20个不同风格的主题，同时还支持实时语法检查，自定义快捷键绑定，代码折叠，搜索替换，自动缩进等等功能 项目地址为： https://ace.c9.io 我主要用它来替换表单中的textarea标签，以及实现在网页上修改文件的展示，例如之前 配置中心Kerrigan 文章中讲到的web端修改配置文件就用了ace 基本使用 这个项目引入非常简单，只需要引入一个ace.js文件即可，然后实例化即可 // 引入js文件 <script src="/static/js/ace.js"></script> <pre id="content" style="height:620px"></pre> // 实例化编辑器 var editor = ace.edit("content"); github上除了源码文件外，ace还贴心的准备了编译好的项目文件，以方便用户使用

vi编辑器简介 什么是vi vi编辑器的操作模式 vi编辑器的3种基本模式 在vi编辑器中光标的移动 移动光标位置的键与光标移动间的关系 进入插入模式 从命令行模式进入插入模式的命令 在命令行模式下删除与复制的操作 删除与复制命令 粘贴命令 复原和重做命令 扩展模式与文件的存储和退出 扩展模式下常用的命令 快速移动光标在文件中的位置 快速移动光标在屏幕中的位置 【本节内容】 1. vi编辑器简介 1) 掌握vi的定义：vi是一个UNIX和Linux系统内嵌的标准正文（文字）编辑器，它是一种交互类型的正文编辑器，它可以用来创建和修改正文文件。 2. vi编辑器的操作模式 1) 掌握vi编辑器的3中基本模式： a) 命令行模式：vi的默认模式。在这一模式中，所有的输入被解释成vi命令，可以执行修改、复制、移动、粘贴和删除正文等命令，也可以进行移动光标、搜索字符串和退出vi的操作等。 b) 编辑模式：在编辑模式中，可以往一个文件中输入正文。在这一模式下，输入的每一个字符都被vi编辑器解释为输入的正文。使用ESC键返回命令行模式。 c) 扩展模式：在一些UNIX系统上也叫最后一行模式。在这一模式下，可以使用一些高级编辑命令，如搜寻和替代字符串、存盘或退出vi编辑器等。要进入最后一行模式，需要在命令行模式中输入冒号（：），冒号这一操作将把光标移到屏幕的最后一行。 3.