漫游的备忘录
转:html5中的contentEditable
2012-3-30 漫游
html5中,所有的元素都有这个contentEditable这个属性,只要把这个属性设置为true,那么这个元素就可以编辑了。这对于写简单的在线编辑器的人来说,无疑是个福音。

http://starkravingfinkle.org/blog/wp-content/uploads/2007/07/contenteditable.htm就是一个例子,整个页面只有25行就实现了基本的在线编辑功能。

如果你的浏览器比较旧,那么就没法用了。好在现在浏览器更新很快,最新的浏览器都支持这个特性。

只要你的浏览器支持contentEditable,就可以做下面的小实验:

在浏览器地址栏输入下面这一行,回车(注意大小写)

javascript:document.body.contentEditable=true;

然后就可以编辑页面的内容了。

这事怎么做到的呢?在地址栏输入javascript:...,回车后,浏览器将执行javascript脚本...。document当然是当前文档,body是页面主体,也就是整个页面的具体内容。让body的contentEditable为true,于是整个页面都可以编辑了。当然,别指望真的能修改服务器上的页面。你一刷新就什么都没了。不过骗骗门外汉还是可以的 —— 在美国国防部首页上面一阵乱改,然后说:“为了中美两国的友谊,我还是还原算了”,再点一下刷新。

上面的方法除了可以给门外汉炫耀以外,还有什么用没有?我到是想到了一个无聊的用处。有些人会通过修改网页截图来发布假消息取乐。修改截图要做好不是很容易,而直接改页面就简单多了。