摘要:一操作元素創建刪除修改二事件一創建用函數創建一個元素用設置屬性注冊用戶修改用給一個元素添加子元素這里給添加剛才創建好的按鈕刪除以下兩種方法都可以刪除元素一種是自毀一種是父節點刪除子元素二點擊事件獲得按鈕聲明一個函數用于在按鈕點擊
一、操作元素(創建, 刪除, 修改)
二、事件
// 一、 // 創建 // 用 document.createElement 函數創建一個元素 var button = document.createElement("button"); // 用 innerHTML 設置屬性 button.innerHTML = "注冊用戶" // 修改 // 用 appendChild 給一個元素添加子元素 // 這里給 .login-form 添加剛才創建好的按鈕 var form = document.querySelector(".login-form") form.appendChild(button) // 刪除 var pwd = document.querySelector("#id-input-password") // 以下兩種方法都可以刪除元素 // 一種是自毀 // 一種是父節點刪除子元素 pwd.remove() form.removeChild(pwd) // 二、 // 點擊事件 // 獲得按鈕 var loginButton = document.querySelector("#id-button-login") // 聲明一個函數, 用于在按鈕點擊后執行 var clicked = function(event) { log("按鈕被點擊到了", event) } // 添加事件, 使用 addEventListener 函數, 它有兩個參數 loginButton.addEventListener("click", clicked) // 第一個是事件的名字, 第二個是事件發生后會被自動調用的函數 // loginButton 發生了 "click" 事件后調用 clicked 函數
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/103562.html
摘要:接下來我們看下三類異步編程的實現。事件監聽事件發布訂閱事件監聽是一種非常常見的異步編程模式,它是一種典型的邏輯分離方式,對代碼解耦很有用處。 一、 一道面試題 前段時間面試,考察比較多的是js異步編程方面的相關知識點,如今,正好輪到自己分享技術,所以想把js異步編程學習下,做個總結。下面這個demo 概括了大多數面試過程中遇到的問題: for(var i = 0; i < 3; i++...
摘要:如何通過一些技巧,達到減少事件綁定,優化頁面性能的目的呢接下來介紹一下我個人對優化事件綁定的實踐。這里直接給出最佳實踐利用事件冒泡機制來為元素綁定事件。再加上由于創建太多的事件監聽,也會對頁面性能有影響。 引言 無論新手老手,在前端開發中,經常要為DOM元素綁定事件,以實現某些功能。如何通過一些JS技巧,達到減少事件綁定,優化頁面性能的目的呢?接下來介紹一下我個人對優化事件綁定的實踐。...
摘要:事件簡介事件是合成事件,所有事件都自動綁定到最外層上。支持事件的冒泡機制,我們可以使用和來中斷它。這樣做簡化了事件處理和回收機制,效率也有很大提升。事件類型合成事件的事件類型是原生事件類型的一個子集。 React事件簡介 React事件是合成事件,所有事件都自動綁定到最外層上。因為Virtual DOM 在內存中是以對象的形式存在的,所以React 基于 Virtual DOM 實現了...
摘要:事件簡介事件是合成事件,所有事件都自動綁定到最外層上。支持事件的冒泡機制,我們可以使用和來中斷它。這樣做簡化了事件處理和回收機制,效率也有很大提升。事件類型合成事件的事件類型是原生事件類型的一個子集。 React事件簡介 React事件是合成事件,所有事件都自動綁定到最外層上。因為Virtual DOM 在內存中是以對象的形式存在的,所以React 基于 Virtual DOM 實現了...
摘要:因此事件觸發時,事件處理函數的實參中必須包含當前事件的基本信息。事件取消事件取消中需要做的就是已經綁定的事件處理函數移除掉即可。 事件機制為我們的web開發提供了極大的方便,使得我們能在任意時候指定在什么操作時做什么操作、執行什么樣的代碼。 如點擊事件,用戶點擊時觸發;keydown、keyup事件,鍵盤按下、鍵盤彈起時觸發;還有上傳控件中,文件加入前事件,上傳完成后事件。 由于在恰當...
閱讀 3463·2019-08-30 13:15
閱讀 1402·2019-08-29 18:34
閱讀 826·2019-08-29 15:18
閱讀 3487·2019-08-29 11:21
閱讀 3250·2019-08-29 10:55
閱讀 3700·2019-08-26 10:36
閱讀 1872·2019-08-23 18:37
閱讀 1823·2019-08-23 16:57