实例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jqery执行方式</title>
<style type="text/css">
.horiz{
float: left;
list-style-type: none;
margin: 10px;
}
</style>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
// window.onload=function(){
// $('#list>li').addClass('horiz')
// }
// window.onload:在页面元素全部加载完成后自动调用的事件！
$(document).ready(function(){
$('#list>li').addClass('horiz')
})
// $(document).ready()====window.onload()
// 页面的渲染值
</script>
</head>
<body>
<h2>购物清单</h2>
<ul id="list">
<li>生活用品
<ul>
<li><a href="">天猫</a></li>
<li>衣服</li>
<li>裤子</li>
<li>鞋子</li>
</ul>
</li>
<li>生鲜
<ul>
<li><a href="">盒马</a></li>
<li>龙虾</li>
<li>大闸蟹</li>
<li>蔬菜</li>
</ul>
</li>
<li>线下购物
<ul>
<li><a href="">大润发</a></li>
<li>方便面</li>
<li>玩具</li>
<li>奶粉</li>
</ul>
</li>
</body>
</html>
<!-- <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$('#list>li').addClass('horiz')
</script> -->运行实例 »
点击 "运行实例" 按钮查看在线实例
终结： 对生成DOM结构有了一些模糊的理解，认识到了window.onload()必须加载完成才会触发，而 $(document).ready()只要生成DOM结构就会触发！不过对jquery认识还挺模糊！
