I have a simple HTML website with some JS in it that displays a working magic 8 ball. However, when I put the same code into the code for a chrome extension, It just displays a blank square. Can someone please help me with this? My code is displayed below.
manifest.json
{ "manifest_version": 2, "name": "Popup Game", "version": "0.1", "content_scripts": [ { "matches": [ "<all_urls>" ], "js": ["content.js"] } ], "browser_action": { "default_icon": "ct.png", "default_popup": "popup.html", "default_title": "Game" } }
content.js
console.log('Chrome extension go?'); tabs.sendMessage.addListener(gotMessage); function gotMessage(message, sender, sendResponse) { console.log(message.txt); if (message.txt === 'hello') { let paragraphs = document.getElementsByTagName('p'); for (elt of paragraphs) { elt.style['background-color'] = '#FF00FF'; } } }
popup.html
<!DOCTYPE html> <html> <body> <script> fill(0, 0, 0); ellipse(200, 200, 375, 375); fill(60, 0, 255); triangle(200, 104, 280, 280, 120, 280); fill(255, 255, 255); var answer = floor(random(1, 20)); if (answer === 1) { text("As I see it,", 171, 200); text("yes", 189, 229); } else if (answer === 2) { text("Ask again", 171, 200); text("later", 189, 229); } else if (answer === 3) { text("Better not ", 171, 200); text("tell you now", 169, 229); } else if (answer === 4) { text("Cannot", 180, 200); text("predict now", 172, 229); } else if (answer === 5) { text("Concentrate", 169, 200); text("and ask again", 165, 229); } else if (answer === 6) { text("Don't count", 171, 200); text("on it", 189, 229); } else if (answer === 7) { text("It is", 191, 200); text("certain", 183, 229); } else if (answer === 8) { text("It is", 193, 200); text("decidedly so", 169, 229); } else if (answer === 9) { text("Most", 187, 200); text("likely", 186, 229); } else if (answer === 10) { text("My reply is", 171, 200); text("no", 193, 229); } else if (answer === 11) { text("My sources", 171, 200); text("say no", 184, 229); } else if (answer === 12) { text("Outlook", 178, 200); text("not so good", 171, 229); } else if (answer === 13) { text("Outlook", 180, 200); text("good", 185, 229); } else if (answer === 14) { text("Reply hazy,", 170, 200); text("try again", 178, 229); } else if (answer === 15) { text("Signs point", 170, 200); text("to yes", 184, 229); } else if (answer === 16) { text("Very", 187, 200); text("doubtful", 180, 229); } else if (answer === 17) { text("Without", 180, 200); text("a doubt", 181, 229); } else if (answer === 18) { text("Yes", 189, 229); } else if (answer === 19) { text("Yes - definitely", 164, 229); } else { text("You may", 175, 200); text("rely on it", 177, 229); } </script> </body> </html>
I have been trying to solve this problem for a long time, but nothing seems to be working.
https://stackoverflow.com/questions/67362817/how-can-i-turn-my-html-code-with-js-in-it-into-a-chrome-extension May 03, 2021 at 10:25AM
没有评论:
发表评论