网页加载速度优化3--动态加载数据 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--先加载css -->
    <link rel="stylesheet" href="style.css">
</head>
<body>
<!--然后加载网页内容 -->
<h1>this is a demo html </h1>

<!--异步加载 -->
<div id="loadingDiv">loading</div>

<!--最后加载js文件-->
<script src="jquery-1.7.1.min.js"></script>
<script src="index.js"></script>
</body>
</html>

index.js中的内容
/**
 * Created by shi on 16/4/27.
 */
$(document).ready(function(){
    $("#loadingDiv").load("index.html");
})
这样是不是在达到加载网页效果的同时，节省了很多时间，而且有了更好的用户体验呢？

index.js一定要写在主页面，否则会造成重复加载的功能性错误。
 
posted @ 2016-04-27 09:53  prince.shi  阅读(454)  评论(0)  编辑  收藏  举报