- 博客(41)
- 收藏
- 关注
RSS订阅原创 vue router详解
一、安装和使用路由1、安装vue -routercnpm install vue-router --save2、在模块化工程中使用，通过Vue.use()来安装路由功能(1)导入路由对象，调用> Vue.use(VueRouter)(2)创建路由实例 传入路由映射哦诶之（3）在Vue实例中挂载创建的实例import VueRouter from 'vue-router';import Vue from 'vue';Vue.use(VueRouter);const router
2020-08-16 09:47:16
4377
原创 动态组件和异步组件 自定义指令
动态组件在动态组件上使用keep-alive组件之间切换的时候，keep-alive可以保持这些组件的状态，以避免反复重渲染导致的性能问题。 <keep-alive> <leftKa v-if="status"></leftKa> <rightKa v-else></rightKa> </keep-alive>异步组件局部注册组件，异步挂载import Home fr
2020-08-16 09:46:52
4434
原创 vue 中的MVVM模式
view层视图层，通常就是DOM层 主要给用户展示各种信息Model层数据层，数据可能是我们固定的死数据，更多是来自我们服务器，从网络上请求下来的数据。vueModel层也叫视图模型层，是view和Model沟通的桥梁一方面它实现了Data Binding，也就是数据绑定，将Model的改变实时的反应到View中另一方面它实现了DOM Listener ,也就是DOM监听，当DOM发生一些事件（点击、滚动、touch）可以监听到，并在需要的情况下改变对应的Data...
2020-08-12 17:08:18
4380
原创 Vue 配置环境 npm报警告：npm WARN deprecated request@2.88.2解决办法
在配置Vue环境时遇到了npm报错遇到了上面的错误
2020-08-12 17:08:07
42794
8
原创 了解Vue CLI以及安装使用
一、什么是CLI呢1、CLI是Command-Line Interface，翻译命令行界面，俗称脚手架2、Vue CLI是一个官方发布 vue.js是官方发布的vue.js项目脚手架3、使用vue-cli可以快速搭建Vue开发环境及对应的webpack配置二、使用Vue CLI当然在使用前我们需要配置环境1、安装NodeJS可以直接在官方网站中下载.http://nodejs.cn/download/2、检测安装的版本默认情况下自动安装node 和npm3、cnpm安装由于国内使用np
2020-08-12 17:07:55
88
原创 jQuery中的插件和echarts使用
jQuery插件jquery功能比较有限，想要更复杂的特效效果，可以借助于jQuery插件完成。注意这些插件也是依赖于jQuery来完成，所以必须先引入jQuery文件，因此也称为jQuery插件jQuery插件常用的网站:1、jQuery插件库：http://www.jq22.com/2、jQuery之家 http://www.htmleaf.com/jQuery插件使用步骤1、引入相关文件2、复制相关html、css、js(常用插件)...
2020-07-30 10:52:15
2681
原创 jQuery中的Ajax
通过HTTP请求加载远程数据jQuery底层Ajax实现。简单易用的高层实现$.get .post等。.post等。.post等。.ajax()返回其创建的XMLHttpRequest对象，最简单情况下，$.ajax()可以不带任何参数直接使用jsonp跨域 $.ajax({ method: "get", url: "", data: {}, dataType: "jsonp",
2020-07-30 10:03:18
77
原创 jQuery语法整理
jQuery概念jQuery 是一个快递的、简介的javascript库，其设计的宗旨是 write less，Do More，即倡导写更少的代码，做更多的事情jQuery封装了 javascript常用的功能代码，优化了DOM操作、事件处理、动画和Ajax交互优点1、轻量级、核心文件才几十kb，不会影响页面加载的速度2、跨浏览器兼容，基本兼容了现在主流的浏览器3、链式编程、隐式迭代4、对事件、样式、动画支持，大大简化了DOM操作5、支持插件扩展开发，有着丰富的第三方插件6、免费、开源j
2020-07-23 15:29:58
241
原创 html5缓存sessionStorage localStorage
本地存储的特性1、数据存储在用户浏览器中2、设置，读取方便，甚至页面刷新不会丢失数据3、容量较大，sessionStorage约5M、localStorage约20M4、只能存储字符串，可以将对象JSON.stringfy()编码后存储window.sessionStorageSessionStorage用于本地存储一个会话中的数据，这些数据只有在同一个会话中的页面才能访问并且会话结束，窗口关闭后，数据就会消失。是一种会话级别的存储。1、生命周期为关闭浏览器窗口2、在同一歌窗口下数据可以共享
2020-07-16 14:19:49
462
1
原创 video API
HTML 元素 用于在HTML或者XHTML文档中嵌入媒体播放器，用于支持文档内的视频播放。你也可以将 标签用于音频内容，但是 元素可能在用户体验上更合适。video属性autoplay，视频可以自动播放，不用等视频加载谷歌中禁用了autoplay视频 自动播放功能，如果需要自动播放，必须使用muted静音属性buffered读取视频媒体的缓存controls可以为视频加上视频控件，允许用户控制视频的音量，播放等currentTime 指示以秒为单位的媒体的当前播放位置。如果vide
2020-07-16 11:50:58
1998
原创 js 里面事件的委托、cookie以及严格模式
事件委托1、什么是事件委托事件委托，通俗地来讲，就是把一个元素响应事件的函数委托到另一个元素。2、事件委托的原理一般来讲，会把一个或者一组元素的事件委托到它的父层或者更外层元素上，真正绑定事件的是外层元素，当事件响应到需要绑定的元素上时，会通过事件冒泡机制从而触发它的外层元素的绑定事件上，然后在外层元素上去执行函数。3、事件委托的优点1、减少了事件注册，节省了内存，如在 table 上代理所有 tr 的 click 事件2、简化了 dom 更新时的事件操作，如现在 table 内增加了一行 t
2020-07-16 00:01:11
168
原创 解决vscode使用canvas绘制图形没有代码提示问题
vscode在没有安装插件的情况（没找到插件/(ㄒoㄒ)/~~）可以用下面的注释解决代码补全的问题 //添加下方注释提供自动补全canvas 代码 /** @type {HTMLCanvasElement} */ var canvas = document.querySelector("#canvas");/** @type {HTMLCanvasElement} */ 开头添加这行注释可以完美解决vscode 使用canvas绘图代码不提示问题...
2020-07-15 23:06:54
798
原创 canvas API总结
canvas简介HTML5 元素用于图形的绘制，通过脚本 (通常是JavaScript)来完成， 标签只是图形容器，您必须使用脚本来绘制图形，可以通过多种方法使用Canva绘制路径,盒、圆、字符以及添加图像。创建并设置canvas画布一个画布在网页中是一个矩形框，通过canvas> 元素来绘制.注意: 默认情况下 元素没有边框和内容。简单实例如下:注意: 标签通常需要指定一个id属性 (脚本中经常引用), width 和 height 属性定义的画布的大小.提示:你可以在HTML页
2020-07-15 21:58:17
159
原创 js三种改变this指向的方法call、apply、bind及区别
call（）方法1、第一个作用可以调用函数，第二个可以改变函数内this的指向2、call 主要作用可以实现继承 var o = { name: "andy" } function fn(a, b) { console.log(this); //指向 对象o console.log(a + b); }; fn.call(o, 1, 2);实现子类对父类的继承
2020-07-09 00:50:12
464
原创 js常用设计模式
工厂模式工厂模式就是使用函数创建对象 返回对象避免多次创建对象只需要传递一个合法的参数,就可以获取到你想要的对象,而无需知道创建的具体的细节例如直接创建一个对象，将属性和方法全部放在这个对象里面 function Factory(name,sex,age,job){ //创建一个对象 var obj={}; obj.name=name; obj.sex=sex; obj.age=age; obj.job=job; obj.e
2020-07-09 00:47:29
132
原创 js里面继承及6种继承
继承的核心机制js里面的六种继承方式分别为 原型练继承、构造函数继承，实例继承，拷贝继承，组合继承，寄生组合继承要理解继承必须理解原型对象 和原型链的关系和指向 一个构造函数由构造函数本身和构造函数的原型对象两个部分组成 ，也就是构造函数有一个隐藏的属性__proto__,指向构造函数的原型对象。当构造函数被实例化时，把构造函数中的所有属性和方法拷贝到实例当中，同时，这个__proto__属性也会被拷贝，当访问实例对象当中的属性或方法时，会先从实例本身找，如果找到了，就会使用实例中的这个属性或方法；如
2020-07-08 16:02:07
97
原创 原生AJAX
一、什么是AJAXAJAX = 异步 JavaScript 和 XML。AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 AJAX）如果需要更新内容，必需重载整个网页面。二、五步法、书写原生AJAX1、 创建ajax对象 考虑兼容，ie5、ie6的兼容2、建立连接使用open方法参数 1、method 请求方式 get post2、连接的服
2020-07-02 11:05:45
131
原创 手机触屏事件
移动端触屏事件移动端浏览器兼容较好，不需要考虑以前js的兼容问题，可以放心使用js书写效果touch代表一个触摸点，触屏事件响应用户对屏幕或者触控板的操作触摸touch事件说明touchstart手指触控到一个dom元素触发touchmove手指在dom元素上滑动时触发touchend手指从DOM元素移开时触发var body = document.body; var startX, startY, endX, endY; body.addE
2020-06-24 18:01:06
889
2
原创 JS面向对象
面向过程和面向对象的对比面向过程：1、优点：性能比面向对象高，适合跟硬件联系很紧密的东西，例如单片机2、缺点：没有面向对象易维护，易复用，易扩展。面向对象 ：1、优点：易维护，易复用，易扩展，由于面向对象有封装、继承、多态的特性，可以设计出低耦合的系统，使系统、更加灵活，更加易于维护2、缺点：性能比面向过程低如何自己定义对象使用new关键字 创建一个新的对象 对象都是引用类型var person = new Object();设置属性 person.name = "张三";
2020-06-24 16:49:56
91
原创 正则表达式
**正则的作用：**测试文本，匹配文本的，匹配串中的子窜或者取出符合某个条件的字串非打印字符描述\cx匹配键盘的 c 代表 A-Z a-z 子符\f匹配换页符\n匹配换行符\r匹配回车符\t匹配制表符\s匹配的是任何空白字符 等价[\f\r\n\v\t]\S匹配任何非空白字符 等价[^\f\r\t\n\v]特殊字符（具有特殊含义的字符 要查）$匹配表达式的结尾 如果套匹配$符号 $
2020-06-17 20:38:55
97
原创 js常用排序总结
1.冒泡排序冒泡排序法又称为交换排序法，是从观察水中气泡变化构思而成。原理是从第一个元素开始，比较相邻元素的大小，若大小顺序有误，则对调后再进行下一个元素的比较。如此经过第一次扫描后就可以确保最后一个元素位于正确的顺序；经过第二次扫描可以确保倒数第二个元素位于正确的顺序。由此可知，N个元素经过（N-1）次扫描，就可以完成所有元素的排序。 //冒泡排序 var arr = [4, 1, 2, 5, 8, 3, 6]; var temp = null;
2020-06-10 20:33:20
455
原创 Math对象和数组对象
Math数学对象Math数学对象 不是一个构造函数，所以我们不需要new 调用 而是直接使用里面的属性和方法1、Math对象的常用属性属性描述Math.E返回算数常量e，约等于2.718Math.PI返回圆周率2、Math对象的常用方法属性描述Math.abs()返回绝对值Math.sin()返回数的正弦Math.cos()返回数的余弦Math.tan()返回角的正切Math.asin()返回数的反正弦值
2020-06-10 19:48:07
155
原创 数组和字符串的方法汇总
字符串的方法字符串方法用法toString()转字符串的方法indexOf(字符)返回字符索引位置 检测不到返回-1；第二个参数是起始查找位置（包含该起始位置）lastindexOf(字符)从右往左检测concat()拼接字符串的方法 返回拼接后的字符串repalce(原值，替换之后的字符)替换字符串的方法 只能替换相同字符串的第一个search(要查找的字符)返回字符索引位置 没有其他参数 es6charAt(索引)返回索引对应的字
2020-06-10 19:22:39
133
原创 BOM浏览器对象模型
BOM的构成1、js访问浏览器的一个接口2、是一个全局对象，定义全局作用域中的变量3、调用的时候可以省略window窗口加载事件让js可以现在任意位置window.onload=function(){} //只能写一次window.addEventListener("load",function(){}); //没有限制document.addEventListener("DOMContentLoad",function(){}); //出触发时，仅当DOM加载完成时 不包括样式
2020-05-26 23:30:19
75
原创 京东放大镜
HTML结构1、搭建一个大盒子， 大盒子部分包括中图盒子 和下面的小图盒子，至于黄色的层和大图的盒子可以让其绝对定位在中图的盒子中 ，调整其位置即可。左右小按钮用a链接加背景图生成。具体代码如下HTML代码 <div class="box"> <div class="preview_img "> <img src="img/middle1.jpg" alt=""> <div class=".
2020-05-21 18:09:25
101
原创 dom部分总结
获取元素4个动态获取document.getElementsByClassName("") // 根据类名称获取，返回的是集合document.getElementsByName("") // 返回的是集合document.getElementById("") // 根据类名称获取 返回的是单个对象document.getElementsByTagName("") //根据标签名获取 返回的集合document.querySelector("")//参数是css选择器还可以是标签名
2020-05-19 23:22:27
186
1
原创 js基础
1、变量变量是存放可变化值的量关键字 var 这个关键字可以定义任意类型的变量定义规则： var 名称=值；命名规则： 以字母开头，或者$ _开头 严格区分大小写 (驼峰 帕斯卡)var username;console.log(username);//空值 undefinedjs定义多个变量用逗号隔开var a, b, c;console.log(a, b, c);2、js数据类型number 数字型boolean 真假（true/false）string 字符串类型
2020-05-13 17:27:07
83
原创 2D 3D动画
2D转换之移动translatetransform:translate(x,y)transform:translateX(n)transform:translateY(n)
2020-05-08 16:28:08
268
原创 css部分总结
浮动1、块级元素独占一行，从上往下顺序排列常用的有 div hr p h1~h6 ul ol form table2、行内元素会按顺序，从左到右排列，碰到父元素边缘则自动换行常用元素 span a i em3、多个块级元素纵向排列找标中军流 横向排列找浮动 float浮动盒子不再保留原先位置4、任何元素都可以浮动，添加浮动之后具有行内块相似的特性5、浮动元素经常和标准流父级搭...
2020-04-23 17:54:55
60
原创 html 元素 +css样式和选择器
HTML标签1、 p标签 段落标签2、 a链接标签 百度属性：target target="_self" 在当前网页里面打开 target="_blank" 重新打开一个选项卡，不写则默认当前网页打开，还可以使用a链接 制作锚标3、br标签 强制换行4、h标签 时HTML的标题标签 h1~h6 h1是最大的标签 h6是最小的标签5、文本格式化标签b 文字...
2020-04-14 22:29:53
81
原创 cookie缓存
ookie主要用于缓存web 页面用户的信息的cookie 是一种数据 缓存到电脑上的文本文件在web页面上 用户的信息不回存储在后端 在页面上使用缓存 来存储在用户访问页面的时候存储用户的信息到cookie下次访问的时候 直接从cookie读取信息cookie 缓存 存在有效期js里面如何创建cookie创建cookiecookie的简单建立document...
2020-03-20 16:54:31
274
原创 ES6(2)
Promise 异步编程在原生js写过函数的回调函数 事件 异步编程Promise 是一个容器 里面放的是未来或者异步的即将发生的东西Promise 对象的三大状态不收外界影响 在内部的异步编程的结果会影响Promise 对象的使用 也是一个构造函数 newlet promise = new Promise(function (resolve, reject) ...
2020-03-20 14:12:33
52
原创 ES6语法
变量let 声明的变量是在当前的作用于内有效，const 声明的是只读变量 -常量let const 声明的变量不存在变量的声明提前， 声明变量不能重复声明 { var a=10; let b = 20; console.log(b); } console.log(a); ...
2020-03-20 13:52:27
52
原创 2.22正则总结
正则表达式正则表达式作用： 验证字符串格式\ 转义字符 ， \n 匹配的就是换行 ，\匹配\^ 代表的是 开始符号 ， 匹配字符的开始 或者正则表达式的开始$ 代表的是 结束符号 匹配字符的结束 或者正则表达式的结束*代表的是匹配一个字表达是零次或者多次+代表的是匹配前面的字表达是 一次或者多次? 代表匹配前面的字表达是 零次或者一次{n} n为非负整数...
2020-02-23 17:42:05
54
原创 2.19动画效果
jquery 基本效果//show([s,[e],[fn]]) 显示//hide([s,[e],[fn]]) 隐藏//toggle([s],[e],[fn]) 显示隐藏切换$(".btn").click(function(){ $(".block").hide();});hide show不加参数直接隐藏 或者显示，参数是速度，不建议带speed 参数 $(".bt...
2020-02-20 18:01:43
85
原创 2.16总结
筛选//过滤//eq(index|-index)first() //过滤出第一个元素//last()//hasClass(class)//filter(expr|obj|ele|fn)//is(expr|obj|ele|fn)//map(callback)//has(expr|ele)//not(expr|ele|fn)//slice(start,[end])//主要用...
2020-02-17 17:35:07
124
原创 2.13jquery练习
jquery选择器console.log($("*"));//获取所有元素console.log($(".btn"));console.log($("ul.tel>li"));//层次选择器console.log($("ul.tel li"))//和上面那个一样console.log($(".li2+li"));//+代表下一个liconsole.log($(".li2~li")...
2020-02-14 18:55:14
118
原创 1.4作业
滚轮事件window.onmousewheel = function (e) {if (e.deltaY < 0) {console.log(“上滑”)}else {console.log(“下滑”)}}bom 浏览器对象模型 window history location 内置对象 String Array Math Date settimeout...
2020-01-09 10:37:35
65
原创 12.22
数据类型转换var num=10;console.log(typeof num.toString());var str=“10.5”; //强制转化console.log(parseInt(str));console.log(parseFloat(str));var s=“10abc”;console.log(parseInt(s));var m=“abc10”;...
2019-12-26 17:26:31
81
原创 js基础
js12.15日笔记js变量变量类型string number boolean null undefined object使用变量之前需要对变量提前声明和赋值// var a;var b,c;var k=10;console.log(a,b,c);----undefined 没有被定义console.log(k);k=10变量类型检测(typeof) var a...
2019-12-19 17:59:28
79
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人