一行代码，浏览器变临时编辑器

这是 Jose 在CoderWall 分享的一个小技巧：在浏览器地址栏中输入下面这行代码，回车即可把浏览器变临时编辑器。

为什么它能奏效？

这是用了数据URI的格式（Data URI’s format），并告诉浏览器渲染 HTML。不过
contenteditable 是 HTML5 的一个新全局属性，所以这个小技巧只能用于支持该属性的现代浏览器。（IE
8 – 就不行了 :( ）





 

并非只能纯文字，也可粘贴图片（如下图）。赶紧复制粘贴那行代码，然后回车，来试试呗。





有趣的内容还在下面

不少程序员受
Jose 的启发，开始对这行代码加工改造了。

● jakeonrails 童鞋改成了一个支持 Ruby 代码高亮的编辑器  https://gist.github.com/4666256





代码：

● slawdan 提示说：如果把上面的 

ace/mode/ruby 改成 

ace/mode/python

，那么就得到了一个
Python 版的编辑器咯。其他语言依此类推。

● jdkanani 后来的补充：（2013-1-30
22:06:48 更新）

不想复制粘贴代码的懒汉童鞋，可以直接戳下面这些链接：

Ruby 编辑器 、Python
编辑器、PHP 编辑器 、Javascript
编辑器 、Java 编辑器 、C/C++
编辑器 （也可把这些链接作为浏览器书签收藏哦。）

 

● montas 的改造：You can use textarea and make it “invisible” if you want autofocus.

或直接戳 链接。

 

● bgrins 的改造：编辑内容时，自动变换背景颜色；停止后变换白色。

 

● fvsch 的改造：

或直接戳 链接。

 

这些个奇淫技巧就到此为止吧。

 

编译整理：伯乐在线 - 黄利民

文章链接：http://blog.jobbole.com/32823/

 【如需转载，请在正文中标注并保留原文链接、译文链接和译者等信息，谢谢合作！】