我正在构建Chrome扩展程序.我试图让我的应用程序与扩展程序中的每个页面以及用户在浏览器中查看的页面进行通信.我需要从扩展程序访问dom然后更新它.
manifest.json
popup.html
popup.js
background.js
content.js
Run Code Online (Sandbox Code Playgroud)
以及用户正在查看的当前页面.
我的目标是在页面加载时修改dom并在用户看到之前向用户显示新版本的页面.在popup.js用户中允许在弹出窗口中输入关键字.关键字被保存到localStorage他们查看网页时,通过使关键字的父div隐藏(如果在他们正在查看的任何页面上找到关键字),将关键字从其视图中删除.
我需要帮助让每个页面进行通信,我认为我在popup.js中隐藏父div的方式不起作用.我对如何从前面对dom执行操作感到困惑.
将dom发送到background.js在页面上查找关键字并将其父div更改为hidden.将dom推回查看页面.
我认为这句话是说如果我匹配任何网址然后运行我的应用程序,但我不确定.
"matches": ["*://*/*"],
Run Code Online (Sandbox Code Playgroud)
我的manifest.json
{
"name": "Wuno Zensoring",
"version" : "1.0",
"permissions": [
"activeTab",
"tabs",
"storage"
],
"description": "This extension will search the document file for keywords and hide their parent div.",
"icons": {
"19": "icon19.png",
"38": "icon38.png",
"48": "icon48.png",
"128": "icon128.png"
},
"background": {
"persistent": false,
"scripts": ["jquery-1.11.3.min.js","background.js"]
},
"content_scripts": [{
"matches": ["*://*/*"],
"js": ["content.js"],
"run_at": "document_end",
"all_frames": true
}],
"web_accessible_resources": [
"popup.js", "content.js"
], …Run Code Online (Sandbox Code Playgroud) 我想通过浏览器操作按钮打开它时更新popup.html中的html.popup.js应该向当前选项卡上运行的内容脚本发送消息,并且应该收到响应并更新html.但是,内容脚本不会收到任何消息,因此不会发送正确的响应.
Content.js
var text = "hello";
chrome.runtime.onMessage.addListener(
function(message, sender, sendResponse) {
switch(message.type) {
case "getText":
sendResponse(text);
break;
}
}
);
Run Code Online (Sandbox Code Playgroud)
Popup.js
chrome.tabs.getCurrent(function(tab){
chrome.tabs.sendMessage(tab.id, {type:"getText"}, function(response){
alert(response)
$("#text").text(response);
});
});
Run Code Online (Sandbox Code Playgroud)
的manifest.json
{
"manifest_version": 2,
"name": "It's Just A Name",
"description": "This extension is able to",
"version": "1.0",
"permissions" : ["tabs"],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html",
"default_title": "Click here!"
},
"content_scripts": [
{
"matches": ["https://*/*"],
"js": ["jquery.min.js","content.js"]
}]
}
Run Code Online (Sandbox Code Playgroud)
Popup.html
<!doctype html>
<html>
<head>
<title>Title</title>
<style>
body {
font-family: "Segoe UI", …Run Code Online (Sandbox Code Playgroud) 我正在编写 chrome 扩展程序并有一个问题。
我的扩展中有一些 .html 页面,让它成为“popup.html”。我将内容脚本注入某个页面,该脚本在新选项卡中打开一个“popup.html”,其中包含“var p = window.open(chrome.extension.getURL('/popup.html'), "popup" )',它完美地工作。接下来,我需要将一些数据传递给这个窗口,但我不知道如何以简单的方式做到这一点。
出于某种原因,我无法从内容脚本中调用子窗口的函数
var p = window.open(chrome.extension.getURL('/popup.html'), "popup");
p.foo(data);
Run Code Online (Sandbox Code Playgroud)
在控制台中,我看到Uncaught TypeError: Cannot call method 'foo' of undefined message。
我无法在查询字符串中传递数据,因为数据实在是太大了。
有没有一种优雅而简单的方法将数据传递给这种窗口?我考虑过消息传递,但是如何使用背景页面有效地获取新打开的窗口的标签 ID?
非常感谢。
UPD:我尝试反转逻辑并使用 'window.opener.foo()' 从父窗口获取数据,但在新打开的选项卡中window.opener返回null。