HTML在线编辑器任意设置字号大小

HTML在线编辑器相信大家见得多了，有些流行的在线编辑器具有很丰富的功能。但美中不足的是，现有的HTML在线编辑器设置字号大小通常只限于1-7号字而已，不能更好地满足人们的需要。能不能实现像Word那样任意地设置字号大小呢？经过长时间的攻关，Bound0终于可以肯定地回答这个问题了，呵呵呵！请大家共同分享此“Eureka之喜悦”吧！
我们通常所见的内嵌在网页中的HTML在线编辑器，其核心本质是一个IFRAME
例如：

<IFRAME id="Editor" Name="Editor" style="WIDTH: 550; HEIGHT: 480"></IFRAME>

令 Editor.document.designMode="ON";
此时这个IFRAME就是一个设计模式的HTML编辑器了，可以通过脚本

Editor.document.selection.createRange().execCommand(command)

对选中的内容执行command，进行编辑操作。
由于浏览器本身提供的编辑功能非常有限，因此现在流行的HTML在线编辑器大都进行了一些扩展。（在本版精华中收集的PiscesTextEditor就是此类技术的集大成者之一。）
在本文发表之前，HTML在线编辑器在设计模式下的字号（字体大小）任意设定功能尚无成功实现，本文所述技术不仅在此方面实现了零的突破，还对HTML在线编辑器的其他扩展功能的实现作出了广泛的启示。
[前人的误区]
现在流行的HTML在线编辑器的功能可以说已经很丰富了，为什么唯独任意设置字体大小这个看起来并不华丽的功能没有被做出来呢？让我们先来了解一下其中的原因好了：
假设编辑区的HTML内容（Editor.document.body.innerHTML）是

<H1>逍遥主义者的宣言</H1>
<H3>十个小老头
<BR>朱氵太子
</H3>
<P>我们不是败家浪子，我们从不游手好闲；我们不是无用书生，我们从不怨天忧地；我们不是嬉皮士，我们从不玩世不恭；我们不是妄想家，我们从不脱离实际；我们不是阿Q，我们从不麻木颓废；我们不是狂人，我们从不争风吃醋。我们是创造者，我们是改变者，我们是革命者。我们不是在不幸中去幻想幸福的人，我们甚至不是去追求、寻找幸福的人，我们是自己制造幸福的人，我们是快乐的发源者。首先，在我们经历必当经历的经历时，我们不允许自己不快乐！这就是，逍遥主义的真谛。</P>
<P><BIG>将你的梦打开，填进我的希望。谁都不必介怀，一点点的分量。面对别人述说，命运烛转轮回，世间天空海阔，种种因缘寂晦……</BIG></P>

假设选中的是红色的部分，则
Editor.document.selection.createRange().htmlText的内容是

<P>者。我们不是在不幸中去幻想幸福的人，我们甚至不是去追求、寻找幸福的人，我们是自己制造幸福的人，我们是快乐的发源者。首先，在我们经历必当经历的经历时，我们不允许自己不快乐！这就是，逍遥主义的真谛。</P>
<P><BIG>将你的梦打开，填进我</BIG></P>

看见多出来几个蓝色的标签了吧？产生这种现象是因为：“任何时候，document.selection.createRange().htmlText取出来的html代码都是完整成对的，即使当前选中的内容横跨了几个不同的标签”（卖坏梨语），所以IE会自作主张地把不完整的标签补齐。
就是因为这个原因，当选中的内容在Editor.document.body.innerHTML中对应的代码包含不完整的标签时，在Editor.document.selection.createRange()上做pasteHTML可能会吃不进去（有不完整的<table>等时），或者出现明显的BUG。
而现在的HTML在线编辑器所提供的除了基本的Editor.document.selection.createRange().execCommand(command)之外的各种功能几乎都是通过在Editor.document.selection.createRange()上做pasteHTML来实现的。所以字号的自由设定才始终没能实现。
[解决之道]
一切关于“问题的解决之道”的方 * 都不外乎是“变通”二字的某种讲法。既然这个功能不适宜用Editor.document.selection.createRange()的pasteHTML()方法来实现，我们就不用它好了。一个变通的想法是：通过改变Editor.document.body.innerHTML的全局来实现。
很显然，至少在理论上，整体改变Editor.document.body.innerHTML可以实现任何我们想要的HTML编辑效果。