js高程筆記14-15章

第14章 表單腳本

1.提交表單：

　　<input>和<button>標籤type設置成submit

　　<input>標籤type設置成image

　　以上方式提交表單會觸發submit事件

　　使用js：form.submit()也能夠提交，但不觸發事件

　　能夠利用事件驗證表單內容和避免重複提交（不能用click觸發）

2.重置表單：form.reset()

3.表單elements屬性：是全部表單字段的集合

　　表單字段屬性：disabled，form，type，name，value

　　表單字段方法：focus()和blur()

　　表單字段事件：blur，change，focus

4.文本框腳本：<input>和<textarea>，用戶內容保存在value屬性中

　　select()方法：選中文本框全部文本（增長易用性）

　　取得部分文本：setSelectionRange()

　　屏蔽字符：利用keypress事件檢測字符編碼

　　操做剪切板：beforecopy，copy，beforecut，cut，beforepaste，paste

　　自動切換焦點：判斷輸入是否等於maxlength

5.HTML5表單約束：

　　必填：required

　　其餘<input>類型：email，url，date。。。

　　數值範圍：min和max特性

　　輸入模式：pattern特性

　　檢測有效性：checkValidity()和validity屬性

　　禁用驗證：novalidity屬性

6.選擇框腳本：

　　選擇框的value屬性，若是選中項已指定value特性，則取特性，不然取選中項文本

　　選擇框change事件只要選中了選項就會觸發。但其餘表單字段在值被修改且焦點離開時觸發

　　訪問選中項：selectbox.selectedIndex屬性

　　添加選項：selectedbox.add()

　　移除選項：selectedbox.remove()

　　移動和重排：appendChild()，insertBefore()

　　表單序列化：P436

　　富文本編輯：document.designMode屬性，contenteditable特性

 

第15章 Canvas繪圖

1.取得上下文：getContext("2d")

2.導出畫布：toDataURL()

3.填充和描邊：fillStyle和strokeStyle

4.繪製矩形：fillRect()，strokeRect()，clearRect()

5.繪製路徑：beginPath()

　　　　　　設計路徑arc()，lineTo()，moveTo()

　　　　　　描繪路徑closePath()，fill()，stroke()，clip()

　　　　　　肯定某一點是否在路徑上isPointInPath()

6.繪製文本：fillText()，strokeText()，textAlign，textBaseLine，measureText().width

7.變換：translate()，rotate()，save()和restore()

8.繪製圖像：drawImage()

9.漸變：createLinearGradient()，addColorStop()，createRadialGradient()

10.模式：createPattern()

11.合成：globalAlpha，globalCompositionOperation