0

有没有办法在页面加载后加载 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 代码加载缓慢并同时挂起网站。

4

5 回答 5

1

如果您想在整个页面（包括所有元素）完成加载后加载脚本，请尝试此操作。(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)

于 2012-09-03T05:51:35.560 回答
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/

于 2012-09-03T05:46:06.807 回答
1

将其应用于 body 的 onload 方法。

于 2012-09-03T05:46:14.183 回答
1 
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;
};

// 申请：

document.addEventListener('DOMContentLoaded', function () {
    asyncLoad('script_url');
});
于 2012-09-03T06:33:48.437 回答
0

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

http://headjs.com/

于 2012-09-03T05:46:57.407 回答