H5有哪些常用的新特性呢？
HTML5（H5）作为HTML的第五个版本，引入了许多新的特性和功能，使得Web开发变得更加灵活和强大。以下是一些H5中常用的新特性：
语义化标签： 包括
<header>、<footer>、<nav>、<article>、<section>等，使得页面结构更加清晰和语义化，有利于搜索引擎优化（SEO）和可访问性。Canvas绘图：
<canvas>元素提供了一个用于绘制图形的API，可以实现复杂的图形、动画和游戏效果。视频和音频： 新增了
<video>和<audio>元素，使得在网页中嵌入视频和音频变得更加简单，并支持多种格式。本地存储： 包括LocalStorage和SessionStorage，可以在客户端存储数据，不受浏览器关闭影响，方便实现离线应用和持久化存储。
表单控件： 引入了一些新的表单控件，如
<input type="date">、<input type="email">、<input type="range">等，使得表单的输入更加方便和语义化。地理定位： 提供了Geolocation API，可以获取用户的地理位置信息，用于定位服务、导航等应用。
拖放操作： 引入了Drag and Drop API，可以实现元素的拖放操作，方便用户交互和操作。
Web存储： 提供了IndexedDB和Web SQL Database等新的存储方式，用于客户端存储大量结构化数据。
Web Worker： 允许在浏览器中运行后台任务的JavaScript代码，可以提高页面的响应性能和用户体验。
WebSocket： 提供了WebSocket API，支持在浏览器和服务器之间建立持久连接，实现实时通讯和数据交换。
这些新特性使得HTML5成为一个强大的Web开发平台，为开发者提供了更多的选择和可能性，同时也提升了用户体验和页面性能。
HTML5（H5）引入了许多新特性和API，使得Web开发变得更加强大和灵活。以下是一些常用的HTML5新特性和API，以及简单的代码示例：
语义化标签（Semantic Elements）：HTML5引入了一些新的语义化标签，如
<header>、<footer>、<nav>、<article>、<section>等，用于更清晰地描述页面内容结构。
<header> <h1>网页标题</h1> </header> <nav> <ul> <li><a href="#">链接1</a></li> <li><a href="#">链接2</a></li> </ul> </nav> <section> <article> <h2>文章标题</h2> <p>文章内容...</p> </article> </section> <footer> <p>版权信息</p> </footer>
Canvas绘图：<canvas>元素允许通过JavaScript来绘制图形，实现动画效果、图表和游戏等。
<canvas id="myCanvas" width="200" height="100"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = 'blue';
ctx.fillRect(10, 10, 150, 80);
</script>视频和音频（Video and Audio）：HTML5提供了<video>和<audio>元素，可以直接在网页中嵌入视频和音频。
<video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> </video> <audio controls> <source src="music.mp3" type="audio/mpeg"> </audio>
本地存储（Local Storage）：HTML5提供了localStorage和sessionStorage API，用于在客户端存储数据，以便在会话之间保持数据状态。
<script>
// 存储数据到localStorage
localStorage.setItem('username', 'John');
// 从localStorage读取数据
var username = localStorage.getItem('username');
console.log('Username: ' + username);
</script>地理位置（Geolocation）：通过navigator.geolocation API，可以获取用户的地理位置信息。
<button onclick="getLocation()">获取位置</button>
<script>
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
alert("您的浏览器不支持获取地理位置信息。");
}
}
function showPosition(position) {
alert("您的位置为: 纬度 " + position.coords.latitude +
"，经度 " + position.coords.longitude);
}
</script>这些只是HTML5中一些常用的新特性和API，HTML5还提供了许多其他功能，如拖放操作（Drag and Drop）、Web Workers、Web Sockets、表单验证、WebSocket、SVG等。
