Chrome插件13: 修改Css

最新推荐文章于 2024-06-06 14:35:38 发布

Q z1997

最新推荐文章于 2024-06-06 14:35:38 发布

阅读量797

点赞数

分类专栏： Chrome插件文章标签： chrome

本文链接：https://blog.csdn.net/weixin_43939924/article/details/123591372

版权

Chrome插件专栏收录该内容

15 篇文章 10 订阅

订阅专栏

本文介绍了一个名为'FirstChromePlugin'的谷歌浏览器插件的详细配置，包括浏览器动作、后台页面、权限、内容脚本等设置。通过示例HTML和JS代码，展示了如何实现插件的基本功能，如修改页面CSS、调用后台JS以及系统通知等。

摘要由CSDN通过智能技术生成

主文件

{

 "manifest_version":2,

 "name":"FirstChromePlugin",

 "version":"1.4",

 "description":"谷歌插件",
 
 "author":"Qz1997",
 
 "icons": {
	"16":"img/1.png",
	"48":"img/1.png",
	"128":"img/1.png"
 },
 "browser_action": {
	"default_icon":"img/1.png",
	"default_title":"Qz第一个插件",
	"default_popup": "html/main.html"
 },
 "background":{
	"page": "html/back.html"
 },
 "permissions": [
	"contextMenus",
	"tabs",
	
	"notifications",
	"*://*/*",
	"http://*/*",
	"https://*/*"
 ],
 "content_scripts": [
	{	
		"matches": ["<all_urls>"],
		"js": ["/js/autoBaidu1.js"],
		"run_at": "document_start"
	}
 ],
 "chrome_url_overrides":{
	
 },
 "omnibox":{
	"keyword":"bai"
 }
}

html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Qz第一个插件</title>
</head>

<body>
<h1>FirstChromePlugin</h1>
<h2>功能1</h2>

<div id="div2">
    <a href="#" id="openBack">打开后台页</a>
    <a href="#" id="getBackTitle">获取后台页标题</a>
    <a href="#" id="setBackTitle">设置后台页标题</a>
    <a href="#" id="callBackJs">调用台页JS</a>
</div>
<h2>功能2</h2>
<div id="div3">
    <a href="#" id="showBadge">显示Badge</a>
    <a href="#" id="hideBadge">隐藏Badge</a>
	<a href="#" id="popNotify">系统通知</a>
	<a href="#" id="updateCss">修改 Css</a>
</div>
</body>
<script src="../js/jquery.js" type="text/javascript"></script>
<script src="../js/qz.js" type="text/javascript"></script>

</html>

function getCurrentTable(callback){
	chrome.tabs.query({active:true,currentWindow:true},function(tabs){
		if (callback) callback(tabs.length ? tabs[0].id : null)
	})
}


function executeScript(code1) {
	getCurrentTable((tabId)=>{
		chrome.tabs.executeScript(tabId,{code:code1})
	})
}


$("#updateCss").click(o => {
	executeScript('document.body.style.fontSize="27px"')
})

Q z1997

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
Chrome插件13: 修改Css

主文件{ "manifest_version":2, "name":"FirstChromePlugin", "version":"1.4", "description":"谷歌插件", "author":"Qz1997", "icons": { "16":"img/1.png", "48":"img/1.png", "128":"img/1.png" }, "browser_action": { "default_icon":"img/1.png", "defa
复制链接

扫一扫

专栏目录