来一发TinyEditor:简便且易用的html所见即所得编纂器

一些公司联合起来，成立了一个叫做WebHypertextApplicationTechnologyWorkingGroup（Web超文本应用技术工作组-WHATWG）的组织。网页制造poluoluo文章简介：前几日曾给人人先容过一款国产的xhtml编纂器，明天要给人人保举的TinyEditor，是外洋出名Web计划博客leigeber.com刚公布的一款简便且易用的html所见即所得编纂器。

登录/注册后可看大图

前几日曾给人人先容过一款国产的xhtml编纂器，明天要给人人保举的TinyEditor，是外洋出名Web计划博客leigeber.com刚公布的一款简便且易用的html所见即所得编纂器。
TinyEditor有以下特性

• 它利用Javascript编写，不依附于别的类库
  
• 这是一个轻量级的编纂器，要挪用的文件唯一8kb
  
• 它能够处置年夜多半的html格局化需求，而且内置的功效使得天生的标志只管简便
  
• 编纂器顶用到的小图标利用了CSSSprite手艺，削减了http毗连
  
• 在支流扫瞄器中测试经由过程
  
• 可团体或贸易项目中利用，遵守creativecommonslicense
  

上面来看怎样利用：
1，在网页文件中援用TinyEditor供应的js文件和css文件
2，在网页文件中增加编纂器所必要的标签，实在就是个textarea，以下

1. <textareaid="input"style="width:400px;height:200px"></textarea>

复制代码

注重textarea中界说的长宽也就是编纂器的巨细。
3，经由过程剧本初始化编纂器，并设置各类参数，以下：

1. newTINY.editor.edit(editor,{id:input,//(必需)下面第二步中界说的textarea的idwidth:584,//(选填)编纂器宽度height:175,//(选填)编纂器高度cssclass:te,//(选填)编纂器的class，用来经由过程css把持款式controlclass:tecontrol,//(选填)编纂器上按钮的classrowclass:teheader,//(选填)编纂器按钮行的classdividerclass:tedivider,//(选填)编纂器按钮间支解线的款式controls:[bold,italic,underline,strikethrough,|,subscript,superscript,|,orderedlist,unorderedlist,|,outdent,indent,|,leftalign,centeralign,rightalign,blockjustify,|,unformat,|,undo,redo,n,font,size,style,|,image,hr,link,unlink,|,cut,copy,paste,print],//(必需)要依据必要在编纂器上增加按钮控件,个中|代表功效按钮间的竖支解线，n代表按钮行间的支解线footer:true,//(选填)是不是显现编纂器底部fonts:[Verdana,Arial,Georgia,TrebuchetMS],//(选填)编纂器中可选择的字体xhtml:true,//(选填)编纂器天生xhtml仍是html标志cssfile:style.css,//(选填)要为编纂器附加的内部css文件content:startingcontent,//(选填)设置编纂器编纂地区中的初始内容css:body{background-color:#ccc},//(选填)设置编纂器编纂地区背景bodyid:editor,//(选填)设置编纂地区IDfooterclass:tefooter,//(选填)设置编纂器底部classtoggle:{text:源代码,activetext:可视化,cssclass:toggle},//(选填)设置源代码扫瞄切换笔墨，及切换按钮的classresize:{cssclass:resize}//(选填)设置编纂器巨细调剂按钮的class});

复制代码

能够说的上是高度可设置了，并且设置项都对照明晰。
在TinyEditor的实践使用中，必要注重的是，在提交编纂器内容之前，必定挪用instance.post()函数，以确保编纂地区中最新的可视化内容转化为标志文本。
检察示例：http://sandbox.leigeber.com/tinyeditor/
下载：TinyEditor源码及示例文件
本文http://css9.net/javascript-wysiwyg-editor-tinyeditor/
</p>
使用HTML5也是断断续续的有些历史了，但是没有系统的总结过，最近发现公司的图书馆有不少藏书，

学Dreamweaver技术的过程其实是一个增加信心的过程。