javascript - 事件的定義有無(wú)函數(shù)的區(qū)別
問(wèn)題描述
<!doctype html><html lang='en'><head> <meta charset='UTF-8'> <title>跨游覽器封裝函數(shù)</title></head><body> <h1 onclick='alert(’這是html事件綁定方式1’)'>html事件綁定方式1</h1> <h1 onclick='f1()'>html事件綁定方式2</h1> <h2 onclick='f1()'>dom0級(jí)事件綁定方式</h2> <script type='text/javascript'>function f1(){ alert(’這是html事件綁定方式2’);}var h2 = document.getElementsByTagName(’h2’);console.log(h2[0]);h2[0].onclick = function(){ alert(’這是dom0級(jí)事件綁定方式’);}h2[0].onclick = 'alert(’這是dom0級(jí)事件綁定方式’)'; </script> </body></html>
問(wèn)題解答
回答1:1.首先h2[0].onclick = 'alert(’這是dom0級(jí)事件綁定方式’)';這個(gè)寫法你仔細(xì)看下就知道是什么意思了!相當(dāng)于把'alert(’這是dom0級(jí)事件綁定方式’)'當(dāng)成一串字符串賦值給onclick,只是一串字符串,無(wú)法起效的!2.然后,<h1 onclick='alert(’這是html事件綁定方式1’)'>html事件綁定方式1</h1>,這個(gè)寫法,在html標(biāo)簽這里綁定的,onclick后面跟著的alert(’這是html事件綁定方式1’),這部分就是函數(shù)的內(nèi)容,就是你點(diǎn)擊了,觸發(fā)了事件,就執(zhí)行的內(nèi)容。跟<h1 onclick='(function(){alert(’這是html事件綁定方式1’)})()'>html事件綁定方式1</h1>這個(gè)寫法是等價(jià)的,看了這個(gè)寫法就知道是怎么回事了!就是相當(dāng)于,定義了一個(gè)自動(dòng)執(zhí)行的匿名函數(shù),而函數(shù)執(zhí)行的內(nèi)容,就是你寫的alert(’這是html事件綁定方式1’)。3.最后,這個(gè)就不多解釋了,這個(gè)是原理就是點(diǎn)擊后出發(fā)的事件,執(zhí)行函數(shù)而已!
h2[0].onclick = function(){ alert(’這是dom0級(jí)事件綁定方式’);}回答2:
第一個(gè)行內(nèi)定義的是DOM元素的attribute,下面訪問(wèn)DOM.onclick可以看作是訪問(wèn)的property。
<a onclick='alert(’abc’)'>test</a><script>var a = document.querySelector(’#test’);console.log(a.onclick); // function onclick(event) { alert(’abc’); }a.attributes[’onclick’].value = ’alert(’test’)’;console.log(a.onclick); // function onclick(event) { alert(’test’); }</script>
相關(guān)文章:
1. Python中使用超長(zhǎng)的List導(dǎo)致內(nèi)存占用過(guò)大2. 實(shí)現(xiàn)bing搜索工具urlAPI提交3. python - Django有哪些成功項(xiàng)目?4. Python從URL中提取域名5. MySQL主鍵沖突時(shí)的更新操作和替換操作在功能上有什么差別(如圖)6. 關(guān)于mysql聯(lián)合查詢一對(duì)多的顯示結(jié)果問(wèn)題7. node.js - windows10下的npm全局路徑的復(fù)原或者將npm徹底刪除?8. 數(shù)據(jù)庫(kù) - Mysql的存儲(chǔ)過(guò)程真的是個(gè)坑!求助下面的存儲(chǔ)過(guò)程哪里錯(cuò)啦,實(shí)在是找不到哪里的問(wèn)題了。9. 直接打字符不可以嗎?>和>有區(qū)別嗎10. node.js - 微信小程序websocket連接問(wèn)題
