浏览器调试动态js脚本的方法(图解)


Posted in Javascript onJanuary 19, 2018

前两天拉取公司前端代码修改,发现在开发者工具的sources选项里边,居然没有列出来我要调试的js脚本,后来观察了一下,脚本是动态在页面里引入的,可能是因为这样所以不显示出来,但是如果不能断点调试,只靠打印日志真要把人累死了,效率太低,网络搜索试验了一下,有两种方式可以解决:

1、在脚本里边增加 //# sourceURL=xxxxxxxxx.js,名称自己命名,可以直接使用文件名,如下图:

浏览器调试动态js脚本的方法(图解)

然后在网页里打开包含这个js的页面,这样就在开发者工具里能够看到了,可以像普通js一样正常打断点并进行调试

浏览器调试动态js脚本的方法(图解)

2、第二种方法是利用 console.log("让我调试吧!") 打印日志,在浏览器console里看到输出后,点击后面的链接,即跳入动态脚本。名字一般为vmXXX,如下图:

浏览器调试动态js脚本的方法(图解)

浏览器调试动态js脚本的方法(图解)

总结

以上所述是小编给大家介绍的浏览器调试动态js脚本的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery ajax执行后台方法
Mar 18 Javascript
JavaScript之Getters和Setters 平台支持等详细介绍
Dec 07 Javascript
Jquery 实现图片轮换
Jan 28 Javascript
input输入框鼠标焦点提示信息
Mar 17 Javascript
jquery动态增加删减表格行特效
Nov 20 Javascript
AngularJS 文件上传控件 ng-file-upload详解
Jan 13 Javascript
vue实现简单实时汇率计算功能
Jan 15 Javascript
JavaScript基本类型值-Undefined、Null、Boolean
Feb 23 Javascript
Bootstrap页面标题Page Header的实现方法
Mar 22 Javascript
对node.js中render和send的用法详解
May 14 Javascript
微信小程序 冒泡事件原理解析
Sep 27 Javascript
vue 实现 rem 布局或vw 布局的方法
Nov 13 Javascript
Angular实现搜索框及价格上下限功能
Jan 19 #Javascript
vue 插值 v-once,v-text, v-html详解
Jan 19 #Javascript
web前端vue实现插值文本和输出原始html
Jan 19 #Javascript
解决Linux无法正常安装与卸载Node.js的方法
Jan 19 #Javascript
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 #jQuery
解决js ajax同步请求造成浏览器假死的问题
Jan 18 #Javascript
js实时监控文本框输入字数的实例代码
Jan 18 #Javascript
You might like
用PHP实现ODBC数据分页显示一例
2006/10/09 PHP
基于AppServ,XAMPP,WAMP配置php.ini去掉警告信息(NOTICE)的方法详解
2013/05/07 PHP
php Xdebug的安装与使用详解
2013/06/20 PHP
php使用fopen创建utf8编码文件的方法
2014/10/31 PHP
smarty内置函数config_load用法实例
2015/01/22 PHP
php实现文件预览功能
2017/05/23 PHP
Javascript开发包大全整理
2006/12/22 Javascript
一份老外写的XMLHttpRequest代码多浏览器支持兼容性
2007/01/11 Javascript
js或者jquery判断图片是否加载完成实现代码
2013/03/20 Javascript
Jquery实现页面加载时弹出对话框代码
2013/04/19 Javascript
jquery模拟SELECT下拉框取值效果
2013/10/23 Javascript
jQuery实现的导航条切换可显示隐藏
2014/10/22 Javascript
jQuery实现的网页竖向菜单效果代码
2015/08/26 Javascript
jQuery的Read()方法代替原生JS详解
2016/11/08 Javascript
JavaScript中数据类型转换总结
2016/12/25 Javascript
基于JavaScript实现数码时钟效果
2020/03/30 Javascript
ReactJS实现表单的单选多选和反选的示例
2017/10/13 Javascript
微信小程序结合mock.js实现后台模拟及调试
2019/03/28 Javascript
layui使用label标签的方法
2019/09/14 Javascript
Node.js控制台彩色输出的方法与原理实例详解
2019/12/01 Javascript
vue打开其他项目页面并传入数据详解
2020/11/25 Vue.js
[46:16]2018DOTA2亚洲邀请赛3月30日 小组赛B组 iG VS VP
2018/03/31 DOTA
python实现系统状态监测和故障转移实例方法
2013/11/18 Python
Python的Django框架中的Context使用
2015/07/15 Python
简单解决Python文件中文编码问题
2015/11/22 Python
详解Python 数据库 (sqlite3)应用
2016/12/07 Python
Python时间戳使用和相互转换详解
2017/12/11 Python
django的ORM模型的实现原理
2019/03/04 Python
django前端页面下拉选择框默认值设置方式
2020/08/09 Python
Python3中对json格式数据的分析处理
2021/01/28 Python
保险专业大专生求职信
2013/10/26 职场文书
团党委领导干部党的群众路线教育实践活动个人对照检查材料思想汇
2014/10/05 职场文书
求职信格式范文
2015/03/19 职场文书
婚庆开业庆典主持词
2015/06/30 职场文书
python ansible自动化运维工具执行流程
2021/06/24 Python
js前端设计模式优化50%表单校验代码示例
2022/06/21 Javascript