您的位置：首页 > Web前端 > JavaScript

JavaScript动态加载css和js文件

2015-01-09 10:27 671 查看

1,直接document.write

<script language="javascript">

document.write('<script src="js/jquery-1.7.js"><\/script>');

document.write('<link type="text/css" href="style/base.css" rel="stylesheet"><\/link>');

</script>

<script type="text/javascript">

$(function(){

alert("WeiJun Hu");

});

</script>

2,动态创建script/link元素

<script type="text/javascript">

var loadUtil = {

loadJs:function(filePath){

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

throw new Error("fielPath is required!");

}

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

script.setAttribute("src",filePath); //script.src = filePath;

script.setAttribute("type","text/javascript"); //script.type = "text/javascript";

document.getElementsByTagName("head")[0].appendChild(script);

},

loadCss:function(filePath){

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

throw new Error("fielPath is required!");

}

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

link.setAttribute("href",filePath); //link.href = filePaht;

link.setAttribute("rel","stylesheet"); //link.rel = "stylesheet";

link.setAttribute("type","text/css"); //link.type = "text/css";

document.getElementsByTagName("head")[0].appendChild(link);

}

};

loadUtil.loadJs("js/jquery-1.7.js");

loadUtil.loadCss("style/base.css");

</script>

<script type="text/javascript">

window.onload = function(){

alert($("body").html());

$("h1").click(function(){

alert("click.....H1");

});

}

</script>

3,附上页面代码

<body>

<h1>click me!</h1>

</body>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航