Javascript
JaniceDong
勤能补拙
展开
-
js之事件冒泡和事件捕获详细介绍
(1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发。 IE 5.5: div -> body -> document IE 6.0: div -> body -> html -> document Mozilla 1.0: div -> body -> html -> document -> window(2)捕转载 2017-02-06 10:54:18 · 420 阅读 · 0 评论 -
数组结构数据转树形结构
一组数组结构的数据,包含id以及pid(parentId),根据给出的数据把数组转换成树形结构数据var flatLs = [{ id: 1}, { id: 2}, { id: 3}, { id: 4, pid: 1}, { id: 5, pid: 3}, { id: 6, pid: 2}, { i...原创 2019-09-19 11:02:31 · 623 阅读 · 0 评论 -
ES6实现 数组扁平化去重并排序
数组扁平化去重var arr = [ [1, 2, 2], [3, 4, 5, 5,6], [6, 7, 8, 9, [11, 12, [12, 13, [14],15]]], 10];var result = Array.from(new Set(arr.flat(Infinity))).sort((a, b) => { return a - b...原创 2019-09-19 10:51:51 · 759 阅读 · 0 评论 -
DOMNodeInsertedIntoDocument和DOMNodeRemovedFromDocument与MutationObserver的不同
Mutation Observer API 用来监视 DOM 变动。DOM 的任何变动,比如节点的增减、属性的变动、文本内容的变动,这个 API 都可以得到通知。概念上,它很接近事件,可以理解为 DOM 发生变动就会触发 Mutation Observer 事件。但是,它与事件有一个本质不同:事件是同步触发,也就是说,DOM 的变动立刻会触发相应的事件;Mutation Observer 则是异步...原创 2018-06-21 10:36:14 · 6539 阅读 · 0 评论 -
判断元素是否在父元素中
在公司开发的项目中需要实现类似windows文件在查看效果为图片时的选中效果1、文件有图标和文件名组成,当能看到文件的这两个信息时,直接选中父元素有滚动条时不滚动2、文件显示不完整时(只显示文件名,只显示图标或部分图标),选中元素并使父元素滚动以显示文件的信息以下代码实现了判断元素的位置,元素该怎么移动,具体移动多少,根据文件大小和需求自行编写<div id="bo...原创 2018-04-20 10:08:54 · 1163 阅读 · 0 评论 -
在1到200中随机抽五个数,要求五个数之和是200
只是写出了自己认为的可以执行的程序,因为是随机生成的1-200内的数,所以程序可能在得到正确的五个数之前存在一定的运行时间。有好的思路欢迎评论纠正。function getRandom(){//获取五个数的时候首先保证五个数的和不大于200,如果大于200,此数组就没有意义了,以此减少程序的运行次数 var obj = {}; var arr = []; var add = 0; for(...原创 2018-04-13 10:01:35 · 1317 阅读 · 0 评论 -
获取指定class名的元素,并兼容IE
function getClassName(cls){ var ret = []; var el = document.getElementsByTagName("*"); for(var i = 0, len = el.length;i < len ;i ++){ if(el[i].className === cls || el[i].classN原创 2017-05-12 12:00:04 · 642 阅读 · 0 评论 -
JavaScript 实现反转字符串
JavaScript 实现反转字符串 var str = "abcdefg"; document.write(str.split("").reverse().join("")); 下面对例子中使用到的 JS 方法进行说明:1、j转载 2017-03-24 10:21:04 · 398 阅读 · 0 评论 -
获取指定父元素下指定类名的元素集合
function getByClass(clsName, parent){ var oParent=parent?document.getElementById(parent):document,boxArr=new Array(), oElements=oParent.getElementsByTagName('*'); for(var i=0;i原创 2017-03-14 14:40:55 · 5952 阅读 · 0 评论 -
弹出框式聊天窗口中含有iframe的拖拽问题
最近项目中遇到一个问题,在一个div里面包含iframe,通过拖拽iframe的一部分来改变div的位置,所有的代码已经写好,但是就是移动不了div,移动的话也是一闪一闪的,网上看了很多资料,最终得出来一个结论拖拽iframe是不能改变父div的位置的,违背了一些浏览器的原则,因此,这个问题就放那了,今天换了一个角度,如果在div里面放一个div,通过拖动子div是可以改变父div的位置的,因此我原创 2017-02-09 12:07:42 · 1605 阅读 · 0 评论 -
防抖和节流
在前端开发的过程中,我们经常会需要绑定一些持续触发的事件,如 resize、scroll、mousemove 等等,但有些时候我们并不希望在事件持续触发的过程中那么频繁地去执行函数。防抖:是指触发事件后在 n 秒内函数只能执行一次,如果在 n 秒内又触发了事件,则会重新计算函数执行时间(多次触发事件,每次触发时会重新计算时间,最后一次触发之后在n秒内执行一次)。节流:是指连续触发事件但是在...原创 2019-09-19 11:12:04 · 167 阅读 · 0 评论