- 博客(150)
- 收藏
- 关注
RSS订阅原创 computed
文章目录一、计算属性二、介绍使用三、计算属性的setter和get四、注意一、计算属性 模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中**放入太多的逻辑会让模板过重且难以维护**,因此计算属性可以解决这个维护问题<div id="computed-basics"> <p>Has published books:</p> <span>{{ author.books.length > 0 ? 'Yes' : 'No
2021-08-23 16:48:05
322
原创 watch
文章目录一、概念二、使用三、对比一、概念 侦听器，虽然计算属性在大多数情况下更合适，但有时也需要一个自定义的侦听器。这就是为什么 Vue 通过watch选项提供了一个更通用的方法， 来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的。二、使用<div id="watch-example"> <p> Ask a yes/no question: <input v-model="question" />
2021-08-23 16:46:19
257
原创 echarts折线图封装案例
文章目录一、封装代码二、使用2.1、提取2.2、使用一、封装代码<template> <div class="echarts" ref="chart"></div></template><script>const echarts = require("echarts");import { mapGetters } from "vuex";import "echarts/theme/macarons.js";export de
2021-06-16 11:28:14
712
原创 delete用法
文章目录一、作用二、语法三、返回值四、使用4.1、对象属性删除4.2、变量删除4.3、删除不了原型链中的变量4.4、Math、array，object等内置对象的属性不可删除4.5、删除数组一、作用 delete操作符用于删除对象的某个属性二、语法 delete object.property 或delete object['property']三、返回值 delete操作符具有返回值，返回值为布尔值，对于所有情况都是true，即使是删除不存在的属性也会删除返回true
2021-03-24 12:50:23
1351
原创 let const var
文章目录一、概念二、区别2.1、var的特变之处2.2、const和let的特别之处2.3、var和let还有const的区别2.4、let和const的区别三、循环的块级作用域绑定3.1、var定义的循环3.2、let定义的循环3.3、var定义的循环的函数3.4、let声明的循环一、概念 let 变量声明，定义的变量有块级作用域 var 变量声明 定义的变没有块级作用域 const常量变量声明，定义必须给其赋值二、区别2.1、var的特变之处
2021-03-22 21:28:30
322
原创 vue生命周期最全学习
文章目录一、为什么要学习声明周期二、什么是vue的生命周期2.1、生周期的经历过程.2、生命周期的作用2.3、理解什么是钩子函数2.4、Vue生命周期总共有几个阶段2.5、（重点）分别看看vue生命周期的这八个阶段，这八个阶段对应的钩子函数2.5.1、创建前（beforeCreate）2.5.2、创建后（created）2.5.3、载入前（beforeMount）2.5.4、载入后（mounted）2.5.5、更新前（beforeUpdate）2.5.6、更新后（updated）2.5.7、销毁前（befo
2021-01-31 18:19:14
556
原创 jQuery事件机制
文章目录一、常见的事件绑定二、绑定事件2.1、简单事件的绑定2.2、bind绑定事件2.3、delegate注册委托事件2.4、on方式绑定（重点）2.4.1、on注册简单事件2.4.2、on注册委托事件三、事件解绑3.1、unbind方式（不用）3.2、undelegate方式（不用）3.3、off方式（推荐）四、jQuery事件对象4.1、案例4.2、案例五、jQuery的两个特点5.1、链式编程例子例子5.2、隐式迭代5.2.1、each方法https://blog.csdn.net/weixin_
2020-12-30 14:00:25
445
原创 jQuery使用-02
文章目录一、jQuery认识二、jQuery学习开始2.1、jQuery的入口函数和$符号2.1.1、入口函数（重要）2.1.2、jQuery的入口函数，有一下几种写法2.1.2、jQuery入口函数与js入口函数的区别2.1.3、jQuery的$符号三、js中的DOM对象和jQuery对象比较（重点，难点）3.1、二者的区别3.2、二者的相互转换3.2.1、DOM 对象 转为 jQuery对象：3.2.2、jQuery对象转为DOM对象3.2.3、jQuery对象转换成了 DOM 对象之后，可以直接调用
2020-12-28 14:33:39
218
原创 jQuery初始
[toc]一、JQuery的介绍1.1、引入jquery的原因在用js写代码时，会遇到一些问题1、window.onload事件覆盖的问题，因此只能写一个事件2、代码容错性差3、浏览器兼容性问题4、书写很繁琐，代码量多5、代码很乱，各个页面到处都是6、动画效果很难实现二、什么是JqueryjQuery是js的一个库，封装了我们开发过程中常用的一些功能，方柏霓我们调用，提高开发效率。js库是把我们常用的功能放到一个单独的文件，我们用的时候，直接引用的页面里即可官网：htt
2020-12-28 14:26:28
150
原创 javaScript做的管道小鸟游戏
文章目录一、功能二、实现步骤三、代码一、功能小鸟飞行（背景图像动）小鸟碰到游戏上下边界，游戏结束小鸟碰到管子游戏结束二、实现步骤1、实现背景图片移动，图片平铺，这样移动就不会没有图片1.1）实现方式，定时器移动背景图片的x轴的定位2、实现小鸟上下移动2.1）定时器控制向下运动，这个不控制会一直向下运动2.2）点击事件来控制向上运动，，点击一次向上运动一次2.3）小鸟的位置来判断用来停止运动，利用全局变量runing的布尔值来判断3、管道创建3.1）创建创建管道的函数，每次创建
2020-12-24 11:15:46
2220
2
原创 迷你微信案例
文章目录一、功能二、代码一、功能思路分析：1)点击图片实现用户切换功能1-1：默认两个用户，通过点击来回切换2）点击发送按钮，八用户得聊天内容展示聊天区域2-1、点击发送按钮，把聊天内容展示在聊天区域2-2、设定聊天在领土区域内不同位置显示二、代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>微信聊天界面</tit
2020-12-23 22:09:44
389
1
原创 javascript贪吃蛇游戏
文章目录一、项目介绍二、代码一、项目介绍功能：（1）、开始界面点击开始，进入游戏界面（2）、按上下左右键来控制食物运动得方向（3）、控制一次以后方向确定蛇会一直游动（4）、食物随机产生（5）、当蛇头和食物碰撞后食物位置变动，蛇身加长，游戏分数加1（6）、蛇头碰到墙壁或者自己游戏结束，按确认后游戏重新开始二、代码html<!DOCTYPE html><html lang="en"><head> <meta charset=
2020-12-23 22:04:52
274
原创 五大位置offset,client,scroll,screen,page
文章目录一、偏移量offset二、client鼠标距离(不含边框)（获取边框的宽度）三、scroll四、page(文档坐标)这个当文档没有滑动条时候和client一样五、screen显示屏前言凡是事件中含有x和y的都是为了获取鼠标指针位置相对于触发事件的对象的位置，但是又各不相同一、偏移量offset//获取坐标节点.offsetLeft;节点.offsetTop;获取节点的大小节点.offsetWidth;（一个盒子的所有边框 内边距和内容）节点.ofsetHeight；事件.off
2020-12-22 13:03:13
480
原创 案例点击弹出登录页面并拖拽
功能：（1）、点击弹出对话框有遮盖曾（2）、关闭登录页面（3）、页面可用拖拽代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding: 0px; margin: 0px; .
2020-12-21 13:40:42
277
原创 DOM操作动态创建删除元素
文章目录一、创建节点1.1、createElement创建1.2、document.write()1.3、element.innerHTML=‘’1.4、性能二、插入节点2.1、最后插入appendChild2.2、参考前插入一个节点insertBefore2.3、强调三、删除节点removeChild四、复制节点（克隆节点）4.1、直接获取4.2、替换节点replaceChild(新的节点，旧的节点)五、设置节点的属性5.1、获取节点属性5.2 用方法二、getAttribute（）5.3、设置属性5.4
2020-12-17 14:05:09
1079
原创 DOM的动态创建和删除元素
文章目录一、创建节点1.1、createElement创建1.2、document.write()1.3、element.innerHTML=‘’二、插入节点2.1、最后插入appendChild2.2、参考前插入一个节点insertBefore2.3、强调三、删除节点removeChild四、复制节点（克隆节点）4.1、直接获取五、设置节点的属性5.1、获取节点属性5.2 用方法二、getAttribute（）5.3、设置属性5.4、总结一、创建节点1.1、createElement创建（1）在内
2020-12-17 12:17:33
832
原创 DOM属性和样式的操作
文章目录一、innerHTML和innerText二、nodeType属性:节点类型三、nodeType，nodeName，nodeValue四、文档加载五、行内样式设置六、读取元素的样式七、style属性的注意事项八、style的常用属性九、例子9.1、改变div的大小和透明度9.2、当前输入的文本框高亮显示9.3、高级隔行变色，高亮显示十、通过js获取当前显示的样式一、innerHTML和innerText节点.innerHTML：双闭合标签里面的内容（包含标签）节点. innerText：不包
2020-12-17 09:41:47
665
原创 DOM操作来注册事件以及事件概念
文章目录一、事件简介二、事件的三要素三、步骤四、常用事件五、步骤详解5.1、获取事件源的方法（DOM节点的获取）5.2、绑定事件的方式5.3、事件驱动程序5.3.1、obload事件六、例子一、事件简介事件：就是文档或浏览器窗口中发生的一些特定的交互瞬间。对于 Web 应用来说，有下面这些代表性的事件：点击某个元素、将鼠标移动至某个元素上方、关闭弹窗等等。二、事件的三要素事件源 事件 事件驱动程序例如：比如，我用手去按开关，灯亮了。这件事情里，事件源是：手。事件是：按开关。事件驱动程序是：
2020-12-17 09:28:00
387
原创 DOM中的节点获取方法总结
文章目录一、元素节点的获取二、DOM访问关系的获取2.1、获取父节点节点.pareNode（获取的式元素节点）2.2、获取兄弟节点2.2.1、.nextElementSibling || 节点.nextSibiling2.2.2获取前一个节点 previousSibiling/ 前一个元素节点previousElementSibiling2.2.3、获取任意一个兄弟节点.parentNode.children[index]2.3、获取单个的子节点2.3.1、第一个子节点firstChild | 第一个
2020-12-17 09:23:20
4990
原创 变量，函数，函数表达式提升
文章目录一、全局变量的时候二、在局部变量的时候三、函数表达式和函数声明3.1、当函数表达式和函数一样的情况四、总结一、全局变量的时候规则(1)、在执行前提取script里面的所有全局变量，但是只是声明，不赋值（2）、提升function,函数的提升是直接将整个函数整体提升到作用域的最开始位置，相当于剪切过去的样子（3）明提升到它所在作用域的顶端去执行，到我们代码所在的位置来赋值。<script> console.log(num1); console.log(f
2020-12-13 11:03:12
355
原创 JavaScript的+号
情况一：字符串+数字当加号的两边，只要有一个是字符串的时候，就会调用 String() 函数将数字转为字符串，然后再计算。导致最终的运算结果是字符串。情况二：Boolean+数字Boolean 型和数字型相加时， true 按 1 来算 ，false 按 0 来算。这里其实是先调 Number() 函数，将 Boolean 类型转换为 Number类型，然后再和 数字相加。情况三：null+数字等价于 0+数字情况四：undefined+数字计算结果：NaN...
2020-12-09 14:13:34
618
原创 JavaScript变量之间转换，以及隐式转换
文章目录一.类型转换分为二 其他的简单类型转化为String2.1 隐式类型转换:字符串拼接2.2.调用toString()方法2.3.强制转换使用String()函数三.其他的数据类型转化为Number(重要)3.1.Number()函数3.1.1.字符串转数字3.1.2.布尔转为数字3.1.3.null转数字3.1.4.undefined转为数字3.2.parseInt()函数:字符串---数字3.2.1 字符串--数字总结Number() 函数和 parseInt() 函数的区别：3.2.2.pars
2020-12-09 14:09:40
630
原创 JavaScript里面的自增和自减问题
一、自增自减1.1、自增 ++a,a++(自减同理)(1),原变量不管是先增还是后增，都会使得原变量增/减1var a=10,b=10;a++;++b;alert(a);//11alert(b);//11(2)不同的是,在赋值的时候使用a++这个表达式是把a的赋值给表达式，然后再自己自增++a是先自己自增，自增后再赋值给表达式<script> var a=10,b=10; c=a++; d=++b; alert(c);//10 a
2020-12-09 14:02:36
1006
原创 html标签面试总结
文章目录一、本文主要内容二、html 的常见元素2.1、head 区域的 html 元素2.2、html 元素（body 区域）2.4、html 文档的大纲2.5、查看网页大纲的工具三、 html 元素的分类四、html 元素的嵌套关系五、 html 元素的默认样式和 CSS Reset5.1 常见的 CSS Reset 方案5.2、 Normalize.css六、 html 常见面试题6.1、 doctype 的意义是什么6.2、 HTML、XHTML、HTML5的区别6.3、 HTML5 有什么新的变化
2020-12-07 22:51:04
470
原创 HTML5的语义标签
文章目录一、HTML5介绍二、语法规范2.1、语法规范特点：三、新增的语义和结构元素3.1、语义化的作用3.3、语义化常用的标签一、HTML5介绍是一个新的版本定义了一系列新元素，语义标签，智能表单，多媒体标签，可以帮助开发创建富互联网应用，还提供了一系列js API，如地理定位，重力感应，硬件访问。甚至可以结合canvas开发网页版游戏同时结合CSS3的过渡，转换，动画等特性，可以极大的增强用户体验，提升开发功能的可应用性日常讨论的H5其实是一个泛指，它指的是H5+C3+js等技术组合而成
2020-12-07 10:23:47
304
原创 CSS3新增得flex伸缩布局
文章目录一、背景介绍二、伸缩容器概念2.1、概念介绍2.2、排列：三、伸缩容器属性详解(父元素上)3.1、flex-direction伸缩布局的排列方式 (给父元素设置)3.2、flex-wrap属性控制是否换行（给父元素设置）flex-flow属性是flex-direction属性和flex-wrap属性的简写形式，默认值是row nowrap3.3、最值（设置伸缩的最大或最小值）（给父元素添加）3.4、justify-content调整主轴（水平）对齐--设置布局的样子（给父盒子设置）3.5、alig
2020-12-04 19:00:22
381
2
原创 CSS3得2D学习只是
文章目录一、CSS3转换二、浏览器兼容三、2d转换如何使用3.1、translate（X,Y）使得元素平移3.2、roate（度数）实现元素旋转3.3、scale(x轴，有轴缩放)实现元素缩放，让元素根据中心原点对对象进行缩放，默认值为13.4、skew()函数让元素倾斜3.5、matrix（）方法------把2D得方法合为一3.6、transfrom-origin用来定义旋转中心点四、案例一、CSS3转换CSS3转换可以对元素进行移动、缩放、转动、拉长或拉伸二、浏览器兼容1）Internet
2020-12-03 15:15:23
95
原创 display和visiblity
/*display隐藏元素，不是删除，只是看不见，元素一直在页面，但是他不保留位置，block显示*/display: none;/*隐藏元素，他和上面的区别是他保留位置，visible为显示*/visibility: hidden;
2020-12-01 12:49:53
357
原创 页面布局，浮动以及定位
一、盒模型什么是盒模型？（1）css盒子模型仅仅是一个比喻，HTML中所有的标签都是盒子（2）就是在HTML中所有标签都可以设置（3）宽度/高度：指可以存放内容的区域（4）内边距：内容与边框的距离-填充物（5）边框：（6）外边距：盒子与盒子之间的距离盒子的宽度有不同的宽度（1）盒子宽度和高度–1、内容的宽度和高度就是通过标签的width/height属性设置的宽度和高度–2、元素的宽度和高度宽度=左边框+width+右内边距+右边框高度一样–3、元素空间的宽度和高度宽
2020-12-01 12:29:29
651
原创 margin知识总结（子元素margin-top与父元素一起下移动）
一、margin属性1、首先它是盒模型得外边距属性，有上下左右2、左右主要是使得不同盒子之间留有一定得空隙使得更美观二、margin得应用2.1、在同级元素之间得应用两个水平方向的盒子相遇，那么最终两者之间的距离为左边盒子的右外边距和右边盒子的做外边距之和。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title<
2020-11-29 17:55:06
1872
原创 表单控件
<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"></head><body><!-- <input /> 我们的input是一个单标签 br hr img base input -->用户名: <input type="text" value="派克钢笔" /> <!-- 这是.
2020-11-24 11:48:38
105
原创 学习前端的首要问题,什么是HTML,CSS,JavaScript
一、什么是HTML,CSS,JavaScriptHTML（Hyper Text Markup Language）：超文本标记语言，记住他的作用是标记（就类似于我们平时做笔记对重点位置进行高亮，他的作用差不多就是这个样子），和我们学的编程语言不是一个东西（对不懂编程的就忽略）CSS（Cascading Style Sheet）：俗称层叠样式表，专用来美化html标签JavaScript(简称js)：JavaScript是web的编程语言，所有现代的HTML页面都使用的是js，JavaScript是一种
2020-11-18 10:55:25
192
原创 web学习-----浏览器和服务器1
HTML基础—基本概念一、什么是浏览器？电脑软件功能：1）将网页渲染出来给用户查看2）能够让用户通过浏览器和网页进行交互的软件常见浏览器都有各自的渲染内核，就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页内容，以及页面格式信息二、什么是服务器？高配置计算机，24h不断电，不关机功能：存储数据三、访问网页原理打开浏览器输入想要访问的页面，浏览器会自动创建一些文件夹，这个文件夹和当前被打开的网页有一定的关系，这些文件夹称为缓存文件夹，缓存文件夹是专门用于存储网页数据
2020-11-08 22:50:25
260
原创 git add . 的时候遇到warning: LF will be replaced by CRLF in ...... 解决办法
https://blog.csdn.net/wxl1555/article/details/53033739
2019-12-09 22:49:15
206
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人