- 博客(62)
- 收藏
- 关注
RSS订阅原创 Markdown文件的操作
MarkDown的操作简介：Markdown是一种轻量级标记语言，允许人们使用易读易写的纯文本格式编写文档，然后转换成有效的XHTML（或者HTML）文档。这种语言吸收了很多在电子邮件中已有的纯文本标记的特性。1.标题标签"#“号加空格实现标题标签，一个”#“加空格代表一级标题标签，”#"的数量代表几级标题，一共有六级。例如：“###### 这是六级标签”这是六级标签2.标注由两个反引号组成(``)例如：两个反引号包裹（标注）效果：标注3.加粗由"**“号包裹例如：左右各两个”*
2021-03-01 20:05:21
353
原创 props验证与默认值，Vue的双向数据绑定，Vue组件父传子，子传父，兄弟通信
1. props验证与默认值父props与子props是单向下行绑定：父级的props的值更新会流动到子组件中，但反过来却不行。避免子组件意外改变父级组件的状态，导致数据流混乱。每次父级组件发生更新时，子组件中所有的props都将会刷新为最新的值。不能在子组件内部改变props，否则会导致浏览器控制台发出警告子组件要修改时，用$emit调用自定义事件，父组件接到后由父组件修改改变props的常用例子：这个用来传递一个初始值；这个组件接下来希望将其作为一个本地的数据来使用，要定义一个本地属
2021-01-22 20:35:03
420
原创 跨域与jsonp的原理，跨域的解决方式，发送到URL到页面加载发生了什么，三次握手，四次挥手，Vue中的methods,watch,computed的区别
跨域与Jsonp的原理跨域的概念：同源策略是浏览器的一种安全策略，所谓同源是指，域名，协议，端口号完全相同。协议，域名，端口号不同则为跨域。jsonp的概念：动态创建< script >标签，利用script标签的src不受同源策略的约束来跨域获取数据jsonp由两部分组成：回调函数和数据，回调函数是当响应来到时应该在页面中调用的函数，回调函数的名字一般是在请求中指定的。而数据就是传入回调函数中的JSON数据。跨域的解决方式1. jsonp实现原理利用动态创建scr
2021-01-21 20:36:42
142
原创 瀑布流
瀑布流HTML代码： <body> <div id="box"> <div class="item"> <div id="box1"><img src="./imgs/1.jpg" alt="" /></div> </div> <div class="item"> <div id="box2"><img src="
2021-01-20 19:50:43
135
1
原创 箭头函数，es6新增API，es6中的promise
箭头函数箭头函数 将函数function关键字转化为了箭头箭头函数内部的this指向始终指向箭头函数声明时所在的对象 function fn() { console.log(1) } var fn = () => { console.log(1) } fn() //假如箭头函数存在返回值 var fn = a =>
2021-01-20 14:09:10
147
原创 闭包，继承，事件冒泡，事件捕获，H5与Css新特性，本地存储
1.闭包1. 什么是闭包？当一个函数的返回值是另外一个函数,而返回的那个函数如果调用了其父函数的内部变量,且返回的那个函数在外部被执行,就产生了闭包。 function fn(){ var num =0; num =num +1; return num;} console.log(fun()) // 1 console.log(fun()) // 1 console.log(fun()) // 1 function fn(){ var num=0; return func
2021-01-18 16:15:52
196
原创 模板引擎artTemplate
模板引擎artTemplate1. 基础概念1.1 模板引擎★★★模板引擎（这里特指用于Web开发的模板引擎）是为了使用户界面与业务数据（内容）分离而产生的，它可以生成特定格式的文档，用于网站的模板引擎就会生成一个标准的HTML文档。让开发者以更加友好的方式拼接字符串，使项目代码更加清晰、更加易于维护。1.2 art-template模板引擎★★★介绍art-template 是一个简约、超快的模板引擎。它采用作用域预声明的技术来优化模板渲染速度，从而获得接近 JavaScript 极限的
2021-01-17 19:53:03
486
原创 Express框架的使用
Express框架的使用Express项目结构public – 静态资源托管目录bin –www 项目配置文件，启动时调用routes – 路由文件views – 视图模板引擎app.js – 入口文件package.json – 项目描述文档node_modules – 项目的所有依赖目录项目初始化创建项目： express myapp进入项目cd myapp安装依赖：初始化依赖cnpm i安装ejs cnpm i ejs --save安装数据库
2021-01-15 10:06:29
131
原创 Node服务器搭建
Node服务器搭建处理中文乱码问题：var http = require('http')var connect = http.createServer(function(req,res){ //设置响应头，可以返回html代码，设置编码格式为utf-8，解决中文乱码问题 res.setHeader("Content-Type","text/html;charset=utf-8"); res.end('访问成功')});connect.listen(3000,function(){
2021-01-15 09:46:32
88
原创 Node模块
Node模块1. Node模块的引入方法var xxx = require(‘xxx’)2. 文件模块读取文件案例：var fs = require('fs')//异步读取的文件fs.readFile("./app.txt", "utf-8", function(err, data){ if(err) { return console.log(err); } console.log('异步读取的内容：',data.toString());});//同步读取文件var da
2021-01-15 09:06:21
74
原创 Git安装步骤
一、下载网址：https://git-scm.com/downloads以下每张图片代表下一步，图片勾选即为安装时所需勾选项选择电脑系统支持的版本2. 3.4.5.6.7. 这一步不用勾选。8. Window+R输入CMD，输入git-version查看版本号及是否安装。...
2021-01-14 09:42:45
160
原创 Vue安装步骤
1.前提安装node.2.安装脚手架，cnpm i @vue/cli -g.3.安装成功，查看版本号 vue -V.4.创建项目，npm create demo(命名随便)5.上下切换，空格选中或取消6.以下每张黄色图片完成后回车即可选中回车enter选中这几项回车Save preset as:这一步创建文件夹名随便，回车12.下载成功出现此代码即为成功13.文件拉入visual studio code启动终端，启动命令：Npm run serve下一步：进入lo
2021-01-14 09:37:00
544
原创 Mongodb安装步骤
一、下载网址：https://www.mongodb.com/download-center/community2.选择server，选择要下载的版本，自己电脑系统，下载包类型，点击Download。3.下载好后，开始安装。4.选择custom自定义安装，它会自动跳转下一个界面5. 选着安装路径，next6.把勾选去掉，点击next7.同样把勾选去掉，点击next8.安装完成下载完成后自带mongosdb可视化软件设置环境变量,右击我的电脑，点击高级系统设置，找到底部
2021-01-14 09:31:32
144
1
原创 Node安装步骤
一、安装网址：http://nodejs.cn/二、下载电脑支持的安装包点击安装之后就一路next就ok了，因为是直接安装，所以环境变量就直接被添加了。安装完成之后，到安装目录能够查看到该文件结构；完整包含模块、notejs程序和包管理器验证环境变量；打开cmd命令输入命令：echo %path%如果能看到安装的nodejs的路径，表示path环境变量设置ok在输入命令：npm -v如果能看待对应的版本号，安装ok！这就表示环境变量还没有设置ok；就必须要设置环境变量；设
2021-01-14 09:08:57
273
原创 Sass安装步骤
sass安装手册第一步：Ruby的下载Ruby获取方式：https://rubyinstaller.org/downloads/第二步：Ruby的安装展示关键节点需要勾选的内容选项一：把Ruby加到环境变量里，一定要钩上哦，不然还要手动来添加；选项二：设置.rb和.rbw文件的默认打开程序为Ruby；选项三：设置Ruby的默认编码为utf-8。然后会到接下来的页面。MSYS2是Ruby常用的开发工具，可以选择性安装哦，以后也可以单独进行安装。如果勾选了安装MSYS2，Ruby安装完
2021-01-14 08:53:43
1127
原创 Ajax
一、ajax入门1. 什么是ajax?ajax不是一种开发语言，它是在现有的js/html/css样式基础上，实现在不重新加载整个页面的情况下，与服务器进行简单的数据交互，通过js操作DOM进行页面局部更新.2. ajax的应用介绍：搜索建议，表单验证，点击下一页，等等等等3. ajax概念: Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。 Ajax = 异步 J
2021-01-14 08:46:42
95
原创 CSS3新增属性2
CSS3简介1.CSS：层叠样式表（Cascading Style Sheet）。CSS3是CSS2的升级版本，3只是版本号，它在CSS2.1的基础上增加了很多强大的新功能。目前主流浏览器chrome、safari、firefox、opera、甚至360都已经支持了CSS3大部分功能了，IE10以后也开始全面支持CSS3了。在编写CSS3样式时，不同的浏览器可能需要不同的前缀。它表示该CSS属性或规则尚未成为W3C标准的一部分，是浏览器的私有属性，虽然目前较新版本的浏览器都是不需要前缀的，但为了更好
2020-11-06 10:19:24
244
原创 CSS3新增属性
CSS：层叠样式表（Cascading Style Sheet）。CSS3是CSS2的升级版本，3只是版本号，它在CSS2.1的基础上增加了很多强大的新功能。目前主流浏览器chrome、safari、firefox、opera、甚至360都已经支持了CSS3大部分功能了，IE10以后也开始全面支持CSS3了。在编写CSS3样式时，不同的浏览器可能需要不同的前缀。它表示该CSS属性或规则尚未成为W3C标准的一部分，是浏览器的私有属性，虽然目前较新版本的浏览器都是不需要前缀的，但为了更好的向前兼容，前缀
2020-11-02 10:21:46
300
原创 移动端-iScroll的使用
iscroll的使用概念：它是一种高性能，体积小，无依赖，多平台js插件。作用：它的作用可以快速制作类似原生滚动效果，一个页面不限制使用次数。中文网手册：http://caibaojian.com/iscroll-5/入门：1、html结构 <div class="box"> <div></div> </div>2、设置样式设置外层div宽高固定设置内层div 比外层大给外层设置overflow
2020-10-27 18:50:41
524
原创 移动端-swiper的使用
swiper的使用概念：swiper是轻便的，免费的，稳定的js插件,使用swiper可以快速简单的制作滑动功能轮播特效;官网地址：http://www.swiper.com.cn/演示地址：http://www.swiper.com.cn/demo/index.htmlswiper的文件一共有两个swiper.min.css文件放在head里面swiper.min.js文件放在body里面HTML代码： a、第一层 <div c
2020-10-24 09:05:12
1591
原创 移动端touch-zepto事件
移动端事件1. 原生移动端touch事件1.1. 手指放到屏幕上的时候触发 touchstart 开始触摸 <body> <div id="mm">看这里~~~</div> <script> var mm = document.getElementById("mm"); mm.ontouchstart = function(){ mm.innerHTML = "手指放到屏
2020-10-20 09:07:14
608
原创 移动端-弹性盒子布局
弹性盒布局1. 基本概念：采用Flex布局的元素，称为Flex容器（flex container），简称"容器"。它的所有子元素自动成为容器成员，称为Flex项目（flex item），简称"项目"。容器默认存在两根轴：水平的主轴（main axis）和垂直的纵轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做mainstart，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。项目默认沿主轴排列。单个项目占据的主轴空间叫做
2020-10-19 11:20:00
249
原创 移动端-Meta与视口的设置
Meta与视口的设置上PC端常见的mata定义定义该页面使用字符编码：<meta charset="utf-8"><title>全栈开发</title> title标记内容的长度不要超过80个汉字keywords关键词：<meta name="keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,">告诉搜索引擎你的页面关键字是什么description定义
2020-10-18 20:23:35
424
1
原创 移动端-Ruby、Sass安装
sass安装手册第一步：Ruby的下载Ruby获取方式：https://rubyinstaller.org/downloads/第二步：Ruby的安装展示关键节点需要勾选的内容选项一：把Ruby加到环境变量里，一定要钩上哦，不然还要手动来添加；选项二：设置.rb和.rbw文件的默认打开程序为Ruby；选项三：设置Ruby的默认编码为utf-8。然后会到接下来的页面。MSYS2是Ruby常用的开发工具，可以选择性安装哦，以后也可以单独进行安装。如果勾选了安装MSYS2，Ruby安装完
2020-10-15 10:35:13
155
原创 移动端-像素和分辨率
1.像素分辨率重点：像素 分辨率的关系难点：印刷不同产品时的不同分辨率设置的理解像素概念网页中的像素单位像素(pixel)概念一般而言，pixel（像素）是图像的基本采样单位。详细解释见维基像素条目。所以它不是一个确定的物理量，也不是一个具体的点或者小方块（尽管可以用点和小方块来呈现），而是一个抽象概念。CSS像素(css pixel)CSS像素是Web编程的概念，指的是CSS样式代码中使用的逻辑像素。在CSS规范中，长度单位可以分为两类，绝对(absolute)单位以及相对(relati
2020-10-13 10:36:41
1532
原创 移动端-Sass
一、Sass简介 （Syntactically(语法) Awesome(极好的) StyleSheets(样式表)）1、什么是CSS预处理器css预处理器是对css的扩展，弥补了css的一些缺陷，比如缺少变量，缺少代码块，缺少继承，缺少逻辑判断，从而提高代码的可维护性。2、什么是Sass Sass 是一门高于 CSS 的元语言，它能用来清晰地、结构化地描述文件样式，有着比普通 CSS 更加强大的功能。 Sass 能够提供更简洁、更优雅的语法，同时提供多种功能来创建可维护和管理的样式表。
2020-10-11 18:38:30
301
原创 JavaScript-jQuery动画效果
1 JQ动画详解jQuery提供了三组基本动画，这些动画都是标准的、有规律的效果，jQuery还提供了自定义动画的功能。- 显示(show)与隐藏(hide)是一组动画：- 滑入(slideUp)与滑出(slideDown)与切换(slideToggle)，效果与卷帘门类似- 淡入(fadeIn)与淡出(fadeOut)与切换(fadeToggle)1 显示隐藏 show hide$obj.show([speed], [callback]);// speed(可选)：动画的执行时间
2020-10-09 14:13:22
279
原创 JavaScript-jQuery事件
1 概述JQ事件JavaScript中已经学习过了事件，jQuery对JavaScript事件进行了封装，增加并扩展了事件处理机制。jQuery不仅提供了更加优雅的事件处理语法，而且极大的增强了事件的处理能力。2 JQ事件详解1 事件的添加删除简单事件绑定–bind事件绑定–delegate事件绑定–on事件绑定(推荐)简单事件注册click(fn) 单击事件mouseenter(fn) 鼠标进入事件mouseleave(fn) 鼠标离开事件缺点：不能同时注册多个事件
2020-10-07 19:54:38
107
原创 JavaScript-JQuery样式和属性和内容的操作
1 JＱ 元素的样式操作CSS操作功能：设置或者修改样式，操作的是style属性。操作单个样式// name：需要设置的样式名称// value：对应的样式值$obj.css(name, value);// 使用案例$('#one').css('background','gray');// 将背景色修改为灰色设置多个样式// 参数是一个对象，对象中包含了需要设置的样式名和样式值$obj.css(obj);// 使用案例$('#one').css({ '
2020-10-06 08:23:33
171
1
原创 JavaScript-选择器
JavaScript库的概念JavaScript开发的过程中，处理浏览器的兼容很复杂而且很耗时，于是一些封装了这些操作的库应运而生。这些库还会把一些常用的代码进行封装。把一些常用到的方法写到一个单独的js文件，使用的时候直接去引用这js文件就可以了。（common.js）常见的JavaScript 库 - jQuery、Prototype、MooTools。其中jQuery是最常用的一个jQuery其实就是一个js文件，里面封装了一大堆的方法方便我们的开发，其实就是一个加强版的common.js，因
2020-10-04 18:42:50
481
原创 JavaScript-继承
1 继承的基本概念继承是指一个对象直接使用另一对象的属性和方法js里常用的如下三种继承方式：通过原型链方式实现继承（对象间的继承） 类式继承（构造函数间的继承） 组合继承由于js不像Java那样是真正面向对象的语言，js是基于对象的，它没有类的概念。所以，要想实现继承，可以用js的原型prototype机制或者用apply和call方法去实现。2 程序中的继承方法1 原型继承 /** * 优点： * 实例是父类的实例也是子类的实例 * 父
2020-09-30 08:31:11
88
原创 JavaScript-原型
1 原型的概念原型是一个对象，其他对象可以通过它实现属性继承。每个函数都有一个属性叫做prototype。这个prototype的属性值是一个对象，默认的只有一个叫做constructor的属性，指向这个函数本身。该方式利用了对象的 prototype 属性，可以把它看成创建新对象所依赖的原型。每个构造函数都有一个原型对象（prototype），原型对象都包含一个指向构造函数的指针(constructor)，而实例都包含一个指向原型对象的内部指针(__proto__)2 原型 prot
2020-09-29 08:33:21
72
原创 JavaScript-面向对象
1 面向对象基础什么是对象现实生活中：万物皆对象，对象是一个具体的事物，一个具体的事物就会有行为和特征。举例： 一部车，一个手机JavaScript中的对象JavaScript中的对象其实就是生活中对象的一个抽象JavaScript的对象是无序属性的集合。 其属性可以包含基本值、对象或函数。对象就是一组没有顺序的值。我们可以把JavaScript中的对象想象成键值对，其中值可以是数据和函数。对象的行为和特征 特征---属性 行为---方法事物的特征在对象中用属性来表示。事物的
2020-09-27 18:51:06
70
原创 JavaScript-正则表达式
1 正则表达式的概念正则表达式：用于匹配规律规则的表达式，正则表达式最初是科学家对人类神经系统的工作原理的早期研究，现在在编程语言中有广泛的应用。正则表通常被用来检索、替换那些符合某个模式(规则)的文本。正则表达式是对字符串操作的一种逻辑公式，就是用事先定义好的一些特定字符、及这些特定字符的组合，组成一个“规则字符串”，这个“规则字符串”用来表达对字符串的一种过滤逻辑。2 正则表达式的作用1. 给定的字符串是否符合正则表达式的过滤逻辑(匹配)2. 可以通过正则表达式，从字符串中获取我们想要的
2020-09-24 19:51:25
94
原创 JavaScript-作用域 闭包
1 作用域作用域：变量可以起作用的范围全局变量和局部变量全局变量在任何地方都可以访问到的变量就是全局变量，对应全局作用域局部变量只在固定的代码片段内可访问到的变量，最常见的例如函数内部。对应局部作用域(函数作用域)注意：不使用var声明的变量是全局变量，不推荐使用。var num = 123;function foo() { console.log( num );}foo();//=====================================if (
2020-09-21 08:51:33
71
原创 js运动，原生动画 下
1 关于鼠标事件相对于浏览器位置的相关属性15.1.1 获取鼠标事件坐标位置 ***** (20’) event=event||window.event event兼容性写法 event.clientX 获取鼠标的X轴的坐标 event.clientY 获取鼠标的Y轴的坐标 2 事件对象的相关属性15.2.1 Event事件对象的常用属性回顾 ***** (25’)event.keyCode 获取键盘的键盘码 对象.offsetWidth 计算盒子的宽度，包
2020-09-21 08:46:01
70
原创 js运动，原生动画 上
1定时器1 定时器常用的方法定时器主要有两种，间歇性定时器，一次性定时器，分别是setInterval(方法，时间), setTimeout(方法，时间) 间歇性定时器会间隔一定的事件重复执行一段代码，比如轮播图，我们可以让他间隔3秒重复切换图片，一次性定时器是到了一定时间，自动执行代码，而且只会执行一次，所以相对来说我们用的比较多的是间歇性定时器。 clearInterval(timer), clearTimeout(timer) ，括号中的变量即为你打开定时器的时候保存的变量。倒计时小
2020-09-20 18:41:43
90
原创 JavaScript-事件 event对象下
一、Event对象的概念Event 事件对象的概念Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。事件通常与函数结合使用，函数不会在事件发生前被执行！二、Event对象1、Event对象相关属性event.clientX 当前鼠标的x轴的坐标event.clientY 当前鼠标的y轴的坐标对象.clientWidth 当前对象的宽度 不包含左右边框对象.clientHeight 当前对象的高度 不包含上下边框对象.o
2020-09-18 08:37:44
90
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人