Vue 获取元素样式 元素高度
看到这个问题我第一时间想的竟然是JS
不知道你是怎么想的
不过昨天有一个小哥哥 问我一个Vue的 哈哈哈 get了
我当时问他为什么不用JS获取 他说 这个性能更高
那我们来看看这个高性能的获取元素高度的宝贝
辣就是利用vue的ref属性
听说这个性能很高……emmmm

然后把它打印出来 自己找自己想要的吧

//获取高度值
var h= this.$refs.test.offsetHeight; //获取元素样式值,element 为元素ref="element"
var heightCss = window.getComputedStyle(this.$refs.test).height; //获取元素内联样式值
var heightStyle =this.$refs.test.style.height; // 这里面会找到你要的所有的样式属性值 If you like me, please give me a lot of praise ^ v ^ Thank you very much! mua~
Vue 获取元素样式 元素高度的更多相关文章
- vue获取dom元素高度的方法
获取高度: <div ref="自定义名称" > </div>要在钩子mounted里面dom结构生成后去获取dom的高度,宽度,修改样式等操作!!! mo ...
- vue 获取元素高度
1.html <div ref="getheight"></div> <br><br> 2.JavaScript // 获取高度值 ...
- jquery获取和设置元素高度宽度
jquery获取和设置元素高度宽度 1.height()/ width() 取得第一个匹配元素当前计算的高度/宽度值(px) height(val)/ width(val) 为每个匹配的元素设置CSS ...
- js获取元素的滚动高度,和距离顶部的高度
jq: 获取浏览器显示区域(可视区域)的高度 : $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : $(window).width(); 获取页面的文档高度 $(doc ...
- vue获取DOM元素并设置属性
这里我想到了2个方法: 方法一: 直接给相应的元素加id,然后再document.getElementById("id");获取,然后设置相应属性或样式 方法二: 使用ref,给相 ...
- jquery获取元素与屏幕高度距离
a. onscroll事件 scroll是css样式中overflow的一个值,意思是显示滚动条;当一个元素的实际高度超过他的最大高度是,只要设置了overflow为scroll b. $(..).s ...
- jq 获取各个元素的宽度高度的方法
JS获取各种宽度.高度的简单介绍: scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获 ...
- js学习进阶-元素获取及样式设置
var imgs = document.querySelectorAll("article img"); 获得article元素的直接或间接子孙的所有img元素, <arti ...
- js学习笔记7----return,arguments及获取元素样式
1.return:返回值 1)函数名+括号:fn() ===> return; 2) 所有函数默认返回值:undefind; 3) return后面所有的代码都不会执行; 2.arguments ...
随机推荐
- url编码乱码问题解决
//url encodeURI加密 window.location.href = "upload.html?sendName="+encodeURI(sendName); //接收 ...
- LayaAir疑难杂症之二:字符输入限制不生效(多个限制条件该如何赋值给restrict)
问题描述 采用LayaAir进行开发,在使用TextInput时,对restrict属性进行赋值,使该输入框只允许输入中英文.数字,restrict = “[\u4E00-\u9FA5A-Za-z ...
- java 英文单词拼写纠正框架(Word Checker)
Word Checker 本项目用于单词拼写检查. 项目简介 word checker 用于单词拼写检查. Github 地址 特性说明 支持 i18n 错误提示支持 i18N 支持英文的单词纠错 可 ...
- 转载---JQuery 对 Select option 的操作
下拉框: <select id="selectID" > <option value="1">1</option& ...
- eclipse 安装MyBatis插件 -- 官网直接拖动“安装”
拖动“安装” http://marketplace.eclipse.org/marketplace-client-intro?mpc_install=2947754
- Laravel发送邮箱消息验证
945的密码:umywcvkrfrytfeef ENV的配置如下: MAIL_DRIVER=smtpMAIL_HOST=smtp.qq.comMAIL_PORT=25MAIL_USERNAME=XXX ...
- pyspider 笔记
fetch_type='js' 运行 js代码
- python count函数
描述 Python count() 方法用于统计字符串里某个字符出现的次数.可选参数为在字符串搜索的开始与结束位置. 语法 count()方法语法: str.count(sub, start= 0,e ...
- stm32 HAL库笔记(零)
最近在设计四旋翼飞行器,用stm32f407,有三种开发方式可以选择:一.寄存器开发.二:库函数开发.三:HAL库开发,考虑了一下,选择了HAL库,原因如下: 1. 寄存器开发相对较慢,寄存器很多,配 ...
- Django之Form验证
view.py 配置 from django import forms from django.forms import fields # Create your views here. class ...