Javascript即时编辑页面内容

时间:2008-10-06 23:19:04

标签: javascript html editing

我正在撰写一篇关于编辑页面的文章,以便亲自挑选您真正想要打印的内容。有很多工具(比如“打印你喜欢的”),但我也找到了这个脚本。有人知道吗?我还没有找到任何文件或参考文献。

javascript:document.body.contentEditable='true'; document.designMode='on'; void 0

谢谢!

3 个答案:

答案 0 :(得分:9)

contentEditable属性是你想要的 - 它由IE,Safari(以及作为副产品的chrome)支持,我认为 firefox 3(唉不是FFX2)。嘿,它也是HTML5的一部分:D

Firefox 2支持designMode,但仅限于单个框架,而contentEditable属性适用于单个元素,因此您可以让您的可编辑内容更好地与您的页面一起播放:D

[编辑(olliej):删除示例,因为contentEditable属性没有超过SO的输出过滤器(尽管在预览中工作):(]

[编辑(olliej):我发起了一个非常简单的demo来说明它的行为]

[编辑(olliej):所以是的,链接演示中的contentEditable属性在IE,Firefox和Safari中运行良好。调整大小是一个css3功能,只有webkit似乎支持,并且IE正在尽力打击几乎所有的CSS。 叹息

答案 1 :(得分:1)

document.designMode在IE 4+(显然是以它开始)和FireFox 1.3+支持。 你打开它,你可以在浏览器中编辑内容,这是非常可笑的。 我之前从未使用它,但听起来它非常适合手工挑选可打印的信息。

编辑说:它似乎也适用于谷歌浏览器。我只在Chrome和Firefox中测试过它,因为那些是我有javascript控制台的浏览器,所以我不能保证它在Internet Explorer中工作,因为我从未亲自使用它。我的理解是,这是其他浏览器选择的IE浏览器,目前还没有任何标准,所以如果Firefox和Chrome支持它但IE停止了,我会感到惊讶。

答案 2 :(得分:0)

它可以在可用的情况下启用浏览器的内置编辑功能。如上所述,designMode是Gecko,contentEditable是其他所有人(并添加到Gecko 1.9)。这些功能被用作(几乎?)每个使用HTML / Javascript构建的WYSIWYG编辑器的基础。如果您只是输入/删除,则不必再提供您提供的脚本了。 (尽管如此,“无效”的所有内容都是多余的。)

有关如何在应用程序中使用这些功能的文档,最好的参考是Mozilla的Midas specificationMSDN也可能有用......)。