DOM參考手冊及事件參考手冊

靜逸發表於2015-05-24

給全域性HTML DOM元素增加函式的方法

      HTMLElement.prototype.hasClass = function (className) {
          return new RegExp("(^|\\s)" + className + "(\\s|$)").test(this.className);
      }

常用的節點型別:

事件物件的button屬性可能的值

keycode對應的程式碼數字:

DOM參考手冊

全域性變數
document HTML DOM文件的引用
HTMLElement HTML DOM元素的超類物件
DOM相關操作
body 直接指向HTML的body元素
childNodes 包含所有子節點的陣列
documentElement 所有DOM節點的根的節點,指向<html>元素 
firstChild  指向該元素的第一個子元素
getElementById(id)  通過id獲得元素 
getElementByTagName(tagName)  通過標籤名獲得元素陣列 
lastChild 指向元素的最後一個子節點
nextSibling 指向下一個兄弟節點
parentNode  指向父元素
previousSibling  前一個兄弟節點
節點相關
 innerText  返回一個包含當前元素的所有文字的字串
 nodeName  返回元素標籤名字的大寫形式
 nodeType  節點型別
 nodeValue  節點所包含的文字值
特性
 className  返回樣式class的相關字串
 getAttribute(attName)  訪問DOM元素特性值
 removeAttribute(attrName)  完全刪除元素某個特性的函式
 setAttribute(attrName)  設定包含在DOM元素內的特性的值
DOM修改
 appendChild(nodeToAppend)  引數為要新增的元素
 cloneNode(true|false)

 如果引數為true,節點及其內部的所有東西都會克隆

如果引數為false,則只有節點本身被克隆

 createElement(tagName)  引數為標籤名
 createElementNS(namespace,tagName) 建立節點,在特定的名稱空間下
 createTextNode(textString)  建立文字節點
 innerHTML  訪問和操作DOM元素的HTML內容的字串形式
 insertBefore(nodeToInsert,nodeToInsertBefore)  第一個引數為要插入的節點,第二個引數為在哪個節點之前插入,如果為null,則在節點的最後作為一個子節點插入
 removeChild(nodeToRemove)  刪除文件的節點
 replaceChild(nodeToInsert,nodeToReplace)  第一個引數為要新增的節點,第二個引數為被替換的節點

 

事件參考手冊

通用屬性
 type 如:點選事件函式內的e.type=='click' 
 target/srcElement 目標物件 
 stopPropagation()/cancelBubble 停止冒泡 
 preventDefault()/returnValue=false;  阻止預設行為
滑鼠屬性
 clientX/clientY  視窗的滑鼠游標的x和y座標
 pageX/pageY  相對於呈現文件的滑鼠的x和y座標
 layerX/layerY和offsetX/offsetY

 相對於事件目標元素的滑鼠游標的x和y座標

layerX/layerY可用在基於Mozilla的瀏覽器和Safari

offsetX/offsetY可用在Opear和IE

 button  僅用於click、mousedown、mouseup
 relatedTarget  包含一個滑鼠剛離開的元素的引用
鍵盤屬性
 ctrlKey  該屬性返回一個布林值,表示鍵盤的ctrl鍵是否被按住
 keyCode  包含一個鍵盤相應鍵位的數字
 shiftKey   該屬性返回一個布林值,表示鍵盤的shift鍵是否被按住
頁面事件
 load  在頁面完全載入完畢的時候觸發
 beforeunload  在頁面解除安裝之前觸發
 error  在javascript程式碼發生錯誤時觸發
 resize  重置瀏覽器視窗時觸發
 scroll  瀏覽器視窗內移動文件的位置時觸發
 unload  在使用者離開當前頁時觸發
UI事件
 focus  聚焦
 blur  改變焦點
滑鼠事件
 click  
 dbclick  連續兩次點選後觸發
 mousedown  使用者敲擊滑鼠鍵時觸發
 mouseup  使用者鬆開滑鼠時觸發
 mousemove  滑鼠游標移動
 mouseover  把滑鼠從一個元素移動到另一個元素上時觸發
 mouseout  把滑鼠移出一個元素時觸發
鍵盤事件
 keydown/keypress  鍵盤敲擊時觸發的第一個鍵盤事件
 keyup  最後一個發生的鍵盤事件
表單事件
 select  滑鼠於輸入框內選擇不同區塊的文字時觸發
 change  使用者改變了輸入元素的值時觸發
 submit  提交表單
 reset  重置表單

keydown/keypress

事實上keypress是keydown事件的同義事件,它們的表現完全一致,只有一個例外,如果需要阻止按鍵的預設行為,你必須用keypress事件。

 

相關文章