JavaScript事件概念詳解(區(qū)分靜態(tài)注冊和動(dòng)態(tài)注冊)
什么是事件？事件是電腦輸入設(shè)備與頁面進(jìn)行交互的響應(yīng)，我們稱之為事件
事件類型 鼠標(biāo)單擊：例如單擊button、選中checkbox和radio等元素；鼠標(biāo)進(jìn)入、懸浮或退出頁面的某個(gè)熱點(diǎn)：例如鼠標(biāo)停在一個(gè)圖片上方或者進(jìn)入table的范圍； 鍵盤按鍵：當(dāng)按下按鍵或釋放按鍵時(shí)； HTML事件：例如頁面body被加載時(shí)；在表單中選取輸入框或改變輸入框中文本的內(nèi)容：例如選中或修改了文本框中的內(nèi)容； 突變事件：主要指文檔底層元素發(fā)生改變時(shí)觸發(fā)的事件，如DomSubtreeModified(DOM子樹修改)。常用的事件 onload 加載完成事件： 頁面加載完成之后，常用于做頁面js 代碼初始化操作 onclick 單擊事件： 常用于按鈕的點(diǎn)擊響應(yīng)操作。 onblur 失去焦點(diǎn)事件： 常用用于輸入框失去焦點(diǎn)后驗(yàn)證其輸入內(nèi)容是否合法。 onchange 內(nèi)容發(fā)生改變事件： 常用于下拉列表和輸入框內(nèi)容發(fā)生改變后操作 onsubmit 表單提交事件： 常用于表單提交前，驗(yàn)證所有表單項(xiàng)是否合法。 事件的注冊什么是事件的注冊（綁定）？其實(shí)就是告訴瀏覽器，當(dāng)事件響應(yīng)后要執(zhí)行哪些操作代碼，叫事件注冊或事件綁定。事件的注冊又分為靜態(tài)注冊和動(dòng)態(tài)注冊兩種
靜態(tài)注冊事件：通過html 標(biāo)簽的事件屬性直接賦于事件響應(yīng)后的代碼，這種方式我們叫靜態(tài)注冊 動(dòng)態(tài)注冊事件：是指先通過js 代碼得到標(biāo)簽的dom 對象，然后再通過dom 對象.事件名= function(){} 這種形式賦于事件響應(yīng)后的代碼，叫動(dòng)態(tài)注冊動(dòng)態(tài)注冊基本步驟：
1、獲取標(biāo)簽對象2、標(biāo)簽對象.事件名= fucntion(){}
靜態(tài)動(dòng)態(tài)注冊舉例onload 加載完成事件靜態(tài)綁定：<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>靜態(tài)注冊</title> <script type='text/javascript'> // onload 事件的方法 function onloadFun() { alert(’靜態(tài)注冊onload 事件，所有代碼’); } </script></head><!--靜態(tài)注冊onload 事件,onload 事件是瀏覽器解析完頁面之后就會(huì)自動(dòng)觸發(fā)的事件,body標(biāo)簽的屬性，通過這個(gè)屬性注冊--><body οnlοad='onloadFun();'></body></html>動(dòng)態(tài)綁定：
固定的寫法，通過window.onload(){}方法，在大括號內(nèi)調(diào)用方法的
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>動(dòng)態(tài)注冊</title> <script type='text/javascript'> // onload 事件動(dòng)態(tài)注冊。是固定寫法 window.onload = function () { alert('動(dòng)態(tài)注冊的onload 事件'); } </script></head><body></body></html>onclick單擊事件
舉例，從這個(gè)例子更好的體會(huì)兩者定義的不同
onclick靜態(tài)綁定事件<!DOCTYPE html><html lang='en'><head><meta charset='UTF-8'><title>Title</title><script type='text/javascript'> function onclickFun() { alert('靜態(tài)注冊onclick 事件'); }</script></head><body><!--靜態(tài)注冊onClick 事件，通過button的onclick屬性--><button onclick='onclickFun();'>按鈕1</button></body></html>onclick動(dòng)態(tài)綁定事件
<!DOCTYPE html><html lang='en'><head><meta charset='UTF-8'><title>Title</title><script type='text/javascript'> window.onload = function () { //getElementById 通過id 屬性獲取標(biāo)簽對象 var btnObj = document.getElementById('btn01'); // 2 通過標(biāo)簽對象.事件名= function(){} btnObj.onclick = function () { alert('動(dòng)態(tài)注冊的onclick 事件'); } }</script></head><body> <button id='btn01'>按鈕2</button></body></html>
以上就是JavaScript事件概念詳解(區(qū)分靜態(tài)注冊和動(dòng)態(tài)注冊)的詳細(xì)內(nèi)容，更多關(guān)于JavaScript 事件的資料請關(guān)注好吧啦網(wǎng)其它相關(guān)文章！
相關(guān)文章：
1. python爬蟲實(shí)戰(zhàn)之制作屬于自己的一個(gè)IP代理模塊2. Ajax返回值類型與用法實(shí)例分析3. 使用FormData進(jìn)行Ajax請求上傳文件的實(shí)例代碼4. .Net Core和RabbitMQ限制循環(huán)消費(fèi)的方法5. 解決ajax請求后臺,有時(shí)收不到返回值的問題6. Python編寫nmap掃描工具7. 如何在jsp界面中插入圖片8. HTML 絕對路徑與相對路徑概念詳細(xì)9. 基于javaweb+jsp實(shí)現(xiàn)企業(yè)財(cái)務(wù)記賬管理系統(tǒng)10. .NET6打包部署到Windows Service的全過程
網(wǎng)公網(wǎng)安備