Startseite Erkunden Hilfe
Anmelden
lovecoding
/
W250913
10
0
Fork 0
Dateien Issues 0 Pull-Requests 0 Wiki
Quellcode durchsuchen

admin

fengchuanyu vor 3 Stunden
Ursprung
567b3706a0
Commit
78be8520ff
13 geänderte Dateien mit 122 neuen und 6 gelöschten Zeilen
Gesamtansicht Diff-Statistik anzeigen
  1. 3 0
      .vscode/settings.json
  2. 8 3
      3_JavaScript/15_取整.html
  3. 1 0
      3_JavaScript/17_对象.html
  4. 2 2
      3_JavaScript/19_math对象.html
  5. 3 0
      3_JavaScript/5_数值型.html
  6. 2 0
      3_JavaScript/练习6_阶层求和.html
  7. 1 1
      4_BOM&DOM/11_DOM_控制标签属性.html
  8. 1 0
      4_BOM&DOM/2_BOM_定时函数.html
  9. 1 0
      4_BOM&DOM/9_DOM_获取整个文档.html
  10. 4 0
      6_HTML5/2_语义化标签.html
  11. 20 0
      6_HTML5/5_获取元素.html
  12. 43 0
      6_HTML5/6_cookie.html
  13. 33 0
      6_HTML5/练习1_画板.html

+ 3 - 0
.vscode/settings.json
Datei anzeigen 

@@ -0,0 +1,3 @@
 
+{
 
+    "liveServer.settings.port": 5501
 
+}

+ 8 - 3
3_JavaScript/15_取整.html
Datei anzeigen 

@@ -7,9 +7,14 @@
 
 </head>
 
 </head>
 
 <body>
 
 <body>
 
     <script>
 
     <script>
 
-        var a = 3.66666;
 
-        a = Math.floor(a);
 
-        console.log(a);
 
+        // var a = 3.66666;
 
+        // Math.floor 向下取整 去掉所有小数部分仅保留整数
 
+        // a = Math.floor(a);
 
+        // console.log(a);
 
+
 
+        var num = 1234;
 
+        var a = Math.floor(1234/1000);
 
+        
         
         
     </script>
 
     </script>
 
 </body>
 
 </body>

+ 1 - 0
3_JavaScript/17_对象.html
Datei anzeigen 

@@ -57,6 +57,7 @@
 
         console.log(person2)
 
         console.log(person2)
 
 
 
 
 
+        
 
 
     </script>
 
     </script>
 
 </body>
 
 </body>

+ 2 - 2
3_JavaScript/19_math对象.html
Datei anzeigen 

@@ -10,9 +10,9 @@
 
     <script>
 
     <script>
 
         var num = 1.167;
 
         var num = 1.167;
 
         var num2 = -1.167;
 
         var num2 = -1.167;
 
-        // 向上取整 只要小数部分有值 就进行进位
 
+        // 对数进行上舍入。 只要小数部分有值 就进行进位
 
         console.log(Math.ceil(num));
 
         console.log(Math.ceil(num));
 
-        // 向下取整 直接去掉小数部分
 
+        // 进行下舍入 直接去掉小数部分
 
         console.log(Math.floor(num));
 
         console.log(Math.floor(num));
 
 
 
         // trunc 将数字的小数部分去掉，只保留整数部分。
 
         // trunc 将数字的小数部分去掉，只保留整数部分。

+ 3 - 0
3_JavaScript/5_数值型.html
Datei anzeigen 

@@ -47,6 +47,9 @@
 
 
 
         console.log("num2等于"+num2);
 
         console.log("num2等于"+num2);
 
         console.log("num1等于"+num1);
 
         console.log("num1等于"+num1);
 
+
 
+        a-- //等同于 a = a - 1;
 
+        --a //等同于 a = a - 1;

+ 2 - 0
3_JavaScript/练习6_阶层求和.html
Datei anzeigen 

@@ -10,8 +10,10 @@
 
 <body>
 
 <body>
 
     <script>
 
     <script>
 
         var sum = 0;
 
         var sum = 0;
 
+        // 外层循环是 1 - 10 便利 
         for (var j = 1; j <= 10; j++) {
 
         for (var j = 1; j <= 10; j++) {
 
             var val = 1;
 
             var val = 1;
 
+            // 内层循环实现的是阶层的计算
 
             for (var i = 1; i <= j; i++) {
 
             for (var i = 1; i <= j; i++) {
 
                 val *= i
 
                 val *= i
 
             }
 
             }

+ 1 - 1
4_BOM&DOM/11_DOM_控制标签属性.html
Datei anzeigen 

@@ -32,7 +32,7 @@
 
             console.log(imgAlt);
 
             console.log(imgAlt);
 
 
 
 
 
-            oBox.setAttribute("class","box box2");
 
+            // oBox.setAttribute("class","box box2");
 
         }
 
         }
 
 
 
     </script>
 
     </script>

+ 1 - 0
4_BOM&DOM/2_BOM_定时函数.html
Datei anzeigen 

@@ -25,6 +25,7 @@
 
             console.log("每隔2秒打印一次");
 
             console.log("每隔2秒打印一次");
 
         },2000);
 
         },2000);
 
         // clearInterval 用来取消一个通过setInterval创建的定时器 需要传入一个定时器ID
 
         // clearInterval 用来取消一个通过setInterval创建的定时器 需要传入一个定时器ID
 
+        // 定时函数一旦被清除掉就无法再次启动了
 
         clearInterval(intervalId2);
 
         clearInterval(intervalId2);
 
 
 
         // setTimeout 和 setInterval 都是定时函数setTimeout只会执行一次 而setInterval会重复执行 
         // setTimeout 和 setInterval 都是定时函数setTimeout只会执行一次 而setInterval会重复执行

+ 1 - 0
4_BOM&DOM/9_DOM_获取整个文档.html
Datei anzeigen 

@@ -7,6 +7,7 @@
 
 </head>
 
 </head>
 
 <body>
 
 <body>
 
     <script>
 
     <script>
 
+        // documentElement 获取整个文档对象
 
         var oDocument = document.documentElement;
 
         var oDocument = document.documentElement;
 
         console.log(oDocument);
 
         console.log(oDocument);
 
     </script>
 
     </script>

+ 4 - 0
6_HTML5/2_语义化标签.html
Datei anzeigen 

@@ -8,5 +8,9 @@
 
 <body>
 
 <body>
 
     <div class="header">头部</div>
 
     <div class="header">头部</div>
 
     <div class="nav">导航</div>
 
     <div class="nav">导航</div>
 
+
 
+    <!-- html5中新增了语义化标签 标签本身没有样式只是文件名称更加贴切 -->
 
+    <header></header>
 
+    <nav></nav>
 
 </body>
 
 </body>
 
 </html>
 
 </html>

+ 20 - 0
6_HTML5/5_获取元素.html
Datei anzeigen 

@@ -0,0 +1,20 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <div class="box">hello</div>
 
+    <div class="box">world</div>
 
+    <script>
 
+        // querySelector 获取单个元素。括号中写css选择器
 
+        var oBox = document.querySelector("div");
 
+        // querySelectorAll 获取多个元素
 
+        var aBox = document.querySelectorAll(".box");
 
+        console.log(oBox);
 
+        console.log(aBox);
 
+    </script>
 
+</body>
 
+</html>

+ 43 - 0
6_HTML5/6_cookie.html
Datei anzeigen 

@@ -0,0 +1,43 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+        // var now = new Date();
 
+        // var nowDate = now.getDate();
 
+        // // setDate设置日期
 
+        // now.setDate(nowDate + 1);
 
+        // var dateStr = now.toUTCString();
 
+        // console.log(dateStr);
 
+
 
+        // document.cookie = "username=张三;Expires="+dateStr;
 
+        // document.cookie = "userage=18;Expires="+dateStr;
 
+
 
+        // document.cookie 存储cookie 等于一个键值对的方式 Expires后边是一个时间对象的字符串 表示的是这个cookie的过期时间
 
+        // 当前cookie仅在当前域名生效 比如 www.baidu.com 和 www.taobao.com 下的cookie都是独立空间存储 互相不互通
 
+
 
+
 
+        // cookie 读取 也是通过document.cookie
 
+        // var thisCookie = document.cookie;
 
+        // console.log(thisCookie);
 
+
 
+        var now = new Date();
 
+        var nowDate = now.getDate();
 
+        now.setDate(nowDate - 1);
 
+
 
+        document.cookie = "userage=19;Expires="+ now.toUTCString();
 
+        
+
 
+        // 储存cookie
 
+        setCookie(key,val,timer);
 
+        // 获取cookie
 
+        getCookie(key);
 
+        // 删除cookie
 
+        delCookie(key);
 
+    </script>
 
+</body>
 
+</html>

+ 33 - 0
6_HTML5/练习1_画板.html
Datei anzeigen 

@@ -0,0 +1,33 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+    <style>
 
+        #can{
 
+            background-color: black;
 
+        }
 
+    </style>
 
+</head>
 
+<body>
 
+    <canvas id="can" width="500" height="400"></canvas>
 
+    <script>
 
+        var oCan = document.getElementById("can");
 
+        var aCan = oCan.getContext("2d");
 
+        aCan.strokeStyle = "white";
 
+        aCan.lineWidth = 3;
 
+
 
+        oCan.onmousedown = function(event){
 
+            aCan.moveTo(event.clientX,event.clientY);
 
+            oCan.onmousemove = function(event){
 
+                aCan.lineTo(event.clientX,event.clientY);
 
+                aCan.stroke();
 
+            }
 
+        }
 
+        oCan.onmouseup = function(){
 
+            oCan.onmousemove = null;
 
+        }
 
+    </script>
 
+</body>
 
+</html>