第2章  HTML
本章主要讲述HTML的相关知识。HTML（HyperText Markup Language）：超文本标记语言，是标准通用标记语言下的一个应用，也是一种规范、一种标准。
【学习目标】
● 熟练掌握HTML常用元素的使用。
● 了解HTML多媒体标签。
● 了解拖放编程。
html5开发示例
● 熟练掌握Web存储机制。
● 掌握使用canvas绘制图形。
2．1 HTML常用元素
HTML标签由开始标签和结束标签组成。开始标签是被括号包围的元素名（如<div>），结束标
签是被括号包围的斜杠和元素名（如</div>），某些HTML元素没有结束标签，如<br>。
2．1．1  label、input、button、radio、checkbox、ul
【演练2．1】熟悉label及各种类型的input。
【演练2．2】熟悉单选钮radio、复选框checkbox。
【注意观察】
在<input>标记中设定checked参数，则该选框就被默认选中。
同一组单选具有相同的name，比如旅游组的name都设为“travel”。这样才能实现name相同的一组单选钮多选一的效果。
【演练2．3】掌握select元素的用法，并能获取select元素的索引、值、文本。
对照结果，理解JavaScript代码，学会获取select元素单选、多选时如何获取选中的索引index、文本text和值value。
【演练2．4】掌握datalist的用法。
【演练2．5】熟悉无序列表ul、有序列表ol、动态生成列表元素。
2．1．2  表单验证
介绍如何使用email、url、number、range、date、month等表单验证元素，这些元素提供了更方便的输入控制和验证。
【演练2．6】熟悉各种表单验证元素。
2．2 HTML5新特性
audio、video、canvas等元素的引入，提高了用户体验度。地理位置服务、拖放、本地数据存储、文件上传、离线应用等新特性也极大地丰富了前端编程。本节介绍其中一些常用新特性的使用。
2．2．1  多媒体
【演练2．7】使用video标签播放视频。
【注意】Chrome浏览器可能不支持自动播放。
【演练2．8】使用audio标签播放音频。
2．2．2  拖放
拖放是一种常见的特性，即抓取对象以后拖到另一个位置。在HTML5中，拖放是标准的一部分，任何元素都能够拖放。
【演练2．9】掌握拖放编程的一般方法。
2．2．3  Web存储
HTML5提供了两种在客户端存储数据的新方法：localStorage和sessionStorage，localStorage可以没有时间限制，sessionStorage有效期在一次会话内有效，比如当浏览器关闭后，该次会话数据丢失。
不同的网站，数据存储于不同的区域，并且一个网站只能访问其自身的数据。可以使用 JavaScript来存储和访问数据。
【演练2．10】理解localStorage和sessionStorage的用途并熟练编程。
【演练2．11】利用LocalStorage保存用户登录信息。
2．2．4  canvas绘制图形
canvas元素使用JavaScript在网页上绘制图像。画布是一个矩形区域，可以控制其每一像素。canvas拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。
本节将使用canvas进行线条绘制，区域绘制，图像绘制。
【演练2．12】学会使用canvas绘制图形。
本章思考
1.能不看书、不看帮助熟练编写input、radio、checkbox、a、img、button相关代码了吗？
2.熟悉ul的基本语法了吗？会动态生成列表元素了吗？
3.理解localStorage和sessionStorage了吗？能针对其熟练编程了吗？

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。