精通掌握Google Chrome开发者工具视频教程

欢迎购买学习《精通掌握Google Chrome开发者工具视频教程》课程，你将了解如何使用 DevTools 中的主要工具，包括性能工具、lighthouse、可访问性等等。

发表于 2022 年 11 月
MP4 | 视频：h264、1280×720 | 音频：AAC，44.1 KHz，2 Ch
类型：eLearning | 语言：英语 | 时长：61 节课（2h 32m）| 大小：1.24 GB

你会学到什么

• 了解 Chrome DevTools 的主要工具
• 了解在哪些情况下使用 DevTools 面板
• 如何使用 DevTools 调试 JavaScript 代码
• 检查和修改 DOM
• 检查和修改 CSS
• 优化网站性能

要求

• HTML基础知识
• CSS基础知识
• JavaScript 基础知识

描述

您是否知道使用 Google Chrome DevTools 可以分析您网站的性能？

或者可以模拟视力问题来创建可访问的站点？

如果您对这些问题中的任何一个的回答是否定的，那是因为您可能只是肤浅地了解并使用过 Google Chrome DevTools。

DevTools 是一组强大的工具，可帮助开发人员构建更好的网站。

这是可能的，因为 DevTools 包含调试代码、检查网站元素、运行 JavaScript 代码进行测试、查找性能问题、样式问题、可访问性问题等工具。

在本课程中，您将学习如何使用 DevTools 的主要工具，首先是一段视频，其中我通过案例研究解释了其中一种工具的使用，然后是一个包含必要资源和链接的练习，以便您可以复制您在视频中看到的内容，并以有关本课所学概念的问题结束。

在课程结束时，您将知道如何使用以及在哪里可以找到主要的 DevTools 来改进您的应用程序和网站。

我们将在课程中看到的一些主题是

与 DOM 树元素交互的工具。

使用控制台

使用 Sources 面板与源代码进行交互。

使用“网络”面板可视化网络元素。

提高性能和发现性能瓶颈的工具。

查找渲染问题的工具

在许多其他主题中。

为了充分利用课程，建议您具备 HTML、CSS 和 Javascript 的基本知识。

您还在等什么来创建更好的应用程序和网站？课程见

本课程面向

• 想要学习如何使用 Chrome DevTools 的开发人员
• 想要提高调试技能的开发人员
• 想要解决网站问题的开发人员
• 想要了解 Chrome DevTools 中最新功能的开发人员