- 博客(20)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 前端(如：2019-05-01T16:00:00.000Z),转换为正常格式 vue中封装为过滤器
let time = '2019-05-01T16:00:00.000Z'; function renderTime(date) { var dateee = new Date(date).toJSON(); return new Date(+new Date(dateee) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '') ..
2020-10-19 16:04:06
940
1
原创 vueX的介绍以及使用
vuex文章目录vuex1、为什么要用 vuex ？2、通信解决方案3、vuex 是什么？4、vuex 的工作流5、安装 vuex6、引入 vuex7、从 Store 开始7-1、创建一个 Store8、核心概念8-1、state8-1-1、state 的创建8-1-2、在组件中使用 store8-1-3、store 配置8-1-4、使用辅助函数 `mapState`8-1-5、使用扩展运算符组合9、getters9-1、getters 函数9-2、通过属性访问9-3、通过方法访问9-4、使用辅助函数 `
2020-10-18 18:53:41
218
原创 js获取页面元素位置的方法getBoundingClientRect()
作用getBoundingClientRect()是用来获取页面元素的位置的方法.这个方法最终返回的是一个矩形对象,包括四个属性:left,top,bottom,right四个属性top：元素上边到视窗上边的距离;right：元素右边到视窗左边的距离;bottom：元素下边到视窗上边的距离;left：元素左边到视窗左边的距离;width:边界矩形的宽度(ie9)height:边界矩形的高度(ie9)注意：当我提到元素的边界矩形的时候，返回的大小包含了任何padding和border值
2020-10-14 20:41:12
697
原创 Javascript无缝轮播源码
效果图代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> * { margin: 0; padding: 0; } ul { list-style: none; } img { vertical-a
2020-10-11 19:17:06
132
1
原创 jquery个人总结
节点：元素节点 属性节点 文本节点dom 文档对象模型console.log(“听课”); 输出括号里的内容alert(“你好”) 弹出弹出框document.title 获取文档标题.toggleClass 添加删除类名$(".box").bind(“click”,function(){$(this).css(“background-color”,“yellow”) 事件绑定})<script src="script/jquery.js"&.
2020-10-11 19:08:49
380
原创 Javascript面向对象
1：什么是对象？a:对象就是由若干个键值对，无须组成的数据类型，被称之为对象。b:简单理解，提供了特有的方法和属性就是对象！c:“对象”是一个容器，封装了“属性”（property）和“方法”（method）。举例：var o={name:‘tom’,age:12,fun:function(){alert(1)}}2:键值对？花括号里面冒号前被称之为键，冒号后被称之为值，通过键获取值。3：什么是面向对象？面向对象是一种编程思想，通过这种思想来完成代码的编程。(oop==Obje
2020-10-11 18:55:09
100
原创 前端交互的各种事件
1：什么是事件？人与机的交互就是事件。2：事件类型：ui事件*onscroll 滚动条事件onload 页面加载触发unload 页面关闭触发onselect 选中文本时触发onresize 改变浏览器窗口触发onabort 图像加载被中断触发error 错误信息时触发*onchange 当改变一个元素的值且失去焦点时焦点事件*onfocus 获得焦点事件（没有冒泡，浏览器都支持）*onblur 失去焦点事件（
2020-10-11 18:52:33
622
原创 this的多种情况指向问题?
1：this是什么？this是一个关键字，他的作用具有指向性。2：this的指向分类？a:在事件函数中，this指向事件前对象。 b:在普通函数中，谁调用这个函数，this就指向谁。c:在apply()和call()方法中this指向方法中的对象（如下，指向obj）举例： var x=2; var obj={ x:4 } function fn(){ alert(this.x);//2 } fn(); fn.call(obj)d:在箭头函数中this指
2020-10-11 18:46:06
132
原创 购物车放大镜效果(模拟jd的商品页面)
效果代码:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> * { margin: 0; padding: 0; list-style: none; } .zhuti { width: 1262px; he
2020-10-11 18:37:40
395
原创 vue插槽的使用?怎么改变头部内容?
什么是插槽?插槽就是子组件中的提供给父组件使用的一个占位符，用 表示，父组件可以在这个占位符中填充任何模板代码，如 HTML、组件等，填充的内容会替换子组件的标签。怎么改变移动端项目的头部?单独写一个组件header.vue内容如下:<template> <div> //如下头部分为三部分=左=中=右然后写好全局样式 <div class="header"> <div class="h-left"> <
2020-10-11 18:27:25
378
1
原创 vue中使用npm 命令安装的nprogress以及如何修改颜色/位置
1.安装npm install --save nprogress或者yarn add nprogress2.使用在router.js中//导入import NProgress from 'nprogress'import 'nprogress/nprogress.css'//在路由守卫中可以直接使用使用下边的四个方法3.方法NProgress.start() — 开始出现进度条NProgress.set(0.4) — 设置百分比NProgress.inc() — 递增NP
2020-10-07 09:03:46
2770
2
原创 vue过渡＜transtion＞＜/transtion＞与列表过渡＜transtion-group＞＜/transtion-group＞
1.vue过渡组件Vue 在插入、更新或者移除 DOM 时，使用内置的过渡封装组件可以实现过渡效果语法格式: <transition name="xx"> </div></transition>2.过渡的类名在进入/离开的过渡中，会有 6 个 class 切换：v-enter：进入过渡的开始状态v-enter-active：进入过渡生效时的状态v-enter-to：进入过渡的结束状态v-leave：离开过渡的开始状态v-leave-acti
2020-10-06 20:37:58
348
原创 使用npm 安装依赖包cmd报错npm ERR! code ERR_TLS_CERT_ALTNAME_INVALID npm ERR! errno ERR_TLS_CERT_ALTNAME_INVAL
报错npm ERR! code ERR_TLS_CERT_ALTNAME_INVALID npm ERR! errno ERR_TLS_CERT_ALTNAME_INVALID npm ERR! request to https://registry.cnpmjs.org/nprogress failed, reason: Hostname/IP does not match certificate's altnames: Host: registry.cnpmjs.org. is not in t
2020-10-05 14:30:02
330
原创 ES6知识点
ES6常用知识点1.let 和constlet和const声明的变量都不具备变量提升let的声明方式与 var 相同，用 let 来代替 var 来声明变量，就可以把变量限制在当前代码块中。使用 const 声明的是常量，其值一旦被设定便不可被更改。2.模板字符串使用双 `` 包裹let name='西楠';//字符串双引号let result=`我用的是模板字符串,我的名字叫${name}`;console.log(result)模板字符串中可以调用函数,变量,``3.解构赋
2020-10-04 18:54:39
180
原创 前端Javascript(js)-------dom笔记知识点`
简介通过 HTML DOM，可访问 JavaScript HTML 文档的所有元素。什么是HTML DOM(文档对象模型)?当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model)1.改变HTML内容innerHTML<html><body><p id="p1">Hello World!</p><script>document.getElementById("p1").innerHTM
2020-10-04 14:30:58
108
原创 封装addEventListener浏览器兼容代码
/* * 参数： * obj：要绑定事件的对象 * eventStr：事件(注意：这里不要on) * callback：回调函数 */function bind(obj , eventStr , callback){ if(obj.addEventListener){ //大部分浏览器 obj.addEventListener(eventStr , callback , false); }else{ //I
2020-10-04 14:03:13
128
原创 学习Javascript笔记(2)
1.变量命名规则变量必须以字母开头变量也能以 $ 和 _ 符号开头（不推荐）变量名称对大小写敏感（y 和 Y 是不同的变量）2.数据类型1.值类型(基本类型):字符串（String)数字(Number)布尔(Boolean)对空（Null）未定义（Undefined)Symbol。值类型(基本类型):对象(Object)数组(Array)函数(Function)3.作用域在 JavaScript 中, 对象和函数同样也是变量。在 JavaScript 中,
2020-10-04 13:33:16
95
原创 判断js(Javascript)中变量的数据类型几种方式
typeOf()来获取JavaScript中变量的数据类型.但是这种方法不能判断是Array还是Object使用isArray方法判断是不是数组var cars=new Array();cars[0]="Saab";cars[1]="Volvo";cars[2]="BMW";// 判断是否支持该方法if (Array.isArray) { if(Array.isArray(cars)) { document.write("该对象是一个数组。") ; }}.
2020-10-04 12:46:03
172
原创 学习Javascript笔记(1)
Javascript一.简介二.Javascript用法三.使用`Javascript`注意四.输出方式一.简介Javascript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。JavaScript 是脚本语言JavaScript 是一种轻量级的编程语言。JavaScript是可插入 HTML 页面的编程代码。JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。二.Javascript用法
2020-10-04 12:39:21
213
原创 移动端去除a标签默认点击高亮
a { text-decoration: none; -webkit-tap-highlight-color: transparent;}
2020-10-02 19:09:47
888
vue-devtools扩展
2020-09-28
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人