« 解决Windows系...正则表达式中的特殊字符一览 »
RSS订阅[ＩＴ┆技术类文档]分类:ＩＴ┆技术类文档

WEB在线编辑器原理

Author:Aaron | Update:2006-9-28

从eWebEditor到 FCKeditor现在有很多很多的在线编辑器了，功能都很强，很多，但是其基本原理却都很简单

我发现的编辑器主要有3大类，我总结下，把各自的优缺点都写下

  1. 直接用textarea 标签
    优点：速度快，提交方便，可以用UBB标签来弥补不能所见所得
    缺点：不直观，功能非常少
  2. 用 DIV或者TABLE的CONTENTEDITABLE 标签，属性来让一个区域可以编辑
    优点：可以很直观，可以做各种效果
    缺点：此标签在mozilla下不可用，只适合IE浏览器，且对js要求高
  3. 用iframe或者frame的中的document的document.designMode ="On" 来实现可编辑
    优点：具有上面第二条的全部优点，并且还多浏览器比如ff等支持
    缺点：对js要求高

下面是第三点的一个简单例子代码
<iframe MARGINHEIGHT="1" MARGINWIDTH="1" width="400" height="100"></iframe>
<script language="JavaScript">
<!--
//get frame object
frameobj=frames[0];
bodyHtml="<head>\n<style type=\"text/css\">body {font: 10pt verdana;}</style>\n</head>\n<BODY bgcolor=\"#FFFFFF\" MONOSPACE>"
bodyHtml += "<style>\np{margin:0px;padding:0px;}\n</style>\n</body>";
frameobj.document.open();
frameobj.document.write(bodyHtml);

frameobj.document.close();
frameobj.document.designMode="On";
//-->
</script>

文章来源:互联网
Permalink:http://blue.fhuang.com/blue/Blog/69.asp
TrackBacks:
Add to Favorites | Comments:0 |TrackBacks:0 | Hits:... « 上一篇 | RSS订阅 | 下一篇 »
　　The comments are loading...
Category »
Google
Hot Blogs »
Recommend Blogs »
Recent Comments »
Links »
Copyright©2003-2007 Aaron. Some Rights Reserved. Skin Reserved by Aaron | 京ICP备05061640号
Powered by ABlog V3.1 | Processed in 0.000000 Seconds. | 0 Queries
Top