浅谈jQuery最近大家都在说jQuery已经过时了，兴起的是React和Vue。学习jQuery已经没有什么意思了。真

最近大家都在说jQuery已经过时了，兴起的是React和Vue。学习jQuery已经没有什么意思了。真像是这样吗？让我们来认识一下jQuery。

什么是jQuery？

简单的说jQuery 是一个 JavaScript 库。发明和使用jQuery目的是简化 JavaScript 编程，因为原生的DOM很麻烦让你无法忍受，所以就发明jQuery进行简化。后面的React和Vue也是一样的原因，所以用通俗一点的话来讲，就是模板，比如excel里面内建的函数（如求和sum）。什么框架和库，外行听起来好神秘好高大上的感觉，都不用理会。其实记得jQuery 简化JavaScript编程就可以了。据2019年统计，90%的公司都使用了jQuery，前端一直都是向前兼容得行业，大多是不会重新改写的，所以要维护这些既有的网站，如果你不会，那别人的代码你怎么看得懂了。

jQuery到底有多简单？

举个例子。

$("div")                 //获取div元素

是不是超级简单。

jQuery 的链式操作（Chaining）

通过 jQuery，可以把动作/方法链接在一起。 Chaining 允许我们在一条语句中运行多个 jQuery 方法（在相同的元素上）。
提示：这样的话，浏览器就不必多次查找相同的元素。

举个的例子：把 css()、slideUp() 和 slideDown() 链接在一起。"p1" 元素首先会变为蓝色，然后向上滑动，再然后向下滑动，代码：

$("#p1").css("color","blue").slideUp(200).slideDown(200);

已经有感觉了吧，最后通过“增、删、改、查”模式一一说明：

jQuery 如何获取元素=>简称“查”

$("div")                 //获取div元素
$("#xxx").find('.red')   //获取#xxx里面的.red元素
$("#xxx").parent()       //获取#xxx的爸爸
$("#xxx").children()     //获取#xxx的儿子
$("#xxx").siblings()     //获取#xxx的兄弟
$("#xxx").index()        //获取排行老几（从0开始）
$("#xxx").next()         //获取弟弟
$("#xxx").prev()         //获取哥哥
$(".XXX").each(fn)       //遍历并对每个元素执行fn

jQuery如何创建元素=>简称“增”

$('<div><span>1</span></div>')  //创建div
.appendTo(document.body)        //插入到body中

jQuery如何移动元素=>简称“删”

$div.remove()  //删除被选元素（及其子元素）
$div.empty()   //从被选元素中删除子元素

jQuery如何修改元素的属性=>简称“改”

$div.text(?) //读或写文本内容
$div.html(?) //读或写HTML内容
$div.attr('title',?) //读写属性
$div.css({color:'red'}) //读写style $div.addClass('blue') //增加style属性
$div.on('click',fn) //绑定事件
$div.off('click',fn)//移除事件

提示：$div大部分时候对应了多个div元素，操作时候要小心。

到这里就差不多了，全方面了解可以看看下面的文章。推荐文章：