- 博客(36)
- 收藏
- 关注
RSS订阅原创 Vue简介
Vue介绍什么是Vue?一套用于构建用户界面的渐进式javascript框架渐进式：自底向上增量开发的设计vue特点：采用组件化模式，提高代码复用率，且让代码更好的维护声明式编码，让编码人员无需直接操作DOM，提高开发效率使用虚拟DOM+优秀的Diff算法，尽量复用DOM节点MVVM模型vue 是 MVVM 模式的框架Vue实例想让Vue工作，就必须创建一个Vue实例，且要传入一个配置对象<div id="root"></div> <scr
2022-04-26 16:26:44
643
原创 git和github的使用
git和github的使用git什么是gitgit基本操作github什么是github分支的概念github分支·基本使用git什么是gitGit是一个开源的分布式版本控制系统，是目前世界上最先进、最流行的版本控制系统。可以快速高效地处理从很小到非常大的项目版本管理特点： 项目越大越复杂，协同开发者越多，越能体现出Git的高性能和高可用性!git的特性：Git之所以快速和高效，主要依赖于它的如下两个特性:1.直接记录快照，而非差异比较2.近乎所有操作都是本地执行git中的三个区域：
2022-04-12 16:25:56
330
4
原创 npm是什么东西
npm什么是npmnpm的安装和使用安装基本使用yarnyarn是什么？yarn的基本使用yarn的优点什么是npmnpm (全称Node PackageManager，即node包管理器)是Node.js默认的、以JavaScript编写的软件包管理系统npm来分享和使用代码已经成了前端的标配npm 是 JavaScript 世界的包管理工具,并且是 Node.js 平台的默认包管理工具，也是世界上最大的软件注册表，里面包含超过600000 个 包的结构，能够使您轻松跟踪依赖项和版本。np
2022-04-11 11:25:56
18916
3
原创 了解HTTP
HTTPHTTP协议简介通信HTTP协议HTTP请求消息HTTP请求消息的组成部分HTTP响应消息HTTP响应消息的组成部分HTTP请求方法HTTP响应状态码HTTP响应状态码的组成及分类HTTP协议简介通信什么是通信？通信，就是信息的传递和交换什么是通信协议通信协议是指通信的双方完成通信所必须遵守的规则和约定。通俗的理解：通信双方采用约定好的格式来发送和接收消息，这种事先约定好的通信格式，就叫做通信协议HTTP协议什么是HTTP协议网页内容又叫做超文本，因此网页内容的传输协议又
2022-04-09 10:28:35
353
2
原创 了解Ajax
Ajax什么是AjaxjQuery中的Ajax$.get()函数的语法$.post()函数的语法$.ajax()函数的语法接口接口测试工具接口文档什么是AjaxAjax的全称是 Asynchronous Javascript And XML (异步JavaScript和XML)。通俗的理解:在网页中利用XMLHttpRequest对象和服务器进行数据交互的方式，就是Ajax。为什么要学习Ajax?Ajax能让我们轻松实现网页与服务器之间的数据交互Ajax实际上是下面这几种技术的融合：(1)
2022-04-08 18:09:35
1247
原创 es6-ES6新增语法&内置对象拓展
ES6语法ES6新增语法letES6中新增了用于声明变量的关键字let声明的变量只在所处于的块级有效 if (true) { let a = 10; }console.log(a) // a is not defined**注意：**使用let关键字声明的变量才具有块级作用域，使用var声明的变量不具备块级作用域特性。不存在变量提升console.log(a); // a is not defined let a = 20;暂时性死区利用let声明的变量会绑定在这个
2022-03-31 09:29:45
156
原创 正则表达式
正则表达式1.正则表达式概述1.1什么是正则表达式正则表达式（ Regular Expression ）是用于匹配字符串中字符组合的模式。在JavaScript中，正则表达式也是对象。正则表通常被用来检索、替换那些符合某个模式（规则）的文本，例如验证表单：用户名表单只能输入英文字母、数字或者下划线， 昵称输入框中可以输入中文(匹配)。此外，正则表达式还常用于过滤掉页面内容中的一些敏感词(替换)，或从字符串中获取我们想要的特定部分(提取)等 。其他语言也会使用正则表达式，本阶段我们主要是利用Java
2022-03-26 09:50:16
110
原创 如何制作边框图片
如何制作边框图片在CSS3中，新增了border-image属性，这个新属性允许指定一副图像作为元素的边框。上面这张图片的边框样式很好看，但是用CSS很难写出来，所以CSS3就新增了border-image属性，专门用来写边框图片。边框图片的切割原理想要制作边框图片，首先要做的就是把图片进行切割。切割图片就是把一张图片的四个角切出去，用来作为边框图片的样式。切割图片遵循：上—>右—>下—>左 的顺序。并且，切图的大小要能保证四个角的完整性代码示例<s
2022-03-26 09:36:32
654
原创 闭包和递归
闭包5.闭包5.1变量的作用域复习变量根据作用域的不同分为两种：全局变量和局部变量。函数内部可以使用全局变量。函数外部不可以使用局部变量。当函数执行完毕，本作用域内的局部变量会销毁。5.2什么是闭包闭包（closure）指有权访问另一个函数作用域中变量的函数。简单理解就是 ，一个作用域可以访问另外一个函数内部的局部变量。[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-KL7Cj23u-1648255915846)(images/img3.png)]5.3
2022-03-26 09:02:17
313
原创 严格模式介绍
严格模式介绍1.严格模式1.1什么是严格模式JavaScript 除了提供正常模式外，还提供了严格模式（strict mode）。ES5 的严格模式是采用具有限制性 JavaScript变体的一种方式，即在严格的条件下运行 JS 代码。严格模式在 IE10 以上版本的浏览器中才会被支持，旧版本浏览器中会被忽略。严格模式对正常的 JavaScript 语义做了一些更改：1.消除了 Javascript 语法的一些不合理、不严谨之处，减少了一些怪异行为。2.消除代码运行的一些不安全之处，保证代码运
2022-03-26 08:51:37
968
原创 函数内部this指向
函数内部指向函数内部的this指向1.普通函数this的指向2.对象方法的函数this的指向3.构造函数this的指向4.绑定事件函数this的指向5.定时器函数this的指向6.立即执行函数this的指向改变函数内部的this指向call方法apply方法bind方法call、apply、bind三者的异同函数内部的this指向this的指向是根据调用者来确定的，调用的方式不同，this的指向不同1.普通函数this的指向 //1.普通函数 this指向window functio
2022-03-25 10:39:23
170
原创 Echarts介绍
Echarts介绍介绍Echarts-使用Echarts-基础配置拓展--边框图片介绍ECharts，一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。大白话：是一个JS插件性能好可流畅运行PC与移动设备兼容主流浏览器提供很多常用图表，且可定制。Echarts-使用
2022-03-17 14:29:23
438
2
原创 jQuery（下）
jQuery下1.1. jQuery 事件注册1.2. jQuery 事件处理1.2.1 事件处理 on() 绑定事件1.2.3. 事件处理 off() 解绑事件1.2.4. 事件处理 trigger() 自动触发事件1.3. jQuery 事件对象1.4. jQuery 拷贝对象1.5. jQuery 多库共存1.6. jQuery 插件1.4.1. 瀑布流插件1.4.2. 图片懒加载插件1.4.3. 全屏滚动插件1.4.4. bootstrap组件1.4.5. bootstrap插件（JS）1
2022-03-14 20:29:59
350
1
原创 jQuery（中）
1.1. jQuery 属性操作1.1.1 元素固有属性值 prop() 所谓元素固有属性就是元素本身自带的属性，比如 元素里面的 href ，比如 元素里面的 type。 注意：prop() 除了普通属性操作，更适合操作表单属性：disabled / checked / selected 等。1.1.2 元素自定义属性值 attr() 用户自己给元素添加的属性，我们称为自定义属性。 比如给 div 添加 index =“1”。 注意：attr() 除了普通属性操作，更适合操作自
2022-03-11 19:32:20
79
1
原创 jQuery（上）
1.1. jQuery 介绍1.1.1 JavaScript 库 JavaScript库：即 library，是一个封装好的特定的集合（方法和函数）。从封装一大堆函数的角度理解库，就是在这个库中，封装了很多预先定义好的函数在里面，比如动画animate、hide、show，比如获取元素等。简单理解： 就是一个JS 文件，里面对我们原生js代码进行了封装，存放到里面。这样我们可以快速高效的使用这些封装好的功能了。 常见的JavaScript 库：jQuery、Prototype、YUI、Doj
2022-03-09 18:56:53
98
原创 JS贪吃蛇
JS贪吃蛇效果展示CSS样式index.htmlindex.css构造方格蛇的创造蛇的初始化蛇的运动创建和生成食物创建游戏逻辑按下键盘方向键控制蛇移动方向定时器开始游戏暂停游戏结束游戏效果展示CSS样式index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content=
2022-03-04 16:47:25
2631
1
原创 2021年度总结
2021年度总结时间是一张白纸，我们是执笔者，也是纸上人。2021于我而言是很重要的一年，可以说收获满满。或许是到了大四，心里有种莫名的紧张感，压力无形中被放大，促使我开始思考未来。但是思考了好像并没有用，未来依旧迷雾重重，看不到方向。所以，上半年的我有些颓废。但是，生活不可能一成不变，人也不会一直颓废，在压力驱使下，我开始静下心来认真学习，于是，我感觉一切好像没那么糟糕。甚至，还能感到些许快乐仿佛，还看到了美好的未来。也许，对未来的迷茫，只是因为自己不够优秀。我们必须一直往前走，才
2022-01-22 18:41:51
202
1
原创 仿小米官网—文本框的提示文字
仿小米官网—文本框的提示文字方法一：value方法value方法示例：方法二：placeholder方法方法三：定位方法当我们做文本框时，为了让文本框不那么单调，我们会在文本框中提前加入提示文字。我总结了以下三个方法。方法一：value方法<input type="text" name="" id="" value="这是一个文本框">value方法示例：value方法有很明显的缺点，就是当文本框获得鼠标焦点的时候，提示文字不会自动删除。如果想要获得鼠标焦点时提示文字自动删除，需
2022-01-09 15:25:58
721
1
原创 offset、client、scroll三大系列
offset、client、scroll三大系列元素偏移量 offsetoffset 概述 ：offset 作用offset属性元素可视区 clientclient概述client属性元素滚动 scrollscroll 概述scroll 属性总结主要用法元素偏移量 offsetoffset 概述 ：offset 翻译过来就是偏移量， 我们使用 offset系列相关属性可以动态的得到该元素的位置（偏移）、大小等。offset 作用获得元素距离带有定位父元素的位置获得元素自身的大小（宽度高度）注
2021-12-30 15:25:40
86
1
原创 涨粉小技巧
CSDN涨粉小技巧一级目录二级目录三级目录一级目录你是否为了没有粉丝深夜买醉呢？是否因为没有粉丝感觉没面子呢？这都不是问题！！！！今天本博主教你涨粉小技巧，本人亲测，真实有效二级目录三级目录...
2021-12-15 11:02:18
1148
7
原创 作用域和变量的作用域
作用域和变量的作用域作用域概述全局作用域局部作用域变量的作用域全局变量小结局部变量小结作用域链概述注意点作用域概述通常来说，一段程序代码中所用到的名字并不总是有效和可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突。全局作用域作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件。 <script> //2.js的作用域（es6之前） //3.
2021-12-10 10:11:04
137
4
原创 用JS打印三角形
打印三角形用"*"打印一个三角形用"*"打印一个倒三角形用"*"打印一个菱形用"*"打印一个三角形核心思想：双重for循环外层for循环起到换行的作用，内层for循环是打印"*"的作用 var str2 = ''; for (var i = 1; i <= 6; i++) { for (var j = 1; j <= i; j++) { str2 = str2 + '*'; }
2021-12-07 19:23:25
3513
3
原创 less基础
less基础less介绍维护css弊端less使用Less 使用之变量Less 嵌套Less 运算less介绍Less（LeanerStyle Sheets 的缩写）是一门 CSS扩展语言，也成为CSS预处理器。做为 CSS的一种形式的扩展，它并没有减少CSS的功能，而是在现有的CSS语法上，为CSS加入程序式语言的特性。它在CSS 的语法基础之上，引入了变量，Mixin（混入），运算以及函数等功能，大大简化了 CSS 的编写，并且降低了 CSS的维护成本，就像它的名称所说的那样，Less可以让我们
2021-11-26 15:21:09
406
原创 移动WEB开发之响应式布局
移动WEB开发之响应式布局响应式开发原理响应式布局容器Bootstrap简介bootstrap优点bootstrap栅格系统栅格嵌套响应式工具响应式开发原理响应式开发原理就是使用媒体查询针对不同宽度的设备进行布局和样式的设置，从而适配不同设备的目的。设备的划分情况：小于768的为超小屏幕（手机）768~992之间的为小屏设备（平板）992~1200的中等屏幕（桌面显示器）大于1200的宽屏设备（大桌面显示器）响应式布局容器响应式需要一个父级做为布局容器，来配合子级元素来实现变化效果。
2021-11-26 15:04:29
386
原创 无序列表的居中对齐
无序列表的居中对齐解决办法方法一方法二溜了溜了同学门是不是经常会遇到ul里的li不能居中对齐的情况呢。确实，我也经常遇到。我安静写着代码。突然想起好久没写播客，所以今天它来了。解决办法方法一1.我们用到无序列表，一般都是li里面包含a标签，就像这样 <div class="box"> <ul> <li><a href="">li的居中</a></li> <
2021-11-13 09:47:07
7505
4
原创 这是媒体查询
媒体查询什么是媒体查询背景介绍媒体查询的使用组成mediatype 查询类型关键字媒体特性媒体特性（拓展属性——了解）媒体查询语法规范什么是媒体查询背景近几年整个社会发生了翻天覆地的变化，各种智能手机，pad，之类的移动端设备随处可见。那么，程序员界就刮起了一阵风暴，大家在思考 “ 如何让我们的网站在各种移动端设备上都能布局合理呢？ ”为每一个设备写一套代码自然是非常麻烦的。那么，聪明的程序员们想到了一个办法，“ 我只要一套代码，就能让我的网站在不同大小的设备上正确显示 ”。于是，响应式设计模型诞生啦
2021-11-05 17:51:51
588
2
原创 移动端布局之Flex布局
flex布局布局原理原理缺点父项常见属性flex-direction设置主轴的方向属性：语法justify-content设置主轴上的子元素排列方式属性：语法flex-wrap属性：语法align-content### 设置侧轴上的子元素的排列方式（多行）属性语法align-items设置侧轴上的子元素排列方式（单行 ）属性语法子项常见属性flex子项目占的份数语法align-self控制子项自己在侧轴上的排列方式语法order属性定义项目的排列顺序语法布局原理原理1、lex布局又叫伸缩布局 、弹性布
2021-10-29 17:16:52
224
2
原创 还不会做动画？快进来看看
动画什么是动画如何使用动画先定义动画调用定义好的动画动画序列代码演示动画属性常见属性简写方式速度曲线细节：注意：什么是动画动画是 CSS3 中最具颠覆性的特征之一，可通过设置多个节点来精确的控制一个或者一组动画，从而实现复杂的动画效果如何使用动画先定义动画@keyframes 动画名称 { 0% { width: 100px; } 100% { width: 200px }}调用定义好的动画div { /* 调用动画 */
2021-10-25 10:02:12
93
2
原创 2021-10-20
常用标签——inputinput——typetype=“text”：创建单行文本输入框type=“password”：密码输入框type=“radio”：单选按钮type=“checkbox”：复选框type=“button”：普通按钮type=“submit”：提交按钮type=“reset”：重置按钮type=“image”：图像按钮type=“file”：文件域HTML5新增input type属性type=“url”：输入URL字段type=“tel”：输入电话号码type=“search”：搜索t
2021-10-20 18:28:06
4901
2
原创 2021-10-15
CSS3新增特性CSS3新增选择器属性选择器总结：结构伪类选择器示例代码：E:nth-child 与 E:nth-of-type 的区别：总结：伪元素选择器示例代码总结：盒子模型其他特性图标变模糊 -- CSS3滤镜filter语法：计算盒子宽度 -- calc 函数语法：CSS3 过渡语法：CSS3新增选择器属性选择器示例代码： /* 只选择 type =text 文本框的input 选取出来 */input[type=text] { color: pink;}/* 选择首先是d
2021-10-15 08:57:30
55
1
原创 2021-10-12
不想清除浮动？试试定位吧为什么要用定位？组成定位模式静态定位特点：相对定位特点绝对定位特点固定定位特点粘性定位--了解特点拓展绝对定位的盒子居中绝对定位（固定定位）会完全压住盒子定位特殊特性为什么要用定位？定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置，并且可以压住其他盒子。组成定位=定位模式+边偏移边偏移：top/bottom/right/left定位模式静态定位 .box{ position: static; }特点：没有特点，相当于标准流相对定位
2021-10-12 10:02:43
54
原创 2021-09-26
制作摄影网站会遇到的问题忘记清除浮动为什么要清除浮动清除浮动的方法伪类标签的作用对象先把b盒子隐藏鼠标放到b盒子位置显示b鼠标放到a盒子显示b忘记清除浮动为什么要清除浮动浮动元素会脱离标准流(脱标：浮动的盒子不再保留原先的位置)这样下面的元素就会占据浮动元素的位置，会对后续的布局产生影响清除浮动的方法1.额外标签法<div class="clear"></div>2.父级添加 overflow 属性overflow: hidden;3.父级添加after伪元素
2021-09-30 11:26:27
80
原创 2021-09-26
HTML了解什么是网页网页的组成什么是HTMLweb标准Web 标准提出的最佳体验方案：结构、样式、行为相分离什么是网页一：网站是指在因特网上根据一定的规则，使用 HTML 等制作的用于展示特定内容相关的网页集合。二：网页是网站中的一“页”，通常是 HTML 格式的文件，它要通过浏览器来阅读。网页的组成网页是构成网站的基本元素，它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页，常见以 .htm 或 .html 后缀结尾的文件，因此将其俗称为 HTML 文件。什么是HTML
2021-09-26 16:04:40
55
原创 2021-09-26
浮动什么是浮动浮动带来的影响1.脱标2.塌陷解决方法---清除浮动方法一：额外标签法方法二：父级添加 overflow 属性方法三：父级添加after伪元素方法四：父级添加双伪元素什么是浮动float 属性用于创建浮动框，将其移动到一边，直到左边缘或右边缘触及包含块或另一个浮动框的边缘。语法选择器 { float: 属性值; }浮动带来的影响1.脱标由于父级盒子很多情况下，不方便给高度，但是子盒子浮动又不占有位置，最后父级盒子高度为 0 时，就会影响下面的标准流盒子。2.塌陷浮动的元素
2021-09-26 15:31:02
51
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人