什么是冒泡? DOM事件流(event flow )存在三个阶段:事件捕获阶段、处于目标阶段、事件冒泡阶段。...事件冒泡**(***dubbed bubbling***)**:与事件捕获恰恰相反,事件冒泡顺序是由内到外进行事件传播,直到根节点。...dom标准事件流的触发的先后顺序为:先捕获再冒泡,即当触发dom事件时,会先进行事件捕获,捕获到事件源之后通过事件传播进行事件冒泡。...参数 useCapture 是选填的,填true或者false,用于描述事件是冒泡还是捕获,true表示捕获,默认的false表示冒泡。...") }); div2.addEventListener('click',function(){ console.log("div2--冒泡阶段"
算法简介 冒泡排序是一种简单的排序算法。它重复地走访过要排序的数列,一次比较两个元素,如果它们的顺序不符合要求就把它们交换过来。...时间复杂度和空间复杂度 再谈谈冒泡排序的时间复杂度和空间复杂度吧!
冒泡排序: 冒泡排序是一种简单的排序算法。 它重复地走访过要排序的数列,一次比较两个元素,如果他们的顺序错误就把他们交换过来。
停止事件传播 事件对象还提供了一个.stopPropagation()方法,该方法能够全然阻止事件冒泡。
// 冒泡排序 var arr = [2, 4, 1, 6, 7, 8, 33, 11,77,88,99,3,100]; function sort(array
实例 当点击id为i3的时,浏览器会依次弹出3 2 1,这就是事件冒泡,此正方形处于叶节点上,对其操作的事件会向上进行冒泡,直到根节点。 JS事件冒泡及阻止 div{...DOCTYPE html> JS事件冒泡及阻止 li{...有时候我们并不希望事件冒泡而去执行上级节点绑定的事件,这时候就需要阻止事件的冒泡,w3c的方法是e.stopPropagation(),IE则是使用 window.event.cancelBubble...注意 不是所有的事件都能冒泡。以下事件不冒泡:blur、focus、load、unload。 事件解决方案方式在不同浏览器,可能是有所区别的,有些不支持捕获型方案,多数浏览器默认冒泡型方案。
相反的,事件冒泡是自下而上的去触发事件。绑定事件方法的第三个参数,就是控制事件触发顺序是否为事件捕获。true,事件捕获;false,事件冒泡。默认false,即事件冒泡。...Jquery的e.stopPropagation会阻止冒泡,意思就是到我为止,我的爹和祖宗的事件就不要触发了。...事件的触发顺序自内向外,这就是事件冒泡。...方法: 阻止事件冒泡 和默认行为。 事件冒泡: ? 阻止默认行为: ?
事件机制 ---- 事件触发三个阶段: window往事件触发处传播,遇到注册的捕获事件会触发 传播到事件触发处时触发注册的事件 从事件触发处往window传播,遇到注册的冒泡事件会触发 事件触发一般会按照...|------------------------------------------- 但是有一个特例:如果给body中的子节点同时注册冒泡和捕获事件,事件触发会按照注册的顺序执行。...// 以下会先打印冒泡然后是捕获node.addEventListener( 'click', event => { console.log('冒泡') }, false)node.addEventListener...此时进入冒泡阶段,inner上的时间处理器得到执行 事件命中元素后开始向上冒泡,一路查找是否注册了冒泡阶段的祖先元素上的时间处理器。由于没有找到因此什么也没发生。...我们把时间注册在冒泡阶段(addEventListener的useCapture选项为false) var selector = document.querySelector.bind(document
事件冒泡: 事件冒泡由IE团队提出来的,即事件开始由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播。...IE9,chrome,Firefox,Opera,Safari都支持事件冒泡,并将事件冒泡到window对象。 如下,点击obj3,依次弹出obj3、world、hello。...addEventListener('click', function () { alert('obj3'); })//依次弹出obj3、world、hello 阻止事件冒泡的方法...: 方式一:event.stopPropagation(); 方式二:return false; return false 不仅阻止了事件往上冒泡,而且阻止了事件本身。...event.stopPropagation() 则只阻止事件往上冒泡,不阻止事件本身。
// 冒泡排序 // 原理就是每一轮循环,将一个最大的值放冒泡到最后 // 1.每一趟都是比较相邻两个元素,如果后一个元素大于前一个,则交换两个元素 // 2.第一趟从第一个元素开始进行交换,最后一个元素不参与交换...if (arr.length < 2) { return arr; } // 定义 count 代表执行了趟循环 let count = 0; // 冒泡排序排的趟数...; } } } console.log(`执行了${count}趟循环`); return arr; } console.log("普通冒泡排序...if (arr.length < 2) { return arr; } // 定义 count 代表执行了趟循环 let count = 0; // 冒泡排序排的趟数...break; } } console.log(`执行了${count}趟循环`); return arr; } console.log("一重优化冒泡排序
默认情况下,事件使用冒泡事件流,不使用捕获事件流。...捕获与冒泡 事件捕获:执行顺序(document->html->body->div) 事件冒泡:执行顺序(div->body->html->document) IE < 9:只支持事件冒泡...IE 9+|chrome|firefox|safari:事件冒泡+事件捕获 阻止捕获与冒泡 event.stopPropagation() 示例代码 <!...}, true); inner.addEventListener('click', function (event) { console.log('inner-->事件冒泡...('click', function (event) { console.log('outer-->事件冒泡'); }, false) </html
说到js事件大家肯定都知道,那么今天讲一点大家不知道的(假设大家不知道?)。 所有的js事件都会分为两个阶段捕获和冒泡。...最后是outer冒泡阶段 由此我们可以看到,事件触发的时候实际上都是有捕获和冒泡阶段的,并且捕获阶段会从最外层的父级元素开始捕获,一直捕获到最后触发事件的那个元素点才会停止,那么冒泡阶段反之,会从最内层触发的那个元素开始往外层的父级元素一直冒泡...并且事件的触发是先捕获,在冒泡。 阻止事件冒泡 事件的冒泡会让我们实现某些功能的时候产生阻碍,那么我们怎么怎么阻止事件的冒泡呢,这个时候就会用到一个方法。...e.stopPropagation(); 当我们吧这个方法放到inner冒泡阶段的下面的时候,神奇的事情发生了,当代码执行到这里,默认直接把冒泡的事件给阻止了,这时候会呈现出这个样子。...这样就成功的阻止了事件的冒泡,是不是很神奇,那么我们阻止事件冒泡还有别的方法吗,答案是肯定的,这时候就得了解一下我们的event对象了,我们打印一下event对象,如下: 打印发现当我们触发事件时,
讲 事件冒泡 、阻止冒泡 和 事件捕获 之前先说说什么是事件流,这样会更容易明白 一、事件和事件流 1、什么是事件 事件是可以被 JavaScript 侦测到的行为。...一个完整的JS事件流是从window开始,最后回到window的一个过程。 事件流被分为三个阶段(1~ 5)捕获过程、(5~ 6)事件触发过程、(6~ 10)冒泡过程。...二、事件冒泡 看了上面的那张图应该对事件冒泡有了大概的了解了吧。总结来说就是: 当一个元素接收到事件的时候 会把他接收到的事件传给自己的父级,一直到window。...三、阻止冒泡 1、JS阻止事件冒泡 我们用 e.stopPropagation() 这个方法添加到某事件函数里的末尾,就可以做到阻止冒泡事件。...2、JQ阻止事件冒泡 jq阻止事件冒泡就简单了,直接在事件函数里面添加 return false; 就行了。
block'; var oEvent = ev || event; oEvent.cancelBubble = true; // 取消事件冒泡
1.冒泡排序原理 假设长度为n的数组arr,要按照从小到大排序。
当父子元素中都有点击事件的时候,为了让触发子元素中的事件时,不去触发父元素中的事件,可以在子元素事件中添加stop来阻止事件冒泡。....stop 是阻止冒泡行为,不让当前元素的事件继续往外触发,如阻止点击div内部事件,触发div事件 .prevent 是阻止事件本身行为,如阻止超链接的点击跳转,form表单的点击提交 .self 是只有是自己触发的自己才会执行...,如果接受到内部的冒泡事件传递信号触发,会忽略掉这个信号 .capture 是改变js默认的事件机制,默认是冒泡,capture功能是将冒泡改为倾听模式 .once 是将事件设置为只执行一次,如 .click.prevent.once...阻止click事件冒泡(防止触发另一个事件)的方法 使用vue阻止子级元素的click事件冒泡。...方法二 可以自己写个阻止冒泡事件 然后在发生冒泡的元素中调用这个事件 @click="_stopPropagation($event)" methods:{ _stopPropagation
JS手撕(十) 冒泡排序、插入排序 冒泡排序 原理 冒泡排序原理就是依次比较相邻元素,如果前面的比后面的大,那就互换位置。从第一对比到最后一对。...下面的动图来自于菜鸟教程(贴出来主要是为了能更好的理解) JS实现 实现: function bubbleSort(arr) { const len = arr.length; for (let...(如果待插入元素与有序序列中的某个元素相等,则将待插入元素插入到相等元素的后面,这是为了让插入排序是稳定的) JS实现 function insertSort(arr) { const len =.../sort.js'); let arr = [3, 44, 38, 5, 47, 15, 36, 26, 27, 2, 46, 26, 4, 19, 50, 48]; console.log(insertSort
本文作者:eth10(贝塔安全实验室-核心成员) 当我们访问的站点只是一个简单的登录页面时,我们应充分利用涉及到的JavaScript脚本函数或文件。...0x01 node js站点 (1) 如何判断是JS开发的站 查看登录页面的页面源代码是如下图时,那么可以简单判断本站是一个纯JS开发的站。 ?...(2) 查看重要js文件 查看重要文件,一是寻找配置文件,二是查看app.xxx.js文件。 ? ? (3) 查看js配置文件 通过页面源码可以看到是否存在有js配置文件,如图所示: ?...(4) 查看app.xxx.js文件 app.xxx.js文件是系统主文件,里面可以查看到很多接口,如图: ?...0x04:js登录密码硬编码 如果你登录一个网站时,发现bp抓不了数据包,但是页面提示账户密码错误,那么很大可能密码是写在页面中,通过去js文件中搜索即可获取到账户密码。 ?
0x00:简介 前两天在freebuf上看到一个利用Ink文件触发攻击链的文章,确实佩服作者的脑洞。...0x01:过程 一、利用工具 https://github.com/CroweCybersecurity/ps1encode 二、环境配置 它有很多种生成方式,详情请移步gayhub上查看...今天利用生成的js文件来反弹shell ?...利用此命令生成js文件 ?...并重命名为1.js(文件名随意)。 ? 单单放一个js太单调了。实际环境下可以配合html进行调用js文件执行。 ?
冒个泡 最近的生活状态 最近刚开学,学校比较忙,每天都有好多事要做,所以博客就没有更新,等过了这段时间把博客好好搞一下。 这几天上课、健身,生活过得比较充实。 ...
领取专属 10元无门槛券
手把手带您无忧上云