1.JavaScript 是 web 上一種功能強(qiáng)大的編程語(yǔ)言 ，用于開(kāi)發(fā)交互式 的 web 頁(yè)面醒第。它不需要進(jìn)行 編 譯 进鸠，而是直接嵌入在 HTML 頁(yè)面中 客年，由瀏覽器執(zhí)行 漠吻。
- JavaScript 被設(shè)計(jì)用來(lái)向 HTML 頁(yè)面添加交互行為司恳。
- JavaScript 是一種腳本語(yǔ)言 （腳本語(yǔ)言是一種輕量級(jí)的編程語(yǔ)言〉扔傅。
- JavaScript 由數(shù)行可執(zhí)行計(jì)算機(jī)代碼組成 。
- JavaScript 通常被直接嵌入 HTML 頁(yè)面试读。
- JavaScript 是一種解釋性語(yǔ)言 （就是說(shuō)荠耽，代碼執(zhí)行不進(jìn)行預(yù)編譯） 骇塘。
- JavaScript 的組成：
核心 （ ECMAScript)語(yǔ)法韩容，語(yǔ)句． - 文檔對(duì)象模型 （ DOM ).操作文檔中的元素和內(nèi)容
- 瀏覽器瀏象模型 （ BOM )
2.變量的聲明
- var 變量名； //JavaScript變量是弱類型插爹， 及同一個(gè)變量可以存放不同類型的數(shù)據(jù)请梢，全局是直接變量名毅弧，局部是var+變量名
- 比較運(yùn)算符==是嘗試強(qiáng)轉(zhuǎn)后比如字符串的1和int 1，而===是不強(qiáng)轉(zhuǎn)直接比較
3.js三種書(shū)寫(xiě)格式：行外寸宵，行內(nèi)元咙，頁(yè)面外
1.<script type="text/javascript" src="1..js" ></script>此為頁(yè)面外
新建的js文件來(lái)放<script type="text/javascript"></script>之間的代碼
2.頁(yè)面內(nèi)是在head之間寫(xiě)
<script type="text/javascript">
window兩個(gè)對(duì)象
confirm("");
prompt("");
</script>
3.行內(nèi)
<body>
<a href="切換圖片.html">下一章</a>
<input type="button" value="跳到window" onclick="javascript:location.href='window對(duì)象.html'" />
</body>
直接在跳轉(zhuǎn)事件onclick書(shū)寫(xiě)
4.margin: auto;整體居中
text-align: center;元素內(nèi)部居中
5.切換圖片
<html>
<head>
<meta charset="UTF-8">
<title>切換圖片</title>
<style>
div{
border: 1px solid red;
width: 300px;
height: 300px;
margin: auto;
text-align: center;
}
</style>
<!--<script>
function init()
{
setInterval("changeimg()",3000);
timeAD=setInterval("showAD()",3000);
}
num=1;
function changeimg()
{
document.getElementById("img1").src="../img/"+num+".jpg";
num++;
if(num==4)
{
num=1;
}
}
function showAD()
{
document.getElementById("img2").style.display="block";
clearInterval(timeAD);
hiddeAD=setInterval("hiddenAD()",3000);
}
function hiddenAD()
{
document.getElementById("img2").style.display="none";
clearInterval(hiddeAD);
}
</script>-->
<script type="text/javascript" src="1..js" ></script>
<script>
function forward()
{
history對(duì)象
// history.go(-1);返回上一頁(yè)兩種方式
history.back();
}
</script>
</head>
onload是頁(yè)面創(chuàng)建運(yùn)行方法只可寫(xiě)一回
<body onload="init()">
<div>
<input type="button" value="next" onclick="changeimg()" />
<input type="button" value="foward" onclick="forward()"/>
</div>
</body>
</html>
6.注冊(cè)實(shí)例
此為一個(gè)一個(gè)彈出框
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注冊(cè)頁(yè)面</title>
<!--<script>-->
<!--function checkfrom(){-->
<!--// var userVal=document.getElementById("username").value;
// if(userVal==""){
//
// alert("用戶名不能為空");
// return false;
//
// }
// var pVal=document.getElementById("password").value;
// if(pVal==""){
//
// alert("密碼不能為空");
// return false;
//
// }
// var repVal=document.getElementById("repassword").value;
// if(repVal!=pVal){
//
// alert("確認(rèn)密碼不一致");
// return false;
// -->
<!--// }-->
<!--var eVal=document.getElementById("email").value;
if(!/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/.test(eVal)){
此為email檢測(cè)方法
alert("email格式不正確");
return false;
}
}-->
<!--</script>-->
<script type="text/javascript">
function showtips()
{
document.getElementById("userspan").innerHTML="<font color='gray'>用戶名必填</font>";
}
</script>
</head>
<body>
<table border="1px" align="center" width="1300px" cellpadding="0px" cellspacing="0px">
<!--3.注冊(cè)表單-->
<tr>
<td height="600px" background="../img/regist_bg.jpg">
<!--嵌套一個(gè)十行二列的表格-->
<form action="#" method="get" name="regForm" onsubmit="return checkfrom()">
onsubmit是表單提交方法，有返回值false則不提交
<table border="1px" width="750px" height="400px" align="center" cellpadding="0px" cellspacing="0px" bgcolor="white">
<tr height="40px">
<td colspan="2">
<font size="4">會(huì)員注冊(cè)</font> USER REGISTER
</td>
</tr>
<tr>
<td>
用戶名
</td>
<td>
<input type="text" name="user" size="34px" id="username" onfocus="showtips()" /><span id="userspan"></span>
onfocus是聚焦七扰，onblur是離焦方法
</td>
</tr>
<tr>
<td>
密碼
</td>
<td>
<input type="password" name="password" size="34px" id="password"/>
</td>
</tr>
<tr>
<td>
確認(rèn)密碼
</td>
<td>
<input type="password" name="repassword" size="34px" id="repassword"></input>
</td>
</tr>
<tr>
<td>
Emaile
</td>
<td>
<input type="text" name="email" size="34px" id="email"/>
</td>
</tr>
<tr>
<td>
姓名
</td>
<td>
<input type="text" name="username" size="34px"/>
</td>
</tr>
<tr>
<td>
性別
</td>
<td>
<input type="radio" name="sex" value="男"/>男
<input type="radio" name="sex" value="女"/>女
</td>
</tr>
<tr>
<td>
出生日期
</td>
<td>
<input type="text" name="birthday" size="34px"/>
</td>
</tr>
<tr>
<td>
驗(yàn)證碼
</td>
<td>
<input type="text" name="yzm" />
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="注冊(cè)" />
</td>
</tr>
</table>
</form>
</td>
</tr>
</table>
</body>
</html>
---------------------------------------------------
此為后綴提示注冊(cè)
<tr>
<td height="600px" background="../img/regist_bg.jpg">
<!--嵌套一個(gè)十行二列的表格-->
<form action="#" method="get" name="regForm" onsubmit="return checkfrom()">
<table border="1px" width="750px" height="400px" align="center" cellpadding="0px" cellspacing="0px" bgcolor="white">
<tr height="40px">
<td colspan="2">
<font size="4">會(huì)員注冊(cè)</font> USER REGISTER
</td>
</tr>
<tr>
<td>
用戶名
</td>
<td>
<input type="text" name="user" size="34px" id="username" onfocus="showtips('username','姓名必填')" onblur="checkuser('username','姓名不能為空')" /><span id="usernamespan"></span>
</td>
</tr>
<tr>
<td>
密碼
</td>
<td>
<input type="password" name="password" size="34px" id="password"onfocus="showtips('password','密碼必填')" onblur="checkuser('password','密碼不能為空')"/><span id="passwordspan"></span>
</td>
</tr>
<tr>
<td>
確認(rèn)密碼
</td>
<td>
<input type="password" name="repassword" size="34px" id="repassword"></input>
</td>
</tr>
7.定時(shí)器
- JavaScript 定時(shí)器 ：setTimeout
- setTimeout （） 在指定的毫秒數(shù)后調(diào)用函數(shù)或執(zhí)行代碼片段 拷泽。
setTimeout ( code , 毫秒數(shù)) - setlnterval （） 以指定周期執(zhí)行函數(shù)或代碼片段 司致。
- clearlnterval（） 取消由 setlnterval （） 設(shè)置的 timeout 。
- clearTimeout （） 取消由 setTimeout （） 方法設(shè)置的 timeout 枣耀。
8.事件
事件名 描述
onload 某個(gè)頁(yè)面或圖像被完成加載
onsubmit 提交按鈕被點(diǎn)擊
onclick 鼠標(biāo)點(diǎn)擊某個(gè)對(duì)象
ondblclick 鼠標(biāo)雙擊某個(gè)對(duì)象
onblur 元素失去焦點(diǎn)
onfocus 元素獲得焦點(diǎn)
onchange 用戶改變域的內(nèi)容
onkeydown 某個(gè)鍵盤(pán)的鍵被按下
onkeypress 某個(gè)鍵盤(pán)的鍵被按下或按住
onkeyup 某個(gè)鍵盤(pán)的鍵被松開(kāi)
onmousedown 某個(gè)鼠標(biāo)按鍵被按下
onmouseup 某個(gè)鼠標(biāo)按鍵被松開(kāi)
onmouseover 鼠標(biāo)被移到某元素之上
onmouseout 鼠標(biāo)從某元素移開(kāi)
onmousemove 鼠標(biāo)被移動(dòng)
