Question

有没有办法在页面加载后加载JavaScript代码（不将其放在HTML文档的最底行）？这是脚本示例：

<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=10&display=latest&size=t&layout=x&source=user&user=XXX"></script>

PS。原因是上面的Flickr代码加载缓慢并同时挂起了网站。

Answer 1

你可以尝试一下

<script type="text/javascript">
// Use any event to append the code
$(document).ready(function() 
{
    var s = document.createElement("script");
    s.type = "text/javascript";
    s.src = "test.js";
    // Use any selector
    $("head").append(s);
});
</script>

当然这需要jquery库，否则你可以在body的onload方法上粘贴这段代码

这是有用的东西

无法在URL上同步执行脚本。进一步注意，当涉及网络（甚至文件系统！）时，同步任何东西都是一个坏主意。某个人，某个时候，某个地方会在一个缓慢的系统，或一个慢速的网络，或两者兼而有之，突然之间你只是在他们的过程中挂了他们的UI。

http://bugs.jquery.com/ticket/6557

或者你可以尝试

http://yepnopejs.com/

Answer 2

将它应用于身体的onload方法。

Answer 3

如果要在整个页面加载完成后加载脚本（包括所有元素），请尝试此操作。（jQuery的）

$(window).load(function() {
        var js, 
            id = 'SCRIPT-ID', 
            ref = document.getElementsByTagName('script')[0];

        if (document.getElementById(id)) {
            return;
        }

        js = document.createElement('script'); 
        js.id = id; 
        js.async = true;
        js.src = "http://www.website.com/script.js";
        ref.parentNode.insertBefore(js, ref);
    });

如果您希望在呈现DOM后加载它，只需将$(window)更改为$(document)

Answer 4

var asyncLoad = function (url) {
    if (typeof url !== 'string') {
        return false;
    }
    var script = document.createElement('script'),
        firstScript = document.getElementsByTagName('script')[0];
    script.setAttribute('src', url);
    firstScript.parentNode.insertBefore(script, firstScript);
    return script;
};

//或者，对于无脚本页面，只需添加到头部;

var asyncLoad = function (url) {
    if (typeof url !== 'string') {
        return false;
    }
    var script = document.createElement('script'),
        head = document.getElementsByTagName('head')[0];
    script.setAttribute('src', url);
    head.appendChild(script);
    return script;
};

// apply：

document.addEventListener('DOMContentLoaded', function () {
    asyncLoad('script_url');
});

Answer 5

如果您需要模块化执行脚本，可以使用以下库

http://headjs.com/

页面加载后加载简单的JS代码？

5 个答案: