# DevTools 中的 JSpider

## DevTools 简介

在几乎所有的浏览器中都有 DevTools 用来调试 Javascript 代码和检测网站的一些性能数据。而灵活使用这些功能对于常规的爬虫是十分大的帮助。

## 优秀文章推荐

1. 掘金上的好文章 —— [你不知道的 Chrome 调试技巧](https://juejin.cn/book/6844733783166418958/section/6844733783187390477)

2. DevTools 在 Edge 中有中文教程，这里推荐有前端基础的同学进行阅读 [Link](https://docs.microsoft.com/zh-cn/microsoft-edge/devtools-guide-chromium/)。 教程偏向于网站搭建者，所以不太适合学习爬虫相关知识。

3. [Chrome 调试技巧](https://www.frontendwingman.com/Chrome/)

## 各大浏览器中的 DevTools

1. Chrome 中的 DevTools 对于 Javascript 的代码功能实现是最先进的，可以说 DevTools 中实现了很多实验性的 Javascript 功能，很多高级的功能也是完整支持的，所以最推荐使用。

2. Edge 浏览器中的中文 DevTools，如果您是爬虫初学者，推荐您还是使用 Edge 好，毕竟中文环境对于很多的 API 理解得比较清楚。

3. FireFox 浏览器中的 DevTools 是不推荐的。一个方面是 API 可能有部分差异，功能上也没有 Chrome 和 Edge 多。

## DevTools 的使用

### 打开 DevTools

网页中 **`右键 -> 检查`** 即可打开开发者工具

### DevTools 中的代码编辑

1. 使用 Console 直接写代码

2. 使用 Snippets 写一个 JS 文件