CSDN复制解禁
省流不看：F12开发者工具终端执行document.designMode='on'。
原理嘛，就是利用浏览器的DOM启用设计模式来允许选择元素。关于DOM的详细介绍在下边：
DOM简介
在浏览器中，document对象是一个非常重要的对象，它代表了当前页面的文档。document.DesignMode属性是document对象的一个属性，它用于指定页面的设计模式。
设计模式主要有两种：
- 模式（常态）：页面在正常模式下运行，用户可以正常查看和操作页面元素。
- layouter 模式（布局模式）：页面在 layouter 模式下运行，用户无法正常查看和操作页面元素，只能查看页面的布局和结构。
这两种设计模式主要用于开发者调试和测试网页布局。通常，开发者会在开发过程中将页面切换到 layouter 模式，以便更好地查看和调整页面布局。当开发完成后，页面会自动切换回正常模式。
在页面加载时，浏览器会自动设置document.DesignMode属性的值。开发者也可以通过 JavaScript 代码来修改这个属性的值，从而实现在不同设计模式之间的切换。
除了DesignMode属性之外，document对象还有许多其他的属性和方法，它们可以用来完成各种网页开发任务。例如：
document.body：表示页面的主体部分，包含了所有的 HTML 元素。document.title：表示页面的标题，通常显示在浏览器的标签页上。document.getElementById()：通过元素的 ID 获取指定元素。document.getElementsByClassName()：通过元素的类名获取指定元素集合。document.getElementsByTagName()：通过元素的标签名获取指定元素集合。document.querySelector()：通过 CSS 选择器获取指定元素。document.querySelectorAll()：通过 CSS 选择器获取指定元素集合。
此外，document对象还提供了许多用于操作 DOM 的方法，如createElement()、appendChild()、removeChild()、insertBefore()等，以及用于处理事件的方法，如addEventListener()、removeEventListener()等。
总之，document对象是浏览器中最重要的对象之一，它为网页开发者提供了丰富的属性和方法，使得开发者可以更加方便地完成各种网页开发任务。