javascript - 使用 js 创建指向 js 文件的链接

Question

我有下面的js。这也在这个小提琴中

    (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);
    })();

我想将 js 放在页面底部，就在结束 js 标记之前。

当我在 console.log 中查看它时，我得到了预期的结果。哪个是

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

但是，当我尝试将其实际添加到我的页面时，我得到 [object HTMLScriptElement]

我在这里缺少什么，或者我可以尝试另一种方法来实现这一点？

Answer 1

insertAdjacentHTML将 html 作为其参数，而不是 dom 节点。我会改用 appendChild

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

Answer 2

我采取了一种稍微不同的方法，并尝试将脚本附加为主体节点的子节点。这是使用您的代码的示例：

(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);

它似乎得到了想要的结果。

希望这可以帮助！

Answer 3

我认为'beforeend'必须全部小写。

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

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

在上面查看 Musa 的答案，在这种情况下这是正确的插入方法。