CODEWITHSUNDEEP
google-chrome-extensionaddeventlistener
Jerry Krinock
Jerry Krinock

Reputation: 5030

Chrome Extension: Using addEventListener()

In the tutorial for migrating a Google Chrome Extension to Manifest Version 2, I am directed to Remove inline event handlers (like onclick, etc) from the HTML code, move them into an external JS file and use addEventListener() instead.

OK, I currently have a background.html page that looks like this…

<html>
<script type="text/javascript">
    // Lots of script code here, snipped
    …
</script>

<body  onload="checkInMyNPAPIPlugin('pluginId');">
    <object type="application/x-mynpapiplugin" id="pluginId">
</body>
</html>

Following another directive, I've moved that Lots of script code into a separate .js file, and following this directive, I need to remove the onload= from the body tag, and instead cal addEventListener() in my script code. I've tried several approaches, but am apparently guessing wrong. What will that code look like? In particular, upon what object do I invoke addEventListener()?

Thanks!

Upvotes: 4

Views: 9319

Answers (1)

Siva Tumma
Siva Tumma

Reputation: 1701

I normally use this for body onload event...

document.addEventListener('DOMContentLoaded', function () {
    //   My code here.. ( Your code here  )
});

For somethings it is working.. but really, I think we should use..

window.addEventListener('load', function () {
    document.getElementById("#Our_DOM_Element").addEventListener('change - or - click..', function(){
//      code..
    });
});

Upvotes: 3

Related Questions