常用的chrome工具及前端学习

原创 已于 2023-05-09 21:19:55 修改 · 529 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#chrome #前端 #爬虫

于 2022-01-03 10:52:33 首次发布
本文介绍了爬虫工程师常用的Chrome插件，如XPathHelper和User-AgentSwitcher，以及它们在网页内容抓取和HTTP请求头管理中的作用。同时，分享了网站被挂马的解决案例，强调在遇到此类问题时要检查JS文件，特别是涉及Cookie设置的部分。此外，提供了国内Chrome插件下载地址。

爬虫工程师常用的 Chrome 插件 - 知乎

XPath Helper

User-Agent Switcher

Web前端开发最常用的五款Chrome插件推荐 - 知乎

ctrl+shift +c 选中自己想要的内容，就可以看到网页源代码

ctrl+shift+r 强制重新加载浏览器内容

HTTP请求头之User-Agent - 简书

网站被挂马解决方案：记一次站点被挂马问题排查 - 简书起因，在下班准备回家之际，收到几条朋友发来的信息，说他的网站在百度搜索做信息流广告推广，但是从百度搜索点击打开就会跳转的博彩网站，让我帮忙排查下问题，是不是被挂马了，于是乎就...https://www.jianshu.com/p/bc70b4f7e401

挂马攻击也要检查js文件，尤其是设置cookie的文件 

国内插件chrome下载地址：

XPath Helper_2.0.2_chrome扩展插件最新版下载_极简插件XPath Helper 是一个功能类似于爬虫的扩展插件，通过编写爬虫脚本，可以实现简单的页面内容批量爬取等功能。重要提示：安装此扩展后，必须重新启动Chrome，才会生效。https://chrome.zzzmh.cn/info/hgimnogjllphhhkhlmebbmlgjoejdpjl

使用 Chrome 开发者工具分析 Open UI5 应用前端执行的性能问题
2007 年 ~ 2025 年，深耕 SAP 技术 18 年
04-23 975
本文介绍的使用 Chrome 开发者工具来分析 Web 应用性能问题的步骤，只是该工具使用技巧的冰山一角。后续有机会，Jerry 会继续把我在日常工作中学到的东西分享出来。如果遇到 Open UI5 应用出现性能问题，优先排查性能瓶颈是否由后台 API 造成。对于 Open UI5 应用的前端实现来说，因为 UI5 已经为应用开发人员做出了良好的封装，因此绝大部分情形，应用开发人员无需手动操纵 DOM 元素和 CSS 样式，所以也不大可能出现类似本文 heavyFunction 函数里模拟的极端情况。
chrome前端开发工具_精通Chrome开发人员工具：更高级别的前端开发技术
cumi7754的博客
07-14 481
chrome前端开发工具by Ben Edelstein 通过本·爱德斯坦 You may already be familiar with the basic features of the Chrome Developer Tools: the DOM inspector, styles panel, and JavaScript console. But there are a numbe...
Chrome常用性能工具记录
王亮的博客
12-06 959
参考：工作中如何进行前端性能优化(21种优化+7种定位方式) - 掘金
如何利用Chrome工具进行前端js调试
JavaAlliance
04-12 657
前端调试神器：5 个 Chrome 插件让你的 Bug 无所遁形
前端开发探索之旅
02-10 1762
JSONView 是一款专门用于格式化和展示 JSON 数据的插件。在前端开发中，我们经常需要与服务器进行数据交互，而 JSON 是一种常见的数据格式。当我们在浏览器中访问返回 JSON 数据的接口时，原始的 JSON 数据通常是一串没有格式的文本，很难阅读和分析。JSONView 可以自动将这些 JSON 数据进行格式化，以树形结构展示，并且支持展开和收缩节点，让数据的层次结构一目了然。如果你是一名 Vue.js 开发者，那么 Vue.js devtools 绝对是你的必备插件。
[工具]Chrome插件—优快云开发助手，有点意思！
CnPeng
01-08 1752
今天，准备在 优快云 写点内容时，无意间发现了这个 Chrome插件内测大赛，喏，它的入口在这里： 平时都是直接点击 写文章 就进入了，今天意外的停留了一下，然后就发现了这个入口。此时我才知道，原来 优快云 也有 Chrome 插件了！ 1.1 插件下载 首先，我们进入 插件下载页 看一下，首先引入眼帘的是这一排常用工具： 虽然上面的 sologan 很大很突出，但是下面这一排常用工具对程序员的吸引更大，所以……不用往下看了，直接进入 Chrome 商店下载安装和运行，然后我们会看到下面的样子： 上
精选资源
FeHelper工具(前端助手) - Chrome版本
04-07
FeHelper工具，作为一款专为Web前端开发者设计的Chrome扩展，是前端工程师日常工作中不可或缺的得力助手。这款工具集成了多种实用功能，旨在提升开发效率，简化前端开发过程中的繁琐任务。在V2020.04.0110这个版本中...
前端开发者如何用好Chrome开发者工具
最新发布
AI架构全栈开发实战笔记
05-09 995
随着现代前端框架（React/Vue/Angular）和复杂单页应用（SPA）的普及，前端开发面临调试复杂度高、性能瓶颈定位难、跨设备兼容性差等挑战。Chrome开发者工具（以下简称DevTools）作为浏览器原生调试套件，提供了从DOM渲染到JavaScript执行、从网络请求到内存监控的全链路分析能力。本文聚焦前端开发者日常工作场景，深度解析DevTools核心模块的高阶用法，结合实战案例演示问题定位和优化流程。
精选资源
Chrome 开发者工具中文手册
04-13
Chrome开发者工具是Google Chrome浏览器内置的一套强大的网页开发和调试工具，它为前端开发者提供了丰富的功能，包括元素检查、网络监控、源代码编辑、性能分析等。这份“Chrome开发者工具中文手册”旨在帮助用户...
前端提升之——chrome浏览器插件开发指南——chrome插件介绍及入门
m0_74825634的博客
12-21 1668
有一天突发奇想，想要自己写一个浏览器插件玩一玩，并不做用于商业或者其他方面，仅仅用于自我技术的练习和提升。这里的浏览器我选择Chrome，当然chrome插件同样适用于微软自带的 Microsoft Edge在当今发达的互联网环境下，也找到了诸多的资料教程。个人也有个习惯，学习一个新的东西，虽然说前人已经有诸多的文章，但是我还是会将自己对于这个技术的一些个人感悟加上前人们写的很好的东西重新整理一次。我所有的参考文章均在本文的最后。
Chrome调试工具的使用【详细】
qq_46063669的博客
11-20 6229
1、打开dev tool方式1：菜单-》更多工具-》开发者工具方式2：快捷键F122、打开命令菜单方式：快捷键 ctrl+shift+P使用举例：1）截屏：screen shot2）修改主题颜色为日间模式：light theme3）修改窗口位置靠右：dock to left4）…3、五个常用的Tab1）Element2）Console3）Source4）NetWork。
好用的chrome前端插件推荐
日常笔记/总结/系列知识梳理
09-28 2677
如果你不知道如何安装 VSCode 插件
Chrome调试工具Developer Tools——前端必备神器
热门推荐
Herry_Tank的专栏
02-28 4万+
今天要给大家介绍一个神器，就是谷歌浏览器（Chorme）自带的前端调试工具——Developer Tools.在谷歌浏览器中，通过快键键F12就可以打开Devloper Tools：Developer ToolsDevelop Tools功能比较多，本文主要讲解比较常用的几个面板：Elements、Console、Sources和Network。——1——Elem...
前端开发常用的Chrome插件推荐
xiaoxijinger的博客
11-25 4296
谷歌浏览器简单清爽的界面、因其丰富的插件，成为前端开发者喜欢的浏览器。而易用的插件可以帮助开发者减少开发过程中的大量工作量，带来更加强大的效果。今天给大家推荐几个在程序员中口碑不错非常实用的Chrome插件。 1、Lighthouse前端性能优化测试工具 Lighthouse插件是一款开源的自动化检测工具，由谷歌官方团队提供，正儿八经的行业标杆。可以对需要测试的页面运行一系列评估，然后反馈给开发者详细的优化指导建议。 主要包括网站页面性能、PWA、可访问性（无障碍）、SEO等内容。开发者能够根据这些标准进
chrome调试
01-03 539
Chrome浏览器不仅可以调试页面、JS、请求、资源、cookie，还可以模拟手机进行调试。自从使用了Chrome，我就离不开它了。 下面整理一下如何使用Chrome进行调试。 怎样打开Chrome的开发者工具？ 直接在页面上点击右键，然后选择审查元素： 或者在Chrome的工具中找到： 或者，你直接记住这个快捷方式： Ctrl+Shift+I (或者Ctrl+Shift+J直接
前端chrome浏览器调试总结
YaWen的博客
12-28 3万+
前端chrome浏览器开发者模式的调试方法总结：1.选择箭头按钮；2.手机设备调试；3.Elements的css调试；4.Console控制台调试；5.Sources js资源页面检查；6.Network 网络请求标签页；7.Timeline标签页；8.Profiles标签页；9.Resources标签页；10.Security标签页；11.Audits标签页；以及Sources资源页的断点调试
前端开发工具——Chrome浏览器调试工具
lxy95512的博客
01-12 8908
打开调试工具 打开Chrome浏览器,按下F12键或者右击页面空白处--->检查。 使用调试工具 1、Ctrl+滚轮可以放大开发者工具代码大小。 2、左边是 HTML元素结构,右边是CSS样式。 3、右边 CSS样式可以改动数值(左右箭头或者直接输入)和查看颜色。 4、Ctrl + 0复原浏览器大小。 5、如果点击元素,发现右侧没有样式引入，极有可能是类名或者样式引入错误。 6、如果有样式，...
Chrome web 开发用到的插件
付博瀚
07-29 3795
现在设我是一位web开发人员，以Chrome为阵地。下面是一些能让我少花点时间的工具： WhatFont —— 名字就说明了一切。这是找出你最喜欢网站使用的字体的简单方法，这样你就可以为己所用了。 Pesticide—— 修改CSS的绝佳程序。当我试着学习匣子模型的时候，它简直就是救命稻草般的存在。 Colorzilla ——用于复制确切颜色的一个网站，用它可以将颜色直接复制到剪贴板上，这样你...
牛逼的优快云 Chrome插件，快来体验吧，大大提升阅读体验和学习效率，顺便开发一个自己的插件
一火的专栏
09-01 4561
今天试用了优快云 Chrome插件，真不错，给大家剖析剖析一下csdn插件。 csdn插件官网地址：https://t.csdnimg.cn/bKUP 1.优快云 Chrome插件是什么？ 优快云 Chrome插件，是运行在Chrome浏览器中的小工具，扩展Chrome浏览器的功能，从而提升阅读体验和学习效率。 2.优快云 Chrome插件定位和特点 定位：帮助开发者提升开发效率。 特点： 以搜索框为入口，集成开发...
Chrome截屏插件：前端js截图学习工具
- **前端学习和调试**：在学习前端开发的过程中，经常需要截图来记录代码的效果或者展示给他人看，这类插件可以便捷地实现这一需求。 - **演示和培训**：在进行技术演示或培训时，通过截屏插件可以捕捉网页的当前...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值