HTML5新增哪些功能

本篇內容主要講解“HTML5新增哪些功能”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“HTML5新增哪些功能”吧!

一、HTML5概念
HTML5并不僅僅只是做為HTML標記語言的一個最新版本，更重要的是它制定了Web應用開發的一系列標準，成為第一個將Web做為應用開發平臺的HTML語言。HTML5定義了一系列新元素，如新語義標簽、智能表單、多媒體標簽等，可以幫助開發者創建富互聯網應用，同時有令人眼花繚亂的css 3，還提供了一些Javascript API，如地理定位、重力感應、硬件訪問等，可以在瀏覽器內實現類原生應用，制作webApp，甚至結合Canvas我們可開發網頁版游戲。
二、HTML5新增部分簡介
1.新增的結構標簽
（1）header（頭部） （2）nav（導航） （3）section（主體） （4）aside（側邊欄） （5）article （內容）（6）footer（底部）
作用：與div一樣，只是增加了語義性，便于SEO優化。
拓展：SEO優化可以提升網站在搜索引擎中的排名，在前端實際應用中，我們會更多的去運用語義化標簽，同時針對一些特殊的字符，我們運用權重高的標簽去包裹網站logo。
2.新增的智能表單
2.1 input表單新增了type屬性值：
type="email"限制用戶輸入必須為Email類型
type="url"限制用戶輸入必須為URL類型
type="date"自動生成一個日期控件
type="time"同上
type="month"同上
type="week"同上
type="number"限制用戶輸入必須為數字類型
type="range"產生一個滑動條的表單
type="search"產生一個搜索意義的表單
type="color"生成一個顏色選擇表單
智能表單在移動端用的比較多，它會調取手機自身的控件。
2.2 表單智能驗證
required => 驗證表單是否為空，必須配合form表單來使用
pattern => 自定義驗證表單規則，匹配正則
invalid => 驗證失敗的時候觸發的事件
dom.setCustomValidity()=> 自定義彈出的內容 參數：string 自定義的內容
2.3 表單新屬性
placeholder=> 占位文本，體驗更加
autofocus => 自動獲取焦點 dom.focus（）
autocomplete=> 提交一次后下次自動補全 注意：必須提交一次之后，同時必須要有name屬性
multiple => 配合file控件實現多選
form => 配合form表單的id值實現關聯，在任意位置都可以被提交，但是不建議這么寫
2.4 智能表單過濾（datalist）
類似于搜索提示，輸入一個內容會提示相關聯的匹配的提示。它是利用表單的list =“datalist的id值”與datalist這個標簽取得聯系實現的。
2.5 video和audio標簽
HTML5中新添了video標簽來實現視頻的播放而不是借助于flash技術。
屬性：autoplay =>視頻默認加載完成后播放；controls =>播放的控件

到此，相信大家對“HTML5新增哪些功能”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！