您的功能键在Chrome DevTools中的作用

The function keys on keyboards don’t get the love they used to, but depending on the app you’re running, they can still be handy. Chrome DevTools has some interesting features tucked away behind your function keys. Here’s what they do.

键盘上的功能键并没有像以前那样让人爱不释手，但是取决于您所运行的应用程序，它们仍然可以派上用场。 Chrome DevTools具有一些有趣的功能，隐藏在您的功能键后面。 这就是他们的工作。

什么是Chrome DevTools？ (What Is Chrome DevTools?)

As the name implies, Chrome DevTools is a set of developer tools in the Google Chrome browser. Chrome DevTools is often used to diagnose issues with web pages by digging through the HTML source code of the said web page.

顾名思义，Chrome DevTools是Google Chrome浏览器中的一组开发人员工具。 Chrome DevTools通常用于通过挖掘所述网页HTML源代码来诊断网页问题。

Chrome DevTools is also used to see what certain web pages may look like when specific changes are implemented. Developers can actually do this by editing the HTML of their page directly in DevTools. In fact, you can change what any site looks like. Of course, these aren’t changes that anyone else except you can see.

Chrome DevTools还用于查看实施特定更改后某些网页的外观。 开发人员实际上可以通过直接在DevTools中编辑其页面HTML来做到这一点。 实际上，您可以更改任何网站的外观 。 当然，这些不是您可以看到的其他任何更改。

在Chrome DevTools中使用功能键 (Using the Function Keys in Chrome DevTools)

As with keyboard shortcuts, function keys can help you increase your output for certain tasks. Here’s what the function keys do in Chrome DevTools.

与键盘快捷键一样 ，功能键可以帮助您增加某些任务的输出。 以下是Chrome DevTools中的功能键。

Function Key	Description
F1	Displays the Settings menu. You can also show the settings menu by simply pressing “?”.
F2	Turns on the Edit as HTML function, allowing you to edit the selected element on the webpage.
F3	None
F4	None
F5	Does a normal reload of Chrome DevTools. Alternatively, use Ctrl+R. Use Control+F5 to do a hard reload. Alternatively, use Ctrl+Shift+R.
F6	None
F7	None
F8	Pauses (or resumes, if currently paused) script execution. Alternatively, use Ctrl+\.
F9	None
F10	Steps over the next function call. Alternatively, use Ctrl+’.
F11	Steps into the next function call. Alternatively, use Ctrl+;. Use Shit+F11 to step out of the current function. Alternatively, use Ctrl+Shift+;.
F12	Opens the panel that you just previously used. Alternatively, use Ctrl+Shift+I. If you’re not currently in Chrome Devtools, you can use the F12 key to open it up in Chrome! This brings you straight to the Sources tab.

功能键	描述
F1	显示设置菜单。 您也可以通过简单地按“？”来显示设置菜单。
F2	打开“ 另存为HTML”功能，使您可以编辑网页上的选定元素。
F3	没有
F4	没有
F5	可以正常重新加载Chrome DevTools。 或者，使用Ctrl + R。 使用Control + F5进行硬重装。 或者，使用Ctrl + Shift + R。
F6	没有
F7	没有
F8	暂停(或恢复，如果当前已暂停) 脚本执行 。 或者，使用Ctrl + \。
F9	没有
F10	逐步执行下一个函数调用。 或者，使用Ctrl +'。
F11	进入下一个函数调用。 或者，使用Ctrl +;。 使用Shit + F11退出当前功能。 或者，使用Ctrl + Shift +;。
F12	打开您之前使用的面板。 或者，使用Ctrl + Shift + I。 如果您当前不在Chrome Devtools中，则可以使用F12键在Chrome中打开它！ 这使您直接进入“源”选项卡。

翻译自: https://www.howtogeek.com/663950/what-your-function-keys-do-in-chrome-devtools/