JavaScript實(shí)現(xiàn)動(dòng)態(tài)加載CSS和JS文件
來(lái)源:易賢網(wǎng) 閱讀:1300 次 日期:2015-04-22 11:44:49
溫馨提示:易賢網(wǎng)小編為您整理了“JavaScript實(shí)現(xiàn)動(dòng)態(tài)加載CSS和JS文件”,方便廣大網(wǎng)友查閱!

對(duì)象包含兩個(gè)完全獨(dú)立的方法,分別用來(lái)加載 CSS 文件和 JS 文件,參數(shù)均為欲加載的文件路徑。原理非常的簡(jiǎn)單:對(duì)于不同的加載文件類(lèi)型創(chuàng)建不同的節(jié)點(diǎn),然后添加各自的屬性,最后扔到 head 標(biāo)簽里面。經(jīng)測(cè)試,本方法兼容各瀏覽器,安全、無(wú)毒、環(huán)保,實(shí)乃 web 開(kāi)發(fā)人員工作常備代碼,請(qǐng)放心使用。

var dynamicLoading = {

css: function(path){

if(!path || path.length === 0){

throw new Error('argument "path" is required !');

}

var head = document.getElementsByTagName('head')[0];

var link = document.createElement('link');

link.href = path;

link.rel = 'stylesheet';

link.type = 'text/css';

head.appendChild(link);

},

js: function(path){

if(!path || path.length === 0){

throw new Error('argument "path" is required !');

}

var head = document.getElementsByTagName('head')[0];

var script = document.createElement('script');

script.src = path;

script.type = 'text/javascript';

head.appendChild(script);

}

}

下面是調(diào)用代碼,異常簡(jiǎn)單:

//動(dòng)態(tài)加載 CSS 文件

dynamicLoading.css("test.css");

//動(dòng)態(tài)加載 JS 文件

dynamicLoading.js("test.js");

更多信息請(qǐng)查看IT技術(shù)專(zhuān)欄

更多信息請(qǐng)查看腳本欄目
易賢網(wǎng)手機(jī)網(wǎng)站地址:JavaScript實(shí)現(xiàn)動(dòng)態(tài)加載CSS和JS文件
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢(xún)回復(fù)僅供參考,敬請(qǐng)考生以權(quán)威部門(mén)公布的正式信息和咨詢(xún)?yōu)闇?zhǔn)!
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡(jiǎn)要咨詢(xún) | 簡(jiǎn)要咨詢(xún)須知 | 新媒體/短視頻平臺(tái) | 手機(jī)站點(diǎn)

版權(quán)所有:易賢網(wǎng)