javascript - 這個事件代碼怎么理解?
問題描述
<input type='text' placeholder='輸入要添加的文本' /> <button id='btn'>加 </button> <ul id='ul'><li>11111</li><li>22</li><li>3333</li><li>4444</li> </ul> <script type='text/javascript'>var ul = document.getElementById('ul');var lis = ul.getElementsByTagName(’li’);var btn = document.getElementById('btn');btn.onclick = function() { //動態(tài)添加li var txt = document.getElementById('txt'),txtValue = txt.value,ali = document.createElement('li');console.log(txt.value); ali.innerHTML = txtValue;ul.appendChild(ali);}ul.onmouseover = function(ev) { var ev = ev || window.event; //獲取發(fā)生事件 event 兼容 =====1 var target = ev.target || ev.srcElement; //獲取真正被觸發(fā)的元素 =====2 if (target.nodeName.toLocaleLowerCase() == ’li’) {//判斷target是否是所需要的元素 正是因為這個判斷 我們可以得到任何想要的元素 a li td 等等target.style.background = 'red'; }}ul.onmouseout = function(ev) { var ev = ev || window.event; var target = ev.target || ev.srcElement; if (target.nodeName.toLocaleLowerCase() == ’li’) {target.style.background = ''; }} </script>
標注的1和2兩處的代碼的寫法怎么理解?看不懂= =哪來的api
問題解答
回答1:ev是事件的參數(shù),在ev中包含了事件觸發(fā)時的參數(shù),比如click事件的ev中包含ev.pageX,ev.pageY,keydown事件中包ev.keyCode等,在ie中,ev是全局的可以通過window.event來獲取,在其他瀏覽器中都是作為參數(shù)傳入的。
回答2:function 中ev是event的縮寫,即事件。而事件的接口屬于瀏覽器端實現(xiàn)。
簡單來說:window/event屬于全局變量,只要在瀏覽器中執(zhí)行,默認存在此變量。
回答3:主要是處理瀏覽器兼容性比如2舊的ie瀏覽器,或者事件對應(yīng)的元素需要用 ev.srcElement,而現(xiàn)在瀏覽器只需要使用 ev.target 就可以了
回答4:1和2都是為了兼容IE事件的寫法。
相關(guān)文章:
1. javascript - jQuery each 方法第三個參數(shù)args 如何解釋?2. java - 阿里的開發(fā)手冊中為什么禁用map來作為查詢的接受類?3. apache - 想把之前寫的單機版 windows 軟件改成網(wǎng)絡(luò)版,讓每個用戶可以注冊并登錄。類似 qq 的登陸,怎么架設(shè)服務(wù)器呢?4. java - 關(guān)于i++的一個題目5. css3 - Typecho 后臺部分表單按鈕在 Chrome 下出現(xiàn)靈異動畫問題,求解決6. javascript - 為什么嵌套的Promise不能按預(yù)期捕獲Exception?7. webgl - android上類似汽車之家的3d全景照片怎么實現(xiàn)8. python - uwsgi+django的搭建問題9. python - Pycharm的Debug用不了10. 請教MVC分發(fā)控制器時的相關(guān)內(nèi)容
