- 博客(33)
- 收藏
- 关注
RSS订阅原创 Node.js第七天
Node.js第七天 一.Express请求处理 3.1 构建模块化路由 构建模块化路由的基础代码 // 引入express框架 const express = require('express'); // 创建网站服务器 const app = express(); // 创建路由对象 const home = express.Router(); // 为路由对象匹配请求路径 app.use('/home', home); // 创建二级路由 home.get('/index', (req, res)
2021-07-03 15:36:58
89
原创 Node.js第六天
Node.js第六天 一. Express框架简介及初体验 1.1 Express框架是什么 Express是一个基于Node平台的web应用开发框架，它提供了一系列的强大特性，帮助你创建各种Web应用。 1.2 Express框架特性 ●提供了方便简洁的路由定义方式 ●对获取HTTP请求参数进行了简化处理. ●对模板引擎支持程度高,方便渲染动态HTML页面 ●提供了中间件机制有效控制HTTP请求 ●拥有大量第三方中间件对功能进行扩展 1.3 框架入门 // 引入express框架 const expres
2021-07-03 14:05:07
96
原创 Node.js第五天
Node.js第五天 一.模板引擎的基础概念 1.1模板引擎. 模板引擎是第三方模块。 让开发者以更好的方式拼接字符串，使项目代码更加清晰、更加易于维护。 1.2 art-template模板引擎 1.在命令行工具中使用 npm install art-template 命令进行下载 2.使用 const .template = require (‘art-template’)引入模板引擎 3.告诉模板引擎要拼接的数据和模板位置 const html = template( '模板路径’ ， 数据);
2021-07-02 11:04:33
82
原创 Node.js第四天
Node.js第四天 一.数据库概述及环境搭建 1.1为什么要使用数据库 ● 动态网站中的数据都是 存储在数据库中的 ● 数据库可以用来持久存储客户端通过表单收集的用户信息 ● 数据库软件本身可以对数据进行高效的管理 1.2什么是数据库， 数据库即存储数据的仓库，可以将数据进行有序的分门]别类的存储。它是独立于语言之外的软件，可以通过API去操作它。 常见的数据库软件有: mysq|、mongoDB、 oracle. ...
2021-06-10 21:33:21
90
原创 Node.js第三天
Node.js第三天 1.服务器端基础概念 1.1网站的组成 网站应用程序主要分为两大部分:客户端和服务器端。 客户端:在浏览器中运行的部分,就是用户看到并与之交互的界面程序。使用HTML、CSS、 JavaScript构建。 服务器端:在服务器中运行的部分,负责存储数据和处理应用逻辑。 1.2 Node网站服务器 能够提供网站访问服务的机器就是网站服务器，它能够接收客户端的请求,能够对请求做出响应. 1.3 IP地址 互联网中设备的唯一标识。 IP是Internet Protocol Address的简
2021-06-05 20:47:45
149
1
原创 Node.js第二天
Node.js第二天 一.第三方模块Gulp 基于node平台开发的前端构建具 将机械化操作编写成任务,想要执行机械化操作时执行个命令行命令 任务就能自动执行了用机器代替手工，提开发效率。 4.6 Gulp能做什么 ● 项目上线，HTML、CSS、JS文件压缩合并 ● 语法转换(es6、 less … ● 公共文件抽离 ● 修改文件浏览器自动刷新 4.7 Gulp使用 1.使用npm install gulp下载gulp库文件 2.在项目根目录下建立gulpfile.js文件 3.重构项目的文件夹结构src
2021-06-04 13:37:38
90
原创 Node.js第一天
Node.js第一天 一.Node开发概述 1.1为什么要学习服务器端开发基础 ● 能够和后端程序员更加紧密的配合 ● 网站业务逻辑前置，学习前端技术需要后端技术支撑(Ajax) ● 扩宽知识视野,能够站在更高的角度审视整个项目。 1.2服务器端开发要做的事情 ● 实现网站的业务逻辑 ● 数据的增删改查 1.3为什么选择Node ● 使用JavaScript语法开发后端应用 ● 一些公司要求前端工程师掌握Node开发 ● 生态系统活跃，有大量开源库可以使用 ● 前端开发工具大多基于Node开发 1.4 No
2021-05-31 22:41:13
72
原创 Ajax第三天
Ajax第三天 一.同源政策（续） 1.1CORS跨域资源共享 CORS:全称为Cross- origin resource sharing,即跨域资源共享,它允许浏览器向跨域服务器发送Ajax请求,克服了Ajax只能同源使用的限制。 服务器端代码 app.use((req, res, next) => { // 1.允许哪些客户端访问我 // * 代表允许所有的客户端访问我 // 注意：如果跨域请求中涉及到cookie信息传递，值不可以为*号 比如是具体的域名信息 res.hea
2021-05-29 21:32:03
47
原创 Ajax第二天
Ajax第二天 一.模板引擎 1.1模板引擎概述 作用:使用模板引擎提供的模板语法，可以将数据和HTML拼接起来。 官网网址：https://aui.github.io/art-template/zh-cn/index.html 1.2使用步骤 下载art-template模板弓|擎库文件并在HTML页面中引入库文件 <script src="./js/template-web.js"></script> 准备art-template模板 <script
2021-05-27 21:22:14
62
原创 Ajax第一天
Ajax第一天 一.Ajax基础 1.1Ajax概述 Ajax是浏览器提供的一方法，可以实现页面无刷新更新数据，提高用户浏览网站应用的体验。 1.2Ajax应用场景 页面上拉加载更B数据 列表数据无刷新分页 表单项离开焦点数据验证 搜索框提示文字下拉洌表 主要运用在不刷新页面的情况下，向服务器端发送请求，和服务器端进行交互，从而更改客户端页面中的数据或者状态。 1.3Ajax运行原理 Ajax相当于浏览器发送请求与接收响应的代理人，以实现在不影响用户浏页面的情况下，局部更新页面数据，从而提高用户体验。
2021-05-25 19:48:23
56
原创 ES7-10
#ES7 一.ECMASript 7 新特性 1.1.Array.prototype.includes Includes 方法用来检测数组中是否包含某个元素，返回布尔类型值 const teams = ['nets', 'rockets', 'suns']; console.log(teams.includes('nets'));//true console.log(teams.includes('lakers'));//false 1.2指数操作符 在 ES7 中引入指数
2021-05-22 16:23:19
73
原创 ES6第三天
ES6第三天 一.set ES6 提供了新的数据结构 Set（集合）。它类似于数组，但成员的值都是唯 一的，集合实现了 iterator 接口，所以可以使用扩展运算符和for…of…进 行遍历. 集合的属性和方法： size 返回集合的元素个数 add 增加一个新元素，返回当前集合 delete 删除元素，返回 boolean 值 has 检测集合中是否包含某个元素，返回 boolean 值 clear 清空集合，返回 undefined //创建一个空集合 let s = new Set();
2021-05-21 20:29:53
129
原创 ES6第二天
ES6第二天 一.参数默认值 1.1.形参初始值具有默认值的参数，一般位置要靠后(潜规则) function add(a,b,c=10) { return a+b+c; let result = add(1,2); console. log(result);//结果为13
2021-05-20 16:03:45
58
原创 ES6第一天
ES6第一天—— ECMASript 6 新特性（上） 一.let 关键字 let 关键字用来声明变量，使用 let 声明的变量有几个特点： 2.1 不允许重复声明 let animal ='小狗' let animal ='小猪'; //会报错 因为重复声明了变量animal //改用var不会报错 2.2块儿级作用域 (包括 全局，函数，eval） ...
2021-05-17 22:19:00
72
原创 JS高级第五天
JS高级第五天 一.ES6 什么是ES6 ? ES的全称是ECMAScript ,它是由ECMA国际标准化组织制定的一项脚本语言的标准化规范。 为什么使用ES6 ? 每一次标准的诞生都意味着语言的完善，功能的加强。 JavaScript语言本身也有一 些令人不满意的地方。 ●变量提升特性增加了程序运行时的不可预测性 ●语法过于松散, 实现相同的功能,不同的人可能会写出不同的代码 ...
2021-05-16 09:43:31
61
原创 JS高级第四天
JS高级第四天 1.正则表达式概述 1.1什么是正则表达式 正则表达式( Regular Expression)是用于匹配字符串中字符组合的模式。在JavaScript中,正则表达式也是对象。 正则表通常被用来检索、替换那些符合某个模式(规则)的文本,例如验证表单:用户名表单只能输入英文字母、数字或者下划线，昵称输入框中可以输入中文(匹配)。此外,正则表达式还常用于过滤掉页面内容中的一些敏感词(替换) ,或从字符串中获取我们想要的特定部分(提取)等。 1.2正则表达式的特点 1.灵活性、逻辑性和功能性非常
2021-05-13 15:22:23
116
原创 JS高级第三天
JS高级第三天 1.函数的定义和调用 1.1函数的定义方式 函数声明方式function关键字(命名函数) 函数表达式(匿名函数) new Function() var fn = new Function('参数1', '参数2'..., ' 函数体') ●Function 里面参数都必须是字符串格式 ●第三种方式执行效率低,也不方便书写,因此较少使用 ●所有函数都是Function的实例(对象) ●函数也属于对象 ...
2021-05-10 21:43:15
117
原创 JS高级第二天
JS高级第二天 一.构造函数和原型 1.1概述 在典型的OOP的语言中(如Java) , 都存在类的概念,类就是对象的模板,对象就是类的实例,但在ES6之前，JS中并没用引入类的概念。 ES6，全称ECMAScript6.0 , 205.06发版。但是目前浏览器的JavaScript是ES5版本,大多数高版本的浏览器也支持ES6 ,不过只实现了ES6的部分特性和功能。 在ES6之前, 对象不是基于类创建的,而是用一种称为构建函数的特殊函数来定义对象和它们的特征。 创建对象可以通过以下三种方式: 对象字面量
2021-05-08 10:32:11
69
原创 JS高级第一天
JS高级第一天 1.面向对象编程介绍 1.1两大编程思想 ●面向过程 ●面向对象 1.2面向过程编程POP(Process-oriented programming) 面向过程就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现 ,使用的时候再一个一个的依次调用就可以了。 面向过程,就是按照我们分析好了的步骤,按照步骤解决问题。 1.3面向对象编程O0P (Object Oriented Programming) 面向对象是把事务分解成为-个个对象,然后由对象之间分工与合作。 面向对象是以对象功
2021-05-03 08:18:25
74
原创 jQuery第四天
jQuery第四天 一. jQuery事件注册 1.1单个事件注册 语法: element .事件( function() {}) $ ("div") .click (function() {事件处理程序 }) 其他事件和原生基本一致。 比如mouseover、mouseout、 blur、 focus、 change、 keydown、 keyup、 resize、 scroll等 二. jQuery事件处理 2.1事件处理on()绑定事件 on()方法在匹配元素上绑定一个或多 个事件的事件处理函数 语
2021-04-26 12:48:29
51
原创 jQuery第三天
jQuery第三天 一.jQuery属性操作 1.1设置或获取元素固有属性值prop() 所谓元素固有属性就是元素本身自带的属性,比如 a元素里面的href , 比如input元素里面的type。 获取属性语法 prop(“属性’”) 设置属性语法 prop(“属性”, ’ ‘属性值’ ) 5.2设置或获取元素自定义属性值attr() 用户自己给元素添加的属性,我们称为自定义属性。比如给div添加index=“1"。 获取属性语法 attr(“属性”) // 类似原生getAttribute() 设
2021-04-24 11:14:39
68
原创 jQuery第二天
jQuery第二天 一.jQuery样式操作 1.1操作css方法 jQuery可以使用Css方法来修改简单元素样式;也可以操作类,修改多个样式。 参数只写属性名,则是返回属性值. $(this).css("color"); 参数是属性名,属性值,逗号分隔,是设置- -组样式,属性必须加引号,值如果是数字可以不用跟单位和引号. $(this),css("color", "red'"); 参数可以是对象形式,方便设置多组样式。属性名和属性值用冒号隔开，属性可以不用加引号. $(this).cs
2021-04-22 21:15:49
48
原创 jQuery第一天
jQuery第一天 一.jQuary概述 1.1 JavaScript库， JavaScript库:即library ,是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库,就是在这个库中, 封装了很多预先定义好的函数在里面,比如动画animate、hide、 show ,比如获取元素等。 简单理解:就是一一个JS文件,里面对我们原生js代码进行了封装,存放到里面。这样我们可以快速高效的使用这些封装好的功能了。 比如jQuepy ,就是为了快速方便的操作DOM ,里面基本都是函数(方法)。
2021-04-20 16:32:46
53
原创 JS第九天
JS第九天 一.触屏事件 1.1触屏事件概述 移动端浏览器兼容性较好,我们不需要考虑以前JS的兼容性问题,可以放心的使用原生JS书写效果,但是移动端也有自己独特的地方。比如触屏事件touch (也称触摸事件) , Android和IOS都有。 touch对象代表一个触摸点。触摸点可能是一根手指 ,也可能是一根触摸笔。触屏事件可响应用户手指(或触控笔)对屏幕或者触控板操作。 常见的触屏事件如下: ...
2021-04-16 21:05:42
147
原创 JS第八天
JS第八天 一.动画函数封装 1.1动画实现原理 核心原理:通过定时器setInterval0不断移动盒子位置。 实现步骤: 获得盒子当前位置 让盒子在当前位置加上1个移动距离 利用定时器不断重复这个操作 加一个结束定时器的条件 注意此元素需要添加定位,才能使用element. style.left 1.2动画函数简单封装 注意函数需要传递2个参数动画对象和移动到的距离。 1.3缓动效果原理 缓动动画就是让元素运动速度有所变化,最常见的是让速度慢慢停下来 思路: 让盒子每次移动的距离慢慢变小,速度就会
2021-04-13 13:09:01
69
原创 JS第七天
JS第七天 一.元素滚动scroll系列 1.1元素scroll系列属性 使用scroll 系列的相关属性可以动态的得到该元素的大小、滚动距离等。 1.2页面被卷去的头部 如果浏览器的高(或宽)度不足以显示整个页面时,会自动出现滚动条。当滚动条向下滚动时,页面上面被隐藏掉的高度,我们就称为页面被卷去的头部。滚动条在滚动时会触发onscroll事件。 二.3个系列的比较 主要用法: offset系列 经常用于获得元素位置offsetLeft offsetTop client 经常用于获取元素大小clie
2021-04-11 15:47:44
52
原创 JS第六天
JS第六天 一.元素偏移量offset系列 1.1 offset概述 offset翻译过来就是偏移量,我们使用offset系列相关属性可以动态的得到该元素的位置(偏移)、大小等。 ● 获得元素距离带有定位父元素的位置 ● 获得元素自身的大小(宽度高度) ● 注意:返回的数值都不带单位 offset系列常用属性: 1.2 offset与style区别 offset ● offset可以得到任意样式表中的样式值 ● offset系列获得的数值是没有单位的 ● offsetWidth包含padding+ bor
2021-04-10 14:18:05
141
原创 JS第五天
1.JS执行机制 4.1 JS是单线程 JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事。这是因为Javascript这门]脚本语言诞生的使命所致一-JavaScript 是为处理页面中用户的交互,以及操作DOM而诞生的。比如我们对某个DOM元素进行添加和删除操作,不能同时进行。应该先进行添加,之后再删除。 4.2同步和异步 为了解决这个问题,利用多核CPU的计算能力, HTML5提出Web Worker标准,允许JavaScript脚本创建多个线程。于是, JS中出现了同步和
2021-04-06 17:21:49
55
原创 JS第四天
1.BOM概述 1.1什么是BOM BOM ( Browser Object Model )即浏览器对象模型,它提供了独立于内容而与浏览器窗口进行交互的对象,其核心对象是window。 BOM由- -系列相关的对象构成,并且每个对象都提供了很多方法与属性。 BOM缺乏标准, JavaScript语法的标准化组织是ECMA , DOM的标准化组织是W3C , BOM最初是Netscape浏览器标准的一部分。 DOM ●文档对象模型 ●DOM就是把「文档」当做 一个「对象」来看待 ●DOM的顶级对象是docum
2021-04-05 17:01:17
116
2
原创 JS第三天
JS第三天 一.事件（绑定事件） 1.1注册事件概述 (1)传统注册方式 ●利用 on开头的事件onclick ●< button οnclick=“ alert(“hi~)” > ●btn.onclick = function( ){} ●特点:注册事件的唯一性 ●同一个元素同一 个事件只能设置一个处理函数,最 后注册的处理函数将会覆盖前面注册的处理函数 (2)方法监听注册方式 ●w3c标准推荐方式 ●addEventListener() 它是一一个方法 ●IE9之前的IE不支持此方法,可使
2021-04-04 14:15:13
87
原创 JS第二天
JS核心第二天 一.节点操作 1.如何获取节点 获取元素通常使用两种方式: 1.利用DOM提供的方法获取元素 ●document.getElementByld( ●document.getElementsByTagName ●document.querySelector等 缺点： 逻辑性不强、繁琐 2.利用节点层级关系获取元素 ●利用父子兄节点关系获取元素 ●逻辑性强,但是兼容性稍差 2.什么是节点 网页中的所有内容都是节点(标签、属性、文本、注释等) , 在DOM中,节点使用node来表示。 HTML
2021-04-03 13:12:30
180
原创 JS核心第一天
JS核心第一天 一.API 和Web API API是为我们程序员提供的一个接口,帮助我们实现某种功能,我们会使用就可以了,不必纠结内部如何实现 Web API主要是针对于浏览器提供的接口,主要针对于浏览器做交互效果。 Web API -般都有输入和输出(函数的传参和返回值), Web API很多都是方法(函数) 4.学习Web API可以结合前面学习内置对象方法的思路学习 二.DOM简介 1.1什么是DOM 文档对象模型( Document Object Model ,简称DOM) , 是W3C组织推
2021-04-01 16:37:23
158
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人