自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(105)
  • 资源 (1)
  • 收藏
  • 关注

原创 vue的组件通信和插槽

目录组件通信父组件向子组件传递数据props子组件向父组件传递数据多个参数非父子组件之间通信Vue 组件间通信有哪几种方式?插槽匿名插槽具名插槽插槽作用域组件通信父组件向子组件传递数据1.父传子: 父变,子变,子变,父不变,并且报错.2.父传子:父变,子变,子变,父变,需要传递一个对象3.父传子: 父变,子不变,子变, 父不变, 需要在子组件中将数据传递新的data属性父级Parent.vue<template>...

2021-12-26 20:44:55 276

原创 vue的组件components基础和安装vue脚手架

组件组件在vue是一个很强大的功能,可以对HTML进行扩展,在大型应用中,可以对一些抽象的功能进行封装作用:可复用的vue实例组件注册 局部注册组件 new Vue({ el: components:{ 自定义组件名称:{ template:'模板内容' } }}) <!-- 1.引入vue --> <script src="./vue.js"&...

2021-12-26 20:28:19 1178

原创 vue的侦听器,过滤器和过度动画的了解

目录侦听器普通监听深度监听百度搜索案例过滤器局部过滤器全局过滤器全局过滤器和局部过滤器的区别封装时间过滤器总结计算属性和 watch 的区别vue过渡动画transition组件内置的过渡类名内置类名实现动画配置animate.css实现过渡动画侦听器侦听器又名监听器监听器在vue中属于一个特殊的方法,用来监听data数据的改变,从而做出及时的响应普通监听* 1.监听器的方法名为data中的属性名* 2.系统...

2021-12-26 20:10:49 582

原创 vue的生命周期和计算属性

目录生命周期钩子函数Vue中render函数和template的区别vue的计算属性计算属性和methods的区别计算属性的get和set方法购物车案例生命周期生命周期:对象从创建到销毁的过程钩子函数:在某一特定的时刻,自动被触发的函数被钩子函数钩子函数new Vue({ el: template: render(){} data: methods: beforeCreate(){}created(){}beforeMou...

2021-12-26 19:50:08 523

原创 vue的事件处理,$set的用法和表单元素处理修饰符

目录事件处理事件注册事件传参event阻止事件冒泡阻止默认事件捕获事件.capture事件修饰符按键修饰符$set用法set操作数组$set操作对象$set操作数组对象表单元素处理表单修饰符事件处理事件注册事件注册: 语法: v-on:事件名称 = "事件函数/表达式" 简写 @事件名称 = ...

2021-12-22 22:31:13 1043

原创 Vue的系统指令

目录v-textv-html{{}},v-text,v-html的优缺点v-on事件绑定v-oncev-if条件渲染v-show(条件展示)v-if和v-show区别:v-modelv-bind动态类名class动态样式stylev-forv-for遍历时key的作用指令:采用v- 开始的,一般称之为指令.指令通常在属性中-v-text <script src="./vue.js"></script>&...

2021-12-20 22:17:07 515 2

原创 初识vue的使用和设计模式

目录vue的基本介绍什么是vue?为什么使用vue?vue优点缺点对于Vue是一套渐进式框架的理解(面试题)?SPA(单页面应用)相对复杂说说你对 SPA 单页面的理解,它的优缺点分别是什么?vue的下载及引入练习vue的使用实例化vue定义数据和方法设计模式mvc设计模式MVVM设计模式vue的基本介绍什么是vue?1.渐进式javascript框架2.作者:尤雨溪 个人开发3.Vue (读音 /vjuː/,类似于 ..

2021-12-20 22:02:53 992

原创 es6模块化,websocket和mvc

目录es6模块化使用es6模块化步骤:exportes6模块化语法有三种:引入运行调试上面定义的模块文件:websocketsocket.io模块webSocket的常用方法1.webSocket2.io3.on4.emit5.join6.to群聊编写点对点通信MVCes6模块化使用es6模块化步骤:(1) 使用export暴露数据(2) 使用import引入模块(3) 在html中引入js文件,注意为script.

2021-12-19 20:52:42 331

原创 原生ajax和Jquery的ajax

目录原生ajax传统请求(同步方式)的问题Ajax优势和作用Ajax请求与传统请求的区别:ajax原理(方法,属性 )XMLHttpRequestopensend属性readyStatetatusresponseText事件ajax实现步骤ajax的get和post传参getzhuce.html文件代码如下:postJquery之Ajaxgetpostajax封装ajax原生ajaxAsynchronou..

2021-12-19 20:35:16 1189

原创 接口开发规范(RESTful api)和token(令牌),md5使用

目录优点:常用方法规范路由如何定义根据RESTful 进行接口开发接口文档组成Token使用什么是JWT? 【了解】token的使用规则本地客户端(浏览器是常见客户之一 )存储技术有三种:【重点】使用步骤uuid和md5API: API(Application Programming Interface,应用程序接口)是一些预先定义的接口(如函数、HTTP接口),或指软件系统不同组成部分衔接的约定。RESTful规范,是目前一种比较流行的互联网软件设计规.

2021-12-19 20:06:28 1673

原创 promise与异步,async函数,async函数模块化封装数据库

目录promise与异步同步和异步的不同同步异步回调函数promisePromise的特点:promise状态promise对象方法thencatchpromise链式调用Promise.all()并发方法:async函数async函数基本用法用async函数模块化封装数据库promise与异步Promise是异步编程的一种解决方案,比传统的解决方案(回调函数和事件)更合理。同步和异步的不同同步当前调用发出之后在没有得到结.

2021-12-19 19:30:49 839

原创 文件上传,cookie和session,ejs和express脚手架的使用

目录项目开发流程文件上传前端后端服务器处理完毕响应结果cookie使用为什么要使用cookie、session?介绍cookie特点cookie实现原理cookie-parser下载引入并开启cookie功能设置cookie获取cookiesession使用介绍session特点session与cookie的联系:实现原理cookie-session下载引入并开启session功能设置Session数据访问.

2021-12-13 22:01:03 950

原创 web服务器的搭建方法(nodejs,express)和中间件的使用

目录Nodejs创建web服务器(不常用)创建服务器步骤搭建过程中需要的Express框架开发基本信息express的安装和使用初始化项目并安装express初体验:express创建web服务器express中的app对象1.app.get( 路径,兼听函数 )2.app.post(路径,兼听函数 )3. app.all(路径,兼听函数 )express的response对象1. res.send( 字符串|对象 )。2.res.sendF.

2021-12-13 21:29:54 1453

原创 计算机前端知识(客户端,url,http)

目录应用程序从架构上分为C/S,B/S架构客户端和服务端什么是上网互联网上的服务(客户端与服务器端的一次请求流程)url地址通信协议服务器名称(主机名)端口号路径参数域名与ip的关系IP域名互联网传输协议互联网中的传输协议什么是HTTP协议?http与https的区别?交互模型(请求与响应)HTTP协议的工作过程(原理)?http协议的组成请求消息的组成响应消息组成请求方法http协议常见状态码应用程序从

2021-12-13 20:48:57 2345

原创 数据库Mysql介绍和sql查询语言和node操作mysql

目录什么是数据库?常见数据库【重点】存储数据的方式mysql安装mysql数据库基础概念数据可视化工具连接mysql数据库的两种方式【重点】:常见的数据类型设计表的规则备份与还原【重点】SQL查询语言SQL的主要内容增删改查【重点】添加数据删除数据更新数据查询数据其它子句where 条件order by排序group by分组查询、聚合查询limitjoin联表查询【重点】什么是数据库?数据库(databa.

2021-12-06 21:34:53 714

原创 nodejs的模块系统和npm和包()的用法

目录一、模块系统1.1 模块化介绍1.1.1 传统开发的问题1.1.1 概述1.1.2 nodejs的模块化分类1.2. Commonjs简述1.2.1 组成1.2.2 定义规范的好处1.3 模块的种类1.4 nodejs自定义模块1.4.1 介绍ndoejs自定义模块的语法(commonjs):【重点】自定义模块js1.4.2 定义、使用自定义模块文件的步骤1.4.3 module.exports与exports的区别1.4.4练习(去除空.

2021-11-26 21:55:26 688

原创 认识Node和文件系统(读写,删除等)的操作

目录一、Node简介1.1 什么是Node.js1.2 为什么学习Node.js1.3 Node.js简史1.4 Node.js的特点【重点】1.5 Node与JavaScript之间的区别【重点】二、Node安装2.1 下载与安装2.2 第一个nodejs程序2.3nodejs运行程序的方法三、命令行与cmd3.1 cmd和命令介绍3.2 打开cmd(打DOS小窗)的三种方法【重点】3.3 常用DOS命令【重点】3.4 使用技巧【重点】.

2021-11-26 20:53:16 917

原创 认识ECMASCript6(扩展运算符,函数扩展,类class)

目录一,扩展运算符(spread)1.1 函数传参1.2 实现浅拷贝1.3数组合并/伪数组转数组1.4展开对象小技巧( 加薪优化 )1.5 rest参数(剩余参数)【重点】二、函数扩展2.1 箭头函数的语法【重点】2.1箭头函数的特点【重点】2.1.1箭头函数不同于一般函数:2.1.2、箭头函数的简写形式:2.1.3、箭头函数的this指向2.2 箭头函数不适用的场景2.3 函数形参默认值三、类class3.1 面向对象编程3.1.1 概念

2021-11-24 20:42:10 501

原创 初认识ECMASCript6(let,数据类型,数据结构,运算符)

目录一,ECMASCript6简介ES6与ES5:ECMASCript与JavaScript:Javascript遗留问题ECMAScript6历史版本二,let和const命令2.1 let命令2.1.1 基础用法2.1.2 let命令特点【重点】let应用2.2 const命令2.2.1 基础用法2.2.2 const特点:【重点】三、数据类型3.1字符串扩展3.1.1模板字符串的特点:【重点】3.1.2 新增方法startsWit

2021-11-23 21:11:55 898

原创 Git用法

目录git介绍定义特点git三个区域【重点】安装步骤1.下载2.安装3.配置用户信息【重点】Git操作步骤【重点】Git命令 git初始化:git init:git statusgit add .git commit -m 备注信息git loggit log --onelinegit reset --hardgit refloggit文件忽略介绍使用步骤git分支介绍什么是主分支?主分支的问题:分支..

2021-11-22 21:41:33 442

原创 jQuery的插件扩展和zepto用法

目录jQuery插件扩展是基于jQuery去扩展功能 必须先引入jqueryjQuery三方插件Zeptozepto和jQuery的区别touch模块fx模块fx_metodsselectorjQuery插件扩展是基于jQuery去扩展功能 必须先引入jquery <ul> <li>1</li> <li>2</li> <li>3</li&.

2021-11-21 21:18:36 376

原创 百度新闻导航,滚动监听,和弹幕效果案例

百度新闻导航 <style> * { padding: 0; margin: 0; list-style: none } #list { width: 1000px; height: 40px; background: #01204f; margin: 50px auto;

2021-11-21 21:09:29 454

原创 jQuery的动画方法

目录三组动画show([speed,[easing],[fn]])/hide([speed,[easing],[fn]])/toggle([speed,[easing],[fn]]) 显示 / 隐藏 / 切换slideDown() / slideUp() / slideToggle() 展开/收起/切换 fadeIn() / fadeOut() / fadeToggle() 淡入/淡入/切换阻止冒泡及默认行为自定义动画animate(params,[speed],[e...

2021-11-21 21:04:53 332

原创 本地存储和音视频的属性和方法

目录本地存储音视频的属性及方法音视频的方法音视频属性音视频的事件本地存储本地存储 持久性存储技术 (浏览器关闭不会自动消失) 存储大小5MB左右同源策略存储 协议 域名 端口号 都一致称之为同源 localStorage.setItem(key,val); 设置 localStorage.getItem(key); 获取 localStorage.removeItem(key); ...

2021-11-21 20:50:32 148

原创 JavaScript的面向对象

目录编程思想面向对象的特性创建对象的几种方式1.字面量方式创建对象2.工厂模式进行创建3.构造函数方式创建对象4.原型模式创建对象JavaScript数据类型检测原型链原型原型链面向对象选项卡面向对象拖拽实现(屏幕上拖动)继承的几种方式原型继承call继冒充对象继承寄生组合继承javaScript中一切皆对象编程思想在JavaScript中有两种编程思想 面向过程 和 面向对象 面向过程(POP):先做第一步,然...

2021-11-21 20:33:54 431

原创 JavaScript的高级函数和DOM回流

目录高级函数回调函数栈区回调函数理解自执行函数函数闭包闭包模拟随机数闭包模拟点赞闭包模拟私有属性递归函数递归求斐波那契数列快速排序防抖和节流防抖节流防抖和节流的区别call和apply应用DOM回流分类DOM回流的数据绑定方式 字符串拼接 动态添加利用文档碎片高级函数回调函数概念:将函数作为参数传递给另一个函数调用的函数(等某个动作完成后调用的函数),是解决异步操作的有效途径字...

2021-11-21 20:09:20 632

原创 DOM实现元素拖拽,滚轮事件和特效动画缓冲运动处理

目录元素拖拽实现(点击拖动可视屏幕任意位置)DOM滚轮事件处理滚轮事件绑定滚轮事件方向滚轮事件兼容滚轮缩放图片案例实现特效动画 缓冲运动 单向缓冲运动反复缓冲运动简单的封装透明度处理多属性运动多属性目标值问题元素拖拽实现(点击拖动可视屏幕任意位置)/* 拖拽 onmousedown 按下 onmousemove 鼠标移动是在按下的基础之上 onmouseup 抬起*/var ...

2021-11-21 17:19:20 320

原创 JavaScript DOM 高级事件绑定和事件委托

目录HTML DOM 事件1.事件对象鼠标事件onmousedown对象键盘事件对象例子:按键盘移动div2.事件绑定及移除事件绑定DOM0级DOM2级事件移除DOM0级DOM2级事件流4.阻止事件冒泡5.阻止默认行为事件委托实现思路概念模拟搜索框HTML DOM 事件 HTML DOM 允许 JavaScript 对 HTML 事件作出反应:JavaScript 能够在事件发生时执行,比如 当用户点击某个...

2021-11-21 16:59:52 711 1

原创 jQuery的事件(绑定,委托,对象)和数据拷贝(extend)

jQuery中全部都是静态获取 只有获取到的是HTMLCollection是动态获取jQuery中全部都是DOM2级事件绑定,没有DOM0事件绑定jQuery对象.事件类型(callBack); 一个事件可以对应多个事件处理函数$("ul li").click(function(){ console.log("哈哈"); }); $("ul li").click(function(){ con...

2021-11-18 17:14:44 544

原创 jQuery中的迭代方法和盒子模型

目录jQuery中的迭代方法工具方法$.map(迭代对象,callBack);each返回原数组 实例方法 jQuery实例.map(callBack);jQuery实例.each(callBack);jQuery的盒子模型盒子模型属性滚动监听案例(滚动到那个div那个li有激活样式 其余的li显示div背景色)jQuery中的迭代方法jQuery中可以分为工具方法 和 实例方法工具方法$.map(迭代对象,callBack);...

2021-11-18 16:37:54 451

原创 jQuery操作元素和元素节点的方法

目录操作元素样式设置单个样式值设置多个样式值获取单个获取多个操作元素类名增加:addClass(类名值);删除:removeClass(类名值);toggleClass(类名值); 原来没有就是增加,有就是移除hasClass(类名值); 判断是否有类名操作内容选项卡案例操作元素的属性prop(attr,[val]); 操作表单元素的布尔值 removeProp(attr);美女画廊案例(点击a标签小图片在下方显示对...

2021-11-17 23:14:39 433

原创 初识jQuery用法(1)

目录jQuery简单了解jQuery的引入jQuery理解jQuery的入口函数jQuery学习参考网址jQuery的选择器基本选择器层级选择器( > + ~ )过滤选择器(:first)属性选择器表单选择器jQuery元素节点筛选jQuery链式调用和转换为jQuery对象的方法jQuery链式调用js对象和jQuery对象的相互转化原生js对象转为jQuery对象jQuery对象转为原生js对象index的使用...

2021-11-17 22:44:54 297

原创 懒加载图片(首页和其他页)实现

首页懒加载实现代码 <style> * { padding: 0; margin: 0; } div { width: 1226px; height: 460px; margin: 50px auto; background: url(./img/TB1BlobNFXXXXXyXXXXXXXXXXX

2021-11-08 09:00:48 107

原创 JavaScript浏览器BOM

目录windowWindow 尺寸Windows的一些方法Window History一些方法:Window LocationWindow NavigatorWindows 弹窗系統提示框计时事件BOM事件BOM(Browser Obejct Model):浏览器对象模型window所有浏览器都支持 window 对象。它表示浏览器窗口。所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。全...

2021-11-07 20:30:47 3909 1

原创 DOM表单元素获取和事件,HTMLCollection 对象

目录表单元素的获取表单元素的事件表单事件formonsubmit:提交事件onreset:重置事件表单元素事件 inputonfocus:获取焦点onblur:失去焦点onchange:事件oninput:输出的时候实时触发 在IE8及以下不会触发但是不会报错IE独有的 onpropertychange表单元素的获取 语法:form.name值; 返回值:单个name值获取到具体的元素,多个name值获取到一个集合 &...

2021-11-07 19:45:10 807

原创 DOM中表格元素动态获取和添加删除表格案列

目录表格元素的获取table.tHead; 获取thead 获取到的是一个具体元素table.tBodies; 获取tbody 获取到的是一个集合table.tFoot; 获取tfoot 获取到的是一个具体元素tbody.rows; 获取tr 获取到是一个集合row.cells; 获取td 获取到是一个集合表格的操作添加删除表格案例表格元素的获取 table.tHead; 获取thead 获取到的是一个具体元素 table.tBodies; 获取...

2021-11-07 19:15:28 602

原创 JavaScript DOM

目录1.DOM的简介2.节点获取1).获取子节点2).节点属性3).获取父节点4).获取相邻节点3).节点的操作1.节点的创建2.节点的添加3.节点的插入4.节点的删除5.节点替换6.节点克隆练习发表评论4).获取元素的其它方式5).操作元素结构上的属性案例:发送验证码状态1.DOM的简介 DOM:Document Object Model 文档对象模型 (创建,添加,删除,替换,查找,获取) DOM树:浏览器在解析..

2021-11-07 18:56:50 96

原创 JavaScript的正则表达式

目录正则正则的创建正则的创建的区别正则的两大作用正则匹配正则捕获正则的组成特殊元字符量词元字符其他正则的应用正则的捕获修饰符正则的两大特性字符串方法替换(replace)前瞻和后顾正则的可视化网站正则正则就是处理字符串的一种规则正则的创建// 字面量的方式 /元字符/ var reg = /\d/; // \d:0-9之间任意的数字 包含0-9之间的任意数字即可 // ...

2021-11-07 16:31:19 253

原创 js实现左右轮播图切换功能和DOM缓冲运动实现淡入淡出轮播图

1秒钟自动播放切换图片,点击左右按钮切换图片,点击下面按钮切换图片,移入暂停。移除自动播放<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devic.

2021-11-04 22:45:46 417 2

原创 JavaScript的定时器与运动函数封装

定时器定时器分类 延迟定时器:多长时间之后才执行一次 (只执行一次 ) 应用场景:广告弹出 间歇性定时器:没隔多长时间就执行一次(只要不清除就一直执行) 应用场景:轮播图,倒计时 延迟定时器:一般支持最小值4ms间歇性定时器:一般支持最小毫秒值 10ms定时器的设置 延迟定时器 基本语法:setTimeout(fun,time) fun:函数,可以传递实名函数或匿名函数 time:时间,单位是ms(单...

2021-11-04 22:22:51 168

初识js变量类型.md

初识js变量类型.md

2021-09-07

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除