今天我们来说一说JQuery的一些设计目的和方法,仅仅是我个人的理解。首先必须声明的是JavaScript和JQuery是可以共存但不可以混用。

1.JQuery选择元素更加方便

一是:使用模拟CSS选择元素。比如选择<div id='box'></div>,使用$("#box"),或者$("div").这样的书写方式和css元素的书写是有相通之处的。并且对于选择的多个标签可以一次性赋予属性,没有必要像JavaScript原生的那样,还需要使用循环来实现。

二是:表达式选择。比如选择一组元素的第一个或者最后一个。使用first或者last。也可以使用odd(偶数)和even(奇数)。也可以使用eq定位第几个元素。

三是:多种筛选方法。比如$("li").filter(".box").选择li中有calss="box".的元素。等等。

四是:选择器的选择具有同级,父级,子级。可以进行关系之间的选择。

向上:
• parent()   返回被选元素的直接父元素
• parents()   被选元素的所有祖先元素,它一路向上直到文档的根元素
• parentsUntil()  介于两个给定元素之间的所有祖先元素
向下:

• children()  返回被选元素的所有直接子元素
• find()      被选元素的后代元素
 同级:这个网上有详细的资料,可以查询。 

• siblings()
• next()
• nextAll()
• nextUntil()
• prev()
• prevAll()
• prevUntil()

2.JQ的写法
一是:方法函数化。简单点就是都是函数。比如等待页面加载完,JavaScript中是这样来写的
window.onload =function(){};但是在JQuery中只要$()。
点击事件:
onclick =funtion(){};但是在JQuery中就是click(function(){})。
innerhtml=“123”。JQuery就是html()。

所以在JQuery中就是把他们这些东西都函数化了。在原生中经常可以看到赋值的操作符=,而在JQuery中比较不常见。而且在JQuery的使用中,很多时候我们要在后面使用()。

二是:链式操作

JQuery的链式操作是重要的一点。也算是优点之一。链式操作,节省代码量,使代码看起来更优雅。另外一点为了更好的异步体验 Javascript是无阻塞语言,所以他不是没阻塞,而是不能阻塞,所以他需要通过事件来驱动,异步来完成一些本需要阻塞进程的操作

链式操作的原理是:实际上链式操作仅仅是通过对象上的方法最后 return this 把对象再返回回来,对象当然可以继续调用方法啦,所以就可以链式操作了。

三是:取值赋值合体

比如html()这就是取值,那么html(“hello”)就是赋值。或者css(“width”),就是取值。那么css(“width”,“200px”)就是赋值。

后续如果有新的想法,在写下一篇。。。。。