1、HTML5多媒體
HTML5 是HTML4的升級版。不是特定的開發語言。javascript
目前支持的瀏覽器有 safari、opera 、firefox 、 chrome、ie 可是較老的版本不支持。html
標籤：html5
<audio> 音樂播放器java
controls=「controls」 爲顯示音樂播放器面板jquery
<source src="連接" type="audio/mpeg（mp3,ogg）"/>git
</audio>程序員
<video> 視頻播放器chrome
controls="controls" 視頻播放器面板shell
width= 音樂播放器寬度canvas
height= 音樂播放器高度
<source src="連接" type="video/mp4"/>
</video>
document.getElementById("XXX").load 從新加載
document.getElementById("XXX").play 播放
document.getElementById("XXX").pause 暫停
2、HTML5表單
HTML5 表單新增特性
<input type="number"/> 數字
<input type="url"/> URL
<input type="email"/> 郵箱
<input type="color"/> 顏色拾取
<input type="date"/> 日期選擇
<input type="range"/> 範圍
input新增經常使用屬性
min 最小
max 最大
placeholder 默認提示
autocomplete 自動提交
autofocus 自動聚焦
novalidate 提交時不要驗證(默認自動驗證)
3、畫布
HTML5 canvas 畫布
<canvas></canvas>
例如：<canvas id="" width="" height=""></canvas>
canvas 自己不能畫圖，只能藉助於javascript畫圖。
因爲jquery並不能保證徹底支持html5的特性，因此建議使用原生的JS語法。
canvas通常前2個步驟爲：
一、var can = document.getElementById("") //獲取canvas對象
二、var con = can.getContext("2d");//獲取上下文。
注意：通常canvas經過上下文去畫圖，根據圖形的特殊性，矩形，圓，線段等統一歸類爲2d
注意：在canvas畫布上畫圖形以前，要給canvas必定的尺寸以後，再定義在畫布上顯示的東西，例如：去看電影，幕布就是canvas，顯示的電影圖像就是咱們要去畫的矩形、圓形 等。
注意：在canvas中，畫圖大體有2個類型：實心和空心。
分別用fill和stroke 表示。經常使用語法以下：
一、stroke(fill)Text 空心(實心)文本
二、stroke(fill)Style 空心(實心)樣式
三、stroke(fill) 開始繪製空心(實心)圖
四、stroke(fill)Rect 空心(實心)座標
五、clearRect(x,y,width,height)實際上就是橡皮擦，清除某一塊區域的內容
canvas基本分類：
一、畫矩形。
var can = document.getElementById("");
var con = can.getContext("2d");
con.fillStyle = "" //設置顏色
con.fillRect(x,y,width,height) //設置矩形顯示的尺寸
二、畫線段。
var can = document.getElementById("");
var con = can.getContext("2d");
con.moveTo(x,y); //起始座標位置
con.lineTo(x,y); //結束座標位置
三、畫圓。
var can = document.getElementById("");
var con = can.getContext("2d");
con.beginPath();//開始畫圓
con.arc(圓心x,圓心y，半徑r，開始弧度，結束弧度)；//順時針
con.strokeStyle = "white"; //設置空心圓顏色.
con.stroken(); //開始繪製
con.closePath();//結束畫圓
四、漸變 矩形。
var can = document.getElementById("");
var con = can.getContext("2d");
var grd = con.createLinearGradient(開始x,開始y,結束x,結束y);//建立一個漸變矩形
grd.addColorStop( 0 ， 開始漸變顏色);
grd.addColorStop( 1， 結束漸變顏色);
con.fillStyle = grd; //實心矩形顏色方案爲grd
con.fillRect(x,y,width,height);//這個漸變圖形在畫布上的座標。
五、漸變 圓形。
var can = document.getElementById("");
var con = can.getContext("2d");
var grd = con.createRadialGradient(開始的圓心x,開始的圓心y,開始的圓半徑,結束的圓心x,結束的圓心y,結束的圓半徑);//建立一個漸變圓 。 實際上就是一個圓向另外一個圓漸變！
grd.addColorStop( 0 ， 開始漸變顏色);
grd.addColorStop( 1， 結束漸變顏色);
con.fillStyle = grd; //實心矩形顏色方案爲grd
con.fillRect(x,y,width,height);
拖拽：實際上是兩個動做。
在HTML5中，特指把一個控件拖拽到另外一個控件中。
drag drop
使用步驟：
一、設置被拖拽的事件 onDrag
二、設置開始拖拽的事件 dragstart
三、設置被放入的事件 onDrop
四、設置開始放入事件 dropover
地圖定位：定位經緯度。 //有瀏覽器兼容性限制
navigator.geolocation.getcurrentposition( 回調位置函數名)
position.coords.latitude; //緯度
position.coords.longitude; //經度
4、CSS3
CSS3 有以下特性：
一、:in-range 範圍內 例：input:in-range {border:1px solid blue; } input:out-of-range { border:2px double red; }
二、:out-range 範圍外
三、:valid 經過
四、:invalid 沒有經過
五、:enabled 能夠填寫 例：nput[type="text"]:enabled { background: seashell;} input[type="text"]:disabled { background: plum;}
六、:disabled 禁用元素
七、:required 必填選項
八、:optional 可選(默認)
九、:read-only: 選擇器用於選取設置了 "readonly" 屬性的元素。
十、:nth-of-type 選擇器
十一、[屬性^=值] 選擇器匹配元素屬性值帶指定的值開始的元素。
注意：從最開始匹配，從左往右
十二、[屬性$=值] 選擇器同理，匹配元素屬性值帶指定的值結尾的元素。
注意：從最後開始匹配，可是仍是從左往右數
1三、[屬性*=值] 選擇器匹配元素屬性值包含指定值的元素。
注意：只要出現匹配值，就會被匹配
1四、元素1~元素2 選擇器匹配出如今 元素1 後面的 元素2。元素1 和 元素2 這兩種元素必須具備相同的父元素。
1五、錨點 ：咧：<a href="#firstChapter">第一章 血屍</a>點擊跳到某部位
總結：這周的總結也是今年的總結，書讀得太少，寫不出不少字，我以爲對程序員來說寫文章很是重要，新的一年在學習工做之餘多讀讀書，提升本身的文學修養。迷茫的緣由就是想的太多，作的太少，只要一旦放手去作，就會發現事情並不像想象的那麼難。我也制定了一些新的計劃，但願可以實現吧。