0

0

如何使用浏览器调试JS代码

清浅

清浅

发布时间:2019-01-31 13:11:02

|

14411人浏览过

|

来源于php中文网

原创

在浏览器中调试JS代码的方法:1、打开Chrome浏览器,直接选择Chrome运行;2、进入页面,点击F12或者“Ctrl+Shift+I”快捷键;3、选择“Sources”,并设置断点进行代码调试即可。

如何使用浏览器调试JS代码

本文操作环境:Windows7系统、Dell G3电脑、javascript1.8.5&&Chrome76.0。

大家在写程序的过程中,经常会遇到这样或者那样的问题,这个时候就需要调试,看看错误是出现在哪个位置,但是在JavaScript中如果一直都是这样的去调试的话,就会很不方便。这时各个浏览器中自带的调试工具就派上用场了

如何使用浏览器调试JS代码

Chrome浏览器

1、打开Chrome浏览器,,直接选择Chrome运行,其他的浏览器一样的操作

如何使用浏览器调试JS代码

2、进入页面之后,点击F12或者Ctrl+Shift+I,还可以右击界面选择“检查”。这个时候就能看到如下的这个界面: 

如何使用浏览器调试JS代码

3、我们选择“Sources”,如下

未标题-2.jpg

赣极购物商城网店建站软件系统
赣极购物商城网店建站软件系统

大小仅1兆左右 ,足够轻便的商城系统; 易部署,上传空间即可用,安全,稳定; 容易操作,登陆后台就可设置装饰网站; 并且使用异步技术处理网站数据,表现更具美感。 前台呈现页面,兼容主流浏览器,DIV+CSS页面设计; 如果您有一定的网页设计基础,还可以进行简易的样式修改,二次开发, 发布新样式,调整网站结构,只需修改css目录中的css.css文件即可。 商城网站完全独立,网站源码随时可供您下载

下载

点击前面的数字,出现了蓝色框就代表已经标记上了。这是Chrome中的代码调试。

 Firefox浏览器

首先按照Chrome第一步操作就行。 
然后进入页面之后,点击F12或者右击界面选择“查看元素”。就会出现这个界面: 

未标题-2.jpg

我们可以选择调试器,然后在里面找到需要调试的文件,在调式的文件中找到需要调试的内容,如下: 

未标题-2.jpg

总结:以上就是本篇文章的全部内容了。希望对大家学习调试JavaScript代码有所帮助

【推荐课程:JavaScript教程

相关专题

更多
ip地址修改教程大全
ip地址修改教程大全

本专题整合了ip地址修改教程大全,阅读下面的文章自行寻找合适的解决教程。

33

2025.12.26

压缩文件加密教程汇总
压缩文件加密教程汇总

本专题整合了压缩文件加密教程,阅读专题下面的文章了解更多详细教程。

18

2025.12.26

wifi无ip分配
wifi无ip分配

本专题整合了wifi无ip分配相关教程,阅读专题下面的文章了解更多详细教程。

46

2025.12.26

漫蛙漫画入口网址
漫蛙漫画入口网址

本专题整合了漫蛙入口网址大全,阅读下面的文章领取更多入口。

91

2025.12.26

b站看视频入口合集
b站看视频入口合集

本专题整合了b站哔哩哔哩相关入口合集,阅读下面的文章查看更多入口。

283

2025.12.26

俄罗斯搜索引擎yandex入口汇总
俄罗斯搜索引擎yandex入口汇总

本专题整合了俄罗斯搜索引擎yandex相关入口合集,阅读下面的文章查看更多入口。

370

2025.12.26

虚拟号码教程汇总
虚拟号码教程汇总

本专题整合了虚拟号码接收验证码相关教程,阅读下面的文章了解更多详细操作。

35

2025.12.25

错误代码dns_probe_possible
错误代码dns_probe_possible

本专题整合了电脑无法打开网页显示错误代码dns_probe_possible解决方法,阅读专题下面的文章了解更多处理方案。

25

2025.12.25

网页undefined啥意思
网页undefined啥意思

本专题整合了undefined相关内容,阅读下面的文章了解更多详细内容。后续继续更新。

72

2025.12.25

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Git 教程
Git 教程

共21课时 | 2.2万人学习

Kotlin 教程
Kotlin 教程

共23课时 | 2万人学习

PHP新手语法线上课程教学
PHP新手语法线上课程教学

共13课时 | 0.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号