使用浏览器调试JS脚本

我用搜狗浏览器,Google浏览器,QQ浏览器都进行过JS脚本调试,三者基本上都是一样没有区别的,之前看书,介绍使用的是Firefox浏览器,因为界面有些不同,所以略有些不适应。

接下来简单说一下怎么用搜狗,Google,QQ这些浏览器进行调试:

首先用这些浏览器打开你创建的HTML网页,然后选择工具→开发者工具(下图是以QQ浏览器做的例子,不同的浏览器可能“开发者工具”所处位置不同,但都很容易找到)。

开发者工具

然后打开如下图:

调试界面

这个界面在这三个浏览器中都是差不多的,没什么大的区别。这里是用编写的一个九九乘法表做例子,如图中,选择“ch13-js-for-9x9.html”打开,当然如果js文件不是内嵌而是外部引入也可以从这里选择相应的js文件打开。


选择js断点

从图中可以看到在这个HTML文件中js代码部分,点击相应的行标“22”,就会如图中所示出现蓝色,然后点击Console,就会看到输出的日志信息。

调试台输出

如有什么地方不对,欢迎指正。

补充:刚才用QQ浏览器调试,发现无法从打开外部引入的js文件,有没有大神前来指教?

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,786评论 25 709
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,816评论 1 45
  • 用两张图告诉你,为什么你的 App 会卡顿? - Android - 掘金 Cover 有什么料? 从这篇文章中你...
    hw1212阅读 13,045评论 2 59
  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明AI阅读 16,020评论 3 119
  • 六哥的知识管理又开营了,打过一次酱油的我,决定洗心革面,重新入群,跟着六哥学习如何阅读,如何进行知识管理,如何一步...
    小中医左左阅读 551评论 0 1