bmy/ClassContent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
历届学生/fontendsix/每日课程/2021-10-29/array.html Normal file
View File

@@ -0,0 +1,38 @@
<!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>array 数组</title>
</head>
<body>
</body>
<script>
// 数组:通过下标来存储数据
// 定义
// var a = new Array();
// a[0] = "你好0";
// a[1] = "你好1";
// a[2] = "你好2";
// var a = new Array(1,2,3,4,5);
// var a = [1,2,3,4,5,6];
// for (var i = 0; i < a.length; i++) {
// console.log(a[i]);
// }
// a.forEach(function(v, i, arr) {
// console.log(v);
// // console.log(i);
// })
</script>
</html>

81
历届学生/fontendsix/每日课程/2021-10-29/demo.html Normal file
View File

@@ -0,0 +1,81 @@
<!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>实现新闻列表</title>
</head>
<body>
<ul class="test">
</ul>
</body>
<script>
// 虚拟dom
// var ul = {
// localName: "ul",
// className: "test",
// children: [
// {
// localName: "li",
// children: [
// {
// localName: "p",
// innerText: "ewfwef"
// }
// ]
// },
// {
// localName: "li",
// children: [
// {
// localName: "h2",
// innerText: "wdqdqw"
// }
// ]
// }
// ]
// }
var news = [
{
title: '新闻1标题',
time: '2020-10-29',
content: "新闻1内容"
},
{
title: '新闻2标题',
time: '2020-10-29',
content: "新闻2内容"
},
{
title: '新闻3标题',
time: '2020-10-29',
content: "新闻3内容"
},
{
title: '新闻4标题',
time: '2020-10-29',
content: "新闻4内容"
}
];
for (var index = 0; index < news.length; index++) {
var li = `<li>
<h2>${news[index].title}</h2>
<span>${news[index].time}</span>
<div>${news[index].content}</div>
</li>`;
document.querySelector("ul").innerHTML += li
}
</script>
</html>

40
历届学生/fontendsix/每日课程/2021-10-29/event.html Normal file
View File

@@ -0,0 +1,40 @@
<!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>事件</title>
</head>
<body>
<button class="loginBut">登录</button>
</body>
<script>
// 事件
// 三要素: 事件源 事件处理类型 事件处理函数
// 三种
// 1
// 2
document.querySelector(".loginBut").onclick = function (event) {
console.log(event);
}
// document.querySelector(".loginBut").onclick = function () {
// alert("用户登录2")
// }
// document.querySelector(".loginBut").onclick = null
// document.querySelector(".loginBut").addEventListener("click", function() {
// alert("用户登录1")
// })
// document.querySelector(".loginBut").addEventListener("click", function() {
// alert("用户登录2")
// })
</script>
</html>

39
历届学生/fontendsix/每日课程/2021-10-29/eventdemo.html Normal file
View File

@@ -0,0 +1,39 @@
<!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>
body,html{
margin: 0;
width: 100%;
height: 100%;
}
span {
position: absolute;
}
</style>
</head>
<body>
</body>
<script>
var body = document.querySelector("body");
body.onclick = function (event) {
var x = event.clientX, y = event.clientY;
var span = document.createElement("span");
span.innerText = "哈哈哈";
span.style.left = `${x}px`;
span.style.top = `${y}px`;
console.log(span);
body.appendChild(span)
}
</script>
</html>

62
历届学生/fontendsix/每日课程/2021-10-29/for.html Normal file
View File

@@ -0,0 +1,62 @@
<!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>循环</title>
</head>
<body>
</body>
<script>
// 循环
// for
// while
// for (循环的开始变量;循环的结束条件;循环的自增变量) {
// }
// var result = 0;
// for (var i = 1; i<=100; i++) {
// result+=i
// }
// console.log(result);
// var car = {
// name: {
// name1: 'F150',
// name2: '猛禽'
// },
// speed: 6,
// color: "black"
// };
// for (var key in car) {
// console.log(car[key]);
// }
// var i = 1, result = 0;
// while (i<=100) {
// result+=i;
// i++
// }
// console.log(result);
// var i = 1
// do {
// console.log(i);
// i++;
// } while (i <= 10);
</script>
</html>

95
历届学生/fontendsix/每日课程/2021-10-29/function.html Normal file
View File

@@ -0,0 +1,95 @@
<!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>function 函数(方法)</title>
</head>
<body>
</body>
<script>
// function 就是具有相同功能代码的封装,降低代码冗余
// 定义 ?
// function 方法名( 可选 方法参数1,方法参数2,....) {
// // 你的代码
// }
// 没写名字的方法叫 匿名方法
// function test (money, clothes) {
// var b = 2, c = money;
// return `同学帮我洗: ${clothes}, 还剩余${c-b}元,还给了我`;
// }
// var test = function (money, clothes) {
// var b = 2, c = money;
// return `同学帮我洗: ${clothes}, 还剩余${c - b}元,还给了我`;
// }
// var c = test;
// console.log( c(10, "衣服") );
// var d = test(10, "衣服");
// console.log(d);
// 回调函数 在 异步 (同步) 代码里面用
// function async(callback) {
// var b = 1;
// setTimeout(function() {
// b = 3;
// callback(b)
// }, 3000)
// }
// async( function(ddd) {
// console.log(ddd);
// } )
// function a (callback) {
// var c = 1;
// callback(c)
// }
// a( function(res) {
// console.log(res);
// } )
// function forEach(data, callback) {
// for (let index = 0; index < data.length; index++) {
// callback(data[index], index, data)
// }
// }
// forEach(["哈哈1","哈哈2","哈哈3"], function(v,i,arr) {
// console.log(arr);
// } )
// 方法的作用域
// 全局作用域
// 局部作用域
// 变量提升
// var c = 1
// function a () {
// var c = 2;
// console.log(c); // 3
// }
// a();
// console.log(c); // 1
</script>
</html>

95
历届学生/fontendsix/每日课程/2021-10-29/index.html Normal file
View File

@@ -0,0 +1,95 @@
<!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>js</title>
</head>
<body>
</body>
<script>
// es5，es6，es7 ++
// typescript
// 严格模式
// 变量 计算内部会变的数据
// var 系统关键字
// var 变量名称 = 变量数值
// var 变量名称
// var a = 100
// var b = "刘兵"
// 变量名称 规范
// 1: 变量命名不可以出现特殊符号 (_ $)
// 2：变量命名不能以数字开头
// 3: 变量命名区分大小写
// 4: 变量命名 遵守 驼峰命名法
// 5: 变量名不要出现重复
// 6: 先定义后使用
// var c = "1111"
// var C = "3333"
// var UserName = "李四"
// var hhhh
// console.log(a,b);
// a = 1000
// console.log(a);
// console.error("哈哈哈哈")
// console.warn("警告")
// console.log(b);
// 常量 计算内部不会变的数据
// const 常量名称 = 常量数值
// const test = "111"
// test = "活动和德国法国发过"
// 数据类型
// 1：基本类型
// 字符串（String）：凡是用双引号或单引号包裹起来的都是字符串
// 数字(Number)：阿拉伯数字
// 布尔(Boolean)：就是 true（真 1） 和 false（假 0）
// 对空（Null）：表示没有找到某个东西
// 未定义（Undefined）：变量如果未赋值，或者未定义
// Symbol：表示唯一的
// var a = 100
// var b = 1000
// var c = 1
// 简写
var a = 1, b = 2, c = 4
// 运算符 & 赋值运算符
// + - * / % ++ -- += -= *= /+ %=
// a++（--） ：表示先用a，用完后然后再+1
// （--）++a : 表示先+1，然后用a
// +
// 1: 进行数学加法运算（左右两边都是数字）
// 2: 进行字符串拼接
// = 赋值
// == 判断是否相等
// === 强等于 判断是否相等，还会判断数据类型是否相等
// 比较运算符 & 逻辑运算符
// != !== ! && 条件表达式两边必须都为true，才返回true，否则直接返回false
// || 条件表达式两边只要有一个为true，就返回true
// console.log(++a);
// console.log( ( ++a - ( c + (++b) ) ) + ( a-- + (--b) ) );
// console.log( ( a-- + ( ++a + (a-true-(c++)) / --b + (++b) ) ) + ( a + b + c) );
// 2：引用数据类型
// 现在不讲
// Object array function
// 数据类型转换
</script>
</html>

86
历届学生/fontendsix/每日课程/2021-10-29/index2.html Normal file
View File

@@ -0,0 +1,86 @@
<!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>js 数据类型 - 对象</title>
</head>
<body>
</body>
<script>
// object
// 1：数据组成的规则
// 2: 编程中的思想 面向对象(oop)的变成 c++ java php python js 面向过程的编程 c
// 三大特征：封装，继承，多态
// 以前 object，js 更新一个 class
// 如何定义一个对象？
// var 对象名 = {
// 属性名(key): 属性值(value)
// }
// var obj = new Object();
// obj.name = "F150";
// obj.color = "black";
// var obj = new Object({ name: "F150", color: "black" });
// var car = {
// name: {
// name1: 'F150',
// name2: '猛禽'
// },
// 11111: "test",
// speed: 6,
// color: "black"
// };
// console.log(car);
// setTimeout(() => {
// car.name = "demo";
// console.log(car);
// }, 3000)
// console.log(car.name.name2);
// console.log(car.11111);
// console.log( car["11111"] );
// car.start();
// car.stop();
// class car {
// start() {
// console.log("车辆启动了");
// }
// stop() {
// console.log("车辆停止了");
// }
// }
// class F150 extends car {
// name = "11111"
// test() {
// // console.log(this.name);
// }
// }
// class FLL extends car{
// }
// var me = new F150();
// me.test()
</script>
</html>

1
历届学生/fontendsix/每日课程/2021-10-29/js/index.js Normal file
View File

@@ -0,0 +1 @@
alert("1111")

119
历届学生/fontendsix/每日课程/2021-10-29/条件语句.html Normal file
View File

@@ -0,0 +1,119 @@
<!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>条件语句</title>
</head>
<body>
<input type="text" placeholder="请输入分数">
<button>查询</button>
<div class="result"></div>
</body>
<script>
// if
// if (写条件) {
// 具体要干的事情
// }
// if () {
// } else {
// }
// if () {
// } else if () {
// } else {
// }
var je = true;
// if (je) {
// console.log("我去吃饭");
// } else {
// console.log("我不去吃饭");
// }
// if(je) console.log("我去吃饭")
// else console.log("我不去吃饭")
// 三元运算
je ? console.log("我去吃饭") : console.log("我不去吃饭")
// var nums = 100;
// if (nums < 60) {
// console.log("不及格");
// } else if (nums >= 60 && nums <= 70) {
// console.log("一般");
// } else if (nums > 70 && nums <= 80) {
// console.log("普通");
// } else if (nums > 80 && nums <= 90) {
// console.log("良好");
// } else if (nums > 90 && nums <= 100) {
// console.log("优秀");
// } else {
// console.log("成绩不合理");
// }
// document.querySelector("button").onclick = () => {
// var nums = document.querySelector("input").value;
// var res = document.querySelector(".result")
// if (nums < 60) {
// console.log("不及格");
// res.innerText = "不及格"
// } else if (nums >= 60 && nums <= 70) {
// console.log("一般");
// res.innerText = "一般"
// } else if (nums > 70 && nums <= 80) {
// console.log("普通");
// res.innerText = "普通"
// } else if (nums > 80 && nums <= 90) {
// console.log("良好");
// res.innerText = "良好"
// } else if (nums > 90 && nums <= 100) {
// console.log("优秀");
// res.innerText = "优秀"
// } else {
// console.log("成绩不合理");
// res.innerText = "成绩不合理"
// }
// }
// switch
// var je = true;
// switch (je) {
// case true:
// console.log("吃饭");
// break
// case false:
// console.log("不吃饭");
// break;
// default:
// console.log("1111");
// break;
// }
</script>
</html>

7
历届学生/fontendsix/每日课程/2021-10-29/笔记.txt Normal file
View File

@@ -0,0 +1,7 @@
javascript:
js：做表单，做特效，处理简单逻辑的（复杂的逻辑），数据渲染，桌面端，app，游戏开发，3D
js:
dom 操作html+css的
bom 操作控制浏览器的