Я разрабатываю расширение для браузера Google Chrome. Я не мог понять, как получить доступ к текущему объекту DOM вкладки со страницы "popup.html". любые предложения?
Доступ к текущей вкладке DOM Object из "popup.html"?
Ответ 1
По умолчанию в popup.js/popup.html объект "document" ссылается только на документ всплывающего окна расширения. Чтобы получить DOM для определенной вкладки (например, текущую активную вкладку), вам нужно будет использовать связь с текстовыми сообщениями. Например, нам нужно отправить запрос из extension в ваш контент script через popup, поэтому в popup.html вы делаете что-то вроде этого:
chrome.tabs.getSelected(null, function(tab) {
// Send a request to the content script.
chrome.tabs.sendRequest(tab.id, {action: "getDOM"}, function(response) {
console.log(response.dom);
});
});
Теперь в содержании script нам нужно прослушать эти события, исходящие из расширения, поэтому в каком-то файле мы назвали dom.js
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
if (request.action == "getDOM")
sendResponse({dom: "The dom that you want to get"});
else
sendResponse({}); // Send nothing..
});
Теперь не забудьте настроить manifest, чтобы включить контент script и вкладку.
Ответ 2
Этот ответ, похоже, не работает с последним API. Это рабочий пример.
popup.js:
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
var tab = tabs[0];
console.log(tab.url, tab.title);
chrome.tabs.getSelected(null, function(tab) {
chrome.tabs.sendMessage(tab.id, {greeting: "hello"}, function(msg) {
msg = msg || {};
console.log('onResponse', msg.farewell);
});
});
});
getDescription.js:
window.onload = function() {
chrome.runtime.onMessage.addListener(function(msg, _, sendResponse) {
console.log('onMessage', msg);
if (msg.greeting == "hello") {
sendResponse({farewell: "goodbye"});
} else{
sendResponse({});
}
});
};
соответствующие части manifest.json:
{
"permissions": [
"tabs"
],
"content_scripts": [
{
"matches": ["http://*/*", "https://*/*"],
"js": ["getDescription.js"]
}
]
}
Ответ 3
Это последнее исправление:
popup.js
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"}, function(response) {
console.log(response.farewell);
});
});
(Примечание: приведенный выше console.log(response.farewell) предназначен для popup.html, а не для текущей вкладки)
contentscript.js
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
if (request.greeting == "hello")
sendResponse({farewell: "goodbye"});
});