2020年09月_cake_eat

12月 11月 10月 09月

原创 js中的同步和异步

https://blog.csdn.net/qq_22855325/article/details/72958345

2020-09-30 21:31:46 70

什么是回调函数在JavaScript中，回调函数具体的定义为：函数A作为参数(函数引用)传递到另一个函数B中，并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式)，就叫做匿名回调函数。回调函数的英文解释为：A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.翻译过来

2020-09-30 21:26:53 89

原创 css选择器

https://www.cnblogs.com/haiyan123/p/7552235.html

2020-09-30 19:15:08 78

原创 jQuery选择器

1、基础选择器：2、层级选择器除此之外还有：相邻元素选择器：用法: ‘div + span’ 匹配所有紧接在div元素后的span元素之后兄弟元素选择器：用法:‘div ~span’ 匹配div元素之后的所有span元素3、筛选选择器基本过滤器：：first 获取第一个元素：last 获取最后一个元素：even 匹配所有索引值为偶数的元素，从0开始计数：odd 匹配所有索引值为奇数的元素，从0

2020-09-30 19:09:54 136

原创 js中的伪数组

什么是伪数组？伪数组是一个 Object，而真实的数组是一个 Array伪数组具有length属性，其他属性(索引)为非负整数(对象中的索引会被当做字符串来处理，这里你可以当做是个非负整数串来理解)伪数组不具有数组的比如说push，shift，map等等方法常见的伪数组函数内部的argumentsDOM对象列表(document.getElementsByTags)jQuery对象($(“div”))...

2020-09-30 16:59:50 406

原创 js浅拷贝和深拷贝

什么是浅拷贝？浅拷贝只是拷贝一层, 更深层次对象级别的只拷贝引用（地址）。浅拷贝的特点(1) 对于基本数据类型的成员对象，因为基础数据类型是值传递的，所以是直接将属性值赋值给新的对象。基础类型的拷贝，其中一个对象修改该值，不会影响另外一个。(2) 对于引用类型，比如数组或者类对象，因为引用类型是引用传递，所以浅拷贝只是把内存地址赋值给了成员变量，它们指向了同一内存空间。改变其中一个，会对另外一个也产生影响。例如：var obj = { id:1, name:'andy',

2020-09-29 16:55:03 110

原创 js 任务队列

同步与异步JavaScript 语言的一大特点就是单线程，也就是说，同一个时间只能做一件事。这是因为 Javascript 这门脚本语言诞生的使命所致——JavaScript 是为处理页面中用户的交互，以及操作 DOM 而诞生的。比如我们对某个 DOM 元素进行添加和删除操作，不能同时进行。应该先进行添加，之后再删除。单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。这样所导致的问题是：如果 JS 执行的时间过长，这样就会造成页面的渲染不连贯，导致页面渲染加载阻塞的感觉。为了解决

2020-09-29 09:46:20 1460

原创 js for循环点击事件输出i的值错误的原因

代码：var lis = document.querySelector('.nav').querySelectorAll('li');for(var i = 0;i<lis.length;i++){ console.log(i); lis[i].onclick = function (){ console.log(i); }}第一次：for循环嵌套自动函数， i从0-3 执行四次，每次执行，自执行函数也会跟着执行，也就会按照i值的不同，给不同的节点，绑

2020-09-29 08:58:40 959 1

原创高阶函数

什么是高阶函数高阶函数是对其他函数进行操作的函数，它接收函数作为参数或将函数作为返回值输出。<script>function fn(callback){callback&&callback();}fn(function(){alert('hi')}</script><script>function fn(){return function() {}} fn();</script> 此时fn 就是一个高阶函数

2020-09-28 19:01:39 166

原创严格模式

什么是严格模式JavaScript 除了提供正常模式外，还提供了严格模式（strict mode）。ES5 的严格模式是采用具有限制性 JavaScript 变体的一种方式，即在严格的条件下运行 JS 代码。严格模式在 IE10 以上版本的浏览器中才会被支持，旧版本浏览器中会被忽略。严格模式对正常的 JavaScript 语义做了一些更改：消除了 Javascript 语法的一些不合理、不严谨之处，减少了一些怪异行为。消除代码运行的一些不安全之处，保证代码运行的安全。提高编译器效率，增加运行速

2020-09-28 18:34:34 882

原创改变函数内的this指向的方法call() apply() bind()

改变函数内的this指向 js提供了三种方法： call() 、apply()、 bind()1、call方法call方法可以调用函数，还可以改变函数内的this指向。例如：var o = { name: 'andy'}function fn(a,b){ console.log(this); console.log(a+b)}fn.call(o, 1, 2);call()方法的主要作用是实现继承。例如：function Father (uname, ag

2020-09-28 16:51:05 248

原创函数的调用方式和函数内部的this指向

1. 普通函数function fn(){console.log(‘你好’);};调用方式：fn();fn.call();2. 对象的方法var o ={sayHi:function (){console.log(‘hi’);}};调用方式：o.sayHi();3. 构造函数function Star(){};调用方式：new Star();4. 绑定事件函数btn.onclick = function (){};调用方式：点击就可以调用5. 定时器函数set

2020-09-28 15:59:33 300

原创 Object.defineProperty方法

Object.defineProperty方法的作用Object.defineProperty() 定义对象中新属性或修改原有的属性。语法：Object.defineProperty(obj, prop,descriptor)obj：必需。目标对象prop：必需。需定义或修改的属性的名字descriptor：必需。目标属性所拥有的特性Object.defineProperty() 第三个参数 descriptor 说明：以对象形式 { } 书写value: 设置属性的

2020-09-28 11:43:56 70

原创 JavaScript中every、filter、forEach、map、some的区别

不同点：every()：对数组中的每一项运行给定函数，如果该函数对每一项都返回 true，则返回 true。some()：对数组中的每一项运行给定函数，如果该函数对任一项返回 true，则返回 true。filter()：对数组中的每一项运行给定函数，返回该函数会返回 true 的项组成的数组。map()：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。forEach()：对数组中的每一项运行给定函数。这个方法没有返回值。 相同点：以上方法都不会修改数组中的包含的值。注

2020-09-28 10:59:19 207

原创 JavaScript查询商品案例

代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title&.

2020-09-28 10:31:08 603

原创 JavaScript call方法的作用

call方法的作用call方法可以调用函数call方法可以改变这个函数的this指向例如：//call方法function fn(x,y){ console.log(x+y); console.log(this) ;}var o = { name: 'andy'}//1、call方法可以调用函数// fn.call(); //此时函数里面this指向的是window//2、call方法可以改变这个函数的this指向,此时函数的this指向 o 这个对

2020-09-26 20:36:21 825

原创原型对象的应用扩展内置对象

利用 console.log(Array.prototype); 输出数组的原型对象，我们可以看到里面有很多内置的方法，但是没有求和的方法。我们可以利用原型对象来扩展内置对象Array.prototype.sum = function (){ var sum = 0; for(var i = 0 ;i<this.length;i++){ sum += this[i]; } return sum;}var arr=[1,2,3];cons

2020-09-26 20:12:59 116

原创原型对象的this指向问题

构造函数中的this 指向我们实例对象。原型对象里面放的是方法, 这个方法里面的this 指向的是这个方法的调用者, 也就是这个实例对象。例如：var that;function Star(uname, age){ this.uname = uname; this.age = age;}Star.prototype.sing = function (){ console.log('我会唱歌'); that = this;};var ldh = new S

2020-09-26 19:58:55 694

原创 JavaScript对象成员查找规则

对象成员查找规则① 当访问一个对象的属性（包括方法）时，首先查找这个对象自身有没有该属性。② 如果没有就查找它的原型（也就是 __proto__指向的prototype 原型对象）。③ 如果还没有就查找原型对象的原型（Object的原型对象）。④ 依此类推一直找到 Object 为止（null）。⑤ __proto__对象原型的意义就在于为对象成员查找机制提供一个方向，或者说一条路线。例如：``javascriptfunction Star(uname, age){t

2020-09-26 19:17:53 397

原创 JavaScript原型链

在讲原型链之前，我们先回固一下构造函数、原型和实例的关系。构造函数、原型和实例的关系每个构造函数都有一个原型对象，原型对象都包含一个指向构造函数的指针，而实例都包含一个指向原型对象的内部指针。举例：function Star(uname, age){ this.uname = uname; this.age = age;}Star.prototype.sing = function (){ console.log('我会唱歌')}var ldh = new Sta

2020-09-26 18:57:45 133

原创原型对象prototype和对象实例的proto属性

原型对象我们创建的每个函数都有一个 prototype（原型）属性，这个属性是一个指针，指向一个对象，而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。如果按照字面意思来理解，那么 prototype 就是通过调用构造函数而创建的那个对象实例的原型对象。使用原型对象的好处是可以让所有对象实例共享它所包含的属性和方法。换句话说，不必在构造函数中定义对象实例的信息，而是可以将这些信息直接添加到原型对象中。对象的__proto__属性Firefox、Safari 和 Chrome 在每个

2020-09-26 17:09:21 1048

原创 ES5创建对象的方式

ES5创建对象的方式1、对象字面量2、new Object()构造函数3、几种模式:工厂模式：https://blog.csdn.net/cake_eat/article/details/108690230原型模式：https://blog.csdn.net/cake_eat/article/details/108694307组合使用构造函数和原型模式：https://blog.csdn.net/cake_eat/article/details/108696131动态原型模式：https://

2020-09-26 10:57:37 560

原创 ES6面向对象案例-动态添加导航栏标签页

效果图点击加号+新增选项卡：双击tab栏更改文字：HTML代码CSS代码JS 代码

2020-09-24 19:42:25 551

原创 ES6类中this指向问题

ES6中this指向它的调用者。例如：点击button的时候sum()方法里面this指向btn。此时如果再调用构造函数里面的x,y，不能直接用this.x和this.y，而是采取在类之外定义一个变量_that，在构造函数里面让_that等于构造函数里面的this，最后在sum函数里面通过_that变量来调用构造函数中的x和y。var _that;class Father{ constructor(x,y) { this.x=x; this.y=y;

2020-09-24 19:21:31 588

原创 ES6中的类和对象

类class在ES6中增加了类的概念，可以使用class关键字声明一个类，之后以这个类来实例化对象。类抽象了对象的公共部分，它泛指某一大类。对象特指某一个，通过类实例化一个具体的对象。创建类//语法：class Star{ //class body}//实例：var xx = new Star(); 类添加方法//创建类 class 创建明星类class Star{ //constructor() 方法是类的构造函数(默认方法)，用于传递参数,返回实例对象，通过 new

2020-09-24 19:07:04 310

原创 JavaScript事件处理影响内存和性能的解决方法：事件委托和移除事件处理程序

内存和性能在 JavaScript中，添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能。导致这一问题的原因是多方面的。首先，每个函数都是对象，都会占用内存；内存中的对象越多，性能就越差。其次，必须事先指定所有事件处理程序而导致的 DOM访问次数，会延迟整个页面的交互就绪时间。事件委托对“事件处理程序过多”问题的解决方案就是事件委托。事件委托利用了事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。例如，click 事件会一直冒泡到 document 层次。也就是说，我们可以

2020-09-24 08:35:44 346

原创 JavaScript事件类型

1 UI事件UI事件指的是那些不一定与用户操作有关的事件。（1）load事件：当页面完全加载后（包括所有图像、JavaScript 文件、 CSS文件等外部资源），就会触发 window 上面的 load 事件。有两种定义 onload 事件处理程序的方式。第一种方式是使用如下所示的 JavaScript代码：EventUtil.addHandler(window, “load”, function(event){ alert(“Loaded!”); });第二种指定 onload

2020-09-24 08:23:14 559

原创 JavaScript事件对象event

什么是事件对象？在触发 DOM上的某个事件时，会产生一个事件对象 event，这个对象中包含着所有与事件有关的信息。包括导致事件的元素、事件的类型以及其他与特定事件相关的信息。DOM中的事件对象兼容 DOM的浏览器会将一个 event 对象传入到事件处理程序中。无论指定事件处理程序时使用什么方法（DOM0级或 DOM2级），都会传入 event 对象。在事件处理程序内部，对象 this 始终等于 currentTarget（其事件处理程序当前正在处理事件的那个元素）的值，而 target （事件

2020-09-23 16:01:42 104

原创 JavaScript事件流-怎么控制在捕获阶段还是冒泡阶段调用事件处理程序

什么是事件流？事件流描述的是从页面中接收事件的顺序。什么是事件冒泡？由最具体的元素接收，然后珠玑传播到较为不具体的节点。例如：<!DOCTYPE html> <html> <head> <title>Event Bubbling Example</title> </head> <body> <div id="myDiv">Click Me</div> </

2020-09-23 15:31:38 469

原创 DOM操作技术-操作表格

为了方便构建表格，HTML DOM还为<table>、<tbody> 和<tr>元素添加了一些属性和方法。例如：//创建 tablevar table = document.createElement("table");table.border = 1;table.width = "100%";//创建 tbodyvar tbody = document.createElement("tbody");table.appendChild(tbody);

2020-09-23 11:39:13 223

原创 DOM操作技术-动态样式

什么是动态样式动态样式是指在页面刚加载时不存在的样式；动态样式是在页面加载完成后动态添加到页面中的。我们以下面这个典型的<link>元素为例：<link rel="stylesheet" type="text/css" href="styles.css"> 使用 DOM代码可以很容易地动态创建出这个元素：var link = document.createElement("link"); link.rel = "stylesheet"; link.type = "te

2020-09-23 11:36:21 189

原创 DOM操作技术-动态脚本

什么是动态脚本动态脚本指的是在页面加载不存在，但将来的某一时刻通过修改DOM动态添加脚本。创建动态脚本的两种方式（1）插入外部文件例如：var script = document.createElement(“script”);script.type = “text/javascript”;script.src = “client.js”;document.body.appendChild(script);（2）直接插入JavaScript代码var script = document.

2020-09-23 11:05:22 254

原创 DOM节点类型-Comment类型

Comment类型Comment 节点具有下列特征：nodeType的值是8；nodeName的值为“#comment”；nodeValue的值是注释内容；parentNode可能是Document或者Element；不支持子节点。Comment 类型与 Text 类型继承自相同的基类，因此它拥有除 splitText()之外的所有字符串操作方法。与 Text 类型相似，也可以通过 nodeValue 或 data 属性来取得注释的内容。注释节点可以通过其父节点来访问，以下面的代码为例。

2020-09-23 10:19:01 442

原创 DOM节点类型-Text类型

什么是Text类型？文本节点由 Text 类型表示，包含的是可以照字面解释的纯文本内容。纯文本中可以包含转义后的 HTML字符，但不能包含 HTML代码。Text 节点具有以下特征：nodeType 的值为 3；nodeName 的值为"#text"；nodeValue 的值为节点所包含的文本；、parentNode 是一个 Element；不支持（没有）子节点。可以通过 nodeValue 属性或 data 属性访问 Text 节点中包含的文本，这两个属性中包含的值相同。创建文本节点

2020-09-23 10:09:24 650

原创 DOM节点类型-Element类型

什么是Element类型Element 类型用于表现 XML或HTML元素，提供了对元素标签名、子节点及特性的访问。Element 节点特征nodeType 的值为 1；nodeName 的值为元素的标签名；nodeValue 的值为 null；parentNode 可能是 Document 或 Element；其子节点可能是 Element、Text、Comment、ProcessingInstruction、CDATASection 或 EntityReference。要访问元素的标

2020-09-23 08:54:19 580

原创 DOM节点类型-Document类型

什么是Document类型？JavaScript通过 Document 类型表示文档。在浏览器中，document 对象是 HTMLDocument（继承自 Document 类型）的一个实例，表示整个 HTML页面。而且，document 对象是 window 对象的一个属性，因此可以将其作为全局对象来访问。Document节点特征nodeType 的值为 9；nodeName 的值为"#document"；nodeValue 的值为 null；parentNode 的值为 null；o

2020-09-22 19:11:00 1124

原创 DOM节点类型-Node类型

什么是Node类型？DOM1级定义了一个Node接口，该接口将由DOM中的所有节点类型实现。这个Node接口在JavaScript中是作为Node类型实现的；除了IE以外，在其他浏览器中都可以访问到这个类型。JavaScript中所有节点类型都继承自Node类型，因此所有节点类型都共享着相同的基本属性和方法。NodeType属性值有哪些？每个节点都有个NodeType属性，用来表明节点类型。节点类型由在 Node 类型中定义的下列 12个数值常量来表示，任何节点类型必居其一。Node.ELEMENT

2020-09-22 17:16:52 666

原创 DOM节点层次

什么是DOMDOM（文档对象模型）是针对HTML和XML文档的一个API（应用程序编程接口）。DOM描绘了一个层次化的节点数，允许开发人员添加、移除和修改页面的某一部分。什么是节点层次节点分为几种不同的类型，每种类型分别表示文档中不同的信息或标识。每个节点都拥有各自的特点、数据和方法，另外与其他节点存在某种关系。节点之间的关系构成了层次，而所有页面标记则表现为以特定节点为根节点的树形结构。文档节点是每个文档的根节点。文档元素是文档的外层元素，文档中的其他所有元素都包含在文档元素中。每个文档只能有一个

2020-09-22 16:15:39 244

原创客户端检测之用户代理检测

什么是用户代理检测用户代理检测通过检测用户代理字符串来确定实际使用的浏览器。在每一次 HTTP请求过程中，用户代理字符串是作为响应首部发送的，而且该字符串可以通过 JavaScript的 navigator.userAgent 属性访问。在服务器端，通过检测用户代理字符串来确定用户使用的浏览器是一种常用而且广为接受的做法。而在客户端，用户代理检测一般被当作一种万不得已才用的做法，其优先级排在能力检测和（或）怪癖检测之后。什么是电子欺骗所谓电子欺骗，就是指浏览器通过在自己的用户代理字符串加入一些错误

2020-09-22 15:56:54 300

TA关注的人

网上订餐系统（外卖系统）

优购线上购物商城微信小程序

仿去哪网webapp

用 html+css+bootstrap+Nodejs实现学生管理系统

用Node.实现留言板功能

绑定csdn的时候出现了下面的页面，绿色按钮不能点击，该怎么解决呢？

csdn 绑定 github 的时候出现了这个页面，绿色框也点击不了，有大佬知道怎么解决吗？