大家有没有遇到这样的一个问题，我们在分析一些大型电子商务平台的Web前端脚本时，想找到一个元素绑定的点击事件，并不是那么容易，因为有些前端脚本封装的比较隐蔽，甚至有些加密脚本，用传统的查找元素ID、或者页面源码方法去找，可能最后徒劳无功。下面我来介绍利用chrome浏览器来查找元素绑定的事件。只需要通过chrome浏览器以下三个功能就可以轻松找到绑定事件了。
......
433
0
0
2022-04-12
1.添加图标到浏览器窗口，两种方式1）地址栏右侧，如下图：manifest代码如下："browser_action": {
"default_icon": "images/icon.gif",
// 直接定义插件图标
"default_popup": "popup.html"
// 插件弹窗html
},
更多资料参考：h
......
445
0
0
2022-04-12
过去几天，我在 Ubuntu Linux系统上遇到了一个奇怪的问题。我用的是 Firefox 浏览器和 Brave 浏览器。Brave 浏览器一直报“network change detection”错误，几乎每次刷新都报错，但是在 Firefox 浏览器中一切正常。
这个问题严重到了几乎不能使用浏览器的地步。我不能用
......
533
0
0
2022-04-11
前言本文暂未涉及Performance面板的内容。后续会单独出一篇，以下是目录：常用命令和调试黑盒脚本：Blackbox Script控制台内置指令远程调试WebView1、Chrome Devtools 的用处前端开发：开发预览、远程调试、性能调优、bug跟踪、断点调试等后端开发：网络抓包、开发调试Response测试：服务端API数据是否正确、审查页面元
......
508
0
0
2022-04-11
工欲善其事必先利其器，今天长话短说，介绍13个敏捷、高效的Chrome插件根据使用方式，本人将其划分为三大类：开发者工具日常效率工具类浏览器管理类开发者工具1. Web DeveloperWeb Developer 这款扩展集成了各种各样的 Web 开发工具，几乎是网页开发人员必备的 Chrome 开发者工具扩展插件，Web Developer插件的工具栏很
......
355
0
0
2022-04-09
web端产品经理在日常操作系统时，难免会遇到BUG。由于一个系统是由前端开发工程师和后端开发工程师共同开发的，产品经理在提BUG时，如果能定位到问题是出在前端还是后端，提供有价值的信息给到开发工程师，这样能大大提高彼此的工作效率。运用“F12”键打开“开发者工具”，就能灵活定位系统前后端BUG。开发者工具的基本介绍“开发者工具”常用于网站界面测试、调试，分
......
660
0
0
2022-04-06
配图与本文无关前端开发中，有一个重要的技能，叫做断点调试。利用chrome开发者工具中的断点调试，我们能够一步步观察JavaScript的执行过程，直观感知函数调用栈、作用域链、变量对象、闭包、this等关键信息的变化。因此，断点调试对于快速定位代码错误，以及快速了解代码的执行过程有着非常重要的作用，这也是我们前端开发必不可少的一个高级技能。当然如果你对Ja
......
410
0
0
2022-03-31
1. 查看元素伪类 css 样式例如我想查看元素触发 hover 时的 css 样式。先选中该元素，然后按下图操作：2. 临时增删元素 class3. document.body.contentEditable="true"在控制台输入 document.body.contentEditable="true"，就可以对页面直接进行编辑。4. 查看 place
......
385
0
0
2022-03-27
常用 console 命令打印对象解构打印多个变量的时候，单纯打印变量，不显示变量名称，不利于阅读，而用大括号(`{}`)将变量包围起来。这样的优点是不仅会把变量的值打印，同时还会将变量名打印出来。log占位符格式字符（%s）、整数（%d）、浮点数（%f）、根据css格式化字符串（%c）和对象（%o）(%O)使用console.table将复合类型的数据转为
......
339
0
0
2022-03-27
chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框，而且textarea还可以任意拖动放大，这样不但影响外观，而且有时候拖动textarea还会使页面布局错乱，我们如何解决呢？看下面代码。取消chrome下input和textarea的聚焦边框： input,button,select,textarea{outline
......
392
0
0
2022-03-22
Google Chrome 浏览器默认使用单个 TCP 连接进行下载。可以在设置里启用 Parallel downloading （并行下载）选项来实现下载提速。在 Chrome 地址栏内输入 chrome://flags/#enable-parallel-downloading 并回车；在右侧下拉菜单中选择
......
416
0
0
2022-03-06