html5：

html4.1
網頁開發：
結構: html4.0
樣式：css css2
行為：js

HTML5:　是HTML4的升級版本(狹義)

    結構：html5
    樣式：css3
    行為：js API 有所增強  地理定位 web存儲 拖拽

HTML5廣義的概念: 代表著瀏覽器技術發展的一階段，HTML5+CSS3+js API 一套前端技術的組合；

新增語義化標簽

    header 頭部
    nav  導航
    section  區域
    aside  側邊欄
    article 文章
    footer 底部
    progress  進度條

表單

表單類型： type="text"
   email
   tel
   url
   search
   number  step:步長
   color
   range  value   max min
   time
   date
   month
   week

   有兼容性問題

   表單元素：
    <input type="search" list="sex"/>
    數據列表
    <datalist id="sex">
        <option>男</option>
        <option>男</option>
        <option>男</option>
    </datalist>

    <output></output>  輸出信息
    <keygen/>   生成密鑰的 用于表單安全傳輸
    <meter></meter> 度量器  max   min  value  low  high
    <progress></progress> 進度條  max   min  value

    表單屬性：
    placeholder:提示文字
    autofocus:自動聚焦
    autocomplete：自動完成（填充）  on 開啟（默認）   off 取消提示
    required:必填
    multiple: 多選
    novalidate: 關閉表單的默認驗證功能 用于form
    pattern:  自定義正則驗證 pattern="\D+";

    表單事件：
    oninput:當用戶輸入時 觸發
    oninvalid:當驗證不通過是觸發-->設置驗證不通過時的提示文字

多媒體

 在網頁上播放 多媒體 必須依賴于第三方 插件
        mediaplay:
        快播：
        falsh插件：

        H5里面提供了 視頻 和 音頻的標簽
        audio  video

DOM拓展

 document 對象    文檔對象

    當在瀏覽器中 打開一個頁面后， 瀏覽器首先會來解析我們的 網頁，把解析出來的數據，存放到一個DOM對象中；
    document.getElmentById();

    在H5中 DOM新增的功能：

    jquery---
    $('.box');
    $('#box');
    $('div.box);
    $('div p');

   獲取單個元素：
    document.querySelector('.box‘);

    獲取所有符合條件的元素：  返回的數組
    document.querySeletorAll('.box');

    控制類名的API：
    node.classList.add();添加類名
    node.classList.remove()；刪除類名
    node.classlist.contains();判斷是否包含指定的類名
    node.classList.toggle()；切換指定的類名