0

How do I load the HTML ans CSS first then run JS

I noticed that JavaScript runs first then loads the page on SoloLearn. I want it the other way around. I tried window.onload and adding a load event listener but, didn't work. Any suggestions?

30th Dec 2018, 3:52 PM
Joshua Rieth
Joshua Rieth - avatar
5 Answers
+ 9
Try on this post to find the answer, Read Kirk Schafer 's advice! 👍 https://www.sololearn.com/Discuss/300061/?ref=app
30th Dec 2018, 5:14 PM
Danijel Ivanović
Danijel Ivanović - avatar
+ 4
EFFICIENTLY LOAD JAVASCRIPT WITH DEFER AND ASYNC https://flaviocopes.com/javascript-async-defer/ Before asking a question on the Q/A, try to search :  • Google Advenced Search : Set domain to 》sololearn.com《 for  search only on the SoloLearn https://www.google.com/advanced_search   • Eclipse Wiki : "Before asking a question on the forums" https://wiki.eclipse.org/Before_asking_a_question_on_the_forums   • SoloLearn Advanced Search : http://www.freecodeexamples.com/2018/12/sololearn-advanced-search.html https://code.sololearn.com/W26q4WtwSP8W/?ref=app
30th Dec 2018, 4:23 PM
Danijel Ivanović
Danijel Ivanović - avatar
+ 4
On SL content of js tab is injected like an inline script inside the "final" html page (same for css). In practice you have to considerate html, css and js tabs like pieces that build up a final (and processed) html page .. See also here https://code.sololearn.com/WlA8Fx8bl6nI/?ref=app
1st Jan 2019, 8:22 PM
KrOW
KrOW - avatar
+ 2
Ah, I probably could have written that as "here's how HTML/CSS/JS tabs are laid out", visible by adding this to any (preferably blank) code: setTimeout(function(){alert(document.all[0].outerHTML)}, 150) //setTimeout easier than onload variability [Babel ES6 trick...change injected [script] tag behavior] Leveraging how the script tag loads, KrOW figured out a nice Babel transpiler trick to get ES6 syntax working: https://code.sololearn.com/WL4QrKP4we6A/?ref=app ...Try the same alert there to see how it works.
1st Jan 2019, 6:56 PM
Kirk Schafer
Kirk Schafer - avatar
0
There is no script tag in the head on the playground, so I can't use defer or async, and the JS still runs. I could use the script tag in the body, but I prefer not to, as I want to keep everything organized.
30th Dec 2018, 4:37 PM
Joshua Rieth
Joshua Rieth - avatar