- 博客(21)
- 收藏
- 关注
原创 Ajax
Ajax的运行环境 Ajax技术需要运行在网站环境中才能生效,当前课程会使用Node创建的服务器作为网站服务器。 //引入express框架 const express = require( ' express'); //路径处理模块 const path = require( 'path' ); //创建web服务器 const app = express( ); //静态资源访问服务功能 app . use(express . static(path. join(__ dirname, ' pub
2020-06-10 18:00:58
222
原创 JS高级二
一、ES5新增方法概述 ES5中给我们新增了一-些方法,可以很方便的操作数组或者字符串,这些方法主要包括: 1. 数组方法 迭代(遍历)方法: forEach0、map0、 filter0、 some0、 every0 ; (1)forEach array. forEach( function (currentvalue, index, arr) ) currentValue :数组当前项的值 index :数组当前项的索引 arr :数组对象本身 2. 字符串方法 3. 对象方法 ...
2020-06-10 15:49:18
224
原创 JS高级一
一、面向对象编程OOP 含义:以对象的功能来划分,而不是步骤 特性:封装性、继承性、动态性 类:抽象了对象的公共部分,通过类实例化一个对象 对象:一组无序的相关属性和方法的集合。万物皆对象,一个具体的事物 属性:事物的特征 方法:事物的行为 二、创建类 通过class关键字创建类,类名我们还是习惯性定义首字母大写 类里面有个constructor函数,可以接受传递过来的参数,同时返回实例对象中 constructor函数, 只要new生成实例时,就会自动调用这个函数,如果我们不写这个函数,类也会自动生
2020-06-10 12:53:33
256
原创 JS基础一
API API ( Application Programming Interface,应用程序编程接口)是一一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。简单理解:API是给程序员提供的一种工具,以便能更轻松的实现想要完成的功能。 Web API Web API是浏览器提供的一套操作浏览器功能和页面元素的API( BOM和DOM)。 现阶段我们主要针对于浏览器讲解常用的API,主要针对浏览器做交互效果。 比如我们想要浏览
2020-06-09 22:22:53
316
原创 flex布局
一、传统布局与flex布局的对比 1.传统布局 兼容性好 布局繁琐 局限性,不能在移动端很好的布局 2.flex布局 操作方便,布局极为简单,移动端应用很广泛 PC端浏览器支持情况较差 IE 11或更低版本,不支持或仅部分支持 3.建议 如果是PC端页面布局,我们还是传统布局。 如果是移动端或者不考虑兼容性问题的PC端页面布局,我们还是使用flex弹性布局 二、flex布局原理 flex是flexible Box的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性,任何一个容器都可以指定为flex布局
2020-06-09 19:54:37
216
原创 ES6新增语法
什么是ES6 ? ES的全称是ECMAScript,它是由ECMA国际标准化组织制定的一项脚本语言的标准化规范。 一、let es6中新增的用于声明变量的关键字 具有块级作用域,let声明的变量只在所处于的块级有效 不存在变量提升 暂时性死区 二、const 用于声明常量 具有块级作用域 声明变量时必须赋值 常量赋值后,值不能修改 三、解构赋值 从数组中提取值,按照对应位置,对变量赋值,对象也可以解构。 1.数组解构 let [a,b,c] = [1,2,3] console.log(a) cons
2020-06-09 14:45:50
322
原创 CSS
css选择符 1.id选择器( # myid) 2.类选择器(.myclassname) 3.标签选择器(div, h1, p) 4.相邻选择器(h1 + p) 5.子选择器(ul > li) 6.后代选择器(li a) 7.通配符选择器( * ) 8.属性选择器(a[rel = “external”]) 9.伪类选择器(a: hover, li:nth-child) 可以继承的属性 可继承的样式: font-size font-family color, UL LI DL DD DT; 不可继承的
2020-05-19 16:56:33
185
原创 HTML
HTML5新特性 HTML5 现在已经不是 SGML 的子集,主要是关于图像,位置,存储,多任务等功能的增加。 拖拽释放(Drag and drop) 语义化更好的内容标签(header,nav,footer,aside,article,section) 音频、视频(audio,video) 画布(Canvas) 地理(Geolocation) 本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失; sessionStorage 的数据在浏览器关闭后自动删除 表单控件,calenda
2020-05-19 16:45:06
193
原创 web前端面试(1)
Http和Https的区别? 1、https协议需要到ca申请证书,一般免费证书较少,因而需要一定费用。 2、http是超文本传输协议,信息是明文传输,https则是具有安全性的ssl加密传输协议。 3、http和https使用的是完全不同的连接方式,用的端口也不一样,前者是80,后者是443。 4、http的连接很简单,是无状态的;HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议,比http协议安全。 什么是跨域? 由浏览器同源策略限制的一类请求场景,当不同地址,不同端口,不
2020-05-19 16:41:08
270
原创 node基础三(express框架)
使用方法 一、安装express框架 npm install express 二、使用express框架创建服务器 //1.引入express框架 //2.创建服务器 //3.监听端口 const express = require('express') const app = express() app.listen(3000) console.log('服务器启动成功!') 三、使用express框架的好处 提供了中间件有效控制http请求 app.get() 处理请求方式为get的请求
2020-05-11 11:54:25
257
原创 node基础二(服务器)
服务器端基础概念 一、网站的组成 网站应用程序主要分为两大部分:客户端和服务器端。 客户端:在浏览器中运行的部分,就是用户看到并与之交互的界面程序。使用HTML、 CSS、JavaScript构建。 服务器端:在服务器中运行的部分,负责存储数据和处理应用逻辑。 二、 Node网站服务器 能够提供网站访问服务的机器就是网站服务器,它能够接收客户端的请求,能够对请求做出响应。 IP地址:互联网协议地址 URL:统一资源定位符,又叫URL (Uniform Resource Locator),是专为标识Inter
2020-05-10 16:59:06
354
原创 node基础一
运行环境搭建 1.去官网【https://nodejs.org/en/】下载node,默认安装 2.打开CMD,输入【node -v】检查是否安装成功 node.js模块化开发 模块化开发是为了解决js开发的两个弊端:文件依赖和命名冲突 模块化开发中,一个js文件就是一个模块 模块内部定义的常量和函数,在默认情况下外部无法得到 模块成员的导出用 module.exports 模块成员的导入用 require //a.js let a = 3 module.exports.a = a //b.js let a
2020-05-10 13:30:11
287
原创 vue-Router
基本使用步骤 1.引入相关的库文件(vue和vue-Router) 2.添加路由链接 <router-link to="/login">点我就跳转到登录页</router-link> 3.定义路由组件(写/login登录页的页面 Login.vue) 4.添加路由填充位,也叫占位符 <router-view></router-view> 5.创建路由实例并配置路由规则 var router = new VueRouter ({ routes: {
2020-05-10 09:11:13
247
原创 Element-ui
简介 是一套基于 vue 2.0 的桌面端组件库 https://element.eleme.cn/#/zh-CN 使用方法 1.基于命令行方式手动安装 (1)安装依赖包 (2)导入Element-UI相关资源 //1.安装依赖包 npm i element-ui -S //2.导入Element-UI相关资源 //导入组件库 import ElementUI from 'element-ui' //导入组件相关样式 import 'element-ui/lib/theme-chalk/index.css
2020-05-10 08:27:10
347
原创 vue-cli
安装脚手架vue-cli 全局安装,只要安装一次,以后都不需再安装。 在安装前必须先安装了node.js //在命令行输入 npm install -g @vue/cli 用脚手架vue-cli创建项目 1.基于交互式命令行的方式,创建vue新项目 //在命令行输入 vue create 项目名称 2.基于图形化界面的方式,创建vue新项目 vue ui 3.基于2.x旧模板的方式,创建vue旧项目 npm install -g @vue/cli-init vue init webpack 项目名称 脚手架
2020-05-10 07:51:13
228
原创 git 与 GitHub
git ( git status )查看状态 ( git branch ) 查看分支 ( git add . ) 将修改的文件提交到暂存区 ( git checkout 分支名称 ) 切换分支 ( git checkout -b 分支名称 ) 新建分支并切换到该分支 ( git commit -m 首次提交 ) 本地提交 ( git push 远程仓库地址 分支名称 ) 将本地仓库推送至远程仓库 ( git remote add 远程仓库地址别名 远程仓库地址 )为远程仓库起别名 ( git
2020-05-09 18:03:44
231
原创 vue前后端交互(Promise、fetch、axios、async/await)
前后端交互模式 1.接口调用方式 原生ajax 基于jQuery的ajax fetch axios 2.URL (1)传统的URL 协议://域名或IP地址:端口号/路径?参数#锚点 (2)Restful形式的URL HTTP请求方式: get 查询 post 添加 put 修改 delete 删除 Promise 概述 Promise是异步编程的一种解决方案, 从语法上讲,Promise是一个对象,从它可以获取异步操作的消息。 使用Promise的好处 可以避免回调地狱(多层异步调用嵌套问题) P
2020-05-09 11:31:05
547
原创 vue组件化(组件注册、组件间数据交互、组件插槽)
全局组件注册 语法: Vue.component('组件名称', { data: 组件数据, template: 组件模板内容 }) 实例: Vue.component('button-counter', { data(){ return { count:0 } }, template: `<button @click="count++">...
2020-05-08 13:49:59
233
原创 vue常见特性(自定义指令、计算属性、过滤器、侦听器、生命周期)
自定义指令 内置指令不能满足需求,所以需要自定义指令。 语法: Vue.directive('指令名称',{ bind: function(){}, inserted: function(){}, updated: function(){} }) 实例: Vue.directive('focus',{ inserted: function(el){ el.focus(); ...
2020-05-08 12:04:10
271
原创 vue指令
一、vue指令 v-cloak //用法 //1.提供样式 [v-cloak]{ display:none } //2.在插值表达式所在的标签中添加v-cloak指令 <p v-cloak> {{message}} </p> v-text 填充纯文本 v-html 填充html片段 v-pre 填充原始信息 v-once 只编译一次,显示内容之后不再具有响应功能 v-m...
2020-05-08 09:38:20
186
原创 Vuex(State, Mutations, Actions, Getters)
vuex 核心概念 State Mutation Action Getter 一、State State提供唯一的公共数据源,所有共享的数据都存放到store的State中进行存储 export default new Vuex.Store({ state: { list: [] }, mutations: { r...
2020-05-08 08:29:34
250
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅