jQuery和Vue的区别(转载)

1.jQuery首先要获取到dom对象，然后对dom对象进行进行值的修改等操作
2.Vue是首先把值和js对象进行绑定，然后修改js对象的值，Vue框架就会自动把dom的值就行更新。
3.可以简单的理解为Vue帮我们做了dom操作，我们以后用Vue就需要修改对象的值和做好元素和对
象的绑定，Vue这个框架就会自动帮我们做好dom的相关操作
4.这种dom元素跟随JS对象值的变化而变化叫做单向数据绑定，如果JS对象的值也跟随着dom元素的
值的变化而变化就叫做双向数据绑定

用一个简单的例子来说明编写Jquery和Vue上的不同
修改文字

点击按钮后：

改为

(1)jQuery代码

<!DOCTYPE html>
<html lang="en">
<head>  <meta charset="UTF-8">  <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
</head>
<body>
<div><p>大家好，我是<span id="name">张三<span>!</p><p>我是一名<span id="jop">医生</span>.</p><button id = "modifyBtn">修改</button>
</div>
<script type="text/javascript">  $("#modifyBtn").click(function(){$("#name").text("李四");$("#jop").text("老师");});
</script>
</body>
</html>

(2)Vue代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue</title>
<script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="app"><p>大家好，我是<span>{{name}}<span>!</p><p>我是一名<span>{{jop}}</span>.</p><button v-on:click="modifyInfo">修改</button>
</div><script>
new Vue({el: '#app',data:{name:"张三",jop:"医生"},methods:{modifyInfo:function(){this.name = "李四";this.jop = "老师";}}
})
</script>
</body>
</html>

jQuery和Vue的区别(转载)相关推荐

jquery和javascript的区别(转载自脚本之家)
jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单,为了说明区别,下面与大家分享下JavaScript 与JQuery 常用方法比较 jquery 就对j ...
原生JS和jQuery操作DOM的区别小结
一.Js原生对象和jQuery实例对象的相互转化: (1).原生JS对象转JQ对象: $(DOM对象); (2). JQ对象转原生JS对象: $(DOM对象).get(index); //注意区分eq ...
前端知识总结汇总！（HTML、CSS、JS、jQuery、vue、微信小程序）
前端知识总结汇总!(HTML.CSS.JS.jQuery.vue.微信小程序) 前端理论考核题 1 / HTML 1.DOCTYPE 的作用是什么?标准模式与兼容模式各有什么区别? !DOCTYPE是 ...
vue-d2admin-axios异步请求登录，先对比一下Jquery ajax, Axios, Fetch区别
先说一下对比吧 Jquery ajax, Axios, Fetch区别之我见引言前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被JQuery 1 ...
js中onload和jQuery中的ready区别
js中onload和jQuery中的ready区别 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行. ------>不能写多个(如果有多个,只会执行一个) $(do ...
jQuery length 和 size()区别
jQuery length和size()区别总结如下: 1.length是属性,size()是方法. 2.如果你只是想获取元素的个数,两者效果一样既 $("img" ...
今天的考核题目: 你知道React和Vue的区别吗? skr，skr
React 和 Vue 的区别博主面了几家公司,看简历上写着使用Vue.js框架,就会问,你能说一说 vue 和 react的区别吗 ?react 听过,没用过,所以就只能尴尬的说不怎么了解reac ...
[jQuery] jQuery和Zepto的区别？各自的使用场景？
[jQuery] jQuery和Zepto的区别?各自的使用场景? 创建$的方式不同.前者略微要大,后者略微小点.场景....emmmm 个人简介我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, ...
[jQuery] jQuery与jQuery UI有啥区别？
[jQuery] jQuery与jQuery UI有啥区别? 1)jQuery是一个js库,主要提供的功能是选择器.属性修改和事件绑定等 2)jQuery UI则是在jQuery的基础上,利用jQue ...

jQuery和Vue的区别(转载)

jQuery和Vue的区别(转载)相关推荐

最新文章

热门文章