jQuery:简化了(核心DOM)

jQuery之中有一个方法叫做$或jQuery:工厂函数 作用:

• 查找元素:$('JQ选择器')
• 创建元素:$('<elem 属性名="${变量}">${变量}</elem>')
• 可以将DOM转为JQ:只有this和e.target会自动得到DOM对象:$(DOM)
• 代替window.onload:$(callback)

查找元素

• 直接查找:$("JQ选择器")
• 关系网查找
• • 父：parent();
• • 子：children();
• • 前一个兄弟：prev();
• • 后一个兄弟：next();
• • 他兄弟：siblings(); JQ自带隐式迭代:不需要遍历，可以直接对集合操作

操作元素

内容

• 获取：$("xx").html/text/val();
• 设置：$("xx").html/text/val("新内容");

属性

• 获取：$("xx").attr("属性名");
• 设置：$("xx").attr("属性名","属性值");
• 删除：$("xx").removeAttr("属性名");

样式

可以操作class

• 添加class:$('xx').addClass('新class)
• 删除class:$("xx").removeClass();不填参数删除全部，添加参数，删除指定的class选择器
• 切换class:toggleClass('选择器')在有class选择器和没有之间切换

直接操作css

• 获取$('xx').css("属性名")
• 设置$("xx").css({属性名:"值"})

创建元素&上树

$("父").append($(`<elem 属性名="${变量}">${变量}</elem>`));

删除

$("xx").remove();

JQ动画

• 显示：$("xx").show();
• 隐藏：$("xx").hide();
• 切换：$("xx").toggle(); 不传参数是瞬间显示和隐藏，如果传入参数$("xx").toggle("动画名称",时长),一定要搭配jQueryUI使用

绑定事件

$("xx").事件名(callback)

获取下标：

$("xx").index();

Node.js第三方框架:express

下载在项目路径下打开cmd:npm i express

express是函数对象，用于创建服务器。

var express=require("express");
var app=express();
app.listen(80);

路由

GET方式

app.get("路由名",(req,res)=>{
//req->依然是请求对象，保存着前端传来的请求消息：req.query.键名;（不光可以得到GET表单提交的，还可以得到GET的ajax提交的消息）	
//res->依然是响应对象，可以向前端发送数据，也可以向前端发送文件
//发送数据：res.send(json字符串);
//发送文件：res.sendFile("文件路径");
})

POST请求

app.post("路由",(req,res)=>{
//req->依然是请求对象，保存着前端传来的请求消息：3步
//下载引入一个第三方模块：var bp=require("body-parser");
//使用【中间件】的语法：app.use(bp.urlencoded({extended:false}));
//req.body.键名;
//res->依然是响应对象，可以向前端发送数据，也可以向前端发送文件
//发送数据：res.send(json字符串);
//发送文件：res.sendFile("文件路径");
})

中间件

功能：

• 可以执行任何代码
• 可以修改请求和响应对象
• 可以终止请求
• 可以放行到下一个中间件/路由 - 中间件可以写多个 语法：

app.use((req,res,resolve)=>{
一切你想要执行的代码，都可以放
resolve();//放行函数
})

固定套路:

• 获取post的隐藏的请求消息：app.use(bp.urlencoded({extended:false}));
• 内置中间件加载一切静态资源：app.use(express.static("静态资源的文件夹名"))