WEB在线编辑器原理

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

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

­

直接用textarea 标签 ­

优点:速度快,提交方便,可以用UBB标签来弥补不能所见所得 ­

缺点:不直观,功能非常少 ­

­

用 DIV或者TABLE的CONTENTEDITABLE 标签,属性来让一个区域可以编辑 ­

优点:可以很直观,可以做各种效果 ­

缺点:此标签在mozilla下不可用,只适合IE浏览器,且对js要求高­

­

用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>

你可能感兴趣的:(Web,浏览器,fckeditor,IE)