DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 異步動態加載js與css文件的js代碼
異步動態加載js與css文件的js代碼
編輯:關於JavaScript     

jquery動態加載css,js文件方法簡單很,

方法1:

代碼如下
復制代碼 代碼如下:
$.getscript("test.js");

方法2:

代碼如下
復制代碼 代碼如下:
function loadjs(file){

var head = $('head').remove('#loadscript');

$("<scri"+"pt>"+"</scr"+"ipt>").attr({src:file,type:'text/javascript',id:'load'}).appendto(head);

}

方法3:

代碼如下
復制代碼 代碼如下:
$("<scri"+"pt>"+"</scr"+"ipt>").attr({src:file,type:'text/javascript',id:'load'}).appendto($('head').remove('#loadscript'));

 

下面附一些js動態加載js,css文件的方法。

以下代碼是摘自news.qq.com頁面裡的代碼的,本人未進行測試,程序看著應該沒有問題的,可以做為參考的,主要用來在網頁底部位置,實現動態加載js文件到網頁<head>標簽的後面,通過DOM來實現的,代碼如下:

代碼如下
復制代碼 代碼如下:
<script>
var SCRIPT_TIMEOUT = 20000;
var QVPL_PATH = "/QVPL1.0.0.js";

function loadHelper (jsurl) {
var oScriptEl, oTimeoutHDL, oHead;
oScriptEl = document.createElement("script");
oScriptEl.type = "text/javascript";
oScriptEl.language = "javascript";
oScriptEl.src = jsurl;
oScriptEl.onreadystatechange = doCallback;

oScriptEl.onload = function()
{
this.readyState = "complete";
doCallback();
if(typeof(lianbo) == "object"){
lianbo.init(window.QVPL);
}
};

oTimeoutHDL = window.setTimeout(doError,SCRIPT_TIMEOUT);
document.getElementsByTagName("head")[0].appendChild(oScriptEl);

function doCallback()
{
if (oScriptEl.readyState == "complete" || oScriptEl.readyState == "loaded")
{
oScriptEl.onload = oScriptEl.onreadystatechange = new Function();
window.clearTimeout(oTimeoutHDL);
}
};

function doError()
{
oScriptEl.parentNode.removeChild(oScriptEl);
};
}

loadHelper(QVPL_PATH);
</script>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved