5 分钟带你写个自己的 Chrome 扩展和油猴脚本
苏生不惑第篇原创文章,将本公众号设为星标,扩展第一时间看最新文章。源码源码
前几天分享过文章实用油猴脚本推荐,扩展让你的源码源码和平精英指标源码谷歌浏览器更强大(二),有人问如何自己写个油猴脚本,扩展今天就来分享如何写个自己的源码源码Chrome扩展和油猴脚本。
一个 Chrome 扩展其实就是扩展一个配置文件manifest.json和一系列html、css、源码源码js文件的扩展集合,只要有一点点前端的源码源码基础,写一个简单的扩展扩展还是很简单的。
这里就带你5分钟写个简单的源码源码扩展,功能就是扩展点击链接在新标签页打开,chrome_extension扩展目录结构如下:
一个icon文件,lib目录下一个jQuery文件(如果不依赖jQuery库可以不需要),一个配置文件manifest.json以及一个编写代码的文件url.js,就这4个文件行了。
先来看看manifest.json文件里的内容,主要在content_scripts加载的js文件:
其实要写的代码就是url.js里的3行:
扩展代码写好了就可以安装到谷歌浏览器了,具体如何安装看之前文章上不了谷歌如何安装 Chrome 扩展?,打开chrome://extensions/,点击加载已解压的扩展程序,就是chrome_extension目录。
就这样安装好了,测试下没问题,原来写扩展就是这么简单,5分钟搞定,当然这只是github源码怎么复制个demo,下面来看看大名鼎鼎的油猴扩展怎么写的, 谷歌浏览器的扩展默认安装目录为 C:\Users\xxx\AppData\Local\Google\Chrome\User Data\Default\Extensions ,xxx为你的Windows用户名 ,先在扩展里找到油猴的id为 dhdgffkkebhmkfjojejmpbldmpobfkfo
找到油猴扩展的源代码目录 C:\Users\xxx\AppData\Local\Google\Chrome\User Data\Default\Extensions\dhdgffkkebhmkfjojejmpbldmpobfkfo\4._0 ,这个manifest.json文件写得就复杂多了。
顺便提下怎么备份Chrome扩展,这样方便迁移到新电脑使用,这个在之前文章也分享过了那些你可能不知道的谷歌浏览器实用技巧。
导出生成的crx文件就可以分享给他人使用了。
最后如果你想发布扩展到谷歌商店供他人安装,可以在谷歌管理后台提交你的扩展,不过需要5美元的费用。
写油猴脚本就更简单了,先安装好油猴扩展, 然后直接新建脚本。
脚本内容如下:
然后导出你写的脚本文件,这样方便给其他人安装使用。
同样的也可以在 greasyfork.org/zh-CN/sc... 发布你的脚本,比如之前分享过的油猴脚本实用油猴脚本推荐,让你的谷歌浏览器更强大
除了写Chrome扩展和油猴脚本,让浏览器运行脚本还有个更简单的方法就是书签。
先添加一个网页到书签然后修改,复制这段代码到网址里:javascript:"use strict";!(function(){ document.querySelectorAll("a").forEach(function(item,index,arr){ item.target='_blank';});})();
使用的时候点击网页上方的新标签打开网页就行了,比Chrome扩展和油猴麻烦点。
顺便分享2个书签代码,第一个是显示密码,默认输入密码的地方是星号*javascript:"use strict";!function(){ for(var tag=document.getElementsByTagName("input"),i=0;i
第二个是自由编辑网页javascript:"use strict";!function(){ "true"===document.body.getAttribute("contenteditable")?(document.body.setAttribute("contenteditable",false),alert("关闭自由编辑网页了!")):(document.body.setAttribute("contenteditable",true),alert("可以自由编辑网页了!"))}();
谷歌扩展开发教程(一)扩展开发的银行源码源代码基础知识
在本谷歌扩展开发教程的第一部分,我们将学习创建一个简单的"Hello, Extensions"示例,并了解扩展的基础知识。首先,你需要在本地创建一个扩展项目文件夹,可以自行创建或者从GitHub获取源代码。
在新文件夹内,创建一个名为manifest.json的文件,这是扩展的核心配置文件,定义了扩展的功能和图标,如Chrome操作的图标和弹出窗口的HTML页面。记得将示例中的default_icon替换为实际图标路径。
接下来,为弹出窗口创建一个名为hello.html的文件,确保在其中使用UTF-8编码的中文。在开发者模式下,你可以通过解压扩展并加载来验证这些文件是否正确。
在清单文件中修改扩展名称,保存后刷新扩展页面查看更改。同时,开发者模式下可以利用控制台日志进行调试。在hello.html中添加一个脚本标签,如popup.js,以查看控制台输出。
故意引入错误,如删除popup.js的结束引号,可以观察到错误日志并进行调试。请注意,manifest.json文件应始终位于项目根目录以确保正确构建。
Chrome扩展推荐:一键解锁网站右键菜单,防止qq举报源码从此再不受限制
在浏览网页时,有时会遇到无法复制文本、使用右键菜单的问题,这无疑对用户体验造成影响。为解决这类困扰,我们推荐一款名为“破解右键锁”的Chrome扩展。
这款扩展旨在解锁网站的右键菜单功能,包括复制、选择文本等常用操作。与某些功能相似的扩展如“Enable Copy”相比,“破解右键锁”在用户反馈中表现出更强的实用性。
以知乎网站为例,即使启用其他扩展无法解锁其右键菜单,但“破解右键锁”却能实现这一功能。不仅如此,它还能解锁其他菜单选项,为用户带来更加灵活的操作体验。
“破解右键锁”还提供了一个便捷选项,用于关闭当前网站的JavaScript功能,避免某些网站过于严格的右键限制。
尽管这项功能可以在浏览器设置中实现,但“破解右键锁”通过增加一个快捷入口,使得用户更加方便地调用这一功能。
安装此扩展后,用户在禁用了右键菜单的网站上将能够不受任何限制地进行复制、粘贴操作。此外,它还允许用户使用Chrome自带的源代码查看器,更深入地了解网站的个人发卡源码正版源码。
值得注意的是,“破解右键锁”主要针对禁用右键菜单的网页,对于普通网站而言,并不需要此类功能。通过使用这款扩展,用户将能够更好地控制自己的浏览体验,享受更加便捷、高效的网页操作。
手写一个简单的谷歌浏览器拓展插件(附github源码)
手写谷歌浏览器插件教程:简易实现与代码详解
首先,让我们通过一个直观的示例来启动创建过程。点击浏览器地址栏输入 chrome://extensions/,即可直接访问扩展程序管理界面。 核心配置文件是 manifest.json,这个文件记录了插件的基本信息,如名称、描述、权限等,是插件身份的身份证。 当插件被激活时,用户会看到一个弹出层,这是通过编写 popup.html 来实现的,它包含了一个简单的HTML界面,用于交互或显示信息。 为了保持代码的清晰,我们把相关的脚本逻辑分离到单独的 popup.js 文件中,这样也支持使用 script 标签直接嵌入。在该文件中,我们将实现插件的核心功能。 此外,我们还需要一个辅助文件 inject.js,它的任务是将特定的代码注入到目标网页,实现所需功能,如上图所示。 整个项目的目录结构清晰可见,便于管理和维护。但这里只是基础部分,更多功能的实现和优化将在后续篇章中详细介绍。谷歌浏览器乱码怎么解决
解决谷歌浏览器乱码问题,需要关注网页编码设置。当遇到乱码情况,首先要通过F打开浏览器控制台,查看文档的编码方式。确保网页源码编码与文档显示的编码一致。
若编码不一致,需要通过安装名为Charset的扩展程序来解决。下载Charset扩展程序后,先将压缩包文件重命名为zip格式,再解压,找到crx后缀的文件进行安装。安装时,进入浏览器扩展程序页面,开启开发者模式,加载已解压的扩展程序。
安装完毕后,Chrome浏览器会显示Charset插件图标。点击该图标即可手动修改当前网页的编码,选择GBK、GB、UTF-8等格式进行切换。操作步骤清晰明了,对于解决谷歌浏览器网页乱码问题提供了有效方法。
总结而言,解决谷歌浏览器乱码的关键在于确认并调整网页编码设置。通过简单的操作步骤,如检查编码、安装扩展程序、修改编码,便能有效解决乱码问题,确保浏览体验流畅。希望以上信息能为遇到此问题的用户提供帮助。
谷歌浏览器版本查看编码方法介绍
1、下载地址2通过扩展程序图标设置网页编码 鼠标左键点击Charset扩展程序图标,会弹出下图所示的编码设置功能,选择设置编码即可3通过右键菜单设置网页编码 在网页中点击鼠标右键,在弹出的菜单上选择quotCharsetquot,就可以选择。
2、打开谷歌浏览器,找到图中红色框内所示图案,点击在下拉列表中找到设置,并点击进入 在打开的新页面内找到“显示高级设置”,点击它展开高级设置找到“网络内容”一栏中的“自定义字体”,点击进入在弹出的窗口中找到最后。
3、1打开chrome浏览器,点击三横,选择设置 2在设置页面中找到网络内容,点击自定义字体 3在弹出来的对话框中,将滑块拉倒最下方,在编码中选择合适的编码,点击完成。
4、查找Ctrl + F 编码到Chorme应用商店安装“Charset”插件。
5、版本之后google已经移除了这个选项,想要更改只能装第三方插件Set Character Encoding。
6、首先我们打开开发者工具,你可以直接在页面上点击右键,然后选择审查元素或者在Chrome的工具中找到或者你直接记住这个快捷方式 Ctrl+Shift+I 或者Ctrl+Shift+J直接打开控制台,或者直接按F打开的开发者工具就长下面的。
7、下载使用chrome插件扩展应用Charset直接下载使用扩展工具,就好了。
8、1打开谷歌浏览器,找到图中红色框内所示图案,点击2在下拉列表中找到设置,并点击进入3在打开的新页面内找到“显示高级设置”,点击它展开高级设置4找到“网络内容”一栏中的“自定义字体”,点击进入5在。
9、软件工具谷歌浏览器 版本 m 方法一在所在页面,鼠标右击弹出菜单,选择“查看网页源代码”方法二在所在页面,按ctrl+u快捷键打开查看网页源代码页面方法三在所在页面,按F打开开发者调试页面。
、首先打开目标网页1在网页上单击鼠标右键,选择“查看网页源代码”2在源代码头部找到如下代码如下图,网页编码方式为gbk。
、打开谷歌浏览器,打开浏览器设置,在设置中找到关于谷歌浏览器这一选项关于 Chrome,点击打开就可看到安装的谷歌浏览器的版本号了。
、在主界面右上方找到并点击有竖向三个小点的符号3找到该小数点符号以后,在下拉选项中找到并点击”帮助“下的”关于googleChrome“4点击进入界面以后,就可以在当前的页面内查看谷歌浏览器的版本和相关的帮助。
、点击右上角的扳手选项基本设置,最下面有提示 安全卫士中的工具大全里也可以设置。
、查看自己用的谷歌浏览器是哪个版本1打开谷歌浏览器2在浏览器右上角,点击菜单按钮3在弹出的菜单中找到关于浏览器4点击关于浏览器在弹出的页面中就能看到版本信息了浏览器是指可以显示网页服务器或者文件。
、有些中文网页在Chrome浏览器中,显示为乱码这是因为网页标注的字符集编码与实际网页html文件编码不一致导致的一工具谷歌浏览器二方法如下首先用谷歌浏览器打开百度API Store,作为案例里面的网页打开后,看起来。
电脑中如何导出Chrome谷歌浏览器安装的扩展程序
要导出Chrome浏览器安装的扩展程序并生成相关文章,可以按照以下步骤进行:
1. 打开Chrome浏览器并点击右上角的菜单按钮(三个竖点)。
2. 选择“更多工具”>“扩展程序”。
3. 在扩展程序页面,找到要导出的扩展程序,并记下其ID(每个扩展程序都有一个唯一的ID)。
4. 在Chrome浏览器的地址栏中输入以下URL:
chrome://extensions/?id=扩展程序ID
(将“扩展程序ID”替换为要导出的扩展程序的实际ID)
5. 打开该URL后,将显示扩展程序的详细信息页面。
6. 在详细信息页面上,找到“源代码”部分,并点击“查看源代码”链接。
7. 这将打开一个新的标签页,显示扩展程序的源代码。
8. 在源代码页面上,使用浏览器的页面另存为功能(通常是右键单击页面并选择“另存为”)将源代码保存为文本文件。
保存为文本文件后,你可以使用任何文本编辑器打开这个文件,并在其中生成相关文章。源代码通常包含扩展程序的HTML、CSS、Javascript等内容,你可以根据需要提取相关信息并生成文章。
2024-11-20 16:15
2024-11-20 16:06
2024-11-20 15:13
2024-11-20 14:53
2024-11-20 14:03