plus21n的博客

解决跨域------JSONP

plus21n — Fri, 23 Apr 2021 14:08:25 +0800

一、JSONP是什么？ JSONP（JSON with Padding），是一个非官方的跨域解决方案，纯粹凭借程序员开发出来，只支持get请求。二、JSONP是怎么工作的？在网页有一些标签天生具有跨域能力，比如：img、link、iframe、script， JSONP就是利用script标签的跨域能力来发送请求。利用动态创建一个script标签并利用它的src属性向服务器发送一次HTTP请求,并提前声明好一个回调函数，回调函数的函数名利用callback请求参数传递给后端。后端接收到来自前端的请求

ES6迭代器(iterator)和生成器(generator)

plus21n — Sun, 18 Apr 2021 16:00:29 +0800

迭代器(iterator) 一、什么是迭代？从一个数据集合中按照一定的顺序，不断的取出数据的过程（很容易就想到遍历）。二、迭代和遍历有什么区别？迭代强调是依次取出，不能确定取出的有多少，也不能保证把数据全部取完；遍历必须保证知道了数据的长度，循环不断的全部取出，针对于数据量过大的使用遍历需要的时间很长三、迭代器迭代器是一个带有特殊接口的对象，自己带有next（）方法，next （）方法会返回当前位置的对象，调用后得到一个包含value和done属性的对象，value属性表示当前属性的值，do

js的深克隆与浅克隆

plus21n — Sun, 11 Apr 2021 23:51:13 +0800

区别：浅克隆只是克隆一层，更深层次对象级别的只拷贝引用。深克隆拷贝多层，每一级别的数据都会拷贝。克隆只针对对象、数组、函数等复杂数据浅克隆就是将栈内存中的引用复制一份，赋给一个新的变量，本质上两个指向堆内存中的同一地址，内容也相同，其中一个变化另一个内容也会变化（根本上改变的是同一个对象）。深克隆就是创建一个新的空对象，开辟一块内存，然后将原对象中的数据全部复制过去，完全切断两个对象间的联系。原生js实现浅克隆 // 浅克隆 var obj ={ id:1, name:'jack' };

正则表达式

plus21n — Tue, 06 Apr 2021 14:10:37 +0800

正则表达式就是一个用于查找的含有匹配字符串或匹配元字符的字符串。正则表达式对象就是由正则表达式创建的对象, 该对象可以进行匹配, 提取和替换。创建正则表达式对象有两种方式：构造函数： var reg = new RegExp(); console.dir(reg); 输出结果为：字面量： // var regex = /正则表达式/; var reg1 = /heygirl/ console.log(reg1); var str = '1234679heygi

数组去重的几种方法

plus21n — Sat, 20 Mar 2021 11:28:19 +0800

数组去重：去除数组中重复的元素。 1.将数组的每一个元素依次与其他元素做比较，发现重复元素，利用数组方法splice()删除重复元素 var arr = [2, 4, 6, 8, 4, 7, 2, 5]; for (var i = 0; i < arr.length; i++) { // 获取当前元素后的所有元素 for (var j = i + 1; j < arr.length; j++) { // 判断两个元素的值是否相等 if (arr

一些数组的方法

plus21n — Thu, 18 Mar 2021 20:52:03 +0800

数组的方法 map 映射一一对应 let arr = [1, 2, 3, 4, 5]; // let arr1 = []; // for (var i = 0; i < arr.length; i++) { // arr[i] *= 2; // // arr1.push(arr[i] *= 2) // } // console.log(arr); let newArr = arr.map(v => v * 2) console.log(newArr); forEach 遍历

表单验证--12306注册账号页面

plus21n — Mon, 28 Dec 2020 20:08:14 +0800

需求：创建表单；点击下一步按钮会变色；当文本框失去焦点时，如果文本框中没有填入内容，会有相对应的提示内容，并且文本框的边框颜色变为红色；当输入内容符合要求时右边会显示绿色的√；当用户名和密码长度不够时会有错误提示，当确认密码与登录密码不匹配时也会有对应的提示；首先搭建框架， HTML部分：

账

Array对象方法：slice() 方法和splice() 方法

plus21n — Thu, 10 Dec 2020 18:36:04 +0800

Array对象方法 slice slice() 方法可从已有的数组中返回选定的元素。可以用来从数组中提取元素。使用slice() 方法不会改变原数组，而是将截取到的元素封装到一个新数组中返回。参数截取开始的位置的索引，包含开始索引。截取结束的位置的索引，不包含结束索引。第二个参数可以省略不写，此时会截取从开始索引往后的所有元素。索引可以传递一个负值，如果传递一个负值，则从后往前计算。（-1是倒数第一个，-2是倒数第二个以此类推） var arr = ['苹果', '香蕉', '橘子', '芒

数组的遍历之创建一个函数，可以将perArr中满18岁的Person提取出来，然后封装到一个新的数组中并返回

plus21n — Wed, 09 Dec 2020 19:21:23 +0800

数组的遍历所谓遍历数组，就是将数组中的所有元素都取出来： var arr = [10, 20, 30, 40]; console.log(arr[0]); console.log(arr[1]); console.log(arr[2]); console.log(arr[3]); 显而易见，我们需要用到循环。 var arr = [10, 20, 30, 40]; for(var i = 0; i < arr.length; i++){ console.log(arr[i]); } 效果

JavaScript中一个非常重要的对象Array（数组）

plus21n — Sat, 05 Dec 2020 11:44:28 +0800

数组（Array）数组也是一个对象它和我们普通对象功能类似，也是用来存储一些值的不同的是普通对象是使用字符串作为属性名，而数组是使用数字来作为索引操作元素。索引：从0开始的整数数组的存储性能比普通对象好，在开发中经常使用数组来存储一些数据。创建数组对象创建数组 1.使用构造函数创建数组 var arr = new Array(); 2.使用字面量创建数组语法：【】，var arr = []; 使用字面量创建数组时，可以在创建时就指定数组中的元素。 var arr = [1, 2, 3,

js中让我头疼的this关键字

plus21n — Sat, 05 Dec 2020 10:47:33 +0800

this 关键字面向对象语言中 this 表示当前对象的一个引用。但在 JavaScript 中 this 不是固定不变的，它会随着执行环境的改变而改变。在方法中，this 表示该方法所属的对象。如果单独使用，this 表示全局对象。在函数中，this 表示全局对象。在函数中，在严格模式下，this 是未定义的(undefined)。在事件中，this 表示接收事件的元素。类似 call() 和 apply() 方法可以将 this 引用到任何对象。 ...

浅谈for循环

plus21n — Mon, 30 Nov 2020 16:00:07 +0800

JavaScript 循环如果希望一遍又一遍地运行相同的代码，并且每次的值都不同，那么使用循环是很方便的。不同类型的循环 JavaScript 支持不同类型的循环： for - 循环代码块一定的次数 for/in - 循环遍历对象的属性 while - 当指定的条件为 true 时循环指定的代码块 do/while - 同样当指定的条件为 true 时循环指定的代码块在这里，我们简单讨论一下for循环。 for循环 for 循环的语法： for (初始化表达式; 条件表达式; 条件更改表达式) {

JavaScript 中的数据类型

plus21n — Mon, 30 Nov 2020 14:45:49 +0800

JS中的数据类型值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。引用数据类型：对象(Object)、数组(Array)、函数(Function)。字符串（String）：字符串是存储字符的变量。字符串可以是引号中的任意文本。 var name = 'lihua'; 数字(Number)：JavaScript 只有一种数字类型。数字可以带小数点，也可以不带： var x = 1; var y = 2

CSS背景

plus21n — Mon, 30 Nov 2020 14:43:41 +0800

CSS 背景 CSS 中包含几个新的背景属性，提供更大背景元素控制。 CSS background-image属性 CSS中可以通过background-image属性添加背景图片。不同的背景图像和图像用逗号隔开，所有的图片中显示在最顶端的为第一张。 .example1 { background-image: url(backgound.jpg); background-repeat: no-repeat; 效果 CSS background-size 属性 background-siz

CSS分页

plus21n — Mon, 30 Nov 2020 14:39:17 +0800

简单分页如果你的网站有很多个页面，就需要使用分页来为每个页面做导航。

CSS浮动（float）

plus21n — Sun, 15 Nov 2020 21:55:24 +0800

什么是 CSS Float（浮动）？ CSS 的 Float（浮动），会使元素向左或向右移动，其周围的元素也会重新排列。 Float（浮动），往往是用于图像，但它在布局时一样非常有用。元素怎样浮动元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。一个浮动元素会尽量向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。浮动元素之后的元素将围绕它。浮动元素之前的元素将不会受到影响。如果图像是右浮动，下面的文本流将环绕在它左边： img { float:right; }

CSS盒子模型

plus21n — Sat, 14 Nov 2020 10:31:13 +0800

盒子模型（Box Model）所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。 CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：外边距，边框，填充（内边距），和实际内容。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。不同部分的说明： Margin(外边距) - 清除边框外的区域，外边距是透明的。 Border(边框) - 围绕在内边距和内容外的边框。 Padding(内边距) - 清除内容周围的区域，内边距是透明的。 Con

关于CSS

plus21n — Sun, 08 Nov 2020 19:59:43 +0800

什么是 CSS? CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在 CSS 文件中多个样式定义可层叠为一个样式表定义如何显示 HTML 元素，就像 HTML 中的字体标签和颜色属性所起的作用那样。样式通常保存在外部的 .css 文件中。我们只需要编辑一个简单的 CSS 文档就可以改变所有页面的布局和外观。

关于HTML（HTML5）

plus21n — Sun, 08 Nov 2020 18:49:45 +0800

HTML ：超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。 HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。 HTML 的关键是标签，其作用是指示将出现的内容。什么是HTML? HTML 是用来描述网页的一种语言。 HTML 指的是超文本标记语言: HyperText Markup Language