14天入門JavaScript-day one

tomlingtm 發(fā)布于2019-08-20 12:02 / 2654人閱讀

摘要：第一天總結(jié)的是一些事件中的鼠標(biāo)事件事件中主要的都是對樣式的顯示隱藏，其中最簡單的就是使用事件對屬性進(jìn)行顯示隱藏或者改變屬性方法用于顯示帶有一條指定消息和一個按鈕的警告框。當(dāng)鼠標(biāo)指針移動到元素上時觸發(fā)。鼠標(biāo)按鍵被松開。

第一天總結(jié)的是一些HTML DOM 事件中的鼠標(biāo)事件

js事件中主要的都是對樣式的顯示隱藏，display:none or display:block

其中最簡單的就是使用onclick事件對屬性進(jìn)行顯示隱藏或者改變class屬性

demo1

alert() 方法用于顯示帶有一條指定消息和一個 OK 按鈕的警告框。

語法

alert(message)

要在 window 上彈出的對話框中顯示的純文本（而非 HTML 文本）

demo2

鼠標(biāo)移入移出顯示隱藏div塊


顯示隱藏div塊

更多的鼠標(biāo)事件

屬性	描述	DOM
onclick	當(dāng)用戶點(diǎn)擊某個對象時調(diào)用的事件句柄。	2
oncontextmenu	在用戶點(diǎn)擊鼠標(biāo)右鍵打開上下文菜單時觸發(fā)	?
ondblclick	當(dāng)用戶雙擊某個對象時調(diào)用的事件句柄。	2
onmousedown	鼠標(biāo)按鈕被按下。	2
onmouseenter	當(dāng)鼠標(biāo)指針移動到元素上時觸發(fā)。	2
onmouseleave	當(dāng)鼠標(biāo)指針移出元素時觸發(fā)	2
onmousemove	鼠標(biāo)被移動。	2
onmouseover	鼠標(biāo)移到某元素之上。	2
onmouseout	鼠標(biāo)從某元素移開。	2
onmouseup	鼠標(biāo)按鍵被松開。	2

參照菜鳥教程

demo3

使用函數(shù)簡單的對元素進(jìn)行顯示隱藏

demo4

使用函數(shù)改變元素css屬性值

demo5

簡單的對網(wǎng)頁的換膚功能
要在最前面的body中加入id="changebg"

    紅色
    綠色

demo6

className的使用

源碼查看
查看博客

GPU云服務(wù)器云服務(wù)器免備案cdn 14天試用監(jiān)控?cái)?shù)據(jù)最多保存14天第7天:CSS入門 one()

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/80765.html

相關(guān)文章

14天入門JavaScript-day one

摘要：第一天總結(jié)的是一些事件中的鼠標(biāo)事件事件中主要的都是對樣式的顯示隱藏，其中最簡單的就是使用事件對屬性進(jìn)行顯示隱藏或者改變屬性方法用于顯示帶有一條指定消息和一個按鈕的警告框。當(dāng)鼠標(biāo)指針移動到元素上時觸發(fā)。鼠標(biāo)按鍵被松開。第一天總結(jié)的是一些HTML DOM 事件中的鼠標(biāo)事件 js事件中主要的都是對樣式的顯示隱藏，display:none or display:block 其中最簡單的就是使...

cyrils 2019-08-29 11:31 評論0 收藏0
14天入門JavaScript-day one

摘要：第一天總結(jié)的是一些事件中的鼠標(biāo)事件事件中主要的都是對樣式的顯示隱藏，其中最簡單的就是使用事件對屬性進(jìn)行顯示隱藏或者改變屬性方法用于顯示帶有一條指定消息和一個按鈕的警告框。當(dāng)鼠標(biāo)指針移動到元素上時觸發(fā)。鼠標(biāo)按鍵被松開。第一天總結(jié)的是一些HTML DOM 事件中的鼠標(biāo)事件 js事件中主要的都是對樣式的顯示隱藏，display:none or display:block 其中最簡單的就是使...

zhaot 2019-08-01 15:54 評論0 收藏0
14天入門JavaScript-day two

摘要：前面一天學(xué)習(xí)用實(shí)現(xiàn)簡單的網(wǎng)頁效果，現(xiàn)在來學(xué)學(xué)的相關(guān)組成解釋器翻譯操作的能力瀏覽器兼容字面量常量變量樣式優(yōu)先級標(biāo)簽行間改變樣式變綠獲取最簡單選項(xiàng)卡教育培訓(xùn)招生出國循環(huán)的理解的使用簡單理解設(shè)置文字源碼查看查看原文前面一天學(xué)習(xí)用js實(shí)現(xiàn)簡單的網(wǎng)頁效果，現(xiàn)在來學(xué)學(xué)js的相關(guān) JavaScript組成 ECMAScript：解釋器、翻譯 DOM：Document Object Model 操...

Achilles 2019-08-29 11:33 評論0 收藏0
14天入門JavaScript-day three

摘要：學(xué)習(xí)的是的變量類型運(yùn)算符，數(shù)據(jù)轉(zhuǎn)換，變量作用域，以及什么是閉包變量類型真的沒定義雖然定義，沒有給東西顯隱性類型轉(zhuǎn)換字符串連接數(shù)字相加數(shù)字相減的使用變量作用域，局部變量和全局變量全局變量在任何地方都能用閉包簡單指的是子函數(shù)可以使用父函數(shù)中的學(xué)習(xí)的是js 的變量類型typeof運(yùn)算符，數(shù)據(jù)轉(zhuǎn)換，變量作用域，以及什么是閉包 demo1 變量類型 var a=12; //alert(typ...

keke 2019-08-29 11:33 評論0 收藏0
14天入門JavaScript-day two

摘要：前面一天學(xué)習(xí)用實(shí)現(xiàn)簡單的網(wǎng)頁效果，現(xiàn)在來學(xué)學(xué)的相關(guān)組成解釋器翻譯操作的能力瀏覽器兼容字面量常量變量樣式優(yōu)先級標(biāo)簽行間改變樣式變綠獲取最簡單選項(xiàng)卡教育培訓(xùn)招生出國循環(huán)的理解的使用簡單理解設(shè)置文字源碼查看查看原文前面一天學(xué)習(xí)用js實(shí)現(xiàn)簡單的網(wǎng)頁效果，現(xiàn)在來學(xué)學(xué)js的相關(guān) JavaScript組成 ECMAScript：解釋器、翻譯 DOM：Document Object Model 操...

wthee 2019-08-20 12:11 評論0 收藏0