時(shí)間過(guò)的真快，千鋒哈爾濱Web前端培訓(xùn)JavaScript部分已經(jīng)學(xué)習(xí)一個(gè)月了，仿佛昨天才開(kāi)始接觸JS。剛開(kāi)始接觸JS時(shí)，總感覺(jué)寫JS代碼特別難，寫上那么幾行代碼就感覺(jué)好吃力。隨著深入的學(xué)習(xí)，接觸多了也不覺(jué)得有多難了，當(dāng)每周末回頭看之前的知識(shí)點(diǎn)總感覺(jué)好容易啊。現(xiàn)在學(xué)的知識(shí)點(diǎn)多了，代碼量也是越來(lái)越多，從之前的十幾行到現(xiàn)在的動(dòng)輒上百行，感覺(jué)之前的難度都不算個(gè)事。在這個(gè)月里我感覺(jué)綜合能力最強(qiáng)的是做九宮格那個(gè)拖拽效果了。編程思路主要如下：

　　一、取顏色和插內(nèi)容好做，就不贅述了。

　　二、一共用到mousedown mousemove mouseup

　　1.mousedown時(shí)要做的事：

　　1.1要記下此時(shí)鼠標(biāo)距離事件源的位置，方便在鼠標(biāo)移動(dòng)事件使用該數(shù)值，主要是為了鼠標(biāo)松開(kāi)時(shí)計(jì)算離其余九個(gè)位置的距離(勾股定理)

　　1.2克隆一個(gè)一樣的節(jié)點(diǎn)且放在原地

　　2.拖拽時(shí)實(shí)時(shí)記錄clientX clientY的值，后邊計(jì)算最短距離時(shí)用到。

　　3.鼠標(biāo)松開(kāi)時(shí)，要新聲明兩個(gè)數(shù)組，兩個(gè)都是用來(lái)存放勾股定理求出來(lái)的數(shù)組，其中一個(gè)用sort排序，得到最小值，然后根據(jù)這個(gè)最小值在第二個(gè)數(shù)組中找到它的索引，也就是可以根據(jù)這個(gè)索引找到它是第幾個(gè)div;然后和clonenode的那塊進(jìn)行交換left和top值。

　　既然來(lái)到千鋒培訓(xùn)班學(xué)習(xí)，那就課上好好聽(tīng)講，課下多多練習(xí)，剛開(kāi)始可以跟著老師的思路來(lái)寫代碼，但是學(xué)到了一個(gè)月之后我們就需要自己有思想，自己去想如何對(duì)代碼進(jìn)行優(yōu)化，一定要有自己的思想。學(xué)習(xí)上遇到不會(huì)的地方一定要多問(wèn)，每天遇到的問(wèn)題最好當(dāng)天解決，不要每天留一個(gè)問(wèn)題，時(shí)間長(zhǎng)了會(huì)越積越多。前端是自己寫出來(lái)可以看到的東西，比看不到效果的后臺(tái)接受度高很多，讓人學(xué)習(xí)更有動(dòng)力，同時(shí)要多敲代碼，這樣才熟能生巧!

上一篇

千鋒哈爾濱學(xué)員分享Web前端培訓(xùn)第一周便收獲滿滿

下一篇

感謝千鋒哈爾濱Web前端培訓(xùn) 給予我成長(zhǎng)和蛻變的機(jī)會(huì)