- 博客(42)
- 收藏
- 关注
RSS订阅原创 Vue 之 生命周期
又名： 生命周期回调函数、生命周期函数、生命周期钩子是Vue在关键时刻帮助我们调用的一些特殊名称的函数vue的生命周期就是从创建到销毁的过程中，在某个特定的时间点自动执行的函数，有8个生命周期函数：beforeCreate，Create，beforeMount，Mounted，beforeUpdate，Update，beforeDestory，destoryed生命周期函数中的this指向是vm 或 组件实例对象生命周期函数的名字不可更改（mounted），但函数的具体内
2022-09-14 06:28:08
321
2
原创 Vue指令
局部指令new Vue({directives:{指令名：配置对象}})new Vue ({directives（指令名，回调函数）})全局指令Vue.directive（指令名，配置对象）Vue.directive（指令名，回调函数）2. 配置对象中常用的3个回调bind： 指令与元素成功绑定时调用inserted： 指令所在元素被插入页面时调用update：指令所在模板结构被重新解析式调用指令定义时不加v-，但是使用时要加v-指令名如果是多个单词，要使用。
2022-09-05 22:23:51
343
原创 Vue之绑定样式和渲染、收集表单数据、过滤器
1. 虚拟DOM中key的作用：key是虚拟DOM对象的标识，当数据发生变化时，Vue会根据【新数据】生成【新的虚 拟DOM】,随后Vue进行【新虚拟DOM】与【旧虚拟DOM】的差异比较2.对比规则：(1).旧虚拟DOM中找到了与新虚拟DOM相同的key： ①.若虚拟DOM中内容没变, 直接使用之前的真实DOM！ ②.若虚拟DOM中内容变了, 则生成新的真实DOM，随后替换掉页面中之前的真实 D...
2022-09-02 12:58:12
583
原创 Vue基础知识——数据绑定、数据代理
Vue是一套用于构建用户界面的渐进式JavaScript框架Vue可以自底向上逐层的应用简单应用：只需一个轻量小巧的核心库复杂应用：可以映入各式各样的Vue框架。
2022-08-30 14:43:17
402
原创 Git分支管理
💐Per aspera ad astra 循此苦旅，以觅繁星💐🌑 分支的概念分支就是科幻电影里面的平行宇宙,当你正在电脑前努力学习Git的时候，另一个你正在另一个平行宇宙里努力学习SVN。如果两个平行宇宙互不干扰，那对现在的你也没啥影响。不过,在某个时间点，两个平行宇宙合并了，结果,你既学会了Git又学会了SVN!在进行多人协作开发的时候，为了防止互相干扰，提高协同开发的体验,建议每个开发者都基于分支进行项目功能的开发🌒master主分支。......
2022-08-12 10:25:05
262
1
原创 Github的了解和使用
开源即开放源代码（Open source code）代码是公开的，任何人都可以查看，修改和使用开源代码软件的代码是封闭的，只有作者能看到闭源软件的代码，只有作者泵对源代码进行修改开源并不意味着完全没有限制，为了限制使用者的使用范围和保护作者的权利，每个开源项目都应该遵守开源许可协议（Open Source License）常见的5种开源许可协议🔸具有传染性的一种开源协议，不允许修改后和衍生的代码作为比原的商业软件发布和销售使用GPL的最著名的软件项目是：Linux🔸。......
2022-08-10 14:41:07
2107
1
原创 【Git】一起来了解一下版本控制系统吧
Git是一个开源的分布式版本控制系统，是目前世界上最先进，最流行的版本控制系统。可以快速高效的处理从很小到非常大的项目版本管理特点：项目越大越复杂，协同开发者越多，越能体现Git的高性能和高可用性。......
2022-08-09 11:24:34
285
1
原创 带你认识npm和yarn
npm（全称Node Package Manager 即node包管理器）是Node.js默认的，以JavaScript编写的软件包管理系统，npm拥有超过一百万个软件包，是世界上最大的软件注册表npm来分享和使用代码已经成为了前端的标配官网：http://www.npmjs.com 👉 搭建环境是通过如下代码将npm设置成淘宝镜像 👉 设置当前地址（设置为默认地址）👉 查看镜像的配置结果👉 使用 nrm工具切换淘宝源👉 如果之后需要切换回官方源可使用👉 也可以使用淘宝定制的cnpm...
2022-08-07 10:49:20
448
4
原创 HTTP协议详解
通信就是信息的传递和交换通信三要素主体内容方式我们通过一个案例来分辨通信三要素。服务器把你的简介通过响应的方式发送给客户端浏览器服务器和客户端浏览器：是通信的主体你的简介：是通信的内容响应：是通信的方式通信协议：是指通信的双方完成通信所必须遵守的规则和约定通俗的来讲就是：通信双方采用约定好的格式来发送和接收消息，这种事先约定号的通信格式，就叫做通信协议。...
2022-08-06 16:52:58
388
3
原创 【Ajax】实现网页与服务器之间的数据交互
全称 Asynchronous javascript And XML(异步JavaScript 和XML)通俗的理解： 在网页中来利用XMLHttpRequest对象和服务器进行数据交互的方式，就是 AjaxAjax能让我们轻松实现网页于服务器之间的数据交互表单在网页中主要负责数据采集功能html中的标签，就是用于采集用户输入的信息，并通过标签的提交操作，把采集到的信息提交到服务器端进行处理axios是专注于网络数据请求的库相比于原生的XMLHttpRequest对象，axios简单易用。...
2022-08-04 14:51:22
2522
7
原创 一文搞懂ES6基本全部语法
name'张三'}functionfn(){//this指向是obj对象return()=>{//this指向的是箭头函数定义的位置，那么这个箭头函数定义在fn里面，而这个fn指向是的obj对象，所以这个this也指向是obj对象}}constresFn=fn.call(obj);resFn();...
2022-07-28 14:55:04
2455
2
原创 正则表达式
正则表达式（RegularExpression）是用于匹配字符串中字符组合的模式。在JavaScript中，正则表达式也是对象。1.大括号量词符.里面表示重复次数2.中括号字符集合。匹配方括号中的任意字符.3.小括号表示优先级预定义类指的是某些常见模式的简写方式.预定类说明\d匹配0-9之间的任意数字，相当于[0-9]\D匹配0-9之外的任意字符，相当于[^0-9]\w匹配任意字母，数字，下划线，相当于[A-Za-z0-9_]\W表单验证案例//手机号验证。...
2022-07-27 14:56:35
121
1
原创 递归方法实现最大公约数
最大公约数最大公约数最大公因数，也称最大公约数、最大公因子，指两个或多个整数共有约数中的一个、、、等接下来我们以辗转相除法为例子来求两个数的最大公约数。
2022-07-26 20:40:44
1395
1
原创 this指向问题，闭包以及递归
递归如果一个函数在内部可以调用其本身，那么这个函数就是递归函数。函数内部自己调用自己,这个函数就是递归函数递归函数的作用和循环效果一样，由于递归很容易发生“栈溢出”错误（stackoverflow），所以必须要加退出条件return。...
2022-07-26 18:36:11
188
1
原创 基于echarts+js+fexible.js实现的数据可视化适配案例（附源代码）
数据可视化 ：借助于图形化手段，清晰有效地传达与沟通信息ECharts：是一个使用JavaScript实现的开源可视化库，可以流畅的运行在PC和移动设备上，兼容当前绝大部分浏览器，底层依赖矢量图形库ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。数据可视化场景：ECharts使用五部曲：步骤一：下载并引用echarts.js文件:https://echarts.apache.org/zh/index.html步骤二：准备一个具备大小的DOM容器步骤三：初始化echarts实例
2022-07-25 16:25:51
795
1
原创 来get一个超实用的小页面——todolist
顾名思义就是列出要做事情的清单，依次去完成。规划好要做的事情，有条理清楚的展现出未完成或者已完成的事情，是有助于提高我们做事的效率以及如何安排做事的顺序。接下来就一起来完成这个页面吧。...
2022-07-21 19:36:11
495
2
原创 想要更加方便完成DOM操作，事件处理，动画设计吗？我带来了一个小伙伴——jQuery
jQuery是一个快速简洁的JavaScript库jQuery封装了JavaScript常用的功能代码，优化了DOM操作，事件处理。动画设计和Ajax交互优点官网地址 ：http://jquery.com/DOM加载完毕再去执行js代码相当于原生js’中的DOMContentLoaded3. jQuery的顶级对象 $$是jQuery的别称$ 也是jQuery的顶级对象jQuery对象和DOM对象用原生js获取的对象就是DOM对象jQuery方法获取的元素就是jQuery对象
2022-07-20 15:35:24
188
1
原创 童年的回忆小游戏来了——贪吃蛇，快来自己动手写一个属于自己的小游戏吧
在我的记忆里，小时候经常趁父母不在家的时候，偷偷拿爷爷奶奶的手机玩贪吃蛇，推箱子等游戏，这是童年记忆里的游戏。现在我已经好久没有玩过这个游戏了，但是！！！马上就可以拥有一个独一无二是属于自己的贪吃蛇了，快来和博主一起动手设计这个简易的贪吃蛇游戏吧一个大盒子.bigBox宽高都为640px(可以跟随自己的想法设置)属性有宽20px、高20px属性宽20px、高20px、direction（蛇头的方向）right（初始方向）属性宽20px、高。...
2022-07-20 11:16:40
1433
1
原创 项目一：小米官网
这个项目是模仿小米官方网站而展开设计的，其目的是为了锻炼html+css+javascript综合知识的使用本项目需结合HTML+CSS+JS等技术进行开发的一个综合项目。
2022-07-19 21:12:15
514
1
原创 BOM浏览器对象模型（下篇）—— offset、client、scroll三大家族、插件及本地存储特性(案例：仿京东放大镜、模态框拖拽)
offset 翻译过来就是偏移量， 我们使用 offset系列相关属性可以动态的得到该元素的位置（偏移）、大小等。获得元素距离带有定位父元素的位置获得元素自身的大小（宽度高度）注意：返回的数值都不带单位常用属性offset 可以得到任意样式表中的样式值offset 系列获得的数值是没有单位的offsetWidth 包含padding+border+widthoffsetWidth 等属性是只读属性，只能获取不能赋值style 只能得到行内样式表中的样式值style.width 获得的是带有单位的字符串st
2022-07-19 17:15:08
306
1
原创 BOM浏览器对象模型（上篇）——概述、window对象常见事件、JS执行机制（5秒后关闭广告、倒计时案例、发送短信倒计时案例）
window对象给我们提供了一个location属性用于获取或设置窗体的url，并且可以用于解析url，因为这个属性返回的是一个对象，也称这个属性为location对象。
2022-07-19 16:09:35
124
1
原创 DOM对象(三) ——DOM总结和 事件高级、事件对象、DOM事件流、常用鼠标事件及常用键盘事件
文档对象模型（Document Object Model，简称DOM），是 W3C 组织推荐的处理可扩展标记语言（html或者xhtml）的标准编程接口。W3C 已经定义了一系列的 DOM 接口，通过这些 DOM 接口可以改变网页的内容、结构和样式。主要修改dom的元素属性，dom元素的内容、属性、表单的值等主要获取查询dom的元素主要针对自定义属性接下来我们来整理事件操作。特点方法监听注册方式特点该方法的三个参数方法监听注册方式事件流描述的是从页面中接受事件的顺序事件发生时会在元素节点之间按照特定
2022-07-14 15:26:50
561
1
原创 DOM对象（二）——排他思想、节点操作、换肤案例 , 下拉菜单,简单版发布留言及表格变色案例
如果有同一组元素，我们想要某一个元素实现某种样式， 需要用到循环的排他思想算法：所有元素全部清除样式（干掉其他人）给当前元素设置样式 （留下我自己）注意顺序不能颠倒，首先干掉其他人，再设置自己换肤案例案例分析：表格变色案例思路分析：自定义属性的操作获取属性值区别设置属性值网页中的所有内容都是节点（标签、属性、文本、注释等），在DOM 中，节点使用 node 来表示。 HTML DOM 树中的所有节点均可通过 JavaScript 进行访问，所有 HTML 元素（节点）均可被修改，也可以创建或删
2022-07-14 10:54:35
199
1
原创 DOM对象（一）——DOM对象介绍、获取元素、事件和样式操作（包括案例：仿京东显示密码 点击关闭二维码等）
## 常见的鼠标事件 |鼠标事件| 触发条件 ||--|--|| onclick | 鼠标点击左键触发 || onmouseover |鼠标经过触发 || onmouseout | 鼠标离开触发 || onfocus |获得鼠标焦点触发 ||onblur |失去鼠标焦点触发 ||onmousemove | 鼠标移动触发 ||onmouseup | 鼠标弹起触发 ||onmousedown |鼠标按下触发 |...
2022-07-14 10:02:46
1010
1
原创 JavaScript函数和对象——创建函数，对象以及JavaScript的内置对象
函数：就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用。function 是声明函数的关键字,必须小写由于函数一般是为了实现某个功能才定义的， 所以通常我们将函数名命名为动词，比如 getSum函数声明有两种方式自定义函数方式(命名函数)利用函数关键字 function 自定义函数方式因为有名字，所以也被称为命名函数调用函数的代码既可以放到声明函数的前面，也可以放在声明函数的后面函数表达式方式(匿名函数）利用函数表达式方式的写法如下：因为函数没有名字，所
2022-07-13 21:28:14
345
1
原创 Bootstrap使用插件时jQuery.min.js文件的导入方法
这几天在使用bootstrap框架的插件时突然忘记了jQuery文件时怎么导入的，接下来就详细讲解以下导入过程。
2022-07-08 14:55:12
2026
3
原创 JavaScript基础语法——继续深入了解js吧（变量、数据类型、循环）
在一个程序执行的过程中，各条代码的执行顺序对程序的结果是有直接影响的。很多时候我们要通过控制代码的执行顺序来实现我们要完成的功能。简单理解：流程控制就是来控制代码按照一定结构顺序来执行流程控制主要有三种结构，分别是顺序结构、分支结构和循环结构，代表三种代码执行的顺序。...
2022-07-05 15:40:43
192
2
原创 JavaScript初篇——带你走进js的世界
JavaScript 是世界上最流行的语言之一，是一种运行在客户端的脚本语言 （Script 是脚本的意思）脚本语言：不需要编译，运行过程中由 js 解释器( js 引擎）逐行来进行解释并执行现在也可以基于 Node.js 技术进行服务器端编程...
2022-07-05 11:50:26
302
2
原创 移动web网页开发——项目：生活资讯网（响应式开发）
前两篇内容讲述了流式布局，flex布局，rem适配布局，响应式布局四种布局页面，今天我们就以学习的内容来完成项目“生活资讯网”的设计。我们在设计开发生活资讯网可以选择的开发方式很多，如以下几种：流式布局（百分比布局）flex布局（伸缩盒布局）rem适配布局（rem单位+媒体查询+less 或 flexible.js+rem单位）响应式布局(纯响应式布局)Bootstrap+响应式布局这边我选择的是Bootatrap+响应式布局来完成的。...
2022-06-29 11:45:35
714
1
原创 移动web网页开发（下篇）——rem适配布局和响应式布局开发
栅格系统英文为"grid systems" ,也有人翻译为"网格系统” 。它是指将页面布局划分为等宽的列,然后通过列数的定义来模块化页面布局。Bootstrap提供了一套响应式、移动设备优先的流式栅格系统,随着屏幕或视口( viewport )尺寸的增加,系统会自动分为最多12列。Bootstrap里面container宽度是固定的,但是不同屏幕下, container的宽度不同,我们再把container划分为12等份...
2022-06-27 11:46:19
315
2
原创 移动web网页开发（上篇）——流式布局（百分比布局）和Flex弹性布局
前面我们学习的一直都是pc端的页面布局，也称为传统布局。传统布局的优点在于兼容性好，但它局限性除了布局繁琐外，在移动端不能很好的布局。为了解决这个问题就出现了两个xuanze——单独制作移动端的页面和响应式页面。单独制作移动端页面可以分为流式布局（百分比布局），flex弹性布局，less+rem+媒体查询布局，混合布局。...
2022-06-09 16:45:15
1231
7
原创 CSS3新增属性——过渡和动画（2D属性，3D动画）
目录CSS3一、过渡1. 属性2. 花费时间3. 运动曲线4. 何时开始二、2D属性 2. translate（移动）2. rotate（旋转）3. scale（缩放）4. transform-origin（转换中心点）综合写法三、动画 1. 动画的使用1）.定义动画（keyframes）2） 元素使用动画 2. 动画序列3. 动画属性4. 动画属性简写四、3D动画 1. 三维坐标系 2. 3D移动 translate3d3. 透视 perspective 4. 3D旋转5. 3D呈现 （tran
2022-06-07 20:22:17
2922
3
原创 CSS3新增属性——新增选择器（属性选择器、结构伪类选择器、伪元素选择器）
结构伪类选择器主要根据文档结构来选择器元素,常用于根据父级选择器里面的子元素 效果图E[att="val"] 效果图： E[att^="val"] 效果图： E[att$="val"] 效果图： E[att*="val“]效果图： 结构伪类选择器主要根据文档结构来选择器元素,常用于根据父级选择器里面的子元素 E:firs...
2022-06-06 17:55:06
1180
6
原创 CSS技巧和进阶——让布局更漂亮
目录一、CSS技巧1.精灵图2. 字体图标3.css三角二、CSS进阶1.CSS用户界面样式2.vertical-align属性应用3.单行文本溢出显示省略号一、CSS技巧1.精灵图一个网页中往往会应用很多小的背景图像作为修饰,当网页中的图像过多时,服务器就会频繁地接收和发送请求图片,造成服务器请求压力过大,这将大大降低页面的加载速度。为了有效地减少服务器接收和发送请求的次数,提高页面的加载速度,出现了CSS精灵技术(也称CSS Sprites、...
2022-06-02 17:09:28
345
3
原创 字体图标的下载和引用、问题解决——保姆级教程
字体图标字体图标其实就是显示网页中通用的小图标，它的本质属于字体优点轻量级:-一个图标字体要比一 系列的图像要小。一 旦字体加载了,图标就会马上渲染出来,减少了服务器请求 灵活性:本质其实是文字,可以很随意的改变颜色、产生阴影、透明效果、旋转等 兼容性:几乎支持所有的浏览器请放心使用注意:字体图标不能替代精灵技术,只是对工作中图标部分技术的提升和优化。字体图标的下载作者这边推荐两个网站可以去下载字体图标字体图表的下载icomoon字库 ...
2022-05-30 10:44:14
540
4
原创 定位及元素的显示和隐藏
一、定位将盒子定在某一个位置 ,所以定位也是在摆放盒子，按照定位的方式移动盒子。定位由 定位模式+边偏移组成，接下来先来了解定位模式。1.定位模式position属性position属性用于指定一个元素在文档中的定位方式。static 静态定位 relative 相对定位 absolute 绝对定位 fixed 固定定位 sticky 粘性定位 static静态定位默认定位方式，无定位的意思。按标准流特性摆放位置，没有边偏移.
2022-05-27 11:31:09
1241
5
原创 浮动的影响及解决方法
一、浮动浮动的元素会脱离标准流，不会再保留原先的的位置；浮动的元素会在一行内显示并根据元素顶部对齐，浮动的元素是互相贴靠在一起（没有缝隙），如果父级宽度装不下这些浮动的盒子，多出的盒子会另起一行对齐；浮动的元素会具有行内块元素的特性。浮动的典型应用：让多个块级元素一行内排列显示浮动的准则：第一准则：多个块级元素纵向排列找标准流，多个块级元素横向排列找浮动 第二准则：先设置盒子大小，之后设置盒子位置举例：<!DOCTYPE html><html lang="en.
2022-05-23 19:00:39
1531
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人