- 博客(40)
- 资源 (1)
- 收藏
- 关注
RSS订阅转载 js中的数据类型，以及如何检测数据类型
基本数据类型：string，number，boolean，null，undefined，symbol引用数据类型：object（array，function…）常用的检测数据类型的方法一般有以下三种：typeof 一般主要用来检测基本数据类型，因为它检测引用数据类型返回的都是object还需要注意的一点是：typeof检测null返回的也是object（这是JS一直以来遗留的bug）typeof 1"number"typeof 'abc'"string"typeof true"boo
2020-07-10 20:53:33
220
转载 JavaScript数组去重（12种方法，史上最全）
JavaScript数组去重（12种方法，史上最全）转载自：https://segmentfault.com/a/1190000016418021?utm_source=tag-newest数组去重，一般都是在面试的时候才会碰到，一般是要求手写数组去重方法的代码。如果是被提问到，数组去重的方法有哪些？你能答出其中的10种，面试官很有可能对你刮目相看。在真实的项目中碰到的数组去重，一般都是后台去处理，很少让前端处理数组去重。虽然日常项目用到的概率比较低，但还是需要了解一下，以防面试的时候可能回被问到。
2020-06-29 10:15:14
262
原创 jQuery 动画详解——比js动画更方便的方法
jQuery 标准动画通过类似于动画的形式,来完成标签的显示隐藏实际上,本质,就是我们之前写的 运动函数通过 定位的 left top 属性 和 透明度 opacity 来完成效果1. $(标签).show() 显示语法 : $(标签).show(时间,运动曲线,运动结束时执行的函数)运动到指定的位置,也就是css样式,定义的标签位置离那里进,就从那里开始运动离 左上角近 就从...
2020-04-29 00:14:45
264
原创 了解jQuery ，jQuery 选择器和筛选器总结
在说选择器和筛选器之前，首先我们来了解一下什么是jQuery：jQuery 的简介什么是jQueryjQuery是 一个前端的方法库也就是别人将JavaScript程序,定义成了各种函数方法,我们直接写直接用,就可以实现各种功能jQuery的网站官网 : https://jquery.com/中文网站 : http://jquery.cuishifeng.cn/jquery的三大优...
2020-04-28 02:21:53
379
原创 ajax请求及其用法详解
什么是ajax首先，ajax中的四个字母的意思分别是：a : async 异步j : JavaScripta : andx : XMLajax请求是一个异步的 JavaScript 和 XML 的数据交互ajax技术最初只能和 XML格式的内容进行交互现在发展到可以和任意的后端程序内容进行交互现在是前后端数据交互的主要手段超链接跳转传参和form表单跳转传参都必须要跳转页...
2020-04-27 00:13:10
1561
原创 用 js 实现购物网站中的商品放大镜效果
首先说一下原理，以天猫某商品放大镜效果为例：所谓的放大镜效果，其实也是欺骗我们眼球的一种效果，这里我们可以看到，图片显示去下面那一排小图与遮盖层的图片和放大层的图片其实是一样的，只是分辨率不同，所以实现放大镜效果，就需要这么几组分辨率大小不同，但是图片内容相同的图片：显然，小图中放的就是我这里图片名中带有small的小图了，遮盖层就是正常大小的图，放大层就是带有big的放大的图了，然后再加入适...
2020-04-15 01:07:46
1040
原创 JavaScript ES6的构造函数语法
ES5的构造函数有一些问题最大的问题，就是定义 prototype 是在函数之外定义的调用构造函数，生成实例化对象，一定要在定义 prototype 之后否则生成的实例化对象，只有属性没有函数方法ES6中，新增语法形式 class 类是一种新的定义构造函数的语法作用和原理与ES5语法完全相同只是语法格式和书写方式，不同实例ES5的构造函数语法// 如果先调用构造函数,只有属性没...
2020-04-13 21:29:43
625
原创 JavaScript 面向对象之工厂模式与构造函数详解
面向对象什么是面向对象？所谓的面向对象，是一种编程思想，编程思路，代码的书写格式。之前为了简化代码，我们是将程序封装为函数的形式来调用函数会有一些小问题:：函数内部定义的局部作用域变量，函数外部无法直接调用函数调用使用时，会占用大量的系统内存，容易造成数据溢出数据泄露，容易被黑客攻击函数一般只是封装一些模块化的功能复杂程序的封装会 封装成其他形式，使用面向对象的方式来封装程序。面...
2020-04-12 20:43:18
199
原创 JavaScript ES6语法之箭头函数及其this指向问题
箭头函数所谓的箭头函数是函数的另一种语法形式。语法规则const fun = function(){} 普通函数const fun = ()=>{} 箭头函数将匿名函数的部分,从 function(){} 写成 ()=>{} 的形式实例<div>我是div</div><script> const ...
2020-04-10 00:00:36
480
3
原创 JavaScript 正则表达式常用规范及其符号类型
基本概念正则表达式是对字符串内容，进行格式和内容的验证对于正则表达式，我们不用自己去写，所有常用的正则表达式，在网上都可以搜到，我们只需要能看懂，会使用所有的计算机语言，正则表达式 都是相同的，通用基本语法字面量(常用)使用 // 来包裹表达式内容：var 变量 = /正则表达式/构造函数var 变量 = RegExt(‘正则表达式’);正则表达式的使用方法验...
2020-04-09 00:32:13
654
1
原创 JavaScript 经典轮播图的代码实现
轮播图大概都是什么样的呢，我们以淘宝网首页这个样式为例：这是个很经典的轮播图，这里有五张图轮序自动播放，鼠标移上去时它会自动停下来，鼠标移开时它又会继续自动播放，下方的五个按钮和左右按钮都可以控制轮播图的播放顺序。那么接下来我们就亲自动手实现以下这种效果：1. 构建html结构<div class="banner"> <ul> <li&...
2020-04-08 02:01:50
1878
原创 JavaScript 冒泡事件 / 事件的传播
冒泡事件定义子级标签触发事件，JavaScript中，父级程序默认也会触发相同类型的事件，这样的效果，称为冒泡事件。规则只与标签在HTML中的层级关系有关，与css和显示效果无关执行顺序，都是从当前标签向父级元素，执行实际的标签的捕获顺序是有区别的： IE浏览器是 从 子级向父级 获取标签，称为 冒泡机制 其他浏览器 是 从 父级向子级 获取标签，称为 捕获机制 虽然...
2020-04-06 23:13:19
134
原创 JavaScript 事件监听用法及其兼容
事件的监听如果是普通的事件绑定，相同事件类型，只能绑定一个事件处理函数；如果同一个类型，绑定多个事件处理函数，后绑定的事件会覆盖之前绑定的事件。如果想同时绑定多个事件处理函数，可以用事件监听解决。语法规则标签对象.addEventListener(事件类型 , 事件处理函数，参数3)事件的获取方式： 冒泡 : 从子级开始,向父级执行 捕获 : 从父级开始,向子级执行第三个参数...
2020-04-02 22:44:44
316
1
原创 如何利用js实现选项卡效果（超简单）
在开始写我们的选项卡之前，先来看一下最终实现的大概效果：那废话不多说，接下来就看看如何去实现这个效果。首先，利用我们的 html 和 css 基础，写出选项卡的基本布局：html代码：<div class="news"> <ul> <li class="active">标题1</li> <li>标题2</li&g...
2020-04-02 01:46:30
5325
2
原创 button标签与input标签的区别
button标签与input标签都有作为按钮的功能，那么它们之间到底有什么区别呢，实际项目中我们应该如何选择呢？，下面我们就来具体了解一下：input标签作为按钮，有3种 type 效果：1. 提交按钮 点击提交数据<input type="submit" style="color:red;font-size: 50px;">2. 刷新按钮 点击恢复默认数据<inp...
2020-04-01 02:24:13
6705
原创 js获取元素占位之offsetLeft、offsetTop用法
offsetLeft offsetTopoffsetLeft： 到定位父级左边界的间距。offsetTop： 到定位父级上边界的间距。规则每一个标签对象，都有一个属性，叫 offsetParent ，表示这个标签的定位父级对象是谁。我们先设定好标签的样式，下面规则中的demo都是在带有该样式的基础上更改或执行的：*{ margin: 0; padding: 0;}...
2020-03-30 21:23:17
2344
原创 用 js 设定标签的样式，并解决语法兼容性的问题
设定标签的样式1. 给标签设定样式语法标签对象.style.属性 = 属性值2. 获取标签设定的样式语法标签对象.style.属性实例var oDiv = document.querySelector('div');// 通过 标签对象.style.属性 = '属性值'// 设定的是标签的行内样式// oDiv.style.color = 'red';// 获取样式...
2020-03-29 03:30:14
320
原创 使用js设定标签属性，利用循环遍历给标签添加事件
设定标签属性给标签添加属性语法标签对象.setAttribute('属性名称' , 属性值);一次只能定义一个属性，如果要定义多个属性，要执行多次。例如：标签对象.setAttribute('属性名称1' , 属性值1);标签对象.setAttribute('属性名称2' , 属性值2);获取标签属性的属性值语法标签对象.getAttribute('属性名称');获取到的...
2020-03-27 21:40:38
2678
原创 js中浏览器常见事件；如何获取页面中的标签
BOM操作之浏览器常见事件什么是事件？所谓的事件,就类似于一个约定。当触发条件时，就会执行 指定的程序 。例如：clcik 点击事件给标签绑定点击事件，当标签触发 点击条件时 执行绑定的程序。如何添加事件例如：clcik 点击事件给标签绑定点击事件 当标签触发 点击条件时 执行绑定的程序click 点击事件 --- 事件类型onclick 绑定点击事件...
2020-03-27 11:14:58
1496
原创 JavaScript date对象的补充，异步执行规则，BOM操作之弹窗、获取浏览器滚动条
上次说了date对象的获取方法和应用，这次补充一下它的参数写法规则以及设定方法：date 对象参数的写法方法1:常用方法语法规则一个字符串，来表示指定的时间。年月日，时分秒，都设定完整。'2000-10-12 8:30:00''2000/10/12 8:30:00''2000 10 12 8:30:00''2000,10,12 8:30:00'这四种设定方法都是正确的。实...
2020-03-26 02:07:11
172
原创 JavaScript Math对象和date对象的应用，定时器与延时器的应用，以及如何制作动态时钟
Math 对象中常用的方法Math.random() 方法创建一个介于0~1之间的随机数，不包括1。常用于创建两个数之间的随机数。语法Math.random()*(b+1-a) + a实例// 输出1~10之间的随机整数console.log(parseInt(Math.random()*(10+1-1)+1));Math.round() 方法四舍五入保留小数。实例va...
2020-03-25 00:14:23
277
原创 JavaScript 对象的操作方法，常用的数组去重方法以及严格模式的了解
对象 — 也是数据的集合。对象与数组的异同数组： 索引值 —> 数据 有 length 属性 必须自己定义 数据的键名 和 数据的数值。对象： 键值对形式：键名 —> 数据、键名 = 数值 的形式 没有 length 属性 数组中,直接定义数据,索引是JavaScript程序自动添加的。对象的 属性/键名 功能就类似于数组的 索引下标。数组中的数据，可以是...
2020-03-24 01:28:23
181
原创 JavaScript 数组中的冒泡排序和选择排序
冒泡排序原理相邻的两个单位，比较存储的数据如果第一个单元的数据较大，就将两个相邻单元交换存储数据过程从起始单元开始比较,第一次循环,会选择出一个最大值,放在数组所有单元的最后之后,每次循环,都会比较出一个本次循环的最大值,放在当前参与比较单元的最后之前已经比较选出的单元,不会参与下一次比较排序的优化1. 单次循环,最后一个单元,通过倒数第二个单元,参与比较 最后...
2020-03-22 18:10:49
170
原创 JavaScript 深浅拷贝，数组循环遍历，数组去重，截取扩展名，屏蔽关键词......
深浅拷贝要解释深浅拷贝，就不得不说一下引用类型的赋值操作，这里我们在demo中看一下什么叫深拷贝与浅拷贝。引用类型的赋值操作1. 简单数据类型/基本数据类型实例// 此时 str1 中存储的是 数据 北京var str1 = '北京';// 将 str1 中存储的数据北京 赋值给 str2 var str2 = str1;// 之后对str1 的操作,与str2,无关str...
2020-03-21 01:46:51
263
原创 JavaScript 如何增删查改数组中的数据单元
数组的操作方法1. 通过 索引下标 增删查改实例（1）通过索引下标，调用数组中，指定单元的数据var arr = ['北京','上海','广州','重庆','天津'];// arr[0] ---> 调用索引下标是 0 ,实际是第一个单元的数据 北京（2）通过索引下标，来修改数组中，存储的单元的数据// 对已存在的索引下标,进行赋值,进行的是重复赋值,会覆盖之前存储的数据ar...
2020-03-20 01:15:39
242
原创 JavaScript 了解数组及其使用并学习用数组生成HTML表格
数组的基本介绍定义所谓的数组，就是数据的集合。数组中的数据单元，可以是任意形式的数据内容，比如可以是一个数组,对象,函数等等。数组是JavaScript中，一个非常重要的数据类型。后端接口返回给我们的数据形式，往往都是数组的形式。索引/下标JavaScript会给数组中的单元自动添加序号，我们称这个序号为 索引/下标。通过 索引/下标，可以获取到对应的数据。所有计算机语言的 索引/下标...
2020-03-18 23:20:27
790
原创 JavaScript 如何理解预解析，作用域，函数变量的调用赋值以及递归函数
JavaScript 预解析/预解释JavaScript 是弱类型、解释型的脚本语言。JavaScript 是解释型计算机语言，在程序执行之前，会先将定义的程序，预先解释，也就是预先模拟执行一遍，会找程序中的关键词 var function 两个关键词。实例// 先输出// 如果是没有使用 var 关键词声明的变量,执行结果是会报错 // 如果使用 var 关键词声明的变量,执行结...
2020-03-17 23:47:29
285
原创 JavaScript 如何定义及调用函数，如何写函数说明
在实际操作前，先来了解一下JavaScript 函数的一些概念，认识一下JavaScript 函数：JavaScript 函数的基本概念JavaScript 函数是实现固定功能的代码块。函数是工具，是实现功能的工具。函数是通过其中的代码，来实现所谓的功能。函数的作用封装： 将需要的代码，写入到函数中重复： 一个函数可以反复调用调用： 可以在任意需要位置上调用执行代码函数的定义（封...
2020-03-17 01:03:09
1589
原创 JavaScript for循环及其嵌套并用其制作99乘法表
for 循环所谓的for循环，是完全等价于 while 循环。任何一个for循环都可以写成while循环，任意一个while循环也可以写成for循环。for循环是应用最广泛的循环形式，适用于已知循环次数，循环嵌套情况。语法for (语句 1; 语句 2; 语句 3) { 循环体;}语句 1 设定循环变量的初始值语句 2 判断进入循环的条件语句 3 步长特别注意的是...
2020-03-14 03:07:49
1078
原创 JavaScript 03-12条件语句与while循环
if 语句语法1. if( 表达式 ){执行程序}当表达式的结果为true，执行程序，当表达式的结果为false，没有执行程序。实例// 当月薪超过 10W , 可以获得 零花钱 100 元// 当月薪小于 10W , 就没有零花钱var pay = 50000;if(pay > 100000){console.log('恭喜我自己,获得 100 元零花钱');}2....
2020-03-13 00:26:52
211
原创 JavaScript 03-11
JavaScript中的运算符定义所谓的运算符，就是操作变量的符号。在计算机程序中，使用特殊的定义好的符号，来对变量中的数据进行操作。运算符的分类算术运算符 / 数学运算符 + - * / % 赋值运算符 = += -= *= /= %= 比较运算符 > < >= <= == =...
2020-03-11 23:56:11
97
原创 JavaScript 03-10
定义未赋值和未定义的变量的区别// 定义未赋值 只是定义了变量,但是没有给变量进行赋值操作var int1 ;console.log(int1); // 未赋值 执行结果是 undefined// 直接使用一个没有定义过的变量console.log(int2); // 未定义 执行结果是 报错NaNNaN，not a number 不是一个数值，是表示存储的数据的数据...
2020-03-11 01:28:42
327
1
原创 JavaScript 03-09日结
JavaScript的基本介绍- JavaScript是什么？JavaScript 是互联网上最流行的脚本语言，是一种轻量级、弱类型的脚本语言。- JavaScript 有什么作用？实现页面的交互 :用户操作的交互数据的交互- JavaScript 三大组成部分1. ECMAScript（核心） - JavaScript 的语法（描述了该语言的语法和基本对象）2. B...
2020-03-10 01:03:15
148
原创 Html+CSS常用要点及易错点归纳（二）
本次主要总结了CSS中的零碎知识点，也是每个学习CSS的朋友们需要了解或者记住的：CSS 相关点：- 复合样式书写顺序：1. background属性： 复合的值是通过空格隔开的，并且没有顺序要求。这里有个小技巧，CSS3中背景图片有个background-size属性，也是可以写进复合样式中的，举个例子：background: url() no-repeat center top / ...
2020-03-08 19:29:05
474
1
原创 常用的CSS命名规则
一.注释的写法:/* Footer /内容区/ End Footer */二.id的命名:页面结构容器: container页头：header内容：content/container页面主体：main页尾：footer导航：nav侧栏：sidebar栏目：column页面外围控制整体布局宽度：wrapper左右中：left right center导航导航...
2020-03-07 21:10:58
133
原创 Html+CSS常用要点及易错点归纳（一）
最近回顾html和css相关知识的时候，发现很多零碎的知识有些遗忘，所以这里总结归纳一下，既方便我自己的记忆，大家也能一起回顾一下，看看你都记全了吗。今天先来说说html的相关知识点：Html 相关点：- 文件的命名规范小写英文字母、数字、下划线的组合，其中不得包含汉字、空格和特殊字符；必须以英文字母开头。 eg： goods_iphone_1000.html- Html语义化含义：...
2020-03-07 20:48:36
677
原创 如何利用CSS制作简易旋转木马效果
最近回顾动画知识的时候，看到了3d相关的知识，想到了当时学CSS 3动画的时候做的一个旋转木马还挺好看的，今天就来说说怎么用CSS3的变形（transform）和动画（animation）的相关知识做一个简单的3d版的旋转木马效果。准备工作首先，想做这个动画，我们要先了解用到的相关属性。变形transform:通过这个属性，我们可以对元素进行位移、旋转、缩放、倾斜等操作，其中最常用的就是位...
2020-03-06 01:43:35
1145
原创 2020-03-03学习日结
由于时间问题，今天就先不整理了…HTML5新语义化标签 ( 很重要的 )div span h1 img -> html4.01width height background -> css2.1transform border-radius -> css3header footer main -> html5注：很多新的HTML5语义化标签，跟div类似。h...
2020-03-04 02:49:07
223
原创 网格布局的简单应用（display: grid;）
我们在做布局的时候经常会发现有些地方的宽高排列都非常规则，而且有多行内容，这时使用网格（grid）布局就非常的方便快捷了。那么接下来我们做个简单的九宫格来看看该如何使用该布局：实例很明显九宫格就是九个小方块，那么我们可以用一个大盒子去套九个小盒子：<div id="main"> <div class="box1"></div> ...
2020-03-01 20:17:02
753
1
原创 定义一个简单的CSS3动画
通过CSS3，我们无需javascript也可以创建一些简易的动画效果，下面我们来看一下相关的属性和规则。CSS3 animation属性通过animation属性，我们可以给元素附加动画效果及样式，下表列出了animation属性的值：属性功能animation-name定义动画的名称animation-duration定义动画运行一个周期花费的时间an...
2020-02-23 22:02:59
688
JavaScript 轮播图.rar
2020-04-08
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人