<中文版>JavaScript元素動(dòng)作
JavaScript是一門根據(jù)HTML/CSS形成的Web語言。JavaScript可以直接作用于HTML文檔中,實(shí)現(xiàn)各種動(dòng)態(tài)效果,如響應(yīng)鼠標(biāo)點(diǎn)擊、改變HTML/CSS元素信息等。我們通常稱這些特性為“元素動(dòng)作”。下面是一些具體的例子:
1. 單擊事件
單擊事件(“onclick”)允許您在用戶單擊HTML元素時(shí)執(zhí)行特定的JavaScript代碼。例如,如果您想在用戶點(diǎn)擊一個(gè)按鈕時(shí)顯示一條消息,“onclick”事件可確保這在單擊按鈕時(shí)發(fā)生。
function showMessage() { alert("Hello World!"); }2. 輸入事件 輸入事件(“oninput”)允許你在用戶更改HTML表單輸入時(shí)執(zhí)行JavaScript代碼。例如,下面的代碼將在用戶更改文本框的內(nèi)容時(shí)自動(dòng)計(jì)算文本框中數(shù)字的總和。
function sumInput() { var input1 = document.getElementById("input1").value; var input2 = document.getElementById("input2").value; var sum = parseInt(input1) + parseInt(input2); document.getElementById("output").innerHTML = sum; }3. 鼠標(biāo)移過事件 鼠標(biāo)移過事件(“onmouseover”)允許您在鼠標(biāo)移動(dòng)到HTML元素上時(shí)執(zhí)行JavaScript代碼。例如,下面的代碼將在用戶將鼠標(biāo)懸停在按鈕上時(shí)更改元素的背景顏色。
function changeBackground() { document.getElementById("button").style.backgroundColor = "green"; }4. 時(shí)間事件 時(shí)間事件(“setInterval”)讓您可以重復(fù)執(zhí)行函數(shù)。例如,下面的代碼將每秒鐘更新標(biāo)簽中的時(shí)間。
function updateTime() { var today = new Date(); var hours = today.getHours(); var minutes = today.getMinutes(); var seconds = today.getSeconds(); document.getElementById("time").innerHTML = hours + ":" + minutes + ":" + seconds; } setInterval(updateTime, 1000);總之,元素動(dòng)作使得我們可以控制HTML/CSS元素的行為和外觀。JavaScript和它的動(dòng)態(tài)性為Web開發(fā)打開了新的大門,使得我們能夠交互和以各種不同的方式展示信息。