专栏首页日常学python分享几个 Chrome 开发者工具的 小技巧

分享几个 Chrome 开发者工具的 小技巧

题图:by thefolkpr0ject from Instagram

阅读文本大概需要 4 分钟。

在《论语》中,孔子提倡“学而不思则罔,思而不学则殆”的学习方法。我们再往深层面挖掘,“思”究竟是在思考什么?个人理解是思考并总结出一些共性的东西,即“套路”。有套路了,我们学习或工作会更加有效率。

当我们爬取不同的网站是,每个网站页面的实现方式各不相同,我们需要对每个网站都进行分析。那是否有一些通用的分析方法?我分享下自己爬取分析的“套路”。在某个网站上,分析页面以及抓取数据,我用得最多的工具是 Chrome 开发者工具

Chrome 开发者工具是一套内置于 Google Chrome 中的 Web 开发和调试工具,可用来对网站进行迭代、调试和分析。因为国内很多浏览器内核都是基于 Chrome 内核,所以国产浏览器也带有这个功能。例如:UC 浏览器、QQ 浏览器、360 浏览器等。

接下来,我们来看看 Chrome 开发者工具一些比较牛逼的功能。

01

元素面板

通过元素(Element)面板,我们能查看到想抓取页面渲染内容所在的标签、使用什么 CSS 属性(例如:class="middle")等内容。例如我想要抓取我知乎主页中的动态标题,在网页页面所在处上右击鼠标,选择“检查”,可进入 Chrome 开发者工具的元素面板

通过这种方法,我们能快速定位出页面某个DOM 节点,然后可以提取出相关的解析语句。鼠标移动到节点,然后右击鼠标,选择 “Copy”,能快速复制出 Xpath 、CSS elector 等内容解析库的解析语句。

02

网络面板

网络(Network)面板记录页面上每个网络操作的相关信息,包括详细的耗时数据、HTTP 请求与响应标头和 Cookie,等等。这就是我们通常说的抓包。

其中的 Filters 窗格,我经常使用其来过滤出一些 HTTP 请求,例如过滤出使用 Ajax 发起的异步请求、图片、视频等。

最大的窗格叫 Requests Table,此表格会列出了检索的每一个 HTTP 请求。 默认情况下,此表格按时间顺序排序,最早的资源在顶部。点击资源的名称可以显示更多信息。

  • Headers 是显示 HTTP 请求的 Headers,我们通过这个能看到请求的方式,以及携带的请求参数等。
  • Preview 是请求结果的预览。一般用来查看请求到的图片,对于抓取图片网站比较给力。
  • Response 是请求返回的结果。一般的内容是整个网站的源代码。如果该请求是异步请求,返回的结果内容一般是 Json 文本数据。
  • Cookies 能看到请求携带的 Cookies 以及服务器返回的 Cookies。有时候是需要使用到 Response 的 Cookies。例如,某个页面必须登录才能看到。

如果你觉得文章还不错,请大家点赞分享下。你的肯定是我最大的鼓励和支持。

本文分享自微信公众号 - 日常学python(daily_learn)

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2018-11-29

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 为了一窥国足输韩国之后人们的评论,我爬了懂球帝APP

    如果你是个足球迷的话,估计或多或少都会看一下昨晚中国踢韩国的比赛,因为不管他们踢得怎样,我们还是深爱着他们,那句话说得好,“国足虐我千百遍,我待国足如初恋”。更...

    sergiojune
  • Python爬虫:Xpath语法笔记

    更多xpath用法可以参考scrapy xpath文档:http://doc.scrapy.org/en/0.14/topics/selectors.html

    sergiojune
  • 爬虫实践: 获取百度贴吧内容

    本次要爬的贴吧是<< 西部世界 >>,西部世界是我一直很喜欢的一部美剧,平时有空也会去看看吧友们都在聊些什么。所以这次选取这个吧来作为实验材料。

    sergiojune
  • 爬虫必备工具 —— Chrome 开发者工具

    在《论语》中,孔子提倡“学而不思则罔,思而不学则殆”的学习方法。我们再往深层面挖掘,“思”究竟是在思考什么?个人理解是思考并总结出一些共性的东西,即“套路”。有...

    猴哥yuri
  • Kali Linux Web渗透测试手册(第二版) - 4.8- 执行跨站点请求伪造攻击

    thr0cyte,Gr33k,花花,MrTools,R1ght0us,7089bAt

    用户1631416
  • 「欧洲AI联合实验室」ELLIS成立:誓与中美抢人才

    今年 4 月的倡议书《Initiative to establish a European Lab for Learning & Intelligent Sys...

    机器之心
  • Vue源码学习和分析笔记

    compiler 目录包含 Vue.js 所有编译相关的代码。它包括把模板解析成 AST 语法树,AST语法树优化,代码生成等功能。

    Tiffany_c4df
  • 4个月开设一门人工智能课,这位老师怎么办到的?

    历时一个通宵,两个白天,60多G的数据终于分发到上百台计算机。200多平米的实验室空荡荡,只能听见计算机运行的声音。数天后,这里将坐满学生,键盘声此起彼伏。

    用户2908108
  • 观点 | LeCun、Jordan、李开复圆桌全文:AI的现状与未来

    创新工场董事长兼 CEO 李开复、Yann LeCun、Michael Jordan、高欣欣针对AI的现状与未来做了圆桌讨论

    AI科技评论
  • 中国将成世界AI培训中心!未来学家预测5年、50年、500年世界变迁

    人工智能已经从根本上改变了世界。它不是要来,而是就在这里。恨它或爱它,AI已到处都是。它像一颗刚刚发芽的种子,但是从这颗种子中会生长出一片森林。

    CDA数据分析师

扫码关注云+社区

领取腾讯云代金券