目录
1 Js 的引入方式
1.1 JS 内部引入
<script type="text/javascript">
/*网页中的弹框*/
alert("js 的学习课程");
</script>
代码:
-
<!DOCTYPE html>
-
<html>
-
<head>
-
<meta charset="utf-8">
-
<title>
</title>
-
-
<!--【1】JS引入的方式一-->
-
<script type="text/javascript">
-
-
/*网页中的弹框*/
-
alert(
"js 的学习课程");
-
-
-
</script>
-
-
</head>
-
<body>
-
-
-
-
</body>
-
</html>
测试效果:
1.2 外部引入文件
src: 引入文件的路径
charset:指定引入的编码-->
<!--注意:引入js 的时候千万不要二合一-->
<script type="text/javascript"
src="js/test.js" charset="UTF-8" ></script>
HTML代码:
-
<!DOCTYPE html>
-
<html>
-
<head>
-
<meta charset="utf-8">
-
<title>
</title>
-
-
-
-
<!--[2]js引入的方式二 type:引入文件的类型 src: 引入文件的路径 charset:指定引入的编码-->
-
<!--注意:引入js 的时候千万不要二合一-->
-
<script type="text/javascript" src="js/test.js" charset="UTF-8" >
</script>
-
-
</head>
-
<body>
-
-
-
-
</body>
-
</html>
JS代码:
alert("js的学习引入方式");
效果:
2 js 中的变量
2.1JS中变量的声明
var 变量名=值;
2.2 JS中变量的使用注意的事项
1.js中的变量的名称和java中标识符的命名保持一致就可以了。
2.js中变量名称是可以重复的,但是后者的名称会把前者的名称值覆盖
3.js中末尾即使没有分号结束也是可以的,但是不推荐大家这样书写。
3 JS 中的数据类型
3.1 基本数据类型
number(数字类型的数据)
string(字符串类型)
boolean(布尔数据类型)
object(对象类型)
代码:
-
<!DOCTYPE html>
-
<html>
-
<head>
-
<meta charset="utf-8">
-
<title>
</title>
-
-
-
<script>
-
-
var a=
1;
-
-
var b=
1.2;
-
-
var c=
'你';
-
-
var d=
"我们";
-
-
var e=
true;
-
-
var f=
new
Date();
-
-
-
-
// alert(typeof f);
-
-
-
var aa;
-
-
-
// alert(typeof aa);
-
-
-
var bb=
"123a";
-
-
// alert(Number(bb));
-
-
var cc=
null;
-
-
var dd=
"";
-
-
alert(
typeof cc);
-
-
</script>
-
-
-
</head>
-
<body>
-
-
-
</body>
-
</html>
-
效果:
4 JS 中特殊数据类型
undefined(未定义)
NaN(不是一个数字) not a
number
null(空对象)
5 JS 中的运算符
5.1 算数运算符
+ - * / %++ --
和java类似详见:
5.2 逻辑运算符
& | ! && || ^ < > <= = !=
和java类似详见:
5.3 连接符
+
和java类似详见:
5.4 特殊运算符
(==)等值符
先比较类型 如果类型一致,在比较内容如果类型不一致,这时候会进行强制转换统一转number类型,然后再进行内容的比较
(===)等同符
先比较类型 如果类型一致,在比较内容如果类型不一致 直接返回false;
6 控制语句
6.1 条件语句
if(){}
if(){}else{}
if(){}else if(){} else if()...else{}
6.2 分支语句(选择语句)
switch(){
case value: break;
default: break;
}
6.3 循环语句
while(){}
至少执行一次循环体
do{}while()
for(var i =0 ; i<10;i++){}
代码:
-
<!DOCTYPE html>
-
<html>
-
<head>
-
<meta charset="utf-8">
-
<title>
</title>
-
<script>
-
-
/*var a=15;
-
-
switch (a){
-
case 10: alert("我是10");
-
break;
-
case 20: alert("我是20");
-
break;
-
case 30: alert("我是30");
-
break;
-
default:
-
break;
-
}*/
-
-
-
-
for(
var a=
1; a<=
9;a++){
-
-
-
for(
var b=
1;b<=a;b++){
-
-
-
document.write(b+
"*"+a+
"="+a*b+
" ");
-
-
}
-
/*直接把信息打印到浏览器上*/
-
document.write(
"<br />");
-
}
-
-
-
</script>
-
-
</head>
-
<body>
-
</body>
-
</html>
效果:
7 JS 中函数的声明
7.1 函数声明的三种形式
(1) function 函数名(){
函数体
}
(2) var 函数名=function(){
函数体
}
(3) var 函数名=new Function("函数体");
7.2 函数参数传递
在js中实参的个数和形参的个数可以不一致
7.3函数的返回值
如果函数没有return
这时候返回 undefined():函数执行符
代码:
-
<!DOCTYPE html>
-
<html>
-
<head>
-
<meta charset="utf-8">
-
<title>
</title>
-
-
<script>
-
-
/*****【1】函数声明的方式***********************/
-
-
//方式一
-
function demo1(){
-
-
alert(
"函数声明一");
-
-
}
-
-
//方式二
-
var demo2=
function(){
-
-
-
alert(
"函数声明二");
-
-
}
-
-
//方式三 (函数本身也是一个对象) 了解
-
-
var demo3=
new
Function(
"alert('我是函数声明三')");
-
-
-
// demo3();
-
// demo1();
-
-
/*************函数中参数传递************************/
-
-
function demo4(a,b){
-
-
console.log(a+
"...."+b);
-
-
-
}
-
-
-
/* demo4(1,2);//1....2
-
-
demo4(1);//1....undefined
-
-
demo4(1,2,3);//1....2*/
-
-
-
/**************函数的返回值**************************/
-
-
-
function demo5(a){
-
-
-
console.log(
"参数值:"+a());
-
-
-
return a;
-
-
-
}
-
-
// alert(demo5(5));
-
-
var a=
function(){
-
-
console.log(
"我是函数a");
-
-
};
-
-
demo5(a);
-
-
-
-
-
-
</script>
-
-
-
</head>
-
<body>
-
</body>
-
</html>
效果:
转载:https://blog.csdn.net/ZGL_cyy/article/details/105748593