jQuery的几大难点

jQuery的认识

jQuery是一个前端框架,说的更具体一点,其实就是JavaScript的一个库,里面封装了很多的方法,可以让我们的操作dom变得更加方便,快捷,而且没有兼容性问题,大家仔细想想,咱们一般用JavaScript做些什么事,其实绝大多数就是来操作dom元素

jQuery的优点:

  • 解决了浏览器兼容性问题,最低可以兼容到IE6
  • 对于dom操作封装了很多的方法,让dom操作变得异常简单
  • 代码简洁,逻辑性,可读性更强

jQuery的版本问题

jQuery的第二版本之后就已经摒弃了IE浏览器,因为在国外,确实已经没有多少人在使用IE浏览器了,但是在国内,使用IE的人还有很多,所以必须做到兼容,所以推荐大家使用jQuery第一版本的最后一次更新版,也就是1.12这个版本

<script src="https://cdn.bootcss.com/jquery/1.12.2/jquery.js"></script>

jQuery强大的选择器

$()

$函数有两个用法:

  • 用于获取jQuery元素,也就是获取页面元素
  • 讲dom对象转换为jQuery对象

jQuery对象和DOM对象的区别于联系

  • DOM对象:就是用原生JavaScript的方式获取到的元素对象
  • jQuery对象:用jQuery的方式获取到的元素对象称之为jQuery对象

jQuery对象其实就是对于dom对象的一次封装,说白了就是jQuery对象里面包着dom对象,,就像是这种结构:[{},{},{},{},{}],一个数组里面有很多的对象

jQuery对象的原型身上添加了很多的方法,这就是jQuery的方法,jQuery的方法只有jQuery对象才能使用

dom对象的方法,也只有dom对象才能使用,jQuery对象不能直接使用dom对象的方法

这里jQuery对象和dom对象必须完全搞清楚,不然就会出现方法乱用的情况

  • jQuery对象转dom对象:通过下标的方式
  • dom对象转jQuery对象:通过$()函数,函数的参数就是dom对象

jQuery操作样式

  • css方法:
    css():改变一个样式
    css({}):传入一个对象,同时改变多个样式
  • 操作class
    addclass():添加一个类
    removeclass():移除一个类
    hasclass():判断是否有一个类
    toggleclass():切换一个类的有无

jquery操作属性

attr():通过attr方法来操作属性,用法和css一样
对于属性值是Boolean类型的属性,操作属性用prop()方法

jQuery动画

在jQuery中使用动画常常会遇到一个坑,那就是动画队列:所有触发的动画会全部加载到一个动画队列里面,一个一个执行。

解决方法:在jQuery的动画函数前面加上一个stop()函数

stop():作用就是停止当前动画前面的动画队列,直接执行本次动画

jquery事件难点-委托事件

父元素身上添加事件,但是最终而是由子元素触发执行,

本质原理描述:点击子元素的时候,由于子元素并没有注册事件,所以事件继续向上冒泡,冒泡到父元素,正好父元素身上有一个事件,就开始执行,因为父元素身上的是委托事件,自己并不会执行,所以父元素就会看看触发事件的是谁,是不是委托的对象,如果是,就执行,负责不执行

猜你喜欢

转载自blog.csdn.net/Yun__shen/article/details/78544902