javascript-使用popup.js中的信息刷新background.js-Google Chrome扩展程序
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了javascript-使用popup.js中的信息刷新background.js-Google Chrome扩展程序,小编现在分享给大家,供广大互联网技能从业者学习和参考。文章包含3779字,纯文字阅读大概需要6分钟。
内容图文
![javascript-使用popup.js中的信息刷新background.js-Google Chrome扩展程序](/upload/InfoBanner/zyjiaocheng/678/121897326a2040eaa16d10eed0111b41.jpg)
我正在处理一些代码,这些代码从浏览器弹出窗口的文本框中获取输入,然后将输入中继到background.js,以便使用该输入过滤网页.
如果我在开始时就对background.js进行了硬编码,那么它就可以工作(因为background.js在开始时运行了一次),但是如果我将过滤放入一个函数中,该函数接收来自popup.js文本框的输入不起作用.
popup.js
$(document).ready(function(){
$('#zim').click(function(){
// Get User Input in Text Box
var author = document.getElementById('author').value;
// Pass author variable to background.js
chrome.extension.getBackgroundPage().StartFiltering(author);
});
});
background.js
function StartFiltering(person){
console.log("Starting Filtering");
console.log("person: " +person);
$( "a:contains('" + person + "')" ).closest('.post-wrapper.js_post-wrapper.wide.postlist-dense').remove();
$( ".text-upper:contains('" + person + "')" ).closest('.post-wrapper.js_post-wrapper.wide.postlist-dense').remove();
$( "a:contains('" + person + "')" ).closest('.post-wrapper.js_post-wrapper.postlist-dense').remove();
};
表现
{
"name": "Filter",
"description": "Filter out authors on homepage",
"version": "2.0",
"permissions": [
"activeTab"
],
"background": {
"scripts": ["jquery.js","background.js"],
"persistent": false
},
"icons": {
"128": "128.png"
},
"browser_action": {
"default_title": "Filter",
"default_icon": "filter.png",
"default_popup": "popup.html"
},
"manifest_version": 2,
"content_scripts": [
{
"js": ["jquery.js","background.js"],
"matches": [ "http://example.com/*"]
}
]
}
在background.js上,如果我将jQuery的三行代码放在函数外部,并将硬代码放入“ person”变量中,然后重新加载扩展名,则它将正确过滤网站. StartFiltering肯定会运行,它肯定会从用户那里获取“作者”输入,但是我认为因为background.js仅在开始时运行,所以不知道要更新文件吗?我不确定! JS和编码一般来说都是新手!
在这里搜索过,但找不到任何有相同问题的人!在此先感谢您的帮助!
编辑-解决了!
所以这就是我如何工作的…
在ExpertSystem指出我使用了background.js两次之后,我清理了清单和文件系统,以使我有4个文件:background.js,content.js,popup.js和清单.在清单的content_scripts部分中,我有jquery.js和content.js而不是以前的background.js.
每当用户在弹出文本框中输入值时,我都会popup.js发送一条消息到background.js,这非常简单:
popup.js
chrome.runtime.sendMessage({type: "new author", author:author});
我让background.js监听消息,然后,如果消息类型与从popup.js发送的消息类型匹配,则它将被阻止的作者的值存储在一个数组中(因为最终我计划保留要过滤的作者列表) ),然后将该数组作为消息发送:
background.js
chrome.runtime.onMessage.addListener(
function(request,sender,sendResponse) {
if(request.type == "new author") {
blocked.push(request.author)
}
chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
chrome.tabs.sendMessage(tabs[0].id,{filter:"author",blocked:blocked})
});
});
然后我让content.js监听消息:
content.js
chrome.runtime.onMessage.addListener(function(msg,sender){
if (msg.filter == "author"){
for (var i=0;i<msg.blocked.length;i++){
startFiltering(msg.blocked[i]);
}
}
});
仍然需要调整,但我现在正在交流所有3页内容!
解决方法:
问题
您正在将background.js用作背景页面(实际上是事件页面)和内容脚本.因此,当您访问http://example.com/*时,实际上有两个单独的background.js实例:一个实例注入了网页,另一个实例注入了生成的背景页面. (顺便说一下,启用开发人员模式后,您可以在chrome:// extensions /上访问背景页面.)
解决方案
>请勿使用与背景页面和内容脚本相同的文件.
>从popup.html将消息传递到注入到网页中的内容脚本.
>让内容脚本发挥作用(也称为过滤).
示例(?未经测试的代码警报?):
// In popup
var author = ...;
chrome.tabs.getCurrent(function(currentTab) {
chrome.tabs.sendMessage(currentTab.id, {
action: 'filter',
person: author
});
});
.
// In content script
function filter(person) {
$('a:contains(' + person + ')').
closest('.post-wrapper.js_post-wrapper.wide.postlist-dense').
remove();
...
}
chrome.runtime.onMessage.addListener(function(msg) {
if ((msg.action === 'filter') && msg.person) {
filter(msg.person);
}
});
内容总结
以上是互联网集市为您收集整理的javascript-使用popup.js中的信息刷新background.js-Google Chrome扩展程序全部内容,希望文章能够帮你解决javascript-使用popup.js中的信息刷新background.js-Google Chrome扩展程序所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错,欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 gblab@vip.qq.com 举报,一经查实,本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。