曾经的选择是使用火狐浏览器的Firebug插件，具体的用法到时候在细说，这篇文章登场的是开发静态网页及javascript的利器--webstorm.

一.相关软件安装和配置

　　安装WebStorm 
　　WebStorm官网：( https://www.jetbrains.com/webstorm/ )

　　安装Chrome和JetBrains IDE Support 
　　JetBrains IDE Support的地址是： 
       https://chrome.google.com/webstore/detail/hmhgeddbohgjknpmjagkdomcpobmllji
　　不过一般都是被墙了，所以得FQ去安装插件了。

二、WebStorm调试JavaScript

1.WebStorm增加JavaScript调试选项

如图所示：在项目工程的右上角那里，点那个下尖符号，弹出 Edit Configurations 
 
点绿色的+号，然后选择JavaScript Debug

　　在此处配置好相关路径就可以了

2.运行调试效果

点击那个绿色的甲虫，就可以看到实际的调试效果了。这个时候Chrome会有下面的提示 
 
此时会自动切换回WebStorm的调试界面 

使用WebStorm进行javascript调试的更多相关文章

  1. WebStorm强大的调试JavaScript功能(转载)

    一.JavaScript的调试 目前火狐和Chrome都具备调试JavaScript的功能,而且还是相当的强大.如果纯粹是用浏览器来进行js调试的话,我比较喜欢用火狐.火狐可以安装各种插件,真的是非常 ...

  2. JavaScript调试技巧之console.log()详解

    JavaScript调试技巧之console.log()详解 对于JavaScript程序的调试,相比于alert(),使用console.log()是一种更好的方式,原因在于:alert()函数会阻 ...

  3. 【转】HTML, CSS和Javascript调试入门

    转 http://www.cnblogs.com/PurpleTide/archive/2011/11/25/2262269.html HTML, CSS和Javascript调试入门 本文介绍一些入 ...

  4. JavaScript 调试常见报错以及修复方法

    (看到一篇调试JS很有用的文章,收藏一下) JavaScript 调试是一场噩梦:首先给出的错误非常难以理解,其次给出的行号不总有帮助.有个查找错误含义,及修复措施的列表,是不是很有用? 以下是奇怪的 ...

  5. Javascript 调试利器 Firebug使用详解

    Javascript 调试利器 Firebug使用详解 有时候,为了更清楚方便的查看输出信息,我们可能需要将一些调试信息进行分组输出,那么可以使用console.group来对信息进行分组,在组信息输 ...

  6. IE8"开发人员工具"使用详解下(浏览器模式、文本模式、JavaScript调试、探查器)

    来源: http://www.cnblogs.com/JustinYoung/archive/2009/04/03/kaifarenyuangongju2.html 在上一篇文章IE8“开发人员工具” ...

  7. HTML/CSS/Javascript调试入门(转)

    推荐Chrome作为开发工具(FF可以使用FireBug,IE8和之后的版本也有自己的调试工具) 1.HTML的调试 将鼠标放在任意元素上,右键Inspect Element,即可查看该元素的HTML ...

  8. JavaScript 调试

    在编写 JavaScript 时,如果没有调试工具将是一件很痛苦的事情. JavaScript 调试 没有调试工具是很难去编写 JavaScript 程序的. 你的代码可能包含语法错误,逻辑错误,如果 ...

  9. JavaScript 调试常见报错以及原因

    JavaScript 调试常见报错以及原因 测试环境 chrome 版本 66.0.3359.170(正式版本) (64 位) TypeError 类型错误 不是操作符所接受的数据类型. //---- ...

随机推荐

  1. JUnit单元测试遇到的问题及解决思路

    JUnit是Java单元测试框架,我们在对开发的系统进行单元测试的时候,也遇到了如何测试多个测试用例的问题.  背景:我们的所有测试用例都保存在Excel文件中,该文件包含测试用例和预期输出.我们希望 ...

  2. Autowired注解

    package com.how2java.pojo; import org.springframework.beans.factory.annotation.Autowired; public cla ...

  3. vue初尝试--新建项目

    这是一篇技术贴--如何新建一个基于vue的项目 1.下载对应版本的nodejs安装,下载的nodejs都集成了npm,所以nodejs安装完成之后npm也对应安装完成了. 安装完成之后可以在cmd命令 ...

  4. MSSQL---extents

    一.MSSQLextent分两种: 1. Mixed extent:每个表或索引创建时,MSSQL并不给它分配一个extent,而是在mixed extnet内分配一个页,空间需求扩大时,再分配一个… ...

  5. python安装及写一个简单的验证码组件（配合node）

    1.安装Python 到官网下载响应系统的版本(这里以windows为例):https://www.python.org/downloads/windows/ 然后就是不断地"下一步&quo ...

  6. Python基础学习篇章三

    一. Python对象类型 1. 对象是Python最基本的概念,一个Python程序可以分解为模块.语句.表达式.和对象.它们的关系如下:(1)程序由模块构成 (2)模块包含语句 (3)语句包含表达 ...

  7. 关于团购VPS的事情报告

    作者 玄魂   2017-08-11 玄魂工作室-玄魂 玄魂工作室首先要抱歉,之前的说的继续组织大家购买vps的事情,不会再组织了.原因有以下几个:1)因为人多,需求各不相同,不好协调.2)服务都是购 ...

  8. Python内置函数(37)——sorted

    英文文档: sorted(iterable[, key][, reverse]) Return a new sorted list from the items in iterable. Has tw ...

  9. Mock API是如何在开发中发光发热的？

    在长期的服务过程中,我们经常会遇到前来咨询的用户与我们反馈以下这种情况:咨询者是一个前端人员,在项目开发的过程中需要与后端进行对接,遇到后端还没完成数据输出的情况下,他只好写静态模拟数据,在遇到大型项 ...

  10. 【52ABP实战教程】0.1-- Devops如何用VSTS持续集成到Github仓库！

    工欲善其事,必先利其器.在开始正式的教程之前我们先来聊聊准备工作. 管理工具会VSTS. 代码管理会用GITHUB. 服务器会用Azure. 所有的东西都是利用现有服务.不会说自己从虚拟机开始玩.我们 ...