利用jQuery 动态加载 javascript
By:Roy.LiuLast updated:2014-03-04
为了提高网页程序的性能,在很多情况下javascript 是按需加载,而不是全部写在 里面。利用jQuery可以很方便的实现按需加载js.
当id为“load" 的按钮被点击之后,将会动态加载 helloword.js , 然后就可以执行里面的方法。
其中 helloworld.js 的代码如下:
$( "#load" ).click(function(){ $.getScript( 'helloworld.js' , function() { $( "#content" ).html( 'js 加载成功!' ); }); }); |
当id为“load" 的按钮被点击之后,将会动态加载 helloword.js , 然后就可以执行里面的方法。
<script type= ""text/javascript"" src= ""jquery-1.7.2.min.js"" ></script> <h1>利用 jQuery 动态加载 js</h1> <div id= ""content"" ></div> <button id= ""load"" >Load JavaScript</button> <button id= ""sayHello"" >Say Hello</button> <script type= ""text/javascript"" > $("#load").click(function(){ $.getScript(&# 39 ;js-example/helloworld.js&# 39 ;, function() { $("#content").html(&# 39 ; Javascript is loaded successful! sayHello() function is loaded! &# 39 ;); }); }); $("#sayHello").click(function(){ sayHello(); }); </script> |
其中 helloworld.js 的代码如下:
function sayHello(){ alert( "Hello ~我是动态加载的!" ); } |
From:一号门
Previous:mybatis spring 集成 bootstrap 例子一个
COMMENTS