美文网首页
会jquery 就能快速快速上手 vue? 你仿佛在说笑

会jquery 就能快速快速上手 vue? 你仿佛在说笑

作者: Mr菜头 | 来源:发表于2019-03-15 17:20 被阅读0次

vue和jquery 操作DOM的区别

jquery 操作Dom 的思维:获取Dom元素

步骤:

1、在dom中输入id

2、用选择器选中 该id ,修改id的元素

vue 操作Dom 思维: Dom是对象

   步骤:

1、在dom中声明属性,

2、 在js中直接修改,该属性

如 用jquery时 修改表格中的值

html

<table id="table1" class="table table-bordered col-sm-8">

                <thead>

                    <tr>

                        <th>col1</th>

                        <th>col2</th>

                    </tr>

                </thead>

                <tbody>

                    <tr>

                        <td id="col1" >1.1</td>

                        <td>1.2</td>

                    </tr>

                    <tr>

                        <td id="col1" >1.1</td><!--声明dom id-->

                        <td>{{col2}}</td> <!--声明 dom 属性-->

                    </tr>

                    <tr>

                        <td>2.1</td>

                        <td>2.2</td>

                    </tr>

                </tbody>

            </table>

jquery

$("#col1").text('jqHelloCol2'); //获取Id为 col1 的dom 元素 ,并修改

vue

this.col2='vhelloCol2';//修改  dom对象 的 col2 属性,并修改

上面列子 看似jquery 和 vue  代码量都差不多,甚至vue还略多一些,

但页面复杂后,用 jquery获取dom 就会变得复杂,而vue的代码量却没有变化 

如 n个div嵌套的情况

相关文章

  • 会jquery 就能快速快速上手 vue? 你仿佛在说笑

    vue和jquery 操作DOM的区别 jquery 操作Dom 的思维:获取Dom元素 步骤: 1、在dom中输...

  • TS 入门和Vue实践

    TS 入门和Vue实践 一、TS 快速上手 从 JavaScript 程序员的角度总结思考,快速上手理解 Type...

  • vue快速上手

    vue是一个基于响应式编程思想、模块化设计实现的js框架,可以大大简化开发,是前端开发的首选框架。 1、基础语法 ...

  • vue快速上手

    1.数据双向绑定 更改数据也触发视图的相应更新 渲染html v-bind 双大括号语法不能作用在 HTML 特性...

  • Vue快速上手

    Vue是一个前端框架,简单来说,其目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 国际惯例H...

  • Vue 基本知识

    vue3快速上手 body{-webkit-font-smoothing:an...

  • Vue3快速上手

    Vue3-admin 快速上手实战项目[https://github.com/Miller-Wang/vue3-a...

  • Vue DevUI 贡献指南

    你好!我们很高兴你有兴趣为 Vue DevUI 做出贡献。在提交你的贡献之前,请花点时间阅读以下指南: 快速上手 ...

  • Vue 快速上手(实例)

    Vue 快速上手 实例1: 渲染声明 渲染声明是 vue 的最核心模块。 vue 基于传统的 HTML 模板语法,...

  • 01、vue快速上手

    vue官网本文主要目的是为了让大家对vue有一个初步的了解,简单介绍创建一个vue应用的正常流程以及vue应用 对...

网友评论

      本文标题:会jquery 就能快速快速上手 vue? 你仿佛在说笑

      本文链接:https://www.haomeiwen.com/subject/gqglmqtx.html