first commit

2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
--- a/历届学生/陈一航/2020-04-01/event.html
+++ b/历届学生/陈一航/2020-04-01/event.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>js事件</title>
+
+</head>
+<body>
+    
+    <button>点我</button>
+
+    <script>
+
+        // 事件  
+        // 定义事件
+        // 1: 事件源     登录按钮
+        // 2: 事件类型   有很多类型 onclick
+        // 3: 事件处理函数 按钮需要处理的逻辑或者功能
+
+        // 第1
+        document.querySelector("button").onclick = function () {
+            alert("你点了按钮1")
+        }
+        document.querySelector("button").onclick = function () {
+            alert("你点了按钮2")
+        }
+
+        // document.getElementsByName
+        // document.getElementsByClassName
+        // document.getElementById
+        // document.getElementsByTagName
+
+        // 第2
+        // function tishi () {
+        //     alert("你点了按钮")
+        // }
+
+        // 第3
+
+        // document.querySelector("button").addEventListener('click', function(){
+        //     alert("你点了按钮1")
+        // })
+
+        // document.querySelector("button").addEventListener('click', function(){
+        //     alert("你点了按钮2")
+        // })
+        
+    </script>
+</body>
+</html>
--- a/历届学生/陈一航/2020-04-01/index.html
+++ b/历届学生/陈一航/2020-04-01/index.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>js 方法（函数）</title>
+</head>
+<body>
+    
+
+
+    <script>
+
+        // js 方法（函数） 数据类型之一
+
+        // 作用：封装具有相同逻辑或者作用（功能）的代码
+        // 1：定义：function 函数名() {}
+        // 2：调用
+
+        // 计算长方形面积
+        // 如果想拿到方法的返回值，使用 return 返回方法的最终计算结果给方法调用者
+        // 给钱的过程：向方法传递参数
+        // 不传参数的方法：无参函数（方法）
+        // 传参数的方法：有参函数（方法）
+        // arguments 可以将方法的参数全部获取到，不需要定义变量接受参数
+        function YourName () {
+            var result;
+            for(var i =0;i<arguments.length;i++) {
+                if ( !(i + 1 > 1) ) {
+                    result = arguments[i] * arguments[i+1]
+                }
+            }
+            return result
+        }
+        console.log(result)
+        // var a = 100, b = 300;
+        // var mianji = YourName(a,b);
+        // console.log(mianji);
+
+        // var a = 1;
+        // // 方法内部会形成一个独立的作用域
+        // // 全局作用域
+        // // 局部作用域
+        // // 定义变量不加var，会被js解析器进行变量提升
+        // function GolabVar () {
+
+        // }
+
+        // // 使用 prototype 原型向方法中追加 age变量
+        // prototype 在方法内里面使用
+        // 一般封装原生js插件的时候会用到，或者模拟类的时候
+        // 在vue里面是用来注册全局方法的
+
+        // GolabVar.prototype.age = 18
+        // GolabVar.prototype.getName = function () {
+        //     return "刘兵"
+        // }
+
+        // // 初始化方法，让方法变为object
+        // var ddd = new GolabVar()
+
+        // console.log(ddd.age)
+        // console.log(ddd.getName())
+
+
+        // 第二种定义方法的方式
+
+        // var GetName = function () {
+
+        // }
+        // function GetName() {}
+
+
+
+
+    </script>
+</body>
+</html>
--- a/历届学生/陈一航/2020-04-01/tabs.html
+++ b/历届学生/陈一航/2020-04-01/tabs.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>tabs切换</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            list-style: none;
+        }
+        .tabs_title {
+            overflow: hidden;
+        }
+        .tabs_title li {
+            float: left;
+            margin-right: 10px;
+        }
+        .tabs_content li {
+            display: none;
+        }
+        .active_title {
+            color: red;
+        }
+        .active_content {
+            display: block !important;
+        }
+    </style>
+</head>
+<body>
+    
+
+    <div class="tabs">
+
+        <ul class="tabs_title">
+            <li class="active_title">公告</li>
+            <li>规则</li>
+            <li>论坛</li>
+        </ul>
+
+        <ul class="tabs_content">
+            <li class="active_content">公告的内容</li>
+            <li>规则的内容</li>
+            <li>论坛的内容</li>
+        </ul>
+
+    </div>
+
+
+</body>
+
+<script>
+
+    var TabsTitle = document.querySelectorAll(".tabs_title li");
+    var TabsContent = document.querySelectorAll(".tabs_content li");
+
+    // 遍历所有的li标签
+    TabsTitle.forEach( function(val,index) {
+        // 为每个li标签绑定点击事件
+        val.onclick = function () {
+
+            // 用户点击的时候删除所有li的样式名 active_title active_content
+            TabsTitle.forEach(function(v, i){
+                v.className = ""
+                TabsContent[i].className = ""
+            })
+
+            // 然后为你点击的li标签添加激活样式 active_title active_content
+            val.className = "active_title"
+            TabsContent[index].className = "active_content"
+        }
+    } )
+
+
+
+</script>
+</html>