H5新增特性

1.语义化标签

        HTML5新增语义化的标签主要有:<header>、<footer>、<section>、<nav>、<aside>、<article>等,这些标签在开发过程中能够更清晰的描述网页的结构和内容。

2.增强型表单

        HTML5引入了一些新的表单元素和属性,如<input>元素的新类型(如email、url、tel、search、number等)、<datalist>元素、<output>元素等,以及新的表单属性(如required、autocomplete、pattern等),使得表单的功能和用户体验得到了提升。

3.音频和视频

        HTML5引入了<audio>和<video>标签,在开发过程中可以网页上直接嵌入音频和视频内容,而不需要引入外部插件或者播放器。

4.Canvas绘图

        HTML5提供了<canvas>元素,可以在网页上绘制图形,为开发者提供了更多的创作空间。

5.SVG绘图

        HTML5提供了SVG(可缩放矢量图形)绘图,使得开发者可以在网页上创建更加复杂的矢量图形。

6.地理定位

        HTML5引入了地理定位API,允许网页请求用户的地理位置信息。

7.拖放API

        HTML5提供了拖放API,使得开发者可以轻松地实现网页元素的拖放功能。

8.webWorker

        webWorker允许在后台线程中运行脚本,不会阻塞用户界面,可以提高网页的性能和响应速度。

9.WebStorage

        HTML5提供了Web Storage API,包括sessionStorage(会话存储)和locaStorage(永久存储),用于在客户端(浏览器)中存储数据,而不需要与服务器进行通信。提供了比传统的cookie更大的存储空间和更高的安全性。

共同点:
  1. 都是用于在客户端存储数据的 API,可以存储字符串类型的数据。
  2. 存储的数据在同一域名下的所有页面之间共享,即在同一浏览器的同一标签页或窗口中可以共享存储的数据。
  3. 存储的数据不会被发送到服务器,仅在客户端中存储,不会因为页面刷新或关闭而丢失(除非主动删除或浏览器清除缓存)。 
区别:
  1. 生命周期不同:sessionStorage 的生命周期为当前会话期间,即当浏览器标签页或窗口关闭时数据会被清除;而 localStorage 的数据则永久存储在客户端,除非主动删除或浏览器清除缓存。
  2. 存储容量不同:sessionStorage 的存储容量通常比 localStorage 小,一般为 5MB 左右;而 localStorage 的存储容量通常为 5MB 到 10MB 不等,具体取决于浏览器。
  3. 使用方式不同:sessionStorage 的存储数据仅在当前会话中有效,即只能在当前标签页或窗口中访问;而 localStorage 的数据在所有同一域名下的页面中都可以访问。

10.WebSocket

        HTML5引入了WebSocket API,提供了一种在用户的浏览器和服务器直接建立持久连接方式,使得实时通信变得更加容易。

参考文章:H5新增了哪些新特性_h5新增了哪些特性-CSDN博客

  • 21
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值