JavaScript实现扁平数组与树结构的相互转换

4 月 6 日
阅读 4 分钟
125
扁平数组转为树结构题目描述:给定以下数据格式的扁平数组: {代码...} 你需要将其转换为以下树状结构: {代码...} 请编写一个名为 flatArrayToTree 的函数,接受上述类型的扁平数组作为参数,并返回相应的树状结构数组。方案一:使用Map和递归 {代码...} 方案一解释首先,我们创建一个 Map 来存储每个节点及其子节点列...

JavaScript 中的复制粘贴操作

2021-09-03
阅读 6 分钟
9.7k
Clipboard API 提供了响应剪贴板命令(剪切、复制和粘贴)与异步读写系统剪贴板的能力。从权限 API (Permissions API) 获取权限之后,才能访问剪贴板内容;如果用户没有授予权限,则不允许读取剪贴板内容。

JavaScript中对光标和选区的操作

2021-06-21
阅读 12 分钟
6.5k
在一些业务场景,比如高亮文本、输入编辑、等场景中需要对光标和选区进行操作时,可以使用浏览器提供的 Selection 对象和 Range 对象来操作光标和选区。

JavaScript导出excel文件,并修改文件样式

2020-05-28
阅读 10 分钟
18.5k
因为最近需要实现前端导出 excel 文件,并且对导出文件的样式进行一些修改,比如颜色、字体、合并单元格等,所以我找到了 xlsx-style 这个项目,它可以对导出的 excel 文件进行一些样式上的修改,这个项目是 SheetJS 的一个分支。其实 SheetJS 也是支持修改导出文件的样式的,不过是在它的专业版中, SheetJS 分为社区版...

跨站请求伪造—CSRF

2019-11-26
阅读 5 分钟
17.8k
CSRF,是跨站请求伪造(Cross Site Request Forgery)的缩写,是一种劫持受信任用户向服务器发送非预期请求的攻击方式。

跨站脚本攻击—XSS

2019-09-17
阅读 6 分钟
14k
XSS 是跨站脚本攻击(Cross Site Scripting)的简写,但是从首写字母命名的方式来看,应该取名 CSS,但这样就和层叠样式表(Cascading Style Sheets,CSS)重名了,所以取名为 XSS。

CSS 绘制各种形状

2019-03-28
阅读 8 分钟
7.7k
使用 CSS 可以绘制出许多形状,比如三角形、梯形、圆形、椭圆,等 并不只是可以绘制矩形。下面来看看怎么实现这些形状的吧。为了容易理解,文章分为基本形状 和 组合形状来说,基本形状是比较容易实现的,而利用这些基本形状进行组合,就可以实现稍微复杂点的组合形状了。

关于 ES6 中 Promise 的面试题

2018-10-30
阅读 8 分钟
24.3k
首先 Promise 新建后立即执行,所以会先输出 1,2,而 Promise.then() 内部的代码在 当次 事件循环的 结尾 立刻执行 ,所以会继续输出4,最后输出3。

用 canvas 的 getImageData 做点有趣的事

2018-09-18
阅读 4 分钟
8k
CanvasRenderingContext2D.getImageData() 返回一个 ImageData 对象,用来描述 canvas 区域隐含的像素数据,这个区域通过矩形表示,起始点为(sx, sy)、宽为sw、高为sh。

学习 canvas 的 globalCompositeOperation 做出的神奇效果

2018-08-30
阅读 7 分钟
7.8k
最早知道 canvas 的 globalCompositeOperation 属性,是在需要实现一个刮刮卡效果的时候,当时也就是网上找到刮刮卡的效果赶紧完成任务就完了,这次又学习一次,希望能加深理解吧。

小程序—九宫格心形拼图

2018-07-31
阅读 5 分钟
6.6k
感觉很有趣,就上网查了查怎么做,大部分的说法就是用美图秀秀的拼图功能来做, 在微信小程序中也有专门做心形拼图的小程序,我都试了试之后,感觉还可以更加简单一些,于是我就自己做了个小程序。

JavaScript中的函数重载(Function overloading)

2018-07-11
阅读 6 分钟
9.8k
说明 JavaScript 中没有真正意义上的函数重载。 函数重载 函数名相同,函数的参数列表不同(包括参数个数和参数类型),根据参数的不同去执行不同的操作。 我们举个例子看看 {代码...} 在JavaScript中,同一个作用域,出现两个名字一样的函数,后面的会覆盖前面的,所以 JavaScript 没有真正意义的重载。 但是有各种办法,...

一个浪漫又悲情的爱情故事——笛卡尔心形线

2018-06-10
阅读 7 分钟
9.4k
写这篇文章是因为某天看到这样一个公式 r=a(1-cosθ) ,我上网搜了下,原来是笛卡尔心形线的极坐标方程,这个方程里面的确有一个浪漫又悲情的爱情故事,感兴趣的朋友可以点这里看看,而至于这个故事是真是假,这 并不重要。

CSS中用 opacity、visibility、display 属性将 元素隐藏 的 对比分析

2018-05-31
阅读 13 分钟
15.8k
opacity 用来设置透明度 display 定义建立布局时元素生成的显示框类型 visibility 用来设置元素是否可见。 opacity、visibility、display 这三个属性分别取值 0、hidden、none 都能使元素在页面上看不见,但是他们在方方面面都还是有区别的。

JavaScript实现爆炸碎片的 图片切换 效果

2018-05-13
阅读 6 分钟
3.9k
实现这个效果的思路就是,一个大的div元素,设置好一个背景,生成一定数量小的div元素,背景设置成同样的图片,但是每个小div元素的 background-position 属性值不同,整齐的覆盖在大的div元素上,这样就能拼成一张完整的背景图,鼠标移入时,让所有小的div元素移动和变形。总的来说就是两步:1、生成小的div元素,整齐...

JavaScript实现 超范围的数 相加

2018-05-02
阅读 2 分钟
3.6k
实现 字符串类型的数字 相加的一个方法。比如:输入 '11111111111111111' ,'22222222222222222',返回 '33333333333333333'

canvas实现 漂亮的下雨效果

2018-04-17
阅读 10 分钟
6.6k
看图来分析下,我们需要实现哪些效果。1、雨滴下落效果,移动鼠标控制下落方向 2、雨滴下落散成小水珠,小水珠的移动方向和鼠标移动方向相同3、雨滴下落到鼠标坐标一定范围内,散成小水珠,同样的,小水珠的移动方向也和鼠标移动方向相同

JavaScript实现冒泡排序 可视化

2018-04-04
阅读 3 分钟
6.9k
实现这个效果,思路是这样的 1、先将需要排序的数组,进行冒泡排序,记录每一步的内容,存放在一个数组中2、利用canvas,实现一个 darw 方法,能将一步的内容画到页面上 3、实现动画效果,利用定时器,每隔一段时间,调用 darw 方法,画出一步到页面上

JavaScript实现冒泡排序

2018-04-04
阅读 3 分钟
31.3k
数组中有 n 个数,比较每相邻两个数,如果前者大于后者,就把两个数交换位置;这样一来,第一轮就可以选出一个最大的数放在最后面;那么经过 n-1(数组的 length - 1) 轮,就完成了所有数的排序。

JavaScript实现 满天星 导航栏

2018-03-07
阅读 5 分钟
3.4k
实现这个效果,需要掌握的知识不用很多,知道简单的CSS,会用JS 获取元素, 能绑定事件基本就足够了。 好的,我们直接来看代码,注释已经写的很详细了,不想看有注释的,点这里。

jQuery中的isPlainObject()方法 实现原理

2018-02-27
阅读 3 分钟
4.5k
这个方法的作用是为了跟其他的 JavaScript对象如 null,数组,宿主对象(documents),DOM 等作区分,因为这些用 typeof 都会返回object。

简单说 JavaScript中的事件委托(下)

2017-12-29
阅读 4 分钟
2.1k
上面这段代码,用了事件委托,把事件绑在了ul上,没有给每个 li 都去绑定事件,看上去也是实现效果了,但是如果 li 里面还有子元素,那么这么去绑定事件就不行了,当点击 li 里面的子元素时,就出现问题了。 比如,我们把上面的代码改成这样,看看效果。

简单说 JavaScript中的事件委托(上)

2017-12-29
阅读 5 分钟
5k
事件委托,你叫他 事件代理 也可以,都是一个意思。 事件:JavaScript 侦测到的行为就是事件,比如鼠标点击、某个键盘的键被按下、元素获得焦点。 委托:就是把原来自己做的事,交给别人做。

简单说 JavaScript实现雪花飘落效果

2017-11-30
阅读 6 分钟
11.1k
setTimeout() setTimeout函数用来指定某个函数或某段代码,在多少毫秒之后执行。它返回一个整数,表示定时器的编号,以后可以用来取消这个定时器。

简单说 chrome浏览器 必知必会的小技巧

2017-11-24
阅读 4 分钟
8.6k
这篇文章主要介绍的就是一些chrome浏览器的小技巧,很简单,希望对大家有所帮助。 这其中的一些小技巧在低版本中是没有的,所以建议大家用最新版的,目前最新版是62,版本很重要,如果发现有些技巧不起作用,请先查看浏览器的版本。

简单说 JavaScript的箭头函数

2017-11-19
阅读 4 分钟
9.5k
写箭头函数,我们记住一个顺序就好,参数、箭头、函数体、这个顺序记住就足够了,参数、箭头、函数体、这三个是必须的,函数名可以没有,但这三项必须有,一些简写的方式也是简写这三项里的东西。

简单说 通过CSS实现 文字渐变色 的两种方式

2017-11-06
阅读 3 分钟
61.3k
说明 这次的重点就在于两个属性, background 属性 mask 属性 这两个属性分别是两种实现方式的关键。 解释 方式一 效果图 代码 {代码...} 代码不多,我们来看看, background: linear-gradient(to right, red, blue); 这行是给背景设置为渐变色,这里注意一点,这样是简写了,其实是给background-image 设置为渐变色,不...

简单说 正则表达式——要注意lastIndex属性

2017-11-06
阅读 3 分钟
4.4k
每个RegExp对象都包含5个属性,source、global、ignoreCase、multiline、lastIndex。 source:是一个只读的字符串,包含正则表达式的文本。

简单说 CSS中的 object-fit 与 object-position

2017-11-06
阅读 4 分钟
10.1k
问题: 一个div宽度不固定,高度固定,采用Flex布局,它里面有两个元素一个img宽度占40%,高度占100%,一个p元素,宽度占60%,高度占100%,调整浏览器窗口大小,要保证,img元素不变形,宽高比不变,怎么办!

简单说 一道JS闭包面试题

2017-11-05
阅读 3 分钟
5k
这段代码,我相信大家应该知道最后为什么结果会是 1 和 报错 的,在函数内声明的变量只在函数体内定义,它们是局部变量,作用域是局部的,所以 函数 fun1 调用后,找不到a,就报错了,JavaScript采用词法作用域,函数的执行依赖于变量作用域,这个作用域是在函数定义时决定的,所以我们只要改改上面函数 fun1的位置,它...