vue1.*版本中

在标签中加上el='dom'，然后在代码中this.$els.dom这样就拿到了页面元素

例如：<div class='box' v-el: myBox>你好</div>

让你好的颜色显示为红色：this.$els.my-box.style.color = 'red'

vue2.*版本中

在标签中加上ref='dom'，然后在代码中this.$refs.dom这样就拿到了页面元素

例如：<div class='box' ref='myBox'>你好</div>

让你好的颜色显示为红色：this.$refs.myBox.style.color = 'red

出处: https://blog.csdn.net/mengyunxiu121415/article/details/77334303

vue1和vue2获取dom元素的方法的更多相关文章

  1. vue1和vue2获取dom元素的方法 及 nextTick() 、$nextTick()

    vue1.*版本中 在标签中加上el='dom',然后在代码中this.$els.dom这样就拿到了页面元素 例如:<div class='box' el='myBox'>你好</d ...

  2. JQuery获取Dom元素的方法

    (function (window) { var arr = []; var VP = function (selector, context) { return new VP.fn.init(sel ...

  3. JS获取DOM元素的八种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

  4. 通过class和id获取DOM元素的区别

    1.通过id获取DOM元素的方法:document.getElementById("id名") 2.通过class获取DOM元素的方法:document.getElementsBy ...

  5. JS----获取DOM元素的方法（8种）

    什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...

  6. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

  7. vue获取dom元素高度的方法

    获取高度: <div ref="自定义名称" > </div>要在钩子mounted里面dom结构生成后去获取dom的高度,宽度,修改样式等操作!!! mo ...

  8. 原生写一个一键获取所有DOM元素的方法

    一天挺一个朋友去面试要做一个获取dom元素到数组中 主要用到一个递归算法,通过节点的childNodes属性--代码如下: function getAllNode() { var nodes = do ...

  9. Vue系列之 => ref获取DOM元素和组件

    可以获取DOM元素,和组件中的数据,方法 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

随机推荐

  1. MySQL自增锁等待问题解决

    有网友再群里问:在做基准测试时候,批量插入数据时,有很多自增锁等待,我告诉他解决办法: 1.innodb_autoinc_lock_mode=2 2.innodb_autoextend_increme ...

  2. php如何连接mysql，并操纵后台服务器运作的过程

    PHP,一个嵌套的缩写名称,是英文超级文本预处理语言(PHP:Hypertext Preprocessor)的缩写.PHP 是一种 HTML 内嵌式的语言,PHP与微软的ASP颇有几分相似,都是一种在 ...

  3. 图解HTTP总结（2）——简单的HTTP协议

    HTTP协议是一种不保存状态,即无状态(stateless)协议.HTTP协议自身不对请求和响应之间的通信状态进行保存.也就是说在HTTP这个级别,协议对于发送过的请求或响应都不做持久化处理. 使用H ...

  4. C指针——简单总结

    简介: 指针变量在使用前,必须指向具体的有效的内存单元 指针变量在使用前不但要定义还要初始化 四个方面:指针的类型,指针指向的类型,指针的值或者指针所指向的内存区,指针本身所占的内存区 int *pt ...

  5. openwrt(三) 固件的烧录

    导航: 方法1: tftp: 方法2: 在线升级 方法3: BIOS烧录 方法1:TFTP 这应该是最万能的一种方法了.TFTP是一种依靠网口传送数据的一种通信协议,没错,只是传输数据,并不是烧录,所 ...

  6. POJ：2010-Moo University - Financial Aid

    Moo University - Financial Aid Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 10894 Acce ...

  7. urllib使用二

    urlopen方法返回一个html 对html使用info()方法返回HTTPMessage对象实例 import urllib def print_list(lists): for i in lis ...

  8. 笔记-scrapy-深入学习-sheduler

    笔记-scrapy-深入学习-sheduler 1.      scheduler.py source code:scrapy/core/scheduler.py: 1.1.    初始化的开始 在分 ...

  9. PHP.23-ThinkPHP框架的三种模型实例化-（D()方法与M()方法的区别）

    三种模型实例化 原则上:每个数据表应对应一个模型类(Home/Model/GoodsModel.class.php --> 表tp_goods) 1.直接实例化 和实例化其他类库一样实例化模型类 ...

  10. notepad++ 换行技巧 log换行

    有时候,服务器收集上来的日志,格式很乱,看log很难,如下: java.lang.IllegalStateException: BEvent.init() must be call first\n\t ...