En cliquant sur un élément sur une page par Extension Chrome
Je suis en train de créer une extension chrome qui va cliquer sur un élément sur une page web lorsque vous cliquez sur un bouton de l'extension, mais pour quelque raison il ne fait rien, peu importe ce que j'essaie.
J'ai jusqu'à présent
manifeste.json
{
"manifest_version": 2,
"name": "Such Activity",
"description": "Wow",
"version": "1.0",
"permissions": [
"tabs", "<all_urls>"
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"content_scripts": [
{
"matches": [ "<all_urls>" ],
"js": ["content_script.js"]
}
]
}
popup.html
<!doctype html>
<html>
<head>
<title>activity</title>
<style>
</style>
<script src="content_script.js"></script>
</head>
<body>
<button id="clickactivity">click</button>
</body>
</html>
content_script.js
function ClickPlanet()
{
var planets = document.getElementsByClassName("planet-name");
var randomplanet = Math.floor(Math.random() * planets.length);
var clickplanet = planets[randomplanet];
clickplanet.click();
setInterval(function () { ClickPlanet() }, 2000);
}
document.addEventListener('DOMContentLoaded', function () {
document.getElementById('clickactivity').addEventListener('click', ClickPlanet);
});
Tout ce que je semble être, il est cette erreur
Uncaught TypeError: Cannot read property 'click' of undefined
J'ai été bidouiller avec cela pendant des heures, mais je ne peux pas le faire fonctionner. Toute aide est appréciée!
OriginalL'auteur Rico Clark | 2014-10-15
Vous devez vous connecter pour publier un commentaire.
Question
Dirait que vous êtes malentendu le contenu du script de comportement.
Citant la documentation officielle:
Donc, à l'aide de votre
content_script.js
dans votrepopup.html
n'a pas beaucoup de sens, et entraîne à l'évidence une erreur, parce que vous n'avez pas de bouton avecclass="planet-name"
dans votrepopup.html
page.Solution
À faire ce que vous voulez, vous devez créer un script différent pour votre
popup.html
, et ajouter un écouteur à ce bouton, alors quand il fait cliqué, vous pouvez injecter lecontent_script.js
script dans la page pour cliquer sur la "planète" de l'élément.De sorte que vous aurez à:
manifest.json
retrait de la"content_scripts"
champpopup.js
fichier à ajouter dans votrepopup.html
pagepopup.js
pour injecter lecontent_script.js
fichier à l'aide dechrome.tabs.executeScript()
content_script.js
pour le faire cliquez sur le bouton directement sur la pageTout d'abord, modifier votre
manifest.json
, il devrait ressembler à ceci:Puis, supprimer votre
content_script.js
de lapopup.html
et de le remplacer avec de l'popup.js
script:Créer le
popup.js
script et ajouter l'écouteur du bouton qui permettra d'injecter le script dans la page en cours:Maintenant, dans votre
content_script.js
, vous devez cliquer sur le bouton directement, et aussi vous n'aurez pas besoin d'utiliserDOMContentReady
, parce que Chrome attend à injecter le script en lui-même. Ainsi, votre nouveaucontent_script.js
sera:Exemple de travail
Télécharger un exemple de travail de l'extension de ICI.
Documentation
Je vous suggère fortement de prendre un coup d'oeil à la documentation pour les méthodes utilisées dans mon exemple pour bien comprendre leur comportement et de leurs propriétés, voici quelques liens que vous pouvez trouver utile:
chrome.les onglets
APIchrome.onglets.requête
méthodechrome.onglets.executeScript
méthodePuis ajouter une alerte comme
alert('CONTENT SCRIPT: I am running!')
dans votrecontent_script.js
, de sorte que vous pouvez voir si il obtient injecté correctement...Pas d'alerte. Pour référence, c'est le site que je suis en train de l'appliquer: dl.dropboxusercontent.com/u/17879954/EN%20Betelgeuse.htm Les planètes qui ont besoin d'être cliqué sont sur la droite
J'ai édité la question et testé par moi-même sur la page que vous avez fournis. Maintenant ça fonctionne, il y a un petit problème, parce que l'utilisation
run_at: "document_end"
dans une page qui a déjà chargée ne fait pas exécuter quoi que ce soit. Recharger votre extension avec le nouveau code de ma réponse et de voir si cela fonctionne.J'ai également ajouté un lien de téléchargement pour télécharger le exemple, si vous voulez.
OriginalL'auteur Marco Bonelli