-1.概述
????????JS全称是JAVA Script，只能在浏览器被执行 ，基于对象的事件驱动的脚本语言
? ? ? ? 特点：弱类型，直译式
? ? ? ? 好处：增强了用户的交互性，相对安全，跨平台
? ? ? ? 位置：行内js,内部js，外部js
-2.入门案例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 js的语法</title>
<!-- 2. 内部js -->
<script>
alert(666);
</script>
</head>
<body>
<!-- 1. 行内js
事件驱动: 必须触发才会执行JS的动态效果
-->
<a href="#" onclick="alert(100)">onclick单击</a>
<a href="#" ondblclick="alert(200)">ondblclick双击</a>
<a href="#" onmouseenter="alert(300)">鼠标划入</a>
<a href="#" onmouseout="alert(400)">鼠标划出</a>
</body>
</html>
3.基础语法? ? ? ??
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 JS的语法</title>
<!-- 内部js -->
<script>
// 1. JS的数据类型: 是弱类型的语言,也有几种:number string boolean null undefined
var a = 10 ;
a = 1.9+2.6 ;
a = 1.9+2.1 ;
a = "hello js" ;
a = 'hello js';
a = true ;
a = null ;
alert("a的值:"+a) ;
var b = '123'+'456'; //JS也可以拼串
alert("b的值:"+b);//只定义而不赋值的变量,会得到提示undefined
// 2. JS的运算符
// % ++ --
var c = 10%3 ;
c = c++;
alert(c); //1
//alert(++c);
var d = 1;
//d = d+1;
d += 1 ;
alert(d);
var e = 1 ;
var f = '1' ;
alert(e==f); //数据的值,true
alert(e===f); //数据的值+类型,false
//三元运算符: 比较两个数里的大值
var g = prompt("输入数字") ; //从浏览器输入的值
var h = prompt("输入数字") ;
alert(g>h?1:0);
//typeof: 获取数据的类型
alert(typeof 100);//number
alert(typeof '100');//string
</script>
</head>
<body>
</body>
</html>
4.JS的语句
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 JS语句</title>
<!-- HTML中引入JS代码 -->
<script>
// 3. while
//需求: 如果给你1个亿,每天花一半,能花多少天
var c = 0 ;//记录天
var d = 100000000 ;//记录钱
while(d > 1){
d = d/2 ; //每天花一半
c++; //天数++
}
console.log("总共花几天: "+c);
// 2. for
// 打印1~10
for(var i=1;i<11;i++){
console.log(i);//在浏览器用f12打开控制台
}
//计算1~100里4的倍数的和
var sum = 0;
for(var i=1;i<101;i++){
if(i % 4 == 0){
sum += i ;
}
}
console.log("总和是: "+sum);
// 1. if...else
var a = prompt("请输入名字");
if(a == 'wyf' ){
//alert("大碗牢饭");
console.log("大碗牢饭");
}else{
alert("大碗宽面");
}
// 例子: 接收用户输入的成绩，判断成绩所属的等级
var b = prompt("请输入成绩");
if(b>=80 && b<=100){
alert("优秀");
}else if(b>=60 && b<80){
alert("中等");
}else if(b>=0 && b<60){
alert("不及格");
}else{
alert("输入有误");
}
</script>
</head>
<body>
</body>
</html>
5.JS的数组
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试js的数组</title>
<script>
// 1.定义数组
var a = new Array();
//js是弱类型的语言,对数据的类型要求并不高.可以存各种类型的数据,在java里要用Object[]
var b = new Array(1, 1.1, true, null, 'jack' );
var c = [ ] ;
//js里的数组,长度可以随时改变
c = [1, 1.1, true, null, 'jack'];
console.log(c); //获取数组的数据
console.log(c.length); //获取数组的长度
console.log(c[2]);
// 2.遍历数组
for(var i = 0 ; i < c.length ;i++){
console.log(i + "---" + c[i] ); //下标 和 根据下标获取数据
}
// 3.for ... in
for(var i in c){ //i是下标
console.log(i+"~"+c[i]);
}
</script>
</head>
<body>
</body>
</html>
6.JS的函数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试 js的函数</title>
<script>
// 语法: function 函数名(参数列表){ 函数体 }
//方式1:
//1, 定义函数
function a(){ //不需要参数
console.log(100);
}
function a2(a,b){//需要参数
console.log(a+b);
}
function a3(a){//有返回值的函数
return a ;//通过return返回结果
}
//2, 调用函数
var v = a3('jack');
console.log(v+'你好');
a2(1, 1.2);
a2('jack', 10);
a();
//方式2:
//1, 定义函数
var b = function(){
console.log(1000);
}
var b2 = function(a,b){
console.log(a*b);
}
var b3 = function(a){
return 'hello js' ;
}
//2, 调用函数
var va = b3(10);
console.log(va);
b2(2,10);
b();
</script>
</head>
<body>
</body>
</html>
