在开发成产工作的过程中，开发人员无论是前端后端测试，对于开发人员工具都需要十分熟悉，以方便纠缠错误，但作为普通人，不是很熟悉计算机技术的情况下，对于开发人员工具这个名词会不由自主的产生排斥的反应，殊不知，在这个工具中，几个简单的选项，很有可能对于我们的日常上网体验有着巨大的提升。
开发人员工具的快捷键是F12，或者CTRL+SHIFT+I。（部分电脑现在按下F12会有键位冲突，我在我的办公电脑上面遇到了这个情况，按下F12会进入飞行模式）
接下来我将我日常生活中遇到的一些具有代表性的小妙招来列出：
1.某些网页不让我复制文本内容，但是我不得不摘取文中文字：
遇到这个问题时，我们一般情况下想要摘取文章或者部分好用的文本，但是我们发现复制需要充值会员或者登录账号才行，在现在的技术下，部分小伙伴可能会选择使用截图，然后AI转文字功能，但是转文字的弊端就是有一定可能把字转错，我们后期还得再过一遍确保无误。
使用开发人员工具，让一切文本无可遁形
首先我们打开开发人员工具，进入视野的是这样的界面
找到元素按钮
映入眼帘的就是一大串代码，这个界面的代码都是HTML语法的元素，也就代表这个网页中的所有信息，都是存放在这些元素当中的，我们所看到的一切信息，都是源自这里。
点击上方按钮
在点击之后，我们想要的一切文本内容都无所遁形，把光标放在我们想要提取的文字上面
接下来工具就会直接锁定到文本存储的代码位置，我们展开这一部分，就能直接看到这些文本，在这里就可以直接复制粘贴了。
同理，页面中的所有图片也是可以通过这个方法找到对应的url，直接下载。
2.测试网页中元素大小适配
在部分开发工程中，我们在使用vue/cocos creator/微信开发者工具制作出的界面是一个样子，但是放在网页或者不同型号的设备上面展开的样子是不一样的，很可能出现某些环节不适配的情况，所以我们可以点击这里
在这里调节尺寸
3.通过网络请求查看user-agent/token/接口信息
user-agent：这个元素我们通常会在网络爬虫中使用，为了让爬虫装成一个真人，而不是看到返回的结果是一个水壶。
进入网页后，点击网络按钮
多数情况下，你就能看到数条网络接口请求，点击任意一个
再点击标头界面，划到最下方，就能看到
把内容全部复制下来就可以。
token：token作为认证登录的安全密钥，我们在请求很多接口的时候都需要使用它来作为认证方式，通常，在我们登录认证之后，我们的浏览器就会自动存下一个有效期的token，我们可以在负载或者预览当中直接取得，不过不一样的网络接口存储的方式并不完全一致，部分接口由于不需要token，所以没有信息。
一般情况下都是存在policy当中
接口信息：我们在预览或者响应当中就可以看到
不过响应当中的更加规范，是标准的json格式，我们如果想要对这个地址进行请求，得知需要的接口接收信息，就可以直接在这里看到
扫一扫
2216
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
