重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
什么是事件冒泡:在一个对象上触发某类事件(比如onclick事件),如果次对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层次的最顶层,即document对象(有些浏览器是window)。
专注于为中小企业提供网站建设、网站制作服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业信阳免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了上1000+企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。
事件冒泡的作用:事件冒泡允许多个操作被集中处理(把事件处理器添加到一个父级元素上,避免把事件处理器添加到多个子级元素上),它还可以让你在对象层的不同级别捕获事件。
阻止事件冒泡:事件冒泡机制有时候是不需要的,需要阻止掉,通过 event.stopPropagation() 来阻止
$(function(){
})
代合并阻止操作:实际开发中,一般把阻止冒泡和阻止默认行为合并起来写,合并写法可以用.
// event.stopPropagation();
// event.preventDefault();
// 合并写法:
return false;
事件委托就是利用冒泡的原理,把事件加到父级上,通过判断事件来源的子集,执行相应的操作,事件委托首先可以极大减少事件绑定次数,提高性能;其次可以让新加入的子元素也可以拥有相同的操作。
一般绑定事件的写法:bind
事件委托的写法:
如果我们要取消事件的委托:
//ev.delegateTarge 委托的对象
$(ev.delegateTarge).undelegatee();
//如果是上面的两种例子可使用//$list.undelegate();
创建节点: ('div')
var ('div这是一个div元素/div');
插入节点:
1、append()和appendTo():在现存元素的内部,从后面插入元素
2、prepend()和prependTo():在现存元素的内部,从前面插入元素
3、after()和insertAfter():在现存元素的外部,从后面插入元素
4、before()和insertBefore():在现存元素的外部,从前面插入元素
删除节点
$('#div1').remove();
jQuery中用on来绑定事件,常用写法
两种写法哪个更好?
1. $(document).on 将事件委托document, $('#idname').on 将事件绑定到.className元素上。每次document有点击动作,浏览器都会判断当前点击的对象。如果匹配再决定要不要执行,多了个判断环节。JS渲染效率很高,所以此异同基本可以忽略。
2. $("className").on 为onclick绑定,只有在页面onload时执行一次。页面刷新后,新加载的具有className的元素便没有事件绑定到上面了。相反$(document).on这种方法会刷新和重新赋予绑定操作,所以一定程度上更为全面。
jquery实现网页打开时浏览器图标闪烁法有bug:在打开时,传值判断是页面来的,还是弹窗来的,如果是弹窗... -webkit-backface-v 使用 jQuery 快速高效制作 网页特效
jQuery 库中实现的,并不是浏览器的原生事件。
不过最重要的是把菜单不停闪动的问题解决了!
在页面加载结束后,浏览器会通过js为dom元素添加事件。原生的js中使用 window.onload 方法;在JQ中使用$(document).ready()。这个方法在dom载入就绪时对其进行操纵并调用执行它所绑定的函数。
那么它和window.onload有何不同呢?
window.onload是在网页中所有元素 加上所有资源 ++完全加++载到浏览器后才执行。
而$(document).ready()中绑定的事件是在 dom完全就绪 时就可以被调用,此时对于jQuery来说都是可以被访问的(关联的资源可能并没有被加载完毕)。
举个例子来说,在$(document).ready()中定义了图片的宽高,但由于此时图片还没有被加载完毕,此时的宽高不会生效。要解决这个问题可以使用jQuery中的 load ()方法。
load()方法会在元素的onload事件中绑定一个处理函数,如果该处理函数绑定给window对象,则会在所有资源加载完毕后触发,如果load绑定在元素上则会在该元素加载完毕后触发。
既然window.onload比较完备为什么还要用jQuery中的$(document).ready()呢?
window.onload事件 每次只能保存对一个函数的引用 ,他会覆盖掉之前的函数,所以不能再现有行为上添加新的行为。如果引用了多个js文件,每个都需要window.onload方法就导致编码复杂。
使用$(document).ready()方法能够很好地解决这种问题,每次调用$document.ready()方法都会在现有行为上追加新的行为,这些行为会根据注册顺序依次执行。