I have the following code in a script.js file that I call in my html file:
function loadScript(url) { var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = url; script.async = false; head.appendChild(script); } loadScript('https://polyfill.io/v3/polyfill.min.js?features=es6') loadScript('https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js') loadScript('https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/highlight.min.js') hljs.initHighlightingOnLoad(); I use this code because I want to call only one .js file in my html instead of multiple .js files.
The first two scripts that I load to call MathJax work fine. The third script to call highlight.js however does not run.
When I paste all the code from the file ‘highlight.min.js’ into the my script.js file, the javascript does run normally when I open the html.
I don’t understand why loading the ‘highlight.min.js’ file with the loadScript() does not work, or what I can do to get it to work. Any help is appreciated.
