最近从头开发了一个简单实用的页面可视化编辑器，感觉从中学到了不少东西。功能就是用一个脚本把前端页面的某些块搞成可以编辑的状态。遇到了几个主要的问题，让我印象最深刻。汇总一下吧：
Firefox 3+开始支持contenteditable属性，这让可视化编辑变得简单。想要“可视化”一个节点，只要给它赋上contenteditable属性即可。如果你想让某一个页面上实现简易的在线编辑功能，那么思路就是：
1. 前端页面，通过JavaScript给需要编辑的节点赋上contenteditable属性，为true。注意这里要用o.contentEditable = “true”，用setAttribute在IE下设置不成功。
2. 用js生成一个按钮工具条，包括一些常用的按钮，例如加粗、修改链接等等。用document.execCommand来执行一些常用的命令，但可用的不多，只有createlink, unlink, bold等。需要的话，还是自己写。
3. 需要弹出对话框的指令，例如修改链接，用行内对话框（inline popup）来实现，不用window.open。一来比较方便，二来可以避免某些浏览器把弹窗block掉。