首頁 > web前端 > js教程 > 詳解DOM元素和事件

詳解DOM元素和事件

王林
發布: 2020-05-25 17:55:07
轉載
2752 人瀏覽過

詳解DOM元素和事件

什麼是事件?

事件是指使用者的行為或元素的狀態。由指定元素監聽相關的事件,並且綁定事件處理函數。

什麼是事件處理函數?

元素監聽事件,並在事件發生時自動執行的操作。

一、事件函數分類

1、滑鼠事件

onclick //单击
ondblclick //双击
onmouseover //鼠标移入
onmouseout //鼠标移出
onmousemove //鼠标移动
登入後複製

2、文件或元素載入完成:

onload //元素或文档加载完毕
登入後複製

3、表單控制項狀態監聽:

onfocus //文本框获取焦点
onblur //文本框失去焦点
oninput //实时监听输入
onchange //两次输入内容发生变化时触发,或元素状态改变时触发
onsubmit //form元素监听,点击提交按钮后触发,通过返回值控制数据是否可以发送给服务器
登入後複製

二、取得元素節點

1、根據標籤名稱取得元素節點清單

var elems = document.getElementsByTagName("");
/*参数 : 标签名
返回值 : 节点列表,需要从节点列表中获取具体的元素节点对象,添加相应下标。
*/
登入後複製

2 、根據class 屬性值取得元素節點清單

詳解DOM元素和事件

3、根據id 屬性值取元素節點

詳解DOM元素和事件

##4、根據name 屬性值取元素列表

詳解DOM元素和事件

三、事件綁定方式

1、內聯方式: 將事件名稱作為標籤屬性綁定到元素上

範例:

<button onclick="alert()">点击</button>
登入後複製

2、動態綁定 :取得元素節點,動態新增事件

範例:

btn.onclick = function (){
};
登入後複製
推薦教學:

js入門教學

以上是詳解DOM元素和事件的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:cnblogs.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板