当你将页面设置为设计模式时，你可以直接在浏览器页面内编辑页面内容，这对于测试一些原型或检查新标题的外观非常方便。
**你如何启用它？**打开 DevTools 控制台，然后输入：
document.designMode = 'on'要关闭设计模式，只需要刷新页面或键入：
document.designMode = 'off'你可以编辑、删除文本，还可以拖动图像来重新定位它们。
另一种方式是，通过在 body 元素上添加 contentEditable 属性可以触发相同的结果。也可以通过 JS 动态设置，如下所示：
document.body.contentEditable = true
// 关闭内容可编辑状态
document.body.contentEditable = false几乎所有浏览器都支持此功能，包括 IE。
由于它对任何内容都可以编辑，所以有必要对一些用户输入进行校验，避免带来一些安全隐患。