react和jquery的区别是什么?

首先我们要注意的是,虽然我们这里把React和JQuery拿到一个台面上来说,但是这两者是有本质区别的。React是一个UI库,但是JQuery更多的知识一个工具库或者说是插件库,我们之所以把这两者谈到一起,只是因为这里说的更多的是这两者在编程思想上的不同而已。

1.jpg

最明显的就是对Dom操作的不同了,Reactjs是提供了一整套的vistualDom,也就是虚拟Dom的,所有的操作都在这个虚拟的Dom上而并非真实的Dom,React默认这个真实的Dom是不会被改变的,被改变的只有虚拟的Dom,然后通过这个虚拟的Dom来对真实的Dom进行渲染。

2.png

但是Jquery在这一点上就和react恰恰相反了,jQuery操作的恰恰是真实的Dom,它处理事件的处理方式就是用选择器筛选出需要改变的Dom元素,或者直接对某个Dom元素进行监听。最后来直接改变我们的真实Dom来达到预期的结果。

3.png

但是我们需要注意的是,React本身是没有制作ajax的,对于后台连接使用单纯的fetch不习惯的朋友,也是完全可以使用jQuery的 ajax功能的,不要总听信某些领导说react中就完全不需要使用jquery什么的,只是别用操作Dom的内容和,确保整体架构的稳定性和一致性,就可以了。

4.png

而Jquery之所以会在业务逻辑复杂的时候,变得难以理解以及相当臃肿,是因为它为了统一,把业务逻辑和我们的表面上的ui界面融合在了一起,改一个很容易动到另外一个,其中ui里面还夹杂着大量的交互逻辑,这就使得整个逻辑变得十分混乱。

5.png

最后,不得不说JQuery在当下的互联网平台上的地位还是固若金汤的,即便他有这样或者那样的问题以及复杂性,但是作为刚开始入门互联网行业的人来说,JQuery可谓是一个非常简单而又实用的框架和工具了,但是当我们渐渐熟悉了这个框架以后,大家不妨取尝试一下React、vue等前端,使用原生js来写一些功能,这样对于大家的学习和理解,也是肯定有所帮助的。

Image placeholder
前端答疑
未设置
  47人点赞

没有讨论,发表一下自己的看法吧

推荐文章
vuejs和jquery的区别是什么?

vuejs和jquery的区别1、jQuery首先要获取到dom对象,然后对dom对象进行进行值的修改等操作2、Vue是首先把值和js对象进行绑定,然后修改js对象的值,Vue框架就会自动把dom的值

js和jquery的区别是什么?

JavaScript和jQuery的区别:一、本质上的区别:js是网页脚本语言,而jQuery是基于js语言封装出来的一个前端框架。也就是说js是一种语言,而jQuery是基于该语言的一种框架。二、用

vue与jquery的区别是什么?

vue与jquery的区别是什么?vue和jquey的对比:jQuery是使用选择器($)选取DOM对象,对其进行赋值、取值、事件绑定等操作,其实和原生的HTML的区别只在于可以更方便的选取和操作DO

jquery和js的区别是什么?

jquery和js的区别是什么?一、首先来看一下jQuery和js的概念jquery是一个快速、简洁的JavaScript库,极大的简化了javascript编程。js是一种脚本语言,常用于网页客户端

ajax与jquery的区别是什么?

jQuery是javascript的一个框架,也就是有人做好了很多功能,你直接拿来用就好了。比如实现Ajax。纯javascript,你可能需要些好多函数,来新建对象,捕捉事件,处理异常等。但用jQu

jquery和jquery ui的区别?

jquery和jqueryui的区别?区别有:1、jQuery是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。 2、jQueryUI则是在jQuery的基础上,利用jQuery的扩展性,

jquery和vue的区别是什么?

jquery和vue的区别是什么?●jquery是直接操作DOM;使用选择器($)选取DOM对象,对其进行赋值、取值、事件绑定等操作;和原生的js区别只在于可以更方便的选取和操作DOM对象;数据和界面

jquery中children()和find()的区别是什么?

jquery中children()和find()的区别children(selector)方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈)。参数可选,添加参数表示通过选择器进行过滤,对元素进行

jquery不同版本的区别是什么?

目前jQuery有三个大版本:版本描述1.x兼容ie678,使用最为广泛的,官方只做bug维护,功能不再新增。因此一般项目来说,使用1.x版本就可以了,最终版本:1.12.42.x不兼容ie678,很

jQuery中this和$(this)的区别是什么?

jQuery中this和$(this)的区别是什么?●$(this)相当于jQuery(this),是一个jQuery对象,只能使用jQuery的属性和方法;●this中存放的是DOM元素,属于jav

jQuery on()和click()的区别是什么?

jQueryon()和click()的区别是什么?●click()属于静态加载,当页面加载完,就不再为新增加的元素添加点击事件。●on()属于动态加载,当页面加载完,可以为新增加的元素添加事件。但是必

jquery text() val() html()之间的区别是什么?

jquerytext()val()html()之间的区别是什么?●text()获取元素内的文本,相当于js中的innerText●val()获取表单元素的值,相当于js中的input.value●ht

jquery ===和==的区别是什么?

jquery===和==的区别简单来说,===与==的区别是,===比较刻薄,==相对来说比===温柔一些。==,两边值类型相同时,等同于===;不同的时候,要先进行类型转换,再比较。而===,不做类

jquery中on()和click()的区别是什么?

on()和click()的区别:click()属于静态加载,当页面加载完,就不在为新增加的元素添加点击事件。on()属于动态加载,当页面加载完,可以为新增加的元素添加事件。但是必须选定负级元素。二者在

jquery中bind与on的区别是什么?

jquery中bind与on的区别bind和on都是事件绑定,都是给元素绑定事件用的,但是两者却又有着一个大区别:事件冒泡(事件代理)。事件冒泡也是委托事件的原型,事件委托就是子类的事情委托给父类的去

jquery this与$(this)的区别是什么?

$(this)相当于jQuery(this),是一个jQuery对象,只能使用jQuery的属性和方法;而this中存放的是DOM元素,属于javascirpt中的DOM元素对象,要使用DOM元素对象

jquery和zepto的区别是什么?

jQuery是一个简洁而快速的JavaScript库,可用于简化事件处理,HTML文档遍历,Ajax交互和动画,以便快速开发网站。jQuery简化了HTML的客户端脚本,从而简化了Web2.0应用程序

jquery中size()与length的区别是什么?

jQuerylength和size()区别length是属性,size()是方法。如果你只是想获取元素的个数,两者效果一样既("img").length和("img").size()获取的值是一样的。

jquery easyui和layui的区别是什么?

jqueryeasyuijQueryEasyUI是一组基于jQuery的UI插件集合体,而jQueryEasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复

jquery和ajax的区别是什么?

jquery和ajax的区别Ajax是一门技术,它提供了异步更新的机制,使用客户端与服务器间交换数据而非整个页面文档,实现页面的局部更新。jQuery是一个库,它对JS进行了封装,使其更方便使用。jQ

jquery easyui和bootstrap的区别是什么?

JQueryEasyUIJQueryEasyUI是一组基于jQuery的UI插件集合体,而jQueryEasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复

jquery中attr和prop的区别是什么?

在jQuery中,attr()函数和prop()函数都用于设置或获取指定的属性,它们的参数和用法也几乎完全相同。但不得不说的是,这两个函数的用处却并不相同。下面我们来详细介绍这两个函数之间的区别。jq

vue和react的区别是什么?

vue和react的区别1、监听数据变化的实现原理不同Vue通过getter/setter以及一些函数的劫持,能精确知道数据变化。React默认是通过比较引用的方式(diff)进行的,如果不优化可能导

jquery的作用是什么?

jquery的作用是什么?下面就是jQuery的具体作用:1、取得页面中的元素。如果不使用JavaScript库,遍历DOM(DocumentObjectModel,文档对象模型)树,以及查找HTML

jquery的$是什么?

jquery的$是什么?$就是jQuery的别称,而jQuery就是jQuery库提供的一个函数。这个函数的作用是根据()里的参数进行查找和选择html文档中的元素,函数作用之一就是GetElemen