JavaScript HTML DOM ???
Event
???? ??, ??, ??? ?? ? ???? ???? ??? ???? ?? ??? ???? ??? ?????.
???? JavaScript? DOM ??? ?????.
????? ?????. ???? ???? ?? ??? ??? ???? ?? JavaScript ??? ???? ??? ?????.
???? ?? ??? ????. ???? ??? ? ?? ???? ??????. ???? ??? ???? ?? ???? ??????.
???? ??
???? HTML ??? ???? ? ???? ???? JavaScript? ??? ? ????.
???? ??? ??? ? ??? ????? HTML ??? ??? JavaScript ??? ?????.
onclick=JavaScript
HTML ???? ?:
???? ???? ??? ?
???? ??? ?
???? ????? ?
?? ?? ???? ??? ?
?? ??? ??? ?
HTML ??? ??? ?
???? ? ???? ??? ?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<head>
<script>
function changetext(id){
id.innerHTML="hello";
}
</script>
</head>
<body>
<h1 onclick="changetext(this)">點擊！</h1>
</body>
</html>???? ????? HTML ????? ??? ??? ??? ? ????.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<button onclick="displayDate()">點擊</button>
<script>
function displayDate(){
document.getElementById("demo").innerHTML=Date();
}
</script>
<p id="demo"></p>
</body>
</html>HTML DOM? ???? JavaScript? ???? HTML ??? ???? ??? ? ????.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<head>
</head>
<body>
<button id="myBtn">點這里</button>
<script>
document.getElementById("myBtn").onclick=function(){displayDate()};
function displayDate(){
document.getElementById("demo").innerHTML=Date();
}
</script>
<p id="demo"></p>
</body>
</html>onload ? onunload ???
onload ? onunload ???? ???? ???? ????? ???? ?? ? ?????.
onload ???? ???? ???? ???? ??? ???? ??? ???? ? ??? ???? ??? ??? ? ???? ??? ? ????.
onload ? onunload ???? ???? ??? ??? ? ????.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<script type="text/javascript">
function load(){
alert("頁面加載完成");
}
</script>
</head>
<body onload="load()">
</body>
</html>onchange ???
onchange ???? ?? ??? ??? ??? ?? ?? ?????.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<head>
<script>
function myFunction(){
var x=document.getElementById("fname");
x.value=x.value.toUpperCase();
}
</script>
</head>
<body>
輸入你的名字: <input type="text" id="fname" onchange="myFunction()">
<p>當你離開輸入框后，將小寫字母轉為大寫字母。</p>
</body>
</html>onmouseover ? onmouseout ???
onmouseover ? onmouseout ???? ???? ???? HTML ?? ?? ??? ??? ? ??? ????? ? ??? ? ????.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<div onmouseover="mOver(this)" onmouseout="mOut(this)" style="background-color:yellow;width:120px;height:20px;padding:40px;">Mouse Over Me</div>
<script>
function mOver(obj){
obj.innerHTML="Thank You"
}
function mOut(obj){
obj.innerHTML="鼠標請移動至此"
}
</script>
</body>
</html>onmousedown, onmouseup ? onclick ???
onmousedown, onmouseup ? onclick? ??? ?? ???? ?? ??? ?????. ?? ??? ??? ???? onmousedown ???? ????, ??? ??? ??? onmouseup ???? ????, ????? ??? ??? ???? onclick ???? ?????.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<script type="text/javascript">
function noNumbers(e)
{
var keynum;
var keychar;
keynum = window.event ? e.keyCode : e.which;
keychar = String.fromCharCode(keynum);
alert(keynum+':'+keychar);
}
</script>
</head>
<body>
<input type="text" onkeydown="return noNumbers(event)" />
</body>
</html>?? ???:
onmousedown ? onmouseup
???? ??? ??? ??? ???? ?????.
onload
??? ??? ???? ???? ??? ?????.
onfocus
???? ?? ? ?? ??? ???? ?????.
??? ???
???? ?? ?? ???? ??? ????, ???? ??? ??? ???? ??? ?? ?????.
