zsydgithub 2 gadi atpakaļ
vecāks
revīzija
6f4323944d

+ 29 - 0
4_JS基础/1_test.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+  <style>
+    #div1{
+      background: red;
+    }
+  </style>
+</head>
+<body>
+  <div id="div1">
+    我是div
+  </div>
+
+  <script>
+    // alert('哈哈哈')
+    // alert('111')
+    var div1 = document.getElementById('div1')
+    div1.onclick = function(){
+      console.log('我是div1')
+    }
+  </script>
+  <!-- <script src="1_test.js"></script> -->
+</body>
+</html>

+ 1 - 0
4_JS基础/1_test.js

@@ -0,0 +1 @@
+alert('我是js')

+ 29 - 0
4_JS基础/2_变量.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <script>
+    var a;//创建了一个变量
+    a = 123;// 给变量赋值
+    console.log(a)
+    a = 666
+    console.log(a)
+    // var a = 123;//简写为
+
+    var aZ = 666;
+    var az = 777
+    console.log(az)
+
+
+    //变量名称只能以字母、数字、下划线、$作为变量名称
+    //变量名称必须以字母、下划线、$作为开头
+    //变量不能以关键词为名称
+    //变量区分大小写
+  </script>
+</body>
+</html>

+ 28 - 0
4_JS基础/3_数据类型.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <script>
+    var a = 123;//数字 number
+    console.log(a)
+    var b = 'Hahha哈哈哈';//字符串 string  里面可以写任何内容
+    var c = true;// 布尔值 boolean  只有两个值  true  false
+
+    var d = '123'
+    console.log(d)
+    var f = 'true'
+
+    var un;// undefined  能找到变量名称 但是 没有值
+    console.log(un)
+    // console.log(typeof a)//使用typeof操作符可以用来检查一个变量的数据类型
+    // console.log(typeof d)
+    // console.log(typeof c)
+    // console.log(typeof f)
+  </script>
+</body>
+</html>

+ 79 - 0
4_JS基础/4_运算.html

@@ -0,0 +1,79 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <script>
+    // var a = 1;
+    // var b = 2;
+    // console.log(a*4+b-c) //NaN
+    // console.log(c)// undefined
+
+    // var c = a + b; //变量是可以参与运算的
+    // alert(c)
+
+    // var d = a * 2 + b ;
+    // alert(d)
+
+    // var a = 1; //number
+    // var b = '456' // string
+    // console.log(a+b) // 加法 当两种变量数据类型不统一 一个为number 一个为string  默认进行拼接
+
+    // var c = '哈哈哈哈'
+    // console.log(b+c)//string类型相加  默认拼接
+
+    // var d = true
+    // console.log(a+d) //2  number + boolean boolean 转为 number类型 当为true 值为1  false 值为0
+    // console.log(c+d) //哈哈哈哈true  
+
+    // var h;
+    // console.log(h+c)//碰到string  相加 都进行拼接
+
+    // var a = 123;
+    // var b = '456';
+    // console.log(b-a)//string 参与减法运算 会把里面的内容转为number类型
+    // var c = 'haha777'
+    // console.log(c-a)//NaN  但是如果碰到非全数字的string  无法转化 那么无法参与计算
+
+    // var d = false
+    // console.log(a-d)//boolean类型 参与加法运算 转为number  true为1  false为0
+
+    // var a = 111;
+    // a++;
+    // console.log(a) //a++ 自增  每次+1 
+    // //a 112
+    // a--;
+    // console.log(a)
+
+
+    // var a = 666;
+    // ++a;
+    // console.log(a)//667
+
+    // a++;
+    // console.log(a)/668
+
+    // --a;
+    // console.log(a)//667
+
+
+    // console.log(a)
+    // var c = a++;//先输出  后++
+    // console.log(c)//667
+
+    // console.log(++c)//668
+
+    // console.log(a)//668
+
+
+
+    var a = 5
+    console.log(a++)//5 先输出 后++   a=6
+    console.log(++a)//先++ 后输出  a=7
+  </script>
+</body>
+</html>

+ 30 - 0
4_JS基础/5_运算2.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <script>
+    // var a = 5
+    // var b = 6
+    // console.log(a<=b)
+
+    // console.log((2<5)||(3>5)) 
+    // //逻辑或,当两边值都为false时返回false;只要有一个为true 那么返回true
+    // console.log(2<5 && 3>5)
+    // //逻辑与,只要有一个为false,那么返回false
+    // console.log( a != 6)
+
+    var a = 5
+    var b = '5'
+    console.log(a==b)  // string里面如果为纯数字 会进行转换 从而进行判断
+    console.log(a===b)
+    // = 进行赋值 但是不进行判断
+    //== 进行判断 但是不判断数据类型
+    // === 进行判断 同时判断数据类型
+  </script>
+</body>
+</html>