在谷歌浏览器调试JavaScript小知识，大挑战！本文正在参与“程序员必备小知识”创作活动。测试代码调试运行打开

小知识，大挑战！本文正在参与“程序员必备小知识”创作活动。

本文介绍在谷歌浏览器调试JavaScript的方法。

测试代码

新建test.html文件，写入：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <script type="text/javascript">
		
        alert("Hello World!");
	document.write("Hello World")
        var vAlert={};
        vAlert.show=function(msg){
            alert(msg);
        }
var test_var = 'test world'
        vAlert.show("测试");
	console.log('Hello World')
console.log(test_var)
    </script>
</body>
</html>

调试运行

打开谷歌浏览器
运行test.html
F12 ，呼出开发者模式
进入Sources选项卡

谷歌浏览器开发者模式

在js 代码加入断点，F5刷新，单步运行

断点调试

期间网页会显示代码执行效果，并且在控制台有相应输出，自己也可以在控制台调试当前环境代码

控制台调试