Skip to content

Commit 6b7df41

Browse files
jessica-javajessica-java
authored
Merge pull request #4 from bjmashibing/master
更新 : 2020年1月21日11:30:37
2 parents fd3ddef + 5cdb57b commit 6b7df41

537 files changed

Lines changed: 1479482 additions & 0 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎web前端/code/第十一天/01.js‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
//node平台支持JS全部核心语法
2+
//变量
3+
var a = 100;
4+
var b = 200;
5+
console.log(a + b);
6+
//运算符[数学运算符、比较运算符、逻辑运算符]都支持
7+
console.log(3 > 8 ? 6 : 9);
8+
//流程控制语句
9+
for (var i = 1; i <= 100; i++) {
10+
if (i % 2 == 0) console.log(i);
11+
}
12+
//函数
13+
function sum(a, b) {
14+
return a + b;
15+
}
16+
console.log(sum(11, 11));
17+
//数组
18+
var arr = ["吃饭", "睡觉", "打豆豆"];
19+
console.log(arr.reverse());
20+
//构造函数
21+
function People(name, age, sex) {
22+
this.name = name;
23+
this.age = age;
24+
this.sex = sex;
25+
}
26+
//原型对象方法
27+
People.prototype.eat = function() {
28+
console.log(this.name + "可以吃八斤米饭");
29+
};
30+
//创建小明
31+
var xiaoming = new People("小明", 18, "男");
32+
xiaoming.eat();
33+
34+
//没有DOM、BOM
35+
// console.log(window);
36+
console.log(document);

‎web前端/code/第十一天/02.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
//node软件给我们提供模块（给JS赋予超能力），node软件本省就有的
2+
//fs：可以通过JS向某一个文件写入数据
3+
var fs = require("fs");
4+
//queryString模块：可以将JSON数据格式转换为queryString字符串
5+
var querystring = require("querystring");
6+
//写入数据
7+
fs.writeFile("./jch.txt", "老师是祖国的老花骨朵把", function () {
8+
console.log("数据写入......")
9+
});
10+
//读取数据
11+
fs.readFile("./jch.txt", function (err, data) {
12+
console.log(data.toString());
13+
});
14+
15+
//将JSON转换为queryString字符串
16+
console.log(querystring.stringify({
17+
"a": 1,
18+
"b": 2
19+
}));

‎web前端/code/第十一天/03.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
//不是重点
2+
var http = require("http");
3+
//创建服务器对象
4+
var app = http.createServer(function (req, res) {
5+
res.setHeader('Content-Type', 'text/html;charset=utf-8');
6+
//服务器端下发状态码
7+
res.statusCode = 500;
8+
//服务器响应数据
9+
res.end("老师自己开发的服务器");
10+
});
11+
//端口号设置
12+
app.listen(3000);

‎web前端/code/第十一天/04.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
//引入社区自定义模块colors
2+
//可以改变文字颜色
3+
var colors = require("colors");
4+
console.log("我非常喜欢贾成豪,因为贾成豪只是深渊".green);
5+
console.log("我很喜欢小明".rainbow);
6+
7+
//引入社区自定义模块solarLunar
8+
var solarLunar = require("solarLunar");
9+
var solar2lunarData = solarLunar.solar2lunar(1996, 3, 8);
10+
console.log(solar2lunarData);
11+
console.log(solar2lunarData.animal);

‎web前端/code/第十一天/ajax、JSONP、bootstrap/01AJAX技术基本使用.html‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Document</title>
9+
<!-- 使用JQ务必引包 -->
10+
<script src="./js/jQuery.min.js"></script>
11+
</head>
12+
13+
<body>
14+
<h1>今天课程重点就是AJAX技术</h1>
15+
<button>单击我向服务器端----悄悄发起上行请求（GET）</button>
16+
<button>单击我向服务器端----悄悄的发起上行请求（POST）</button>
17+
<button>单击我向服务器端发起请求</button>
18+
</body>
19+
20+
</html>
21+
<script>
22+
//给按钮绑定单击事件
23+
$("button:eq(0)").click(function () {
24+
//向服务器端悄悄发起上行请求----GET,拉去服务器数据
25+
//第一个参数向向服务器端请求path
26+
//第二个参数:客户端向服务器端额外传递一些数据(可有可无)
27+
//第三个参数：当服务器响应数据成功的时候会立即执行一次
28+
$.get("./data.txt", {
29+
"name": "小明",
30+
'ps': 123
31+
}, function (data) {
32+
//data:就是服务器端响应数据
33+
//修改H1标题
34+
$("h1").html(data);
35+
});
36+
});
37+
//第二个按钮发起POST请求
38+
$("button:eq(1)").click(function () {
39+
//向服务器端去悄悄的发起上行请求----POST，拉去服务器数据
40+
$.post("./data.txt", function (data) {
41+
//在页面没有重新加载情况下实现页面局部跟新
42+
$("h1").html(data);
43+
});
44+
45+
});
46+
47+
//第三个按钮单击事件
48+
$("button:eq(2)").click(function () {
49+
//向服务器端发起POST请求
50+
//当前这个方法可以发起GET、POST，请求参数配置务必是一个JSON数据格式
51+
$.ajax({
52+
// 请求网址
53+
"url": "./data.txt",
54+
//请求方式
55+
"type": "post",
56+
//给服务器额外传递数据
57+
"data": {
58+
"a": 1
59+
},
60+
//回调函数：可以接受服务器数据
61+
"success": function (data) {
62+
//当服务器响应成功的时候会立即执行一次
63+
$("h1").html(data);
64+
65+
}
66+
67+
});
68+
69+
});
70+
</script>

‎web前端/code/第十一天/ajax、JSONP、bootstrap/02原生AJAX技术-----XMLHttpRequest构造函数.html‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Document</title>
9+
</head>
10+
11+
<body>
12+
<h1>我是默认文本</h1>
13+
<button>单击我悄悄发起上行请求----GET</button>
14+
</body>
15+
16+
</html>
17+
<script>
18+
//获取标签
19+
var h1 = document.querySelector("h1");
20+
var btn = document.querySelector("button");
21+
//单击按钮发起上行请求
22+
btn.onclick = function () {
23+
//悄悄发起上行请求
24+
if (window.XMLHttpRequest) {
25+
//高级浏览器写法
26+
var xhr = new XMLHttpRequest();
27+
} else {
28+
//IE低版本写法
29+
var xhr = new ActiveXObject("msxml2.0xmlhttp");
30+
}
31+
//设置请求方式
32+
xhr.open("get", "./data.txt", true);
33+
//发送请求
34+
xhr.send();
35+
//监听就绪状态
36+
xhr.onreadystatechange = function () {
37+
if (xhr.status == 200 && xhr.readyState == 4) {
38+
//在页面没有重新加载情况下实现页面局部跟新
39+
h1.innerHTML = xhr.responseText;
40+
}
41+
}
42+
43+
}
44+
</script>

‎web前端/code/第十一天/ajax、JSONP、bootstrap/03AJAX技术不能跨域请求数据.html‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Document</title>
9+
<!-- 引包 -->
10+
<script src="./js/jQuery.min.js"></script>
11+
</head>
12+
13+
<body>
14+
<h1>我是来源于127.0.0.1服务器页面</h1>
15+
<button>拉去127.0.0.2服务器上面数据</button>
16+
</body>
17+
18+
</html>
19+
<script>
20+
//AJAX技术不能跨域请求数据
21+
$("button").click(function () {
22+
//请求第二个服务器上面数据
23+
$.get("http://127.0.0.2/案例/data.txt", function () {
24+
25+
})
26+
});
27+
</script>

‎web前端/code/第十一天/ajax、JSONP、bootstrap/04JSOP跨域请求数据.html‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Document</title>
9+
</head>
10+
11+
<body>
12+
<h1>我是来源苏127.0.0.1服务器上面页面----拉去127.0.0.2服务器数据</h1>
13+
</body>
14+
15+
</html>
16+
<script>
17+
//声明一个同名函数
18+
function fetchV85(a, b, c, d, e) {
19+
console.log(a, b, c, d, e);
20+
}
21+
</script>
22+
<!--将另外一个服务器函数调用部分引入 -->
23+
<script src="http://127.0.0.2/案例/fetchV85.txt"></script>

‎web前端/code/第十一天/ajax、JSONP、bootstrap/05拉去京东数据.html‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Document</title>
9+
</head>
10+
11+
<body>
12+
<select></select>
13+
</body>
14+
15+
</html>
16+
<script>
17+
//获取下拉框
18+
var select = document.querySelector("select");
19+
//声明一个同名函数
20+
function jQuery4494404(arr) {
21+
//遍历数组
22+
for (var i = 0; i < arr.length; i++) {
23+
//创建节点
24+
var op = document.createElement("option");
25+
op.innerHTML = arr[i].name;
26+
select.appendChild(op);
27+
}
28+
}
29+
</script>
30+
<!-- 将京东服务器调用部分引入 -->
31+
<script src="https://fts.jd.com/area/get?fid=72&callback=jQuery4494404&_=1578732186910"></script>

‎web前端/code/第十一天/ajax、JSONP、bootstrap/bootstrap基本使用/01栅格系统.html‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Document</title>
9+
<link rel="stylesheet" href="./css/bootstrap.min.css">
10+
</head>
11+
12+
<body>
13+
<div class="container">
14+
<div class="row">
15+
<div class="col-xs-6">么么哒</div>
16+
<div class="col-xs-6">哈哈哈</div>
17+
</div>
18+
<div class="row">
19+
<div class="col-xs-2">小明</div>
20+
<div class="col-xs-10">小123131</div>
21+
</div>
22+
<span class="glyphicon glyphicon-fullscreen"></span>
23+
<ul class="pagination">
24+
<li><a href="#">&laquo;</a></li>
25+
<li><a href="#">1</a></li>
26+
<li><a href="#">2</a></li>
27+
<li><a href="#">3</a></li>
28+
<li><a href="#">4</a></li>
29+
<li><a href="#">5</a></li>
30+
<li><a href="#">&raquo;</a></li>
31+
</ul>
32+
</div>
33+
</body>
34+
35+
</html>

0 commit comments

Comments
 (0)