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. activemq启动闪退/失败 （Illegal character in hostname at index 5: ws://****:61614?maximumConnections=1000&wireFormat.maxFrameSize=104857600）

    java.net.URISyntaxException: Illegal character in hostname at index 5: ws://****:61614?maximumConnec ...

  2. Liunx 配置sshd服务

    简介 SSH(Secure Shell)是一种能够提供安全远程登录会话的协议,也是目前远程管理Linux系统最首选的方式,因为传统的ftp或telnet服务是不安全的,它们会把帐号口令和数据资料等数据 ...

  3. 路由器基础配置之单臂路由实现vlan间通信

    我们将以上面的拓扑图开始进行配置,目的为设置单臂路由实现vlan间通信,设置4个vlan,pc0,1,2为vlan10 pc3,4,5为vlan20:pc6,7,8为vlan30:server0,1为 ...

  4. GNU汇编 存储器访问指令

    .text .global  _start _start: mov r0,#0xff str r0,[r1] ldr r2,[r1]

  5. nop 插件解析

    在计算领域,插件( plug-in or plugin)是将特定的功能增加到大型软件中的软件组件. nopCommerce插件用来扩展nopCommerce的功能.nopCommerce 有几种插件. ...

  6. Python函数及参数

    ## 函数 - 函数是代码的一种组织形式,一般一个函数完成一个特定功能 - 函数需要先定义后使用 - 函数的定义 def func_name(参数): func_body ... return fun ...

  7. 判断移动端和pc端最简单的方法

    <!DOCTYPE html><html><head> <title></title> <script type="text ...

  8. 解决win10子系统Ubuntu新装的mysql 不能root登陆方法

    步骤一:打开终端 $sudo /etc/init.d/mysql stop $sudo mkdir -p /var/run/mysqld $sudo chown mysql:mysql /var/ru ...

  9. Android 内嵌 HTML5 并进行交互

    Android与HTML5的交互主要是两个部分, 与HTML5的交互以及与JavaScript的交互, 与HTML5的交互可以通过注册onclick事件转化为与JavaScript的交互 Androi ...

  10. 6 Django的视图层

    视图函数 一个视图函数,简称视图,是一个简单的Python 函数,它接受Web请求并且返回Web响应.响应可以是一张网页的HTML内容,一个重定向,一个404错误,一个XML文档,或者一张图片. . ...