How to make a defer script in Sololearn code playground?

Question

Since I'm currently working with JavaScript canvas very often, I know that I can set a value to the context only after loading the page (canvas). In VS code or any other JS IDE I simply use defer. But here, in SL Playground, I don't have access to referring the script. That means that I have to:

1) Have an window.onload listener

Or...

2) Write the script under the canvas tag in the HTML, so the Playground will read it after loading the canvas

It's not that big deal, but I wanna ask: Can I somehow make the script defer. Probably not, but it would be great :)

Answer 1

You can't defer it exactly but there are many work-arounds like you brushed on.

Option 1:
Wrap your JavaScript with document.addEventListener('DOMContentLoaded', function() {

and ending with });

Option 2:
Wrap all your JavaScript functionality in a named function and do similar to Option 1 but use the name. For example, this will work if your initial function was named 'init':

document.addEventListener('DOMContentLoaded', init);

Option 3:
If you include a jQuery library in your code, you can do:

$(document).ready(init);

Option 4:
Write your JavaScript after your elements load at the bottom of the HTML tab. I wouldn't do this, though. "JS" is a tab for JavaScript so that seems like a more appropriate place for it.