上一节我们明确说明最好使用VScode进行JS编码,并解释使用VScode编码能够提高编码效率,本节课我们将详细介绍如何使用Chrome浏览器进行调试。一般来说,Web开发人员都会选择Chrome浏览器进行网页开发,原因不言而喻,Chrome内置的开发者工具极其强大和便捷,它提供了实时编辑HTML/CSS、强大的JavaScript调试、网络请求监控和性能分析等一站式功能,让调试和优化网页的效率变得非常高,其下载地址为Chrome浏览器。
下面我们详细解释如何使用开发者工具:
1. 如何打开发者工具:(点击F12弹出开发者工具)

2. 如何切换开发者工具位置:

3. 切换中文模式:


4利用控制台检查JS代码('console.log()'):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>欢迎来到Dotcpp的JavaScript(JS)教程</h1>
</body>
<script>
console.log('我们可以充分利用控制台来进行JS代码的检测!');
</script>
</html>
开发者工具还有很多小技巧,笔者这里就不一一列举了。
总结:熟练运用开发者工具,能够帮助我们更好地调试JS代码。
C语言网提供由在职研发工程师或ACM蓝桥杯竞赛优秀选手录制的视频教程,并配有习题和答疑,点击了解:
一点编程也不会写的:零基础C语言学练课程
解决困扰你多年的C语言疑难杂症特性的C语言进阶课程
从零到写出一个爬虫的Python编程课程
只会语法写不出代码?手把手带你写100个编程真题的编程百练课程
信息学奥赛或C++选手的 必学C++课程
蓝桥杯ACM、信息学奥赛的必学课程:算法竞赛课入门课程
手把手讲解近五年真题的蓝桥杯辅导课程