Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Insert elements at <script> tag position

When sites give you some JavaScript that you paste into a web page to have content inserted at that position, how does the script determine its current position in the DOM? Without using document.write?

Thanks,

Nick

like image 932
Nick Spacek Avatar asked May 07 '10 15:05

Nick Spacek


1 Answers

At script inclusion time, it's certain that the last <script> in the page will be the current one; the rest of the page hasn't been parsed yet. So:

<script type="text/javascript">
    var scripts= document.getElementsByTagName('script');
    var this_script= scripts[scripts.length-1];

    // Something that happens later...
    //
    setTimeout(function() {
        var div= document.createElement('div');
        div.appendChild(document.createTextNode('Hello!'));
        this_script.parentNode.insertBefore(div, this_script);
    }, 5000);
</script>

This holds true as long as the script tag doesn't use defer, or HTML5's async.

like image 153
bobince Avatar answered Sep 23 '22 04:09

bobince