Question

我可以使用以下scriptlet来编辑网页

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

但在完成我想要做的编辑后（例如，对于手册的屏幕截图），如何将页面状态恢复到正常的不可编辑状态？我尝试将true和0分别更改为false和1，但无济于事。

Answer 1

您可以通过将命令更改为以下

来退出编辑模式

javascript:document.body.contentEditable='false'; document.designMode='off'; void 0

我已经更新了我的答案，包括我的答案的简单工作示例，在chrome，safari和firefox中测试过。

<input type="button" value="Edit" onclick="javascript:document.body.contentEditable='true'; document.designMode='on'; void 0"> <input type="button" value="Disable Edit" onclick="javascript:document.body.contentEditable='false'; document.designMode='off'; void 0">
<div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel arcu eget risus iaculis imperdiet vel in leo. Pellentesque commodo nibh tellus. Morbi ultricies consectetur fermentum. Aenean eu vehicula libero. Nam pellentesque lobortis dui, ut rutrum neque suscipit at. In tincidunt justo sit amet faucibus bibendum. Sed viverra dignissim nulla, ac lacinia orci bibendum at.</p><p>Mauris enim ex, mattis et augue nec, maximus dignissim leo. Donec maximus interdum blandit. Phasellus porta accumsan est, ac sagittis arcu sollicitudin quis. Donec consequat velit at congue congue. Suspendisse feugiat molestie neque, id condimentum tellus. Vestibulum fringilla libero nec iaculis pellentesque. Cras mollis risus eros, eget mollis augue molestie ac. Nulla tincidunt metus at pulvinar cursus.</p></div>

Answer 2

您需要删除contenteditable属性。

var demo_editable = document.getElementById('demo-editable');
var demo_button = document.getElementById('demo-button');

demo_editable.setAttribute('contenteditable',true);

demo_button.onclick = function() {
  delete demo_editable.removeAttribute('contenteditable');
}

<div id="demo-editable">This is editable</div><button id="demo-button">Make not editable</button>

或者您可以将该属性设置为false。

var demo_editable = document.getElementById('demo-editable');
var demo_button = document.getElementById('demo-button');

demo_editable.setAttribute('contenteditable',true);

demo_button.onclick = function() {
  delete demo_editable.setAttribute('contenteditable',false);
}

<div id="demo-editable">This is editable</div><button id="demo-button">Make not editable</button>

Answer 3

尝试一下：

按F12键检查页面
右键单击<html>标签的最上方元素
从出现的上下文菜单中，选择“编辑为HTML”
将焦点放在可编辑的HTML上，然后按Ctrl + A以全选
按Ctrl + C将页面的HTML复制到剪贴板中
对内容可编辑部分进行编辑
重复步骤1至4
Ctrl + V组合键将已编辑的HTML粘贴到页面的原始HTML

使用javascript技巧编辑网页 - 如何＆＃34; unedit＆＃34;？

3 个答案: