- 博客(41)
- 收藏
- 关注
RSS订阅原创 了解Node.js
什么是node.js?Node.js 就是运行在服务端的 JavaScript,是一个基于Chrome JavaScript 运行时建立的一个平台。(基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。)关于Node.js 安装配置可以参考https://www.runoob.com/nodejs/nodejs-install-setup.htmlNode.js 应用是由哪几部分组成的1.引入 required 模块：我们可以使用 require 指令来载入
2020-12-01 20:50:18
142
原创 ES6 promise
Promise 的含义Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现，ES6 将其写进了语言标准，统一了用法，原生提供了Promise对象。所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise 是一个对象，从它可以获取异步操作的消息。Promise 提供统一的 API，各种异步操作都可以用同样的方法进行处理。特点对象的状态不受外界影响。Promis
2020-11-30 21:05:40
106
原创 es6
es6解构赋值ES6 允许按照一定的模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。数组例：let [head, ...tail] = [1, 2, 3, 4];head // 1tail // [2, 3, 4]let [x, y, ...z] = ['a'];x // "a"y // undefined 解构不成功，变量的值就等于undefined。z // []对象解构对象时变量名与属性同名才能取到正确的值；let { ba
2020-11-23 19:25:24
101
原创 了解es6
什么是es6ES6 就是ECMAScript 6是新版本JavaScript语言的标准。虽然目前已经更新到ES7,但是很多浏览器还不知处ES7语法，该标准仍在更新中，但目前部门网站都指出ES6的语法。目前ES6也是使用最多的最新的javaScript语言标准。在2009年ES5问世以后，javaScript的标准就一直没有更新。从那时起ES标准委员会就已经开始筹划新的ES标准，在2015年发布了ES6。ES6是ECMAScript 的第6个版本。let、constlet命令基本用法ES6新
2020-11-23 19:17:05
106
原创 JSON笔记
什么是jsonjson格式的引入：一种轻量级的数据交换格式JSON：JavaScript 对象表示法（JavaScript Object Notation）。JSON 是存储和交换文本信息的语法。 类似 XML。JSON 比 XML 更小、更快，更易解析。JSON的全称是”JavaScript ObjectNotation”，意思是JavaScript对象表示法，它是一种基于文本，独立于语言的轻量级数据交换格式。XML也是一种数据交换格式，为什么没有选择XML呢？因为XML虽然可以作为跨平
2020-11-18 13:27:44
87
原创 ajax学习笔记
什么是ajaxajax: asynchronous javascript and xmlajax是一种用来改善用户体验的技术，其本质是利用浏览器内置的一种特殊的对象(XMLHttpRequest)异步(即发送请求时，浏览器不会销毁当前页面，用户可以继续在当前页面做其它的操作)的向服务器发送请求,并且利用服务器返回的数据(不再是一个完整的页面，只是部分的数据，一般使用文本或者xml返回)来部分更新当前页面。使用ajax技术之后，页面无刷新，并且不打断用户的操作。ajax对象如何获得ajax对象
2020-11-17 10:44:23
75
原创 rem深度理解
什么是remrem顾名思义就是root element，这个是一个相对的单位，与em的差别在于rem相对的是根节点html的font-size,em相对的是父元素font-size。使用rem其实是用媒体查询修来改html的font-size，那么使用rem的元素的大小也会相应的改变，所以我们只要写一份css就可以适配所有手机的屏幕了。虽然rem在某些浏览器下面不够精准，但那也只是极少数，如果需要非常精准的适配，那么可以使用js来计算html的font-size。我们知道，在不同的手机设备，分辨率大
2020-11-10 19:59:42
703
原创 了解移动端布局
什么是移动端布局viewport概念ViewPort ”meta“标记用于指定用户是否可以缩放Web页面，如果可以，那么缩放到的最大最小缩放比例是什么。使用ViewPort“meta”标记还表示文档针对移动设备进行了优化。ViewPort“meta”标记的content值是有指令及其值组成的以逗号分隔的列表。属性width:控制viewport的宽度，可以指定一个值，也可以是devce-width代表设备的宽度height：控viewport的高度initial-scala：初始缩放比例，
2020-11-08 17:21:23
270
原创 深入Bootscrap
响应式网页1、响应式网页概述：一个页面，可以在各种不同的设备下浏览，都有不错的浏览体验。三个特征：（1）流式布局（2）可伸缩的图片和字体（3）CSS3 Media Query表格.table：基础表格.table-striped：斑马线表格.table-bordered：带边框的表格.table-hover：鼠标悬停高亮的表格.table-condensed：紧凑型表格.table-responsive：响应式表格表单Bootstrap中的表单分为三种：（1）默认表单<f
2020-11-02 20:32:19
214
原创 了解Bootstrap
什么是BootstrapBootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。它提供了一系列全局CSS样式，组件，js插件等等，支持栅格，响应式，css预编译等等。所以我们就只要使用他们写好样式的类就可以了，真的是简单方便明了。基本模板：<!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="utf-8">
2020-11-02 20:11:37
191
1
原创 了解百度API
什么是百度API百度地图API是一套有javascript语言编写的应用程序接口，他能帮助您在网站中构建功能丰富、交互性强的地图应用程序。百度地图API不仅包含构建地图的基本接口，还提供了诸如本地搜索、路线规划等数据服务，您可以根据自己的需要进行选择。地图API的服务是免费的，任何非盈利性的网站均可使用。百度API的参数origin 起点名称或经纬度，或者可同时提供名称和经纬度，此时经纬度优先级高，将作为导航依据，名称只负责展示。 destination 终点名称或经纬度，或者可同时提供名称和
2020-11-02 18:02:42
2662
原创 深入jQuery
jQuery怎么获取并设置文本text() 获取和设置文本获取这个文本var text = $(".div1").text()console.log(text);获取全部的文本console.log($("div").text());//jquery里面封装了迭代的方法 隐式迭代设置文本只需要给text（参数） 加了参数后 就是给参数设置文本 会覆盖原来的文本 包括子元素 如果新设置的文本包括了标签 那么他是不会解析标签的当作文本内容来解析 $("#setBtn").click(f
2020-10-26 20:21:04
144
原创 jQuery基础
什么是jQuery？jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，DoMore”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活
2020-10-26 19:22:55
82
原创 深入理解CSS3弹性布局
CSS3弹性盒子弹性盒子是CSS3的一种新布局模式。CSS3 弹性盒（ Flexible Box 或flexbox），是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。CSS3 弹性盒子内容弹性盒子由弹性容器(Flex container)和弹性子元素(Flex item)组成。弹性容器通过设置 display 属性的值为 flex 或 inline-flex将
2020-10-20 00:33:45
143
原创 CSS3 animation 详解
animation介绍animation的中文含义是过渡。过渡是CSS3中具有颠覆性的一个特征，可以实现元素不同状态间的平滑过渡（补间动画），经常用来制作动画效果。transition 包括以下属性：transition-property: all; 如果希望所有的属性都发生过渡，就使用all。transition-duration: 1s; 过渡的持续时间。transition-timing-function: linear; 运动曲线。属性值可以是：linear 线性ease 减速
2020-10-19 19:41:34
1279
原创 Ajax
AJAX介绍传统的web交换缺点：流量损失浪费时间和带宽AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。概念： ajax使网页异步刷新，在不重新加载整个页面时，对网页的局部进行刷新。特点： 局部刷新；ajax的优点：局部刷新；优化了浏览器与服务器之间的传输，减少了不必要的数据返回，减少了带宽占用；ajax引擎在客户端进行，承担部分服务器的工作，减少了服务器端的压力；ajax的缺点1.ajax不支持浏
2020-10-08 20:39:24
115
原创 JavaScript时间线
JavaScript是一种运行在JS解释器/独立引擎中的解释型脚本语言（解释型语言，编译行语言，弱类型语言，单线程）同步现象：上一件事情没做完，下一件事情必须等待配合异步：提高单线程的执行效率。get和post的区别：1、GET请求请求的数据会附加在URL之后，以?分割URL和传输数据，多个参数用&连接。URL的编码格式采用的是ASCII编码，而不是uniclde，即是说所有的非ASCII字符都要编码之后再传输。POST请求POST请求会把请求的数据放置在HTTP请求包的包.
2020-10-08 20:10:51
245
原创 JS原型和原型链深度解析
说完闭包，我想原型和原型链是js中的难点也是重点，明白了原型和原型链会让我们在后面不管是学习还是工作都会更加高效，并且原型和原型链会是面试中必不可少的话题什么是原型：任何对象都有一个原型对象，这个原型对象由对象的内置属性_proto_指向它的构造函数的prototype指向的对象，即任何对象都是由一个构造函数创建的，但是不是每一个对象都有prototype，只有方法才有prototype。new操作符具体干了什么呢?其实很简单，就干了三件事情：1 var obj = {};2 obj.__
2020-10-07 01:55:35
117
原创 深度理解JavaScript闭包
什么是js闭包我想在JavaScript中，一些比较难以理解透的知识点其中就有js闭包，所以我又回过头专门写了一个js闭包的博客。闭包就是能够读取其他函数内部变量的函数。由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成"定义在一个函数内部的函数"。所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。其实这句话通俗的来说就是：Javascript中所有的function都是一个闭包。不过一般来说，嵌套的function所产生的闭包更为强大，
2020-10-07 01:30:39
123
原创 H5canvas解析
canvas详解canvas本身并不具备绘画能力，它本身只是一个画布，是一个容器。绘图能力是基于html5的getContext(“2d”)返回的CanvasRenderingContext2D对象来完成的。<canvas id="payAbilityLoginTree" width="1000" height="800"></canvas>需注意，必须指定canvas画布的大小，canvas本身是受自身的width、height属性来决定是否重绘的，而不是style属
2020-09-27 23:06:18
243
原创 HTML5画布
CanvasHTML5 元素用于图形的绘制，通过脚本 (通常是JavaScript)来完成。 标签只是图形容器，必须使用脚本来绘制图形。可以通过多种方法使用 canvas 绘制路径,盒、圆、字符以及添加图像。创建一个画布（Canvas）一个画布在网页中是一个矩形框，通过 元素来绘制.注意: 默认情况下 元素没有边框和内容。canvas简单实例如下:<canvas id="myCanvas" width="200" height="100"></canvas&g
2020-09-27 20:59:07
316
原创 js节流
什么是节流？假如在一个页面中有任意多张图片，那么就有可能会使用懒加载技术，懒加载呢就是监听滚动条的位置，那么如果用户一直在滚动，那么事件监听就一直在触发，也是浪费性能。那么节流就是在一定时间间隔内触发一次事件。函数节流(throttle)：高频事件触发，但在n秒内只会执行一次，所以节流会稀释函数的执行频率。函数节流（throttle）与 函数防抖（debounce）都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象。代码如下：有两种主流的
2020-09-20 21:24:16
2964
1
原创 js防抖
什么是函数防抖？概念：函数防抖（debounce），就是指触发事件后，在 n 秒内函数只能执行一次，如果触发事件后在 n秒内又触发了事件，则会重新计算函数延执行时间。为什么需要函数防抖？前端开发过程中，有一些事件，常见的例如，onresize，scroll，mousemove ,mousehover等，会被频繁触发（短时间内多次触发），不做限制的话，有可能一秒之内执行几十次、几百次，如果在这些函数内部执行了其他函数，尤其是执行了操作DOM 的函数（浏览器操作 DOM是很耗费性能的），那不仅会浪
2020-09-20 21:01:23
154
原创 js计时器案例讲解
我们先说一下定时器吧：定时器：设置一个定时器，再设置一个等待的时间，到达指定时间后，执行对应的操作两种定时器：用法一样,区别一个执行后不会停下来，一个只执行一次window.setInterval([function],[interval]);//设置一个定时器，到达指定时间[interval] 执行我们的操作[function],然后定时器//并没有停止，以后每隔这么长时间，都重新执行我们的functionwindow.setTimeout([function],[interva
2020-09-13 18:29:50
544
原创 HTML BOM(window对象的总结)
什么是BOM？BOM，Browser Object Model即浏览器对象模型。浏览器页面初始化时，会在内存创建一个全局对象，用来描述当前窗口的属性和状态，这个全局对象被称为浏览器对象模型。不同于DOM的标准化组织是W3C，JavaScript的语法标准化组织是ECMA，BOM没有官方标准，对于现代浏览器，每个浏览器都有自己的BOM实现方法，所以直接使用BOM会有兼容性问题。BOM包含哪些内容?BOM有一个核心对象window，window对象包含了6大核心模块，分别是：document对象
2020-09-13 18:05:53
979
原创 DOM点击事件
onmousedown, onmouseup 以及 onclick 事件onmousedown, onmouseup 以及 onclick 事件构成了完整的鼠标点击事件。首先当鼠标按钮被点击时，onmousedown 事件被触发；然后当鼠标按钮被释放时，onmouseup事件被触发；最后，当鼠标点击完成后，onclick 事件被触发。onmousedown：用户鼠标按下时触发的事件。onmouseup:鼠标抬起时触发的事件。onclick:鼠标点击后触发的事件示例1：鼠标按下时更换字体
2020-09-06 22:10:00
2120
原创 DOM事件
onload 和 onunload 事件当用户进入后及离开页面时，会触发 onload 和 onunload 事件。onload 事件可用于检测访问者的浏览器类型和浏览器版本，然后基于该信息加载网页的恰当版本。onload 和 onunload 事件可用于处理 cookie。onload点击事件1.window.onload 是窗口（页面）加载事件，当文档内容完全加载完成会触发该事件（包括图像，脚本文件，css文件等），就调用的处理函数下面的代码，当点击按钮，并不会弹出对话框，因为页面还没有
2020-09-06 21:51:29
143
原创 DOM编程
DOM的理解1.D当创建了一个网页并把它加载到Web浏览器中时，DOM就生成了，它将我们编写的网页文档转换成一个文档对象。2.O：“对象”是一种自足的数据集合，相关联的变量称为这个对象的属性，只能通过这个对象调用的函数称为这个对象的方法。JS中的对象可以分为三种类型：A、用户定义对象：程序员自行创建的对象。B、内建对象：Array、Math、DateC、宿主对象：由浏览器提供的对象。JS最初版本中，非常重要的一些宿主对象就可以使用了，最基础的对象是Window对象。Window对象对应着浏览器
2020-08-30 23:50:34
447
原创 DOM案例
什么是DOM文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标记语言（HTML或者XML）的标准编程接口。W3C已经定义了一系列的DOM接口，通过这些DOM接口可以改变网页的内容，机构和样式。文档：一个页面就是一个文档，DOM中使用document表示元素：页面中的所有标签都是元素，DOM中使用element表示节点：页面中的所有内容都是节点（标签，属性，文本，注释等） ，DOM中使用node表示DOM把以上内容都看做是对象以下我们来
2020-08-29 23:14:48
418
原创 DOM对象初步理解
了解DOM需要清楚几个问题：什么是DOM？DOM可以用来干什么？DOM是怎么来的？怎么使用DOM？1. 什么是DOM？HTML DOM 是 HTML 的标准对象模型和编程接口。它定义了：作为对象的 HTML 元素所有 HTML 元素的属性访问所有 HTML 元素的方法所有 HTML 元素的事件换言之：HTML DOM 是关于如何获取、更改、添加或删除 HTML 元素的标准。2. DOM可以用来干什么？理解了DOM是API，就知道它就是一些功能，通过这些功能可以对HTML
2020-08-24 01:05:58
243
原创 错题解析
在js函数中，我们对于函数的理解并不深刻，在我个人做的一些题目中，归结以下错题，做个总结例题一：6、下面代码输出的结果为?var func = function(m, n) { arguments[0] = 3; n = 2; return m + n;}console.log(func(1)); A.2 B. 5 C.编译报错,arguments数组未定义 D.7解析：形参：函数定义的参数实参：函数调用时实际传递的参数参数的匹配从左.
2020-08-22 17:01:09
560
原创 JavaScript正则以及RegExp
正则表达式（英语：Regular Expression，在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。什么是正则？正则表达式是由一个字符序列形成的搜索模式。当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。正则表达式可以是一个简单的字符，或一个更复杂的模式。正则表达式可用于所有文本搜索和文本替换的操作。 搜索模式可用于文本搜索和文本替换。转义字符\s : 空格\S : 非空格\d : 数字\D : 非.
2020-08-16 15:57:41
131
原创 js中Math对象和Date对象
Math对象常用方法介绍Math 是数学函数，但又属于对象数据类型 typeof Math => ‘object’ 它是一个对象console.dir(Math)查看Math的所有函数方法。控制台打印的结果如下：1，Math.abs() 获取绝对值Math.abs(-12) = 122，Math.ceil() and Math.floor() 向上取整和向下取整 console.log(Math.ceil(12.03));//13 console.log(Math.ceil(
2020-08-16 15:16:06
223
原创 理解函数的本质
函数的预编译首先我们需要了解javaScript函数预编译过程:1、创建AO对象（执行期上下文 ），寻找函数形参和变量声明。2、把形参和变量名作为AO属性名，值为undefined。3、把实参赋给形参，实参形参相统一。4、寻找函数声明,赋值函数体。5、函数开始执行。代码实例 function fun(zhang){ console.log(zhang); var zhang = '小张'; consoloe.log(zhang); function zhang(){ret
2020-08-09 15:20:59
427
原创 JavaScript对象以及数组的运用
Object类型 和 Array类型 的创建方法1)Array() 和 Object() 不能构造函数。object对象传统创建对象：var box = new Object();box.name = '张浩';box.age = 21;box.fun = function(){return 'run le'; };字面量创建对象：var box = {name: '张浩',age : 21,fun : function(){ return 'run le';
2020-08-03 00:44:49
166
原创 javascript函数的进阶
一.函数的定义在javascript中函数是一段可以被执行或调用任意次数的JavasScript代码,在数据类型中属于"function"。函数也拥有属性和方法，因此函数也是对象。二.函数的语法函数就是包裹在花括号中的代码块，前面使用了关键词 function：function functionname(){ // 执行代码}三. 函数的表达式在javascript中定义一个函数，该函数整体作为变量的赋值语句或者调用执行的语句而存在，该函数语句块称为函数表达式。//函数表达
2020-08-02 23:58:18
110
原创 JavaScript的循环结构
在前章文章中我们说到了JavaScript的：分支结构： 程序的流程控制1.顺序结构2.分支结构3.循环结构前面已经说了分支结构接下来我们来介绍一下：循环结构js的循环结构是什么？重复执行相同或像是的代码就好比如果我们要在控制台输出十句：hello world；如果没有循环结构，我们是不是得：console.log('hello world');console.log('hello world');console.log('hello world');console.l
2020-07-27 01:21:43
221
原创 深入初级JavaScript
我们学习JavaScript初级首先得从——核心语法初级——DOM—— BOM这样的一个过程DOM和BOM后面会说到变量的增删改查增：var obj = { //obj为对象名 name : 'abc', //属性名 age : 18, gender : false}obj.address = "asdfasdf"; //增加的对象后面的都以增的obj对象为参照删：//给obj的address赋值为空删除此属性obj.address = undefined
2020-07-27 00:56:05
71
原创 JavaScript初步理解
JavaScript的数据类型数据：有用的信息数据类型：数据的分类，保存在内存中的数据的类型，决定了数据在内容中占有多大的空间值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）引用数据类型：对象(Object)、数组(Array)、函数(Function)。1.字符串（string）字符串是储存字符的变量字符串可以是引号中的任意文本，可以使用单引号或者双引号我们也可以在字符串中使用引号，只要不匹配包围字符串
2020-07-19 21:19:36
133
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人