image.png
第一個(gè)js 程序
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>測試js</title>
<script >
alert(123);
</script>
</head>
<body>
</body>
</html>
JS 使用示范
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<Script >
alert(123123123123);
//將內(nèi)容寫到 html代碼中
document.write("這是以JavaScript印出的！");
document.write("<br>");
</Script>
</head>
<!--onload時(shí)間觸發(fā) body中加載完成時(shí) 才觸發(fā)時(shí)間 -->
<body onload="alert('hello')">
<Script Language="JavaScript">
alert("a");//先執(zhí)行，然后才觸發(fā)onload代碼铐殃；
// 使用系統(tǒng)自定義的函數(shù) 獲得當(dāng)前的日期
var d = new Date();
var time = d.getHours();
//js 控制臺(tái)
console.log(time);
//邏輯代碼
if(time < 20){
document.write("<b>Good morning</b>");
}
else{
document.write("<i>Good day</i>");
}
</Script>
<br>aaaa
<Script Language="JavaScript">
alert("b");//先執(zhí)行秉氧，然后才觸發(fā)onload代碼杉畜；
</Script>
</body>
</html>
外部引入 :<script src="js/externalJS.js"> </script>
<!DOCTYPE html>
<html>
<head>
<title>Firs JavaScript Sample</title>
<meta charset="utf-8">
<script src="js/externalJS.js"> </script>
</head>
<body>
<script Language="JavaScript">
alert("a");
document.write("<body bgcolor='yellow' text='blue'><br>");
document.write("<font size='+3'>This is just plain old HTML stuff.</font>");
</script>
</body>
</html>
書寫javaScript 需要注意的事兒
注釋與java 類似
image.png
特殊字符 即 類似于java中的轉(zhuǎn)義字符
image.png
常量
image.png
變量
image.png
image.png
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
var a; //聲明單個(gè)變量锭碳。var關(guān)鍵字與變量名之間以空格分隔
var b, c; //聲明多個(gè)變量欺税。變量之間以逗號分隔
var d = 1; //聲明并初始化變量环肘。等號左側(cè)是變量名欲虚，等號右側(cè)是值
var e = 2, f = 3; //聲明并初始化多個(gè)變量。以逗號分隔多個(gè)變量
var e = f = 3; //聲明并初始化多個(gè)變量悔雹，且定義變量的值相同
console.log( a );
console.log( b );
console.log( c );
console.log( d );
console.log( e );
console.log( f );
</script>
</head>
<body>
</body>
</html>
image.png
js數(shù)據(jù)類型 5種基本數(shù)據(jù)類型1種復(fù)雜類型
image.png
image.png
image.png
image.png
image.png
image.png
<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
var a = "1232.45";
document.write(parseInt(a)+"<br>");
document.write(parseFloat(a)+"<br>");
document.write(Number(a)+"<br>");
document.write("<hr>");
var b = "1232w45";
document.write(parseInt(b)+"<br>");
document.write(parseFloat(b)+"<br>");
document.write(Number(b)+"<br>");
document.write("<hr>");
var c = true;
document.write(parseInt(c)+"<br>");
document.write(parseFloat(c)+"<br>");
document.write(Number(c)+"<br>");
document.write("<hr>");
</script>
</body>
</html>
運(yùn)算結(jié)果
image.png
運(yùn)算符優(yōu)先級
image.png
image.png
image.png
定義函數(shù) 兩種方式
1.靜態(tài)定義
image.png
2.動(dòng)態(tài)定義
image.png
<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script language="javascript">
var circularityArea = new Function( "r", "return r*r*Math.PI" ); // 創(chuàng)建一個(gè)函數(shù)對象
var rCircle = 2; // 給定圓的半徑
var area = circularityArea(rCircle); // 使用求圓面積的函數(shù)求面積
alert( "半徑為2的圓面積為：" + area ); // 輸出結(jié)果
</script>
</body>
</html>
image.png
動(dòng)態(tài)傳參數(shù) arguments對象
image.png
函數(shù)調(diào)用
1.連接調(diào)用
image.png
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Functions</title>
<script language=javascript>
function greetings(){ // Function defined within <head> tags
document.bgColor="lightblue";
alert("Greetings to you!");
}
</script>
</head>
<body><center>
<a href="javascript:greetings()"><big>Click here for
Salutations</big>
</a><br>
</center>
</body>
</html>
2.事件觸發(fā) （最常用）
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Functions and Events</title>
<script language=javascript>
function greetings(){ // Function definition
document.bgColor="pink";
alert("Greetings and Salutations! ");
}
</script>
</head>
<body><center>
<form>
<input type="button" value="Welcome button" onClick="greetings();">
</form>
</body>
</html>
image.png
eval("alert(123)");
作用域：
1.共有函數(shù)
image.png
2.私有函數(shù)
image.png
定義數(shù)組 參考java中定義數(shù)組方式复哆，語法上有些許差異欣喧。
//Object[] arr=new Object[0];
var arr=new Array();
//Object[] arr=new Object[5];
var arr=new Array(5);
//Object[] arr=new Object[]{"5"};
var arr=new Array("5");
//Object[] arr={1,2,3,4,5,6};
var arr=new Array(1,2,3,4,5,6);
var arr=[1,2,3,4,5,6];
//使用數(shù)組 用arr[n]
//輸出
console.log(arr[2]);
//輸入
arr[2]=10;
遍歷數(shù)組
var arr=[1,2,3,4,5,6];
for(var n in arr){
console.log(arr[i]);
}
image.png
image.png
image.png
對象
在js中 只有對象的 概念 沒有類的概念 我們創(chuàng)建對象可以使用new關(guān)鍵字 ,而new 可以省略
