vue 获取dom的css属性值


<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中才能获取到


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM