摘要:事件機制其實很簡單,無非冒泡和捕獲這兩點,筆者不再贅述,網(wǎng)上相關文章一大堆,下面讓我們直接看面試題題目一到七,統(tǒng)一設置題目一請問點擊后,數(shù)字和,誰先被打印出來題目二請問點擊后,數(shù)字和,誰先被打印出來題目三請問點擊后,數(shù)字和,誰先被打印出來題
As we all know,事件機制其實很簡單,無非冒泡和捕獲
這兩點,筆者不再贅述,網(wǎng)上相關文章一大堆,下面讓我們直接看面試題
題目一到七,統(tǒng)一設置css
.test2 { height: 50px; }題目一
請問:點擊div.test1后,數(shù)字1和2,誰先被打印出來?
題目二請問:點擊div.test1后,數(shù)字1和2,誰先被打印出來?
題目三請問:點擊div.test1后,數(shù)字1和2,誰先被打印出來?
題目四請問:點擊div.test1后,數(shù)字1和2,誰先被打印出來?
題目一到四的答案題目一:2,1
題目二:1,2
題目三:2,1
題目四:1,2
如果上面四道題,你做不對,說明了兩件事
一、你對事件機制的全過程不了解,其實很簡單事件機制是先進行捕獲,再進行冒泡
二、你對addEventListener的第三個參數(shù)不了解,看MDN文檔吧
OK,上面問題都搞清楚了嗎?下面繼續(xù)咯~
題目五請問:點擊div.test1后,數(shù)字1和2,誰先被打印出來?
題目六請問:點擊div.test1后,數(shù)字1和2,誰先被打印出來?
題目七請問:點擊div.test1后,數(shù)字1和2的出現(xiàn)順序是什么樣的?
題目五、題目六和題目七的答案題目五:2,1
題目六:1,2
題目七:1,2
我相信,題目五和題目六肯定是沒問題的,但題目七可能和你想的不太一樣,難道不是先捕獲再冒泡了嗎?
當然不是
為什么呢?
因為如果被監(jiān)聽的元素沒有子元素,那么哪個監(jiān)聽代碼寫在前面,就先執(zhí)行哪個!
請問:點擊label后,數(shù)字1和2的出現(xiàn)順序是什么樣的?
答案:1,2,1
因為label和input是有綁定的
點擊label后,瀏覽器自動幫你再點擊一次label
過程就是先進行一次事件機制,這一次對內部input元素的事件監(jiān)聽是不管不問的,所以先打出1
結束后,再進行一次事件機制,這一次,按照正常事件機制流程走,所以接著打出了2,1
文章版權歸作者所有,未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉載請注明本文地址:http://systransis.cn/yun/93592.html
摘要:這也就解釋了以下代碼運行正常那么,的循環(huán)里發(fā)生了什么呢變量提升 for (var index = 0; index < 5; index++) { setTimeout(function (){ console.log(index);//5 }, 10) } console.log(index)// 5 這是個老生常談的問題,但是今天我才明白過來實際是怎么回事。使用ES...
摘要:不過幸運的是所有面試的公司都給了,在這里總結下經(jīng)驗吧。這里推薦下我當時看的一篇的面經(jīng),木易楊老師寫的大廠高級前端面試題匯總。 前言 本人畢業(yè)一年,最近陸續(xù)面試了頭條、瓜子、360、猿輔導、中信銀行、老虎等公司,由于最近比較寒冬而且招1-3年的并不多,再加上自己對公司規(guī)模和位置有一定要求,所以最后合適的也就這幾家了。不過幸運的是所有面試的公司都給了offer,在這里總結下經(jīng)驗吧。掘金:h...
摘要:要想注冊過的事件能夠被解除,必須將回調函數(shù)保存起來,否則無法解除。當用阻止瀏覽器的默認行為時,會做下面這件事停止回調函數(shù)執(zhí)行并立即返回。 showImg(https://segmentfault.com/img/bVboOcb?w=750&h=422); 前言 這是前端面試題系列的第 7 篇,你可能錯過了前面的篇章,可以在這里找到: 理解函數(shù)的柯里化 ES6 中箭頭函數(shù)的用法 thi...
摘要:例題核心編程第二版變量作用域和命名空間一節(jié)有以下一道題目請問輸出結果是什么要想解這道題,必須先了解中的一些概念的變量名解析機制有時稱為。 例題 《核心編程(第二版)》變量作用域和命名空間一節(jié)有以下一道題目 # coding=utf-8 #!/usr/bin/env python def proc1(): j,k = 3,4 print j == %d and k ==...
閱讀 1101·2023-04-25 17:51
閱讀 2894·2021-11-23 09:51
閱讀 1509·2021-11-08 13:21
閱讀 2509·2021-09-22 15:14
閱讀 1537·2019-08-30 12:48
閱讀 1103·2019-08-29 12:44
閱讀 1161·2019-08-26 12:21
閱讀 1423·2019-08-26 10:47