Я создаю расширение инструмента chrome dev для захвата элементов страницы и сохранения. На данный момент я могу захватить элемент страницы, используя метод click в сценарии содержимого, который я ввел. Чтобы отправить захваченный элемент из сценария содержимого в фоновый скрипт, я использовал stopPropagation и preventDefault методы для отключения события click для элемента.Удаление впрыскиваемого скрипта через расширение chrome
Заявление о проблемах: Теперь я хотел бы вернуться к событию по умолчанию элемента после выбора элемента. Вот где я зациклился на том, как вернуться назад.
manifest.json:
{
"name": "My app",
"version": "0.0.1",
"description": "My app",
"manifest_version": 2,
"devtools_page": "devtools.html",
"background": {
"scripts": [
"background.js"
]
},
"permissions": [
"tabs",
"http://*/*",
"https://*/*",
"file://*/*"
]
}
devtools.html
имеет devtools.js
скрипт, который создает новый tab
панель в хромовых Дев инструментов и загружает panel.html
.
panel.html:
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<button id="insertscript">Insert script</button>
<button id="clearscript">Clear Script</button>
<input type="text" id="tagName" />
<script src="panel.js"></script>
<script src="background.js"></script>
</body>
</html>
panel.js:
(function createChannel() {
var port = chrome.extension.connect({
name: "Sample Communication" //Given a Name
});
port.onMessage.addListener(function (message) {
document.querySelector('#tagName').value = message.tagName;
});
}());
function sendObjectToInspectedPage(message) {
message.tabId = chrome.devtools.inspectedWindow.tabId;
chrome.extension.sendMessage(message);
}
document.querySelector('#insertscript').addEventListener('click', function() {
sendObjectToInspectedPage({action: "script", content: "selectitem.js"});
}, false);
document.querySelector('#clearscript').addEventListener('click', function() {
sendObjectToInspectedPage({action: "clear-script", content: "clearscript.js"});
}, false);
background.js:
chrome.extension.onConnect.addListener(function (port) {
var extensionListener = function(message, sender, sendResponse) {
if (message.tabId && message.content) {
// Attach a script to inspected page
if (message.action === "script") {
chrome.tabs.executeScript(message.tabId, {file: "assets/jquery-2.0.3.js"});
chrome.tabs.executeScript(message.tabId, {file: message.content});
} else if (message.action === "clear-script") {
chrome.tabs.executeScript(message.tabId, {code: "document.removeEventListener('click', onClick);"});
}
} else {
port.postMessage(message);
}
if (message.type === "selectedElement") {
sendResponse(message);
}
};
chrome.extension.onMessage.addListener(extensionListener);
port.onDisconnect.addListener(function(port) {
chrome.extension.onMessage.removeListener(extensionListener);
});
});
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
return true;
});
selectitem.js:
function onClick(evt) {
evt.stopPropagation();
evt.preventDefault();
var elem = document.elementFromPoint(evt.clientX, evt.clientY);
chrome.extension.sendMessage({
type: "selectedElement",
tagName: elem.tagName
});
}
document.addEventListener('click', onClick, true);
Теперь, когда я нажимаю на Clear script
метод, я хотел, чтобы удалить stopPropagation и preventDefault, которые я добавил в selectitem.js
. Поскольку элемент, который я выбрал, может быть тегом Anchor
или Button
или может быть любым, что можно щелкнуть.
Я не знаю, как это сделать.
Пожалуйста, не скрывайте ответ за ссылкой на 200 строк кода. Отправьте соответствующую часть здесь. Был ли ответ завершен как 'document.removeEventListener (« click », onClick, true);'? – Teepeemm