CSS與JS的一個誤區

開發工具與關鍵技術:工具:DW 關鍵技術:js、css   
作者:咕噠咕噠giao
撰寫時間:2019年1月16日

對於新手來說,可能對css和javaScript不夠了解所以經常會出現一些錯誤,就好比如下面這兩個大致上一樣的頁面,顯而易見,唯一的區別就是遮罩層和按鈕事件
(頁面A)
在這裏插入圖片描述
(頁面B)
在這裏插入圖片描述
對於寫這些類型大概一樣的頁面,我們做的肯定是把頁面A相同的部分放在頁面B裏,css的話也是直接引用頁面A的就行了,,反正只要html那邊沒有這個類,那一些特別的樣式就算有也是沒有效果。哦,那javaScript也應該是差不多的吧,所以我們會出現這種低級的錯誤,把頁面A的js直接引用到頁面B來,多於的部分也沒有刪掉。
在這裏插入圖片描述
所以最後你會發現,頁面B的鼠標移入事件沒有效果,明明就是這個ID,爲什麼連點擊事件都獲取不了,這就很尷尬,其實這個並不是你代碼的錯誤。
JS和CSS這兩個雖然裏面都有S,但是這兩個東西是完全不一樣的。在JS裏,代碼是從上往下執行的,當它執行到紅色區域那塊點擊事件時,發現沒有獲取到這個變量,就是你聲明的這個變量是不存在的,它便會停止執行,在點擊事件那裏已經停止執行了,那肯定是不會執行下面的鼠標移入事件了。
正確寫法如下:
在這裏插入圖片描述
把多餘的刪掉,就不會遇到停止執行這種錯誤了。所以最好建議大家做頁面的時候,最好是一個頁面就一個獨立的JS,能避免很多麻煩。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章