Do something after an external script is fully loaded via jQuery append

Question

I have a <script> external being added to the page via jQuery com:

$("body").append("<scr"+"ipt src='url_do_script.js'></scr"+"ipt>");

This script adds some elements on the page (some tags). The script works perfectly, but it is asyronous when loading the page, that is, the page loads normally without waiting for what the script will return. But I need to manipulate some tags returned by this .js as soon as they are available.

The problem is that I haven’t found a way to know when this script has already been fully loaded on the jQuery page.

With pure Javascript I can know by adding the script via document.createElement and appendChild. Just make a .onload:

var e = document.createElement("script");
e.src = "url_do_script.js";
document.body.appendChild(e);

e.onload = function(){
   // o script foi totalmente carregado
}

How to do something with the .append jQuery? I’ve tried other ways .get, .load and .ajax but does not work due to CORS (Cross-origin Resource sharing).

I tried to put a onload="funcao()" in the <script> and it didn’t work either.

Any idea how to do this or is there another way using jQuery other than with .append?

Answer 1

I was able to resolve the matter with the tip from @Valdeir Psr. Just add the getScript shortly after the append that the code recognized that the elements were loaded on the page:

$("body").append('<scr'+'ipt src="url_do_script.js"></scr'+'ipt>');
$.getScript( "url_do_script.js", function() {
   // fazer algo após o script ter sido carregado
});

Did not show CORS error or anything. It worked perfectly.

UPDATING

Truth that making a append and using getScript, the script was being called 2 times.

How the tag needs to exist <script> complete on the page (<script src="url_do_script.js"></script>) otherwise it does not work in this specific case, because it still possesses a id (<script id="id_qualquer" src="url_do_script.js"></script>) and is based on this id that the script works, I informed the problem as follows:

$("body").append('<script id="id_qualquer"></scr'+'ipt>');
$("#id_qualquer").attr("src","url_do_script.js");
$.getScript("url_do_script.js")
.done(function(){
   // fazer algo após o script ter sido carregado;
});

I added the src of script via id and executed on getScript after the .done. Worked perfectly.