Доступ к текущей вкладке Объект DOM из расширения Chrome

Я искал вокруг, как это сделать. Я нашел несколько статей, прежде всегоДоступ к текущей вкладке Объект DOM из расширения Chrome

Accessing Current Tab DOM Object from "popup.html"?

Однако я очень новичок в JavaScript и делая расширения хрома и я ударил в тупик. Я предполагаю, что ответ не получен, что объясняет, почему document.write("Hellp") не работает. Любая помощь, чтобы исправить это, будет оценена по достоинству.

У меня есть три основные файлы

manifest.json

{ 
"name": "My First Extension", 
"version": "1.0", 
"description": "The first extension that I made.", 
"browser_action": 
{ 
    "default_icon": "icon.png", 
    "popup": "popup.html" 
}, 
"permissions": 
[ 
    "tabs" 
], 
"content_scripts": 
[{ 
    "matches": ["<all_urls>"], 
    "js": ["dom.js"] 
}] 
}

popup.html

<html>  
<body>  
</body>  
<script> 

chrome.tabs.getSelected(null, function(tab) 
{ 
    // Send a request to the content script. 
    chrome.tabs.sendRequest(tab.id, {action: "getDOM"}, function(response) 
    { 
    document.write("Hello"); 
    document.write(response.title) 
    }); 
}); 

</script> 
</html>

dom.js

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) 
{ 
if (request.action == "getDOM") 
    sendResponse({dom: document.getElementsByTagName("body")[0]}); 
else 
    sendResponse({}); // Send nothing.. 
});

источник

2010-12-07 Blair

Я вижу это старше вопрос , но он остается без ответа, и я в том же вопросе. Возможно, это функция безопасности, но вы, похоже, не можете вернуть объект DOM. Вы можете, однако, вернуть текст. Так что для dom.js:

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) { 
if (request.action == "getDOM") 
    sendResponse({dom: document.body.innerHTML}); 
else 
    sendResponse({}); // Send nothing.. 
});

источник

2011-04-14 22:51:28 John

На самом деле, объекты DOM не могут быть отправлены, потому что они не являются JSON-сериализуемыми (https://developer.chrome.com/extensions/messaging#simple). – 2015-12-20 08:32:12

Итак, как мы можем получить элементы DOM во всплывающем окне[email protected] – Despertaweb 2016-11-16 10:42:00

Я работаю на расширение, которое передает HTML-элемента в виде текста, а затем восстановление элемента обратно с помощью innerHTML. Надеюсь, что проясняет, как получить DOM элементы из текущей страницы **

Это путь я получил DOM:

manifest.json

{ 
    "manifest_version": 2, 
    "version" : "2.0", 
    "name": "Prettify search", 
    "description": "This extension shows a search result from the current page", 
    "icons":{ 
    "128": "./img/icon128.png", 
    "48": "./img/icon48.png", 
    "16": "./img/icon16.png" 
    }, 
"page_action": { 
    "default_icon": "./img/icon16.png", 
    "default_popup": "popup.html", 
    "default_title": "Prettify Results!" 
    }, 

// If the context is the Mach url = sends a message to eventPage.js: active icon 
    "content_scripts": [ 
    { 
     "matches": ["http://www.whatever.cat/*"], 
     "js": ["./js/content.js", "./js/jquery-3.1.1.min.js"] 
    } 
    ], 

    "permissions": [ 
    "tabs", 
    "http://www.whatever.cat/*", 
    "http://loripsum.net/*" //If you need to call and API here it goes 
    ], 

    "background":{ 
    "scripts": ["./js/eventPage.js"], 
    "persistent": false 
    } 

}

Popup.js

$(function() { 
     chrome.tabs.query({active: true, currentWindow: true}, function(tabs) { 

      chrome.tabs.sendMessage(tabs[0].id, {action: "getPage"}, function(response) { 

       var importedCode = response.searchResults; 
       var fakeHtml = document.createElement('html'); 
       fakeHtml.innerHTML = importedCode; // recieved String becomes html 


      }); 
     });

Eventpage.js

>Able/disable the extension button 
chrome.runtime.onMessage.addListener(function(req, sender, resp) { 
    if(req.todo === 'showPageAction'){ 

     chrome.tabs.query({active:true, currentWindow:true}, function(tabs) { 
      chrome.pageAction.show(tabs[0].id); 
     }); 
    } 
});

content.js

Content_Scripts не могут использовать API Chrome, чтобы включить или отключить> значок расширения. Переходим сообщение для Event_Page, JS, он действительно может использовать Апи

chrome.runtime.sendMessage({ todo: "showPageAction"}); 
window.onload = function() { 

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) { 
    console.log(sender.tab ? 
       "from a content script:" + sender.tab.url : 
       "from the extension"); 
    if (request.action == "getPage"){ 
     sendResponse({searchResults: document.body.innerHTML}); 
     } 
    }); 
};

popup.html

Просто ссылка popup.js

источник

2016-12-22 14:32:10 Despertaweb

Доступ к текущей вкладке Объект DOM из расширения Chrome

ответ

Смежные вопросы