2010年9月8日 星期三

如何動態載入Javascript或CSS

在網頁中,我們多半是在</head>中宣告要Include的js檔或css檔,例如:
<head>
<script type="text/javascript" src="blah.js"></script>
<link src="blah.css" type="text/css" ref="stylesheet"></link>
</head>

在某些情況下,可能需要依狀況動態載入不同的Javascript檔或CSS Stylesheet,要怎麼做呢? 看了以下的範例大家就明白了。
var headID = document.getElementsByTagName("head")[0]; 

var newCss = document.createElement('link');
newCss.type = 'text/css';
newCss.rel = "stylesheet";
newCss.href = "blah.css";
headID.appendChild(newCss);

var newJs = document.createElement('script');
newJs .type = 'text/javascript';
newJs .src= "blah.js";
headID.appendChild(newJs);

沒有留言:

張貼留言