gpt4 book ai didi

javascript - 使用 Javascript 获取当前文档

转载 作者:行者123 更新时间:2023-11-28 02:29:49 25 4
gpt4 key购买 nike

我有一个 Chrome 扩展程序,当您单击图标时,它会显示一个文本字段和一个用于搜索的按钮。显示的内容基本上是从 list 中调用的 HTML 文档,如下所示:

"browser_action": {
"default_popup": "popup.html"
}

现在的问题是如何使用 JavaScript 访问浏览器中加载的当前文档?因为我想从文本字段中提取问题,然后去当前文档中查找答案。

谢谢!

编辑1:

代码:

list .json

{
"name": "SmartSearch",
"version": "1.0",
"manifest_version": 2,
"description": "Smart Search extension for Google Chrome.",
"content_scripts":
[
{
"matches": ["<all_urls>"],
"js": ["smartsearch.js"]
}
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
}

}

智能搜索.js

SmartSearch() = function (){

var x = document.title;
alert(x);
}
window.onload = SmartSearch;

popup.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Smart Search</title>
<script type="application/javascript" src="smartsearch.js"></script>
</head>
<body>
<p>Smart Search</p>
<form>
<input type="text" id="search_text_field"></input>
<input type="button" id="search_button" value="Search"/>
</form>
</body>
</html>

现在,我想做的就是当我按下扩展图标时显示当前加载页面的标题,只是为了检查我是否有权访问 DOM。问题是我得到了弹出窗口的标题。解决办法是什么?

编辑2:我发现,如果我转到某个页面,带有该页面标题的警报在加载时会出现(有一些异常(exception),例如 youtube 页面),但我想在按下扩展程序的图标时执行此操作。

最佳答案

您需要使用 content script您可以在 list 上声明如下:

  {
"name": "My extension",
...
"content_scripts": [
{
"matches": ["http://www.google.com/*"],
"css": ["mystyles.css"],
"js": ["jquery.js", "myscript.js"]
}
],
...
}

其中匹配是您将在其中使用脚本的域。这样 css 和 js 就位于文档本身内部。但如果您需要将文档中的数据发送到您的插件,则需要使用 Message Passing 。这里有一个示例,说明如何从内容脚本向插件发送消息。

  chrome.extension.sendMessage({greeting: "hello"}, function(response) {
console.log(response.farewell);
});

然后你必须使用chrome.extension.onMessage.addListener来接收消息。示例:

    chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
console.log(sender.tab ?
"from a content script:" + sender.tab.url :
"from the extension");
if (request.greeting == "hello")
sendResponse({farewell: "goodbye"});
});

另一方面,如果您想从插件发送消息到您必须使用的内容脚本。

chrome.tabs.getSelected(null, function(tab) {
chrome.tabs.sendMessage(tab.id, {greeting: "hello"}, function(response) {
console.log(response.farewell);
});
});

和之前一样chrome.extension.onMessage.addListener在另一端接收消息。

This是一个非常好的入门资源。

编辑:content_scripts 初始化的工作示例

体现:

    {
"name": "Intervention",
"version" : "1.0",
"content_scripts": [
{
"matches": ["http://*/**"],
"js": ["action.js"]
}

],

"manifest_version" : 2
}

JS

var element = document.title;
alert(element);

关于javascript - 使用 Javascript 获取当前文档,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14405578/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com