Question

everyone.

I don’t use jQuery. I create a script tag and append it to head tag to get JSONP data. After JSONP callback function is executed, the script tag which is just added to head tag by me is automatically deleted by browser (Chrome). Why is the script tag deleted automatically by Chrome? I don’t write any codes to delete this script tag.

Thank you.

Answer 1

It isn’t. The most common reason people think DOM changes aren’t being done is that they look at “view source” rather than the actual DOM panel. Be sure that when you’re looking for it, you’re looking at the “Elements” tab in the Dev Tools. “View source” shows you the original HTML delivered from the server, not the DOM and any modifications you may have made to it.

If the element is really going away, there is code removing it. Chrome doesn’t arbitrarily remove script elements (proof). Some possibilities:

1. Other code on the page is removing it.
2. You’ve added it as a descendant element of something, and its parent (or ancestor) is being removed.
3. You’ve added it as a descendant element of something, and then you’re updating that parent/ancestor element with new content, replacing its previous content (e.g., via innerHTML or similar).

In 2 and 3 above, the code is removing the script element as a by-product of removing or updating its parent/ancestor.