简单的edge浏览器插件开发记录

今天在浏览某些网页的时候,我想要屏蔽掉某些信息或者修改网页中的文本的颜色、背景等等。于是在浏览器的控制台中直接输入JavaScript操作dom完成了我想要的功能。但是每次在网页之间跳转该功能都会消失,我需要反复复制粘贴js脚本,无法实现自动化。于是我开始了解如何自动让JavaScript脚本在特定的url下生效。

经过查找信息,我得知了可以通过开发一个edge的小插件来解决我遇到的需求。

edge插件的核心是mahifest文件。该文件中规定了插件的版本号、插件应用的网页,引入的html、js等文件。

1. manifest文件和js文件

首先创建一个manifest文件,该文件中需要写入一个json。matches中的url即是插件应用的网页。js文件需要自己编写。

manifest文件:

{"manifest_version": 3,"name": "我的简单小插件","version": "1.0","description": "替换掉网页中的文字和字体类型","content_scripts": [{"matches": ["https://www.baidu.com/*"],"js": ["content.js"]}]

js文件:

//将id为content的标签中的“编程语言”改成“Java”,并将文本字体改为黑体
document.getElementById("content").innerHTML=document.getElementById("content").innerHTML.replace("编程语言","Java");
document.getElementById("content").style.fontFamily="黑体";

2. 将编写的插件应用到浏览器中

首先确保manifest.json文件和content.js文件位于同一本地路径下。接着打开浏览器扩展。

在这里插入图片描述
点击加载解压缩的扩展,找到存放manifest.json的文件夹,选中即可。
在这里插入图片描述

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

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

相关文章

【数据分享】2001~2020年青藏高原植被净初级生产力数据集

各位同学们好,今天和大伙儿分享的是2001~2020年青藏高原植被净初级生产力数据集。如果大家有下载处理数据等方面的问题,您可以私信或评论。 朱军涛. (2022). 青藏高原植被净初级生产力数据集(2001-2020). 国家青藏高原数据中心. …

Rust 学习笔记 - Hello world

前言 本文将讲解如何完成一个 Rust 项目的开发流程,从编写 “Hello, World!” 开始,到使用 Cargo 管理和运行项目。 编写 Hello world 开始一个新项目很简单,首先,创建一个包含 main.rs 文件的 hello_world 文件夹,…

错误处理 ssh登陆提示:server unexpectedly closed network connection

干了一天的活,因为对etc做权限操作,导致ssh不能连接,差点奔溃 记这次处理经验 因修改/etc/ssh权限导致的ssh不能连接异常解决方法 现象: $ssh XXX192.168.5.21 出现以下问题 Read from socket failed: Connectionreset by peer …

在Visual Studio中搭建Dynamo Python开发环境,效率飞一般的增长

最近在学习Dynamo中Python Script的用法,发现这个东西用起来太不友好了,不支持自动缩进,不支持自动填充和提示。用过Visual Studio做二开的都知道,在引用了Revit api以后,就可以自动填充和提示了。 本来英语就不好&am…

图像识别基础之模板匹配

principle 图像匹配 本质:图像的相似度很高(矩阵的相似度很高) code /*\brief 我的图像匹配函数,获取差方和均值最小的矩阵作为结果\param srcPicFile:用以匹配的图像文件\param templatePicFile:模板图像文件\param destPicFile:输出的检测结果文件…

一周学会Django5 Python Web开发-项目配置settings.py文件-数据库配置

锋哥原创的Python Web开发 Django5视频教程: 2024版 Django5 Python web开发 视频教程(无废话版) 玩命更新中~_哔哩哔哩_bilibili2024版 Django5 Python web开发 视频教程(无废话版) 玩命更新中~共计17条视频,包括:2024版 Django5 Python we…

【Linux内核】从0开始入门Linux Kernel源码

🌈 博客个人主页:Chris在Coding 🎥 本文所属专栏:[Linux内核] ❤️ 前置学习专栏:[Linux学习]从0到1 ⏰ 我们仍在旅途 ​ 目录 …

Qt:Qt3个窗口类的区别、VS与QT项目转换

一、Qt3个窗口类的区别 QMainWindow:包含菜单栏、工具栏、状态栏 QWidget:普通的一个窗口,什么也不包括 QDialog:对话框,常用来做登录窗口、弹出窗口(例如设置页面) QDialog实现简易登录界面…

GET 和 POST 方法有什么区别?

1.概述 当客户端通过 Web 与服务器通信时,此过程由超文本传输​​协议 ( HTTP) 启用。HTTP 是客户端和服务器之间的请求-响应协议。 GET 和 POST 方法是两种最常见的HTTP 请求方法。它们用于检索数据或将数据发送到服务器。它们是客户端-服务器模型的组成部分&…

Lua内存管理策略

传统的内存管理策略主要分为两种:引用计数,和垃圾回收。相比后者每一段时间执行一次回收周期,前者是对于每一个变量都维护被引用数的策略。对于Lua这种轻量化语言而言,占据大内存的开销是极力避免的,而前者的方式显然是…

文件夹删不掉,显示在另一个文件中打开怎么办

问题: 一、想要删掉这个文件夹,却因为文件夹中的文件打开了删不掉,这里我因为做的测试,所以是知道打开了什么 二、一般情况下文件比较多时,是不知道打开了什么的,长这个样子 解决: 一、打开任…

《Go 简易速速上手小册》第4章:接口与抽象(2024 最新版)

文章目录 4.1 接口的定义与实现 - Go 语言的多面手4.1.1 基础知识讲解4.1.2 重点案例:动物乐队功能描述实现代码 4.1.3 拓展案例 1:通用支付系统拓展案例 1:通用支付系统功能描述实现代码 4.1.4 拓展案例 2:动物园管理器拓展案例 …