- 博客(14)
- 收藏
- 关注
RSS订阅原创 防抖和节流讲解
1.防抖(debounce)1.1 防抖讲解防抖，就是防止抖动。官方定义就是用户在触发一次事件后，又在规定的时间内多次触发相同的事件，每次触发都会清除上次事件，也就是说只会触发最后一次事件。但是在我看来，防抖用最通俗易懂的话来说，就是一个运送水泥的流水线车间，每次传送带都会将水泥送到最顶端，但是他不能掉下去到货舱里，只能通过在一定时间内传送带的下一次水泥传送过来，把它撞到货舱里面，直到传送带停止了，还会有一包水泥在最顶端。这袋水泥就好比我们最后触发的事件，传送带每次传送下一次水泥过来的时间就是我
2021-04-08 20:13:15
294
4
原创 JS中的普通事件绑定和事件监听（ addEventListener）
事件JS中的事件说白了就是在获取的页面元素上绑定触发和响应的机制。事件三要素普通的事件绑定<script> var box = document.getElementById('box'); box.onclick = function () { console.log('代码会在box被点击后执行'); }</script>事件监听<script>
2021-03-29 19:41:41
868
原创 NodeJs中的事件循环
在上期发表的博客中，我们详细讲述了一下JavaScript中的事件循环，我突然又想起来，NodeJS也是基于JavaScript语言的一种后台语言。那么他的事件循环跟Javascript中的事件循环有什么相同点又要什么区别呢？今天我们带着这样的疑问也来看看nodejs中的事件循环吧！1.事件循环如上图，大概就是nodejs中的事件循环基本流程。在进入后判断代码是否都为同步代码，如果都为同步代码，则不进入事件循环，直接结束。如果有异步代码，会进入相应的流程队列中。现在就让我们来介绍一下No..
2021-03-22 17:00:41
433
1
原创 JavaScript中的异步，事件循环，任务队列。
1.线程众所周知，在我们的概念中，JS是单线程多事件队列的脚本语言，但是这里的单线程只是指的是浏览器负责解析和执行JS代码只有一条线程，但是在浏览器的渲染进程是可以提供多条线程的（也就是我们说的异步。）JS 单线程 主线程 别人能够看到的线程 JS引擎 V8 1. GUI线程 子线程 听从主线程管理的 别人不能够看到的 webkit 2. 计时线程 子线程 管理两个定时器的，settimeout set...
2021-03-21 23:10:47
289
1
原创 在数组原型（Array.prototype）上写reverse，indexOf方法源码
1.reverse方法将数组中元素的位置颠倒，并返回该数组。数组的第一个元素会变成最后一个，数组的最后一个元素变成第一个。该方法会改变原数组。 Array.prototype.copyreverse = function(){ for(var i = 0,j=this.length-1;i<j;i++,j--){ var s = this[i]; this[i] = this[j];
2020-12-22 19:18:43
269
原创 在数组原型（Array.prototype）上写pop，shift，push方法源码
1.pop方法(从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度。) Array.prototype.addpop = function(){ var num = this[this.length-1] // 定义一个变量接收最后面的一个数即即将被删除的值 this.length-- // 数组长度减减-直接删除最后一项 return num // 返回被删除的值 }2.shift
2020-12-22 19:00:35
485
原创 js中数组的冒泡排序（升序，降序），逆序输出。
冒泡排序冒泡排序即将数组中相邻的两个数字依次进行比较，如果想要得到升序的结果，即把判断条件设为第一个数大于第二个数后就交换位置即可。如果想要得到降序的结果，即把判断条件设置为如果第一个数比第二个数小，就交换位置。运用双层for循环进行简单的遍历便可以得到js中的冒泡排序啦！var arr=[]; function Arr(arr){ //升序输出 for(var i = 0; i<arr.length;i++){ //遍历数组 for(var j
2020-12-03 20:51:46
3235
原创 js中的强制类型转换
转换为 数字类型Number() parseInt() 通过什么样的一个方法 用来 检测 数据的 数据类型 var a = 10; var b = 20; var c = "30"; var d = a + c; document.write(typeof(a)+a+" ") //number10 parseint 转换为整型 var ab = "123.2ab123a"; ab = parseInt(ab); alert(typeo..
2020-12-03 18:52:56
119
原创 CSS精灵图的使用
一.什么是精灵图？精灵图就是将很多很多的小图标放在一张图片上,就称之为精灵图二.精灵图的优点是什么？1.将多张图片合并到一张图片中，可以减小图片的总大小。2.将多张图片合并成一张图片后，下载全部所需的资源，只需一次请求。可以减小建立连接的消耗。三.实例演示在下列精灵图中找到放大镜实例代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <
2020-11-21 16:12:38
289
原创 html CSS之面试常见问题之总结
一. 简述你对语义化的理解？⒈用正确的标签做正确的事情⒉HTML语义化让页面的内容结构化，结构更清晰，便于对浏览器，搜索引擎解析；⒊及时在没有样式CSS情况下也以一种文档格式显示，并且时任意阅读的；⒋搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重，利于SEO；⒌时阅读源代码的人对网站更容易将网站分块，便于阅读维护理解二.元素的title属性和alt属性有什么区别？1.试用范围，浏览器表现 alt是img标签的属性，当图片加载出错、无法显示图像时会显示的替代文本。IE7以下
2020-11-17 23:18:39
177
原创 CSS元素属性的继承性探究和整理
1.继承顾名思义，就是子代元素继承祖先元素所带有的CSS属性，我们称之为继承。继承是一种规则，它允许样式不仅应用于某个特定html标签元素，而且应用于其后代。CSS继承是指设置上级（父级）的CSS样式，上级（父级）及以下的子级（下级）都具有此属性。那么让我们一起用代码去看看什么叫继承，又有哪些属性能够被继承呢？我选择了几个有标志性意义的属性来看看到底什么是继承。<style> .father{ font-size: 18px; color: red;
2020-11-17 20:02:47
331
原创 VScode前端常用插件整理与收集
VScodeVS是Microsoft Visual Studio的简称。VS是美国微软公司的开发工具包系列产品。VS是一个基本完整的开发工具集，它包括了整个软件生命周期中所需要的大部分工具，如UML工具、代码管控工具、集成开发环境(IDE)等等。所写的目标代码适用于微软支持的所有平台，包括Microsoft Windows、Windows Mobile、Windows CE、.NET Framework、.NET Compact Framework和Microsoft Silverlight 及Windo
2020-11-17 19:38:14
251
原创 解决浮动高度塌陷的四种办法
html部分代码<body> <div class="container clean"> <div class="demo">1</div> <div class="demo">2</div> <div class="demo">3</div> <div class="demo">4</div> &
2020-11-09 18:49:51
436
原创 如何用CSS实现一个简单的（二）三级菜单
#实现效果图如下1.写一个父类div用于包裹所有hove伪元素要显示的菜单。2.在父类div中写入一个子类div用于一级菜单<div class="father"> <div class="title">符文大陆</div>3.在父类div中写入二级菜单，因为我们需要行列展示，所以我们使用无序列表ul li标签<div class="father"> <div class="title">符文大陆<
2020-11-06 17:24:51
1220
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人