首页 > Web开发 > 详细

vue 获取dom的css属性值

时间:2019-03-23 16:20:38      阅读:550      评论:0      收藏:0      [点我收藏+]
<template>
  <div id="topInfo" ref="topInfo" style="width: 200px;height: 200px;background-color: #0bb20c">
    <img id="imgInfo" ref="imgInfo" src="./20151205231902_xe2kG.jpeg" alt="" height="200px"  >
  </div>
</template>
 
<script>
    export default {
        name: "center",
      mounted() {
//div 标签获取的方法
        let topInfowidth = this.$refs.topInfo.style.width;
        let topInfoheight = this.$refs.topInfo.style.height;
        console.log("topInfo:"+topInfowidth+"  "+topInfoheight)
 
        console.log("=================================================")
//img 标签获取的方法
        let imgInfowidth = this.$refs.imgInfo.width;
        let imgInfoheight = this.$refs.imgInfo.height;
        console.log("imgInfo:"+imgInfowidth+"  "+imgInfoheight)
        let src = this.$refs.imgInfo.src;
        console.log("src:"+src)
 
      }   //获取dom元素高度通过在标签里面定义ref属性,用this.$refs.自定义名称.offsetHight;去获取。
    }
</script>
 
<style scoped>
  #topInfo{
  overflow: hidden;
}
</style>

注意:需要在mounted中才能获取到

vue 获取dom的css属性值

原文:https://www.cnblogs.com/ysx215/p/10584385.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!