如何使用JavaScript打开开发人员工具

Question

编辑的答案：在大多数浏览器中，有一个名为"Inspect"或"Inspect元素"的函数可以打开开发工具。这允许您使用许多不同的工具，如更改DOM、运行JavaScript、查找链接文件的源、更改CSS等。这个工具集可以用来乱搞，也可以用于其他目的，比如在线考试作弊。这就是许多学校阻止学生使用该功能的原因。作为一个狂热的学习者和程序员，我决定使用其他方法。我想知道我是否可以使用JavaScript打开开发者工具面板，尽管我猜测JavaScript不能对浏览器做出反应，只能对页面做出反应。如果开发者工具菜单有一个JavaScript替代品，请告诉我。谢谢你抽出时间，我真的希望我能得到问题的回复。对于任何想知道的人来说，我只能通过书签与页面进行交互。

Answer 1

这里是

javascript:(function()%7B(function() %7Bvar x %3D document.createElement("script")%3Bx.src %3D "https%3A%2F%2Fcdn.jsdelivr.net%2Fgh%2FSnowLord7%2Fdevconsole%40master%2Fmain.js"%3Bx.onload %3D alert("Loaded Developer Console!")%3Bdocument.head.appendChild(x)%3B%7D)()%7D)() 

粘贴到书签的url部分，并根据需要命名。

Answer 2

如果这是一个自定义的Chrome版本，他们禁用甚至删除了该工具，那么你就无能为力了。

Chrome界面不受Javascript的控制，Javascript仅用于渲染。可以使用热键(Ctrl+Shift+J或I(、F12、右键单击元素或通过界面进行访问(如果已启用(。

Answer 3

尝试创建一个书签并将其命名为"Inspect Element"。然后将此代码分配给创建书签的URL部分：

javascript:void(myDiv=document.createElement('div'));void(myBody=document.getElementsByTagName('body')%5B0%5D);void(myDiv.style.background='url(http://www.andybudd.com/images/layoutgrid.png)');void(myDiv.style.position='absolute');void(myDiv.style.width='100%');void(myDiv.style.height='100%');void(myDiv.style.top='0');void(myDiv.style.left='0');void(myBody.appendChild(myDiv));