![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Correction status：qualified
Teacher's comments：
Collection
Collection
总结：
现在已经学习了HTML。css。JavaScript，还有就是jQuery了感觉最难的就是JavaScript了，要多话点时间去学习。jQuery的引入简单明了，还可以引用css的知识，感觉还不错，JavaScript的window.onload是等页面加载完成以后自动调用的事件。而jQuery中的$(document).ready，只要dom结构生产就会触发，用得比较多
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.horiz{
text-align: center;
color: #333;
list-style-type: none;
line-height: 1.5px;
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">
//$('one > li ').addClass('horiz') 这样式不行的
window.onload = function () {
$('one > li ').addClass('horiz')
}
//window.onload是等页面加载完成以后自动调用的事件
/*$(document).ready(function(){
$('one > li ').addClass('horiz')
}
)*/
//简写
$(function(){
$('one > li ').addClass('horiz')
}
)
//页面的渲染顺序
//1先加载dom结构
//2加载图片
//$(document).ready，只要dom结构生产就会触发
</script>
</head>
<body>
<h2>购物</h2>
<ul id="one">
<li>淘宝
<ul>
<li>鞋子</li>
<li>衣服</li>
</ul>
</li>
<li>京东
<ul>
<li>电器</li>
<li>手机</li>
</ul>
</li>
<li>拼多多
<ul>
<li>包包</li>
<li>袜子</li>
</ul>
</li>
</li>
</ul>
<p>自从有了网购以后，已经很少人到实体店买东西了</p>
<p>实体店已经越来越难做了</p>
</body>
</html>
<!--<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$('<img src="./1.jpg" width="150"').insertAfter('h2').css('border-radius','50%')//导入图片
$('p+p').html('哈哈哈')//切换p的文本
$('one > li ').addClass('horiz')//添加样式
</script>-->点击 "运行实例" 按钮查看在线实例