我有一个简单的Chrome扩展程序,它使用内容脚本功能来修改网站.更具体地说,background-image所述网站.
出于某种原因,我似乎无法使用本地图像,即使它们被包装在扩展中.
body {
background: #000 url('image.jpg') !important;
background-repeat: repeat !important;
}
就是这样,最简单的CSS ......但它不起作用.浏览器不加载图像.
我已经尝试了很多方法(所有文档化的程序),在检查onUpdated.addListener上的URL时将脚本注入特定页面.最后,带有'executioncript'的下面代码似乎有效,但并不完美.我能够获取警报,但无法通过getElementById/getElementsByName查找页面的文档元素.
当我检查页面时,脚本被注入.但在错误控制台中,我得到:
拒绝加载chrome-extension://jfeiadiicafjpmaefageabnpamkapdhe/js/Leoscript.js.资源必须列在web_accessible_resources清单键中,以便由扩展名外的页面加载.
manifest.json的:
{
"name": "Leo Extension for Job Boards",
"version": "1.6",
"manifest_version": 2,
"content_security_policy": "script-src 'self'; object-src 'self'",
"description": "Leo Extension",
"background": {
"scripts": ["js/Leojshelper.js"],
"persistent": true
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["js/eventPage.js"],
"run_at" : "document_start"
}
],
"icons":{"48":"images/bob48.png", "128":"images/bob128.png"}, //Define any icon sizes and the files that you want to use with them. 48/128 etc.
"browser_action": {
"default_icon": "images/bob.png", // What icon do you want to display on the chrome toolbar
"default_popup": "LeoExtwatch.html" // The …我正在尝试制作一个半可重复使用的小部件,但我遇到了一个问题.我试图在阴影根中封装一些CSS代码,这样它就不会影响网页的其余部分,但是这个CSS用于多个小部件,所以我试图包含一个远程样式表.我找到的所有例子都没有使用远程样式表,我想知道这是否可行.
EX:
<template id="templateContent">
<head>
<link rel="stylesheet" href="css/generalStyle1.css">
</head>
<body>
<div class="affectedByGeneralStyle1"></div>
</body>
</template>
用于包含模板的脚本:
<div id="host"></div>
<script>
var importedData = (html_import_element).import.getElementById("templateContent");
var shadow = document.querySelector('#host').createShadowRoot();
var clone = document.importNode(importedData.content, true);
shadow.appendChild(clone);
</script>