前两天拉取公司前端代码修改,发现在开发者工具的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. 『Python CoolBook』使用ctypes访问C代码_下_demo进阶

    点击进入项目 这一次我们尝试一下略微复杂的c程序. 一.C程序 头文件: #ifndef __SAMPLE_H__ #define __SAMPLE_H__ #include <math.h&g ...

  2. pymysql连接数据库,读取表内容

    python中有MySQLdb.pymysql等数据库模块,本文用pymysql模块连接mysql数据库,并且读取数据库表 看过其他博文的介绍,把程序和数据库比作两个目的地,将游标比喻成运输货车 很是 ...

  3. 数据分析库之Numpy

    Numpy get started NumPy中我们要学习的核心其实就是一个 ndarray n多 d dimension 维度 array数组 多维数组 创建一个ndarray的几种方法 impor ...

  4. vue-常用指令

    一.一些指令 1.v-bind 绑定元素(简写 :) <div id="app-2"> <span v-bind:title="message" ...

  5. Win10系列:C#应用控件基础18

    WebView控件 使用WebView控件可以在应用中添加一个简易的网页浏览器窗口,将指定地址的网页内容显示出来,并可以通过WebView控件所提供的方法.属性及事件,实现如页面导航.HTML文本解析 ...

  6. linux c使用socket进行http 通信,并接收任意大小的http响应(四)

    终于说到SOCKET 这里了.SOCKET进行http通信的实际就是利用socket将http请求信息发送给http服务器,然后再利用socket接收http响应. 由于本文与之通信的服务器是ip已知 ...

  7. C# MVC 微信支付教程系列之公众号支付

    微信支付教程系列之公众号支付           今天,我们接着讲微信支付的系列教程,前面,我们讲了这个微信红包和扫码支付.现在,我们讲讲这个公众号支付.公众号支付的应用环境常见的用户通过公众号,然后 ...

  8. Let me introduce myself

    介绍自己,从开学到这上半学期结束,不知道说了多少个版本.开学军训,要自我介绍:军训结束,在班里要自我介绍:参加社团,面试要自我介绍.....不能说对每个人,至少对于我来说,在众人面前开口介绍自己,总还 ...

  9. 安装Ruby、Sass在WebStrom配置Scss编译环境css自动压缩

    安装Sass和Compass sass基于Ruby语言开发而成,因此安装sass前需要安装Ruby.(注:mac下自带Ruby无需在安装Ruby!) window下安装SASS首先需要安装Ruby,先 ...

  10. centos7源码安装Python3的前提条件

    centos7源码安装Python3的前提条件: # yum -y install openssl-devel bzip2-devel expat-devel gdbm-devel readline- ...