Create a link to js file with js

Question

I have the below js. which is also in this fiddle

    (function () {
        var test = document.createElement('script');
        test.type = 'text/javascript';
        test.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'www.example.com/test.js';
        console.log(test);
        document.getElementsByTagName('body')[0].insertAdjacentHTML("beforeEnd", test);
    })();

I want to put the js at the bottom of my page just before the closing js tags.

When I view it in the console.log I get the expected result. Which is

<script type="text/javascript" src="http://www.example.com/test.js"></script>

However when I try and actually add it to my page I get [object HTMLScriptElement]

What am I missing here or is there another method I can try to acheive this?

Musa · Accepted Answer · 2013-07-07 22:56:31Z

4

insertAdjacentHTML takes html as its argument not dom nodes. I'd use appendChild instead

document.getElementsByTagName('body')[0].appendChild(test);

answered Jul 7, 2013 at 22:56

Musa

97.9k17 gold badges123 silver badges144 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Yahel Over a year ago

appendChild also has the benefit of having universal browser support, which isn't the case for insertAdjacentHTML.

jrthib · Accepted Answer · 2013-07-07 23:07:47Z

2

I took a slightly different approach and tried appending the script as a child of the body node. Here's an example using your code:

(function (document) {
    var test = document.createElement('script');
    test.type = 'text/javascript';
    test.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'www.example.com/test.js';
    document.getElementsByTagName('body')[0].appendChild(test);
})(document);

It seems to get the desired result.

Hope this helps!

answered Jul 7, 2013 at 23:07

jrthib

1,3191 gold badge12 silver badges18 bronze badges

Comments

Patrick Moore · Accepted Answer · 2013-07-07 22:54:46Z

1

I think 'beforeend' needs to be all lowercase.

[...] document.getElementsByTagName('body')[0].insertAdjacentHTML("beforeend", test);

https://developer.mozilla.org/en-US/docs/Web/API/element.insertAdjacentHTML

Look above for Musa's answer, which is the correct insertion method in this case.

answered Jul 7, 2013 at 22:54

Patrick Moore

13.4k5 gold badges41 silver badges63 bronze badges

Collectives™ on Stack Overflow

Create a link to js file with js

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related