页面制作——开发、调试工具

1.开发工具

文本编辑器 Sublime Text

优点：跨平台，启动快；多行选择（操作方便）；各种实用插件；Snippets（代码片段）；支持VIM（文本编辑器，代码补完，编辑及错误跳转等方便编程功能丰富）兼容模式

常用插件

Package Control 管理工具，可添加、更新、卸载相应插件。

Emmet 快速编写HTML和CSS代码

DocBlockr 方便产生函数注释

SideBarEnhancement 右键菜单增强工具

Terminal 可以在Sublime中直接打开命令行终端

2.调试工具

每个浏览器都自带调试工具，以Chrome为例介绍调试工具

Emmet：用来调试HTML和CSS

Network：可看网站所有的网络请求，和后端调一些接口的时候也会用到这个面板

Sources：可以看到网站所有的资源，在JavaScript文件中可以设置断点调试

Console：类似一个命令行工具，可以直接写JavaScript代码执行，另外在JavaScript文件中也经常输出一些内容方便调试，经常和Sources面板结合起来调试JavaScript

Resources（Application）：网站的本地数据资源，cookies，storage等

Timeline，Profile（Memory），Audits：主要用来调试页面的性能

IE浏览器

IE早期的版本不会自动更新

IE8+ 版本自带调试工具，可调式IE7-电脑安装版本

IE6 IETester查看IE6效果，安装IE Develop Toolbar 进行调试

F12 打开调试器，DOM资源管理器（Elements），样式（Styles修改CSS）