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

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

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

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

浏览器调试动态js脚本的更多相关文章

  1. VSCode调试Html中的脚本 vscode前端常用插件推荐,搭建JQuery、Vue等开发环境 vsCode 添加浏览器调试和js调试的方法总结 VS Code - Debugger for Chrome调试js

    一.背景 使用Visual Studio Code写了一个简单的Html页面,想调试下其中script标签里的javascript代码,网上查了一通,基本都是复制粘贴或者大同小异的文章,就是要安装De ...

  2. vsCode 添加浏览器调试和js调试的方法总结

    vsCode 添加浏览器调试和js调试的方法 1.直接按F5可以调试的方法或者点击运行按钮(可以直接运行html文件或者js文件) 在launch.json文件中的配置如下: {     " ...

  3. 如何调试异步加载的js文件(浏览器调试动态加载js)

    描述 1:jQuery->var obj= new $.js_Obj():等异步加载js文件,执行方法. obj.method(): 2:页面估计不变,通过声明不同的js文件,进行页面内容的转换 ...

  4. VSCode配合chrome浏览器调试cocos2d js项目

    1.准备阶段 具备调试功能的VSCode(我的是在win10上,版本是1.17.1) 在VSCode里下载安装Debugger for Chrome扩展插件. 2.具体操作 创建一个cocosjs工程 ...

  5. 如何使用 Chrome 浏览器调试动态加载的 Javascript 脚本

    在IE中,可以在调试程序的文档列表最下方看到一个"动态脚本"的文件夹,里面可以找到动态加载的脚本,但是...数量繁多,也不能自定义名称... 但是在 Chrome 中,貌似根本找不 ...

  6. vsCode 添加浏览器调试和js调试的方法

    1.直接按F5可以调试的方法或者点击运行按钮(可以直接运行html文件或者js文件) 在launch.json文件中的配置如下: {     "version": "0. ...

  7. ASP.Net MVC 引用动态 js 脚本

    希望可以动态生成 js  发送给客户端使用. layout页引用: <script type="text/javascript" src="@Url.Action( ...

  8. chrome浏览器控制台创建js脚本并执行

    Chrome的snippets是小脚本,还可以创作并在Chrome DevTools的来源面板中执行.您可以访问和从任何页面运行它们.当你运行一个片段,它从当前打开的页面的上下文中执行.本文主要讲如何 ...

  9. 判断当前IE浏览器是否支持JS

    1.server 2008 r2 64位中自带的IE默认不支持js,这样一些有JS的页面就是失效,所以如果要考虑这方面的系统,需要判断浏览器是否支持JS <div class="js- ...

随机推荐

  1. Docker Image管理学习笔记,ZT

    Docker Image管理学习笔记 http://blog.csdn.net/junjun16818/article/details/38423391

  2. gunicorn flask nginx环境配置

    防火墙端口设置****修改后要重启生效(有时在控制面板中设置80端口无法生效) /etc/init.d/iptables statusservice iptables stopfirewall-cmd ...

  3. Windows下安装python的scipy等科学计算包(转)

    如果要使用python进行科学计算.数据分析等,一定要安装scipy.seaborn.numpy等等包. 但Windows下安装python的第三方库经常会出现问题.此前,已介绍过Windows下如何 ...

  4. 微信小程序 自定义三列城市弹窗

    1.WXML <picker mode="multiSelector" bindchange="bindMultiPickerChange" bindco ...

  5. 『Python CoolBook』Cython

    github地址 使用Cython导入库的话,需要一下几个文件: .c:C函数源码 .h:C函数头 .pxd:Cython函数头 .pyx:包装函数 setup.py:python 本节示例.c和.h ...

  6. Matlab:线性热传导(抛物线方程)问题

    函数文件1:real_fun.m function f=real_fun(x0,t0) f=(x0-x0^2)*exp(-t0); 函数文件2:fun.m function f=fun(x0,t0) ...

  7. CRM SALES ORDER ADD EEWB SEARCH FIELD

    1.找到对应的查询结构: T-code:GENIL_MODEL_BROWSER Component Set 输入'ONEORDER' 点击DISPLAY 展开Dynamic Query Object, ...

  8. 【ANT】输入中文格式为乱码

    使用ant编译,打出的日志的格式为乱码,加上下面的指定编码后,输出为中文了. 为方便拷贝,将其贴出来 <jvmarg value="-Dfile.encoding=UTF-8" ...

  9. python四

    三元运算 name = "张三" if 1 == 2 else "李四" print(name) name1 = "张三" if 1 == ...

  10. jmeter解决request response中文乱码问题

    一:主要内容 解决request请求入参中文乱码问题 解决response响应数据中文乱码问题 二:解决request和response中文乱码问题 request结果:-中文已经不乱码了 respo ...