我有一些带有图像标签的 HTML 和一些像这样的 jQuery:
<body>
<img id="MainImage" src="../img/MainImage.png" style="position: absolute;">
<script type="text/javascript">
$(document).ready(function() {
var $img = $("#MainImage");
$img.hide();
$('div').mousemove(function(e) {
if ($(this).attr('align') === 'center') {
// only show if the align attribute has value center
$img.fadeIn(0);
$img.offset({
top: e.pageY - $img.outerHeight()-2,
left: e.pageX - ($img.outerWidth()-18)
});
}
}).mouseleave(function() {
$img.fadeOut(250);
});
</script>
</body>
我还有包含以下代码的 list 文件:
{
"name": "Div Image Test",
"version": "1.0",
"manifest_version": 2,
"permissions": [
"tabs", "http://*/*"
],
"content_scripts": [{
"matches": ["http://*/*"],
"js": ["js/CoreTest.html"],
"run_at": "document_end"
}]
}
此脚本/扩展的用途是,每当用户将鼠标悬停在任何 div 上(具有 HTML 属性“align='center'”)时,鼠标光标旁边会弹出一个图像......这已经有效,但是什么我需要做的是在安装扩展程序时将脚本/HTML 文件插入到每个网页的“正文”标签中。
我怎样才能做到这一点?
提前致谢。
最佳答案
我不知道您将如何在 Chrome 扩展中执行此操作,但是,如果您对用户脚本感到满意:
创建一个文件并在其顶部放置一个用户脚本 header ,用于描述您的应用程序并包含您的名字等。 这样您就可以使用 JS(img 标签)创建您需要的所有元素,并将悬停绑定(bind)到所有 img。我自己写了这样一个脚本,但用于 Instapaper。这是来源:
安装程序.user.js
// ==UserScript==
// @name Instalater
// @namespace http://jcla1.com
// @description Read Later for Instapaper
// @include *
// ==/UserScript==
function load() {
code = document.createElement('script');
code.type = 'text/javascript';
code.innerText = "$(document).keydown(function(e){if (e.keyCode == 120){(function iprl5(){var d=document,z=d.createElement('scr'+'ipt'),b=d.body,l=d.location;try{if(!b)throw(0);d.title='(Saving...) '+d.title;z.setAttribute('src',l.protocol+'//www.instapaper.com/j/4VJPghE8ugQm?u='+encodeURIComponent(l.href)+'&t='+(new Date().getTime()));b.appendChild(z);}catch(e){alert('Please wait until the page has loaded.');}})();void(0);return false;}})";
document.body.appendChild(code);
};
jq = document.createElement('script');
jq.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js';
jq.type = 'text/javascript';
document.body.appendChild(jq);
setTimeout(load, 1000);
关于javascript - 将 .html 文件的内容添加/注入(inject)到访问的每个网站 - Chrome 扩展?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13410586/