Question

我想在</body>标记之前在页面底部添加一个js文件。

我正在尝试一种格式。但它不能正常工作。

我的代码

var url = 'sample.js';
var script = document.createElement("script");
script.type = "text/javascript";
script.src = url;
document.getElementsByTagName('body')[0].appendChild(script);

但它不起作用。

现在我检查

var x = document.getElementsByTagName('body');
alert(x.length);

其节目0

如何将此js文件添加到页面底部。请指教

Answer 1

请参阅this代码

var body = document.body;
alert("Body when page loading: " + body);
document.addEventListener("DOMContentLoaded", function() {
    var bodyLoaded = document.body;
    alert("Body when page loaded: " + bodyLoaded);
    var url = "http://code.jquery.com/jquery-1.10.2.min.js";
    var script = document.createElement('script');
    script.type = "text/javascript";
    script.src = url;
    script.onload = function(){
        var testP = $("<p></p>");
        testP.html("JQuery worked");
        $(document.body).append(testP);
    }
    bodyLoaded.appendChild(script);
});

首先alert获得null。但是在第二次（加载身体时）你得到HTMLBodyElement。如果你试图在装载身体之前将元素附加到头部，那么这是你的错误。

Answer 2

您正在head部分编写此代码，并且此时尚未创建body元素。这是出错的唯一原因。在创建body元素后保留此代码。

使用javascript动态添加页面末尾的js文件？

2 个答案: