前端油猴脚本开发小技巧笔记

  • 调试模式下,单击选中某dom代码,控制台里可以用$0访问到该dom对象。

  • $0.__vue___ 可以访问到该dom对应的vue对象。

  • jquery 对象 a,a[0]是对应的原生dom对象,$(原生对象) 得到对应的 jquery 对象。

  • jquery 选择器,加空格是匹配下一级,紧密排列是且,[a=b]匹配属性。jquery对象find可以继续筛选下一级。

  • 控制台直接输入函数名,可以打印出该函数的代码,继续点击代码可以跳转到对应的代码位置。

  • 查找某个按钮绑定的vue原始函数,可以通过1、2、5来找。

  • 监听属性

    1. function spyObjSetter(obj, prop, func, spyId) {const propertyName = Object.getOwnPropertyDescriptor(obj, prop);var setter = propertyName.set;if(spyId && propertyName.set['spyId'] == spyId) {return;}var proObj = {set(value) {var old = obj[prop];setter.call(obj, value);if(old != value) {func(old, value);}}}if(spyId) {proObj.set['spyId'] = spyId;}Object.defineProperty(obj, prop, proObj);
      }function spyObjGetter(obj, prop, func) {const propertyName = Object.getOwnPropertyDescriptor(obj, prop);var getter = propertyName.get;Object.defineProperty(obj, prop, {get() {getter.call(obj);func();}});
      }
  • 监听函数

      Function.prototype.after = function(fun){var self = this;return function(){var agent = self.apply(this,arguments);fun.apply(this,arguments);return agent;}}Function.prototype.before = function(fun){var self = this;return function(){fun.apply(this,arguments);var agent = self.apply(this,arguments);return agent;}}getUser = getUser.before(function(){//代码}).after(function(){//代码})
  • setTimeout这么写 setTimeout(function(){vueAopOne()}, 500);    

  • 无法监听的到值可以无脑setTimeout低配替代。

  • 查找某个按钮绑定事件是哪个函数,可以某个执行位置打断点,然后向上查找调用栈,再利用5查找。

  • vue对象可以通过parent和child来寻找指定对象。

  • vue代码method里的方法位置是vue对象的根目录,data里的变量也是。

  • vue.$opition.propsData 是属性位置。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/50982.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

git基础教程(24) git reflog查看引用日志

文章目录 1、`git reflog`命令说明2、`git reflog`命令显示内容3、具体的用法4、引起ref变化的操作有git reflog 命令是用来恢复本地错误操作很重要的一个命令,所以在这里对它进行一下整理。 1、git reflog命令说明 reflog翻译:Reference logs(参考日志) git reflog命令:…

数据结构:二叉树及相关操作

文章目录 前言一、树的概念及结构1.什么是树2. 树的相关概念3.树的表示 二、二叉树概念及结构1.二叉树概念2.特殊的二叉树3.二叉树的性质4.二叉树的存储结构 三、平衡二叉树实现1.创建树和树的前中后遍历1.前中后遍历2.创建树且打印前中后遍历 2.转换为平衡二叉树和相关操作1.转…

解密长短时记忆网络(LSTM):从理论到PyTorch实战演示

目录 1. LSTM的背景人工神经网络的进化循环神经网络(RNN)的局限性LSTM的提出背景 2. LSTM的基础理论2.1 LSTM的数学原理遗忘门(Forget Gate)输入门(Input Gate)记忆单元(Cell State)…

【面试题】:前端怎么实现权限设计及遇到的bug

一.权限的概念 前端权限分为页面权限、按钮权限、API权限。 二.页面权限的实现过程 ①用户登录进去调用获取用户信息接口,后端会给我们返回一个权限标识符 ②在获取到数据之后,我们就要判断用户能访问到哪些页面,我们可以在vuex中permission模块中的action…

分布式与集群的定义及异同

分布式与集群的定义及异同 分布式定义优点不足 集群优点不足 异同 分布式 定义 分布式是指将一个系统或应用程序分散到多个计算机或服务器上进行处理和管理的技术。它是指多个系统协同合作完成一个特定任务的系统。例如,可以将一个大业务拆分成多个子业务&#xf…

macos 使用vscode 开发python 爬虫(安装一)

使用VS Code进行Python爬虫开发是一种常见的选择,下面是一些步骤和建议: 安装VS Code:首先,确保你已经在你的macOS上安装了VS Code。你可以从官方网站(https://code.visualstudio.com/)下载并安装最新版本…

软件测试技术分享丨遇到bug怎么分析?

为什么定位问题如此重要? 可以明确一个问题是不是真的“bug” 很多时候,我们找到了问题的原因,结果发现这根本不是bug。原因明确,误报就会降低 多个系统交互,可以明确指出是哪个系统的缺陷,防止“踢皮球…

vue3范围选择组件封装

个人项目地址: SubTopH前端开发个人站 (自己开发的前端功能和UI组件,一些有趣的小功能,感兴趣的伙伴可以访问,欢迎提出更好的想法,私信沟通,网站属于静态页面) SubTopH前端开发个人站…

react 11之 router6路由 (两种路由模式、两种路由跳转、两种传参与接收参数、嵌套路由,layout组件、路由懒加载)

目录 react路由1:安装和两种模式react路由2:两种路由跳转 ( 命令式与编程式)2-1 路由跳转-命令式2-2 路由跳转-编程式 - 函数组件2-2-1 app.jsx2-2-2 page / Home.jsx2-2-3 page / About.jsx2-2-4 效果 react路由3:函数…

mysql 8.0 窗口函数 之 分布函数 与 sql server (2017以后支持) 分布函数 一样

mysql 分布函数 percent_rank() :等级值 百分比cume_dist() :累积分布值 percent_rank() 计算方式 (rank-1)/(rows-1), 其中 rank 的值为使用RANK()函数产生的序号,rows 的值为当前…

webSocket原理

webSocket三次握手 **1.客户端发送WebSocket握手请求:**当客户端想要建立WebSocket连接时,他会发送一个HTTP请求到服务器,HTTP协议版本不能低于1.1,GET请求到服务器,这个请求通常称为握手请求,其中包含一些…

进行Stable Diffusion的ai训练怎么选择显卡?

Stable Diffusion主要用于从文本生成图像,是人工智能技术在内容创作行业中不断发展的应用。要在本地计算机上运行Stable Diffusion,您需要一个强大的 GPU 来满足其繁重的要求。强大的 GPU 可以让您更快地生成图像,而具有大量 VRAM 的更强大的…

奥威BI数据可视化工具:个性化定制,打造独特大屏

每个人都有自己独特的审美,因此即使是做可视化大屏,也有很多人希望做出不一样的报表,用以缓解审美疲劳的同时提高报表浏览效率。因此这也催生出了数据可视化工具的个性化可视化大屏制作需求。 奥威BI数据可视化工具:个性化定制&a…

在Linux系统上安装和配置Redis数据库,无需公网IP即可实现远程连接的详细解析

文章目录 1. Linux(centos8)安装redis数据库2. 配置redis数据库3. 内网穿透3.1 安装cpolar内网穿透3.2 创建隧道映射本地端口 4. 配置固定TCP端口地址4.1 保留一个固定tcp地址4.2 配置固定TCP地址4.3 使用固定的tcp地址连接 Redis作为一款高速缓存的key value键值对的数据库,在…

消息队列——RabbitMQ(一)

MQ的相关概念 什么事mq MQ(message queue),从字面意思上看,本质是个队列,FIFO 先入先出,只不过队列中存放的内容是 message 而已,还是一种跨进程的通信机制,用于上下游传递消息。在互联网架构中&#xff…

(四)、Springboot+Redisson实现分布式锁封装为starter

1、为什么要使用分布式锁? 在分布式,微服务环境中,我们的服务被拆分为很多个,并且每一个服务可能存在多个实例,部署在不同的服务器上。 此时JVM中的synchronized和lock锁,将只能对自己所在服务的JVM加锁,而跨机器,跨JMV的场景,仍然需要锁的场景就需要使用到分布式锁…

【Python爬虫案例】爬取大麦网任意城市的近期演出!

老规矩,先上结果: 含10个字段: 页码,演出标题,链接地址,演出时间,演出城市,演出地点,售价,演出类别,演出子类别,售票状态。 代码演示…

一款打工人必备的电脑端自律软件!!冲鸭打工人!!

你!有没有渴望进步!! 你!有没有渴望变强!!! 成为大佬!!!超越巨佬!!! 这就是一款为这样的你量身定做的程序:输入…

vue3 tailwindcss的使用

首先安装依赖: npm install -D tailwindcsslatest postcsslatest autoprefixerlatestnpm i -D unocss 然后vite.config.ts中 引入 import Unocss from unocss/viteexport default defineConfig({plugins: [Unocss(),],})终端执行: npx tailwindcss in…

html怎么插入视频?视频如何插入页面

html怎么插入视频&#xff1f;视频如何插入页面 HTML 的功能强大&#xff0c;基本所有的静态效果都可以在此轻松呈现&#xff0c;各种视频网站内有大量的视频内容&#xff0c;本篇文章教你如何在 html 中插入视频 代码如下&#xff1a; <!DOCTYPE html> <html> …