目　录

第1篇 

Web前端开发技术综述篇

第1章 

Web前端开发技术综述 

……………………………………………􀀊2􀀊

1.1􀀊Web综述 

…………………………………………………………􀀊2􀀊

1.1.1􀀊Web的发展历程 

…………………………………………􀀊2􀀊

1.1.2􀀊Web的技术标准和应用领域 

……………………………􀀊4􀀊

1.1.3􀀊Web的开发工具 

…………………………………………􀀊9􀀊

1.2􀀊Web前端工程师的职业需求 

……………………………………􀀊13􀀊

1.2.1􀀊Web前端开发的由来 

……………………………………􀀊13􀀊

1.2.2􀀊Web前端开发工程师的职业要求 

………………………􀀊13􀀊

1.3思政案例 

1爱国人物 

———钱学森的艰难回国路 

……………􀀊13

第2篇 

Web前端技术基础篇

第2章 

HTML标记语言 

……………………………………………………􀀊18􀀊

2.1􀀊HTML概述 

………………………………………………………􀀊18􀀊

2.1.1􀀊HTML发展现状 

………………………………………􀀊18􀀊

2.1.2􀀊HTML页面结构 

………………………………………􀀊19􀀊

2.1.3􀀊HTML页面编辑 

………………………………………􀀊20􀀊

2.1.4􀀊HTML注释 

……………………………………………􀀊22􀀊

2.2􀀊HTML文本与图像 

………………………………………………􀀊22􀀊

2.2.1􀀊HTML头部元素 

………………………………………􀀊22􀀊

2.2.2􀀊HTML文本 

……………………………………………􀀊23􀀊

2.2.3超链接 

……………………………………………………􀀊27􀀊

2.2.4图片标记 

…………………………………………………􀀊29􀀊

2.2.5框架标记 

…………………………………………………􀀊31􀀊

2.2.6综合实例 

…………………………………………………􀀊32􀀊

2.3􀀊HTML表格 

………………………………………………………􀀊36􀀊

2.3.1表格标签 

…………………………………………………􀀊36􀀊

Web前端开发与应用教程

2.3.2行标签 

………………………………………………………………………􀀊38􀀊

2.3.3单元格标签 

…………………………………………………………………􀀊39􀀊

2.3.4表格实例 

……………………………………………………………………􀀊40􀀊

2.4􀀊HTML表单 

………………………………………………………………………􀀊42􀀊

2.4.1表单标签 

……………………………………………………………………􀀊42􀀊

2.4.2输入标签 

……………………………………………………………………􀀊44􀀊

2.4.3表单实例 

……………………………………………………………………􀀊45􀀊

2.5􀀊HTML5新特性 

…………………………………………………………………􀀊47􀀊

2.5.1􀀊HTML5入门 

……………………………………………………………􀀊47􀀊

2.5.2􀀊HTML5表单 

……………………………………………………………􀀊50􀀊

2.5.3􀀊WebSocket…………………………………………………………………􀀊59􀀊

2.6思政案例 

2爱国故事 

———2001年网络 

“大战 

”…………………………………􀀊62

第3章 

CSS层叠样式 

………………………………………………………………………􀀊64􀀊

3.1􀀊CSS基础 

……………………………………………………………………………􀀊64􀀊

3.1.1􀀊CSS概述 

……………………………………………………………………􀀊64􀀊

3.1.2􀀊CSS样式表分类 

……………………………………………………………􀀊65􀀊

3.1.3􀀊CSS选择器 

…………………………………………………………………􀀊66􀀊

3.1.4􀀊CSS样式特性 

………………………………………………………………􀀊70􀀊

3.2􀀊CSS盒子模型 

………………………………………………………………………􀀊72􀀊

3.2.1盒子模型的概念 

……………………………………………………………􀀊72􀀊

3.2.2边框 

…………………………………………………………………………􀀊73􀀊

3.2.3内边距 

………………………………………………………………………􀀊73􀀊

3.2.4外边距 

………………………………………………………………………􀀊74􀀊

3.2.5盒子的浮动与定位 

…………………………………………………………􀀊74􀀊

3.3􀀊CSS常用属性 

………………………………………………………………………􀀊78􀀊

3.3.1字体属性 

……………………………………………………………………􀀊78􀀊

3.3.2文本属性 

……………………………………………………………………􀀊80􀀊

3.3.3背景属性 

……………………………………………………………………􀀊81􀀊

3.3.4鼠标属性 

……………………………………………………………………􀀊84􀀊

3.3.5列表属性 

……………………………………………………………………􀀊85􀀊

3.4􀀊CSS页面布局 

………………………………………………………………………􀀊86􀀊

3.4.1网页布局的类型 

……………………………………………………………􀀊86􀀊

3.4.2􀀊DIV+CSS网页布局 

………………………………………………………􀀊87􀀊

3.4.3􀀊CSS综合实例 

………………………………………………………………􀀊89􀀊

3.5􀀊CSS3新特性 

………………………………………………………………………􀀊94􀀊

3.5.1􀀊CSS3新属性 

………………………………………………………………􀀊94􀀊

3.5.2􀀊CSS3弹性盒子 

……………………………………………………………􀀊97􀀊

3.6思政案例 

3中国国家博物馆 

VR展馆 

———大唐风华 

………………………􀀊100􀀊

Ⅳ 

目　录

第4章 

JavaScript脚本语言 

………………………………………………………………􀀊101􀀊

4.1􀀊JavaScript基础 

……………………………………………………………………􀀊101􀀊

4.1.1􀀊JavaScript概述 

…………………………………………………………􀀊101􀀊

4.1.2􀀊JavaScript基本语法 

……………………………………………………􀀊104􀀊

4.1.3􀀊JavaScript运算符 

………………………………………………………􀀊110􀀊

4.1.4􀀊JavaScript控制流程 

……………………………………………………􀀊111􀀊

4.2􀀊JavaScript事件和函数 

……………………………………………………………􀀊115􀀊

4.2.1􀀊JavaScript事件 

…………………………………………………………􀀊115􀀊

4.2.2􀀊JavaScript函数 

…………………………………………………………􀀊116􀀊

4.3􀀊JavaScript内置对象 

………………………………………………………………􀀊118􀀊

4.3.1􀀊Aray对象 

………………………………………………………………􀀊118􀀊

4.3.2􀀊String对象 

………………………………………………………………􀀊120􀀊

4.3.3􀀊Date对象 

…………………………………………………………………􀀊122􀀊

4.3.4􀀊Math对象…………………………………………………………………􀀊123􀀊

4.3.5􀀊Window对象 

……………………………………………………………􀀊125􀀊

4.3.6􀀊Document对象 

…………………………………………………………􀀊128􀀊

4.4􀀊JavaScript性能优化和安全防护 

…………………………………………………􀀊130􀀊

4.4.1􀀊JavaScript性能优化 

……………………………………………………􀀊130􀀊

4.4.2􀀊JavaScript安全防护 

……………………………………………………􀀊133􀀊

4.4.3􀀊JavaScript综合实例 

……………………………………………………􀀊135􀀊

4.5思政案例4中国国家博物馆 

VR展馆———复兴之路 

………………………􀀊138

第3篇 

Web前端技术进阶篇

第5章 

jQuery应用…………………………………………………………………………􀀊140􀀊

5.1􀀊jQuery基础 

………………………………………………………………………􀀊140􀀊

5.1.1􀀊jQuery简介 

………………………………………………………………􀀊140􀀊

5.1.2􀀊jQuery选择器 

……………………………………………………………􀀊141􀀊

5.1.3􀀊jQuery文档处理 

…………………………………………………………􀀊143􀀊

5.1.4􀀊jQuery事件 

………………………………………………………………􀀊145􀀊

5.1.5􀀊jQuery控制元素 

CSS样式 

………………………………………………􀀊147􀀊

5.1.6􀀊jQuery遍历 

………………………………………………………………􀀊149􀀊

5.2􀀊jQuery高级应用 

…………………………………………………………………􀀊151􀀊

5.2.1􀀊jQuery动画特效 

…………………………………………………………􀀊151􀀊

5.2.2􀀊jQuery插件机制 

…………………………………………………………􀀊153􀀊

5.3思政案例5中国载人航天之路 

………………………………………………􀀊156􀀊

Ⅴ 

Web前端开发与应用教程

第4篇智慧农业系统项目篇

第6章智慧农业系统项目 

…………………………………………………………………􀀊160􀀊

6.1前期设计 

…………………………………………………………………………􀀊160􀀊

6.1.1需求调研及现场工勘 

……………………………………………………􀀊160􀀊

6.1.2总体方案框架设计 

………………………………………………………􀀊162􀀊

6.2具体方案设计 

……………………………………………………………………􀀊164􀀊

6.2.1传感器及执行器应用 

……………………………………………………􀀊164􀀊

6.2.2边缘计算模块 

……………………………………………………………􀀊168􀀊

6.2.3组网方案设计 

……………………………………………………………􀀊168􀀊

6.2.4服务端方案设计 

…………………………………………………………􀀊169􀀊

6.2.5前端软件方案设计 

………………………………………………………􀀊171􀀊

6.3􀀊Web端软件实现 

…………………………………………………………………􀀊175􀀊

6.3.1远程农业监控系统实现 

…………………………………………………􀀊175􀀊

6.3.2农业物联网生产系统实现 

………………………………………………􀀊183􀀊

6.3.3云溯源查询监管应用系统实现 

…………………………………………􀀊189􀀊

6.3.4云信息追溯系统实现 

……………………………………………………􀀊194􀀊

6.3.5系统管理实现 

……………………………………………………………􀀊195

参考文献 

………………………………………………………………………………………􀀊200􀀊

Ⅵ