前端H5怎么切换语言_H5前端基础学习团队 | 过程篇

 H5前端基础

学习团队

实践目的

软件二班本组队员将通过暑假课余时间开展主题为HTML5前端基础js部分知识开展线上课程学习以及实践的专业社会实践活动。此项活动旨在满足课外生活充实的同时，同时增长同学们的网页前端基础素质能力，让队员们对前端领域有更多的，更准确的了解，也让同学们拓宽对自己的专业知识因而有更多的认识与理解，为以后的学习工作添砖加瓦，同时培养同学们的动手能力，思考能力，促进提高自身专业能力，为自身以后的发展产生十分积极的影响。

实践过程

第一天

本次课程讲师主要讲述了关于javascript的起源、类型等等基本知识，让大家懂得了此语言的产生、发展以及运用。介绍了JavaScript的由来以及基本的一些特性，而后转而讲述专业知识，从引入、定义到运用、输出。讲师一一系统地给队员们讲述。

第二天

第二次课程讲师主要讲述了网页动态演示，举例了车轮的滚动和页面箭头的跳动，车轮的滚动是由旋转角度的调整从而实现，箭头的跳动是由高度上下距离的调整从而实现。动态的演示给下次课堂内容进行了铺垫，也是作品完成的重要基础动态演示。

第三天

第三次前端讲课主要讲了基本数据类型中的object类型——对象。

首先了解对象的概念，还有创建对象的两种方法，访问属性的两种方式，创建数组，构造器，math方法。这次课程我们主要实现的功能是前端网页的文字浮现和进度加载。

第四天

第四次课程讲师主要讲述了关于下拉按钮的功能的应用和页面播放音乐的功能按钮设置。首先讲的是关于下拉按钮置离屏幕水平方向的距离的设置和鼠标右键滑动后松开时的鼠标距离屏幕竖直方向的位置大小，也提及改变透明度，显示元素的设。后半段讲解关于音乐播放图标的关闭和播放状态设置，以及讲师对不懂的方进行答疑解惑。

第五天

第五次课程主要讲述了关于页面音乐播放暂停的功能的应用和文本框的功能的应用。首先简单回顾了上一节的音乐图标的设置，然后开始讲解的是关于页面音乐的插入，点击图标开始播放，再次点击音乐暂停的功能。后半段讲解关于文本框从左向右滑入，滑入之后文字开始浮现的功能。

第六天

第六次课程讲师主要讲述了利用网页布局实现一个页面多个js动画功能的实现和应用。首先简单回顾了上一节的js动画的内容，然后做了一下简单但精辟的总结，后半段讲解关于网页布局中的层级关系，z—index数值越大层级越高，最后的结果也如预期的那样，多个js动画在页面，更接近真实浏览的网页。

第七天

最后一次课程主要是讲解多个动画如何在一个页面进行切换。首先简单回顾了上一节的js动画的内容，然后做了一下简单的总结。后半段讲解关于通过JavaScript语言对页面中的动画进行相互调用，再利用定时器setTimeout()的延时调用，改变各元素的display样式实现动画之间的切换效果，以至于更接近实用的网页。最后，由负责人大概总结了本次社会实践的内容并派发实践任务。

实践小结

在这七天的实践活动中，每位同学都认真学习，讲师在web静态前端的基础上，为了丰富网页页面的视觉效果，在一个页面上实现多个动画同时并行的效果展示，讲师不单只讲知识点，还将知识点结合实际操练，让同学们印象更深刻，学习到更多JavaScript的语法，使得自web前端知识更丰富。