使用JavaScript动态创建HTML页面时，jQuery脚本未加载到头部

Question

I created dynamically new window in JavaScript and add some HTML code in it through JavaScript, but when I insert some script link into html head, it does not load when window is open.

<script type="text/javascript">    
function newWindowMap(){

    var myWindow = window.open('','_blank');
    var head = myWindow.document.getElementsByTagName('head')[0];
    var body = myWindow.document.getElementsByTagName('body')[0];

    var jqueryScript = myWindow.document.createElement('script');
    jqueryScript.src = 'jquery.min.js';
    jqueryScript.type = "text/javascript";
    head.appendChild(jqueryScript);

    var alertScr = myWindow.document.createElement('script');
    var inlineScript = 
 document.createTextNode('$(document).ready(function(){alert("Hello World!");});');
    alertScr.appendChild(inlineScript);
    body.appendChild(alertScr);

}
 </script>

Error on console:

Uncaught ReferenceError: $ is not defined at :1:1

Answer 1

$ is from JQuery, which is a popular library for JavaScript, and from the looks, you haven't imported it.

Add this into your head tag to fix the issue

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>