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

136
历届学生/front-end-team/项目练习/学生项目/陆旗/笔记.html/inde.html Normal file
View File

@@ -0,0 +1,136 @@
<!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>
<style>
* {
margin: 0;
padding: 0;
list-style: none;
}
ul {
display: flex;
}
ul.title {
height: 45px;
align-items: center;
}
.active_title {
color: red;
}
ul.title li {
margin: 0 10px;
}
.content {}
.content li {
display: none;
}
.active_content {
display: block !important;
}
</style>
<body>
<ul class="tabs_title"></ul>
<ul class="tabs_content"></ul>
</body>
<script>
index = 0;
var tabsData = [
{
id: 1,
title: '首页',
page: 1,
content: [
{ text: '首页的内容1' },
{ text: '首页的内容2' },
{ text: '首页的内容3' },
]
},
{
id: 2,
title: '社会',
page: 1,
content: [
{ text: '社会的内容1' },
{ text: '社会的内容2' }
]
},
{
id: 3,
title: '财经',
page: 1,
content: [
{ text: '财经的内容1' },
{ text: '财经的内容2' },
{ text: '财经的内容3' },
{ text: '财经的内容4' },
]
},
];
function renderTitle() {
tabsData.forEach((v, i) => {
$(".tabs_title").innerHTML += `<li class="${i == 0 ? 'active_title' : ''}">${v.title}</li>`;
$(".tabs_content").innerHTML += `<li class="${i == 0 ? 'active_content' : ''}"></li>`;
})
_(".tabs_title li").forEach((v, i) => {
v.onclick = () => {
index = i;
_(".tabs_title li").forEach((j, idx) => {
j.classList.remove("active_title")
_(".tabs_content li")[idx].classList.remove("active_content");
});
v.classList.add("active_title");
_(".tabs_content li")[i].classList.add("active_content");
renderContent();
}
})
}
function renderContent() {
_(".tabs_content li")[index].innerHTML = ""
tabsData[index].content.forEach(v => {
_(".tabs_content li")[index].innerHTML += `<p>${v.text}</p>`
})
}
renderTitle();
renderContent();
function _(className) {
return document.querySelectorAll(className)
}
function $(className) {
return document.querySelector(className)
}
</script>
</html>

64
历届学生/front-end-team/项目练习/学生项目/陆旗/笔记.html/index.html Normal file
View File

@@ -0,0 +1,64 @@
<!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>
<input type="text" placeholder="">
<button>搜索</button>
<div class="result"></div>
</body>
<script>
var button = document.querySelector('button');
var input = document.querySelector('input');
var result = document.querySelector('.result');
button.onclick = () => {
console.log(input.value);
result.innerText = input.value
}
var age = [1, 2, 3, 4, 5, 6]
console.log(age[5]);
age.forEach((v) => {
console.log(v);
})
var body = {
name: '陆旗',
age: 18
}
for (const key in body) {
console.log(body[key]);
}
var test = [1, 2, 3, 4, [5, 6, 7, 8], [9, 10, 11, 12, 13]]
test.forEach((v) => {
if (typeof v == "number") {
console.log(v);
} else {
v.forEach((res) => {
console.log(res);
})
}
})
</script>
</html>

95
历届学生/front-end-team/项目练习/学生项目/陆旗/笔记.html/tab.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>Document</title>
</head>
<style>
* {
margin: 0;
padding: 0;
list-style: none;
}
ul {
display: flex;
}
ul.title {
height: 45px;
align-items: center;
}
.active_title {
color: red;
}
ul.title li {
margin: 0 10px;
}
.content {}
.content li {
display: none;
}
.active_content {
display: block !important;
}
</style>
<body>
<ul class="title">
<li class="active_title">首页</li>
<li>社会</li>
<li>文本</li>
<li>实践</li>
</ul>
<ul class="content">
<li class="active_content">首页的内容</li>
<li>社会的内容</li>
<li>文本的内容</li>
<li>实践的内容</li>
</ul>
</body>
<script>
var titleLi = _('.title li');
var contentLi = _('.content li');
console.log(titleLi);
titleLi.forEach((v, i) => {
v.onclick = () => {
titleLi.forEach((j,index) => {
j.classList.remove("active_title")
contentLi[index].classList.remove("active_content")
});
v.classList.add('active_title');
contentLi[i].classList.add("active_content");
}
})
function _(className) {
return document.querySelectorAll(className)
}
</script>
</html>

130
历届学生/front-end-team/项目练习/学生项目/陆旗/笔记.html/tabsv2.html Normal file
View File

@@ -0,0 +1,130 @@
<!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>
<style>
* {
margin: 0;
padding: 0;
list-style: none;
}
ul {
display: flex;
}
.tabs_title {
height: 45px;
align-items: center;
}
.tabs_title li {
margin: 0 10px;
}
.tabs_content li {
display: none;
}
.active_content {
display: block !important;
}
.active_title {
color: red;
}
</style>
<body>
<ul class="tabs_title"></ul>
<ul class="tabs_content"> </ul>
</body>
<script>
var index = 0
var tabsData = [
{
id: 1,
title: '首页',
page: 1,
content: [
{ Text: '首页的内容1' },
{ Text: '首页的内容1' },
{ Text: '首页的内容1' },
]
},
{
id: 1,
title: '首页',
page: 1,
content: [
{ Text: '首页的内容1' },
{ Text: '首页的内容1' },
{ Text: '首页的内容1' },
]
},
{
id: 1,
title: '首页',
page: 1,
content: [
{ Text: '首页的内容1' },
{ Text: '首页的内容1' },
{ Text: '首页的内容1' },
]
},
];
function renderTitle() {
tabsData.forEach((v, i) => {
$('.tabs_title').innerHTML += `<li class="${i == 0 ? 'active_title' : ""}">${v.title}</li>`;
$('.tabs_content').innerHTML += `<li class="${i == 0 ? 'active_content' : ""}">${v.title}</li>`;
})
_('tabs_title li').forEach((v, i) => {
v.onclick = () => {
index = i;
_('.tabs_title li').forEach((j, index) => {
j.classList.remove('active_title')
_('.tabs_content li')[index].classList.remove('active_content');
})
v.classList.add('active_title')
_('.tabs_content li')[index].classList.add('active_content');
renderContent();
}
})
}
function renderContent() {
_(".tabs_content li")[index].innerHTML = ""
tabsData[index].content.forEach((v) => {
_('.tabs_content li')[index].innerHTML += `<p>${v.text}</p>`
})
}
renderTitle();
renderContent();
function _(className) {
return document.querySelectorAll(className)
}
function $(className) {
return document.querySelector(className)
}
</script>
</html>