關於DOM的事件操作

2022-08-05 11:42:10 字數 844 閱讀 5670

三部分:

js是以事件驅動為核心的一門語言

事件源,事件,事件驅動程式

比如,我用手去按開關,燈亮了。這件事情裡,事件源是:手。事件是:按開關。事件驅動程式是:燈的開和關。

再比如,網頁上彈出乙個廣告,我點選右上角的x,廣告就關閉了。這件事情裡,事件源是:x。事件是:onclick。事件驅動程式是:廣告關閉了

於是我們可以總結出:誰引發的後續事件,誰就是事件源

總結如下:

1. 獲取事件源

document.getelementbyid(「box」);

2. 繫結事件

box.onclick = function

();//

事件源.事件

3. 書寫事件驅動程式:關於dom的操作(業務邏輯)

具體**例項:

方式二:先單獨定義函式,再繫結

方式三:行內繫結

注意事項:

當頁面載入(文字和)完畢的時候,觸發onload事件。

jquery操作DOM和事件

1.jquery操作dom的屬性 attr 1.1 獲得節點的屬性 jquery物件.attr 屬性名 eg 獲得節點物件的屬性 alert d1 attr src 1.2 設定節點的一對屬性 jquery物件.attr 屬性名 屬性值 eg 設定節點物件的一對屬性 1.3 設定節點的多對屬性 jq...

關於DOM2級事件的事件捕獲和事件冒泡

dom2級事件中addeventlistener的執行機制,多個addeventlistener同時新增時的執行先後規律 w3c的dom事件觸發分為三個階段 事件捕獲階段,即由最頂層元素 一般是從window元素開始,有的瀏覽器是從document開始,至於其中的差別我稍後會更新 開始,逐次進入do...

關於DOM操作的相關案例

需求 開啟網頁時有乙個普通的按鈕,點選當前按鈕顯示乙個背景圖,中心並彈出乙個彈出框,點選x的時候會關閉當前的模態框 如下 彈出 需求 圖如下 如下 按鈕1按鈕2 按鈕3按鈕4 按鈕5 解釋 滑鼠懸停時,current欄變色,這裡用到了排他思想 先把所有按鈕的classname設定為空,然後把我 th...