淘先锋技术网

首页 1 2 3 4 5 6 7
  1. 获取元素
    第一种:this.$refs
    第二种:document.querySelector()等等
    首先确保获取的元素不是undefined 或 null 等等
    元素得在mounted()生命周期内才获取得到
    建议在修改样式外面加个定时器,保证页面已经渲染完毕~只要遇到定时器就会把定时器放到代码最下面,最后再执行,而不是去等待。即使时间为0;

  2. 获取元素的宽、高
    (1)如果你元素有内联样式style=“width:100px;height:100px;”
    则可以通过以下方式获取宽,高
    this.$refs.名称.style.width 或 this.$refs.名称.offsetWidth
    this.$refs.名称.style.height 或 this.$refs.名称.offsetHeight
    tips:前者获取的是字符串且带单位,后者无单位
    (2)如果你元素没有内联样式或者宽高是写在style标签内的,即在样式表里的。
    则只能通过以下这种方式获取:
    this.$refs.名称.offsetWidth
    this.$refs.名称.offsetHeight

  3. 给元素宽,高赋值
    (1) offsetWidth 与 offsetHeight 只读,所以不能给这两个属性赋值
    (2)可以通过以下方式赋值
    this.$refs.名称.style.width=""
    this.$refs.名称.style.height=""
    注意:!!!
    元素内联样式的style的width和height的值是字符串,而且有单位!所以可能会存在因为少了单位而赋值失效问题!(我遇到过!!!)
    this.$refs.名称1.style.width = this.$refs.名称2.offsetWidth + ‘px’
    this.$refs.名称1.style.height = this.$refs.名称2.offsetHeight + ‘px’

  4. getComputedStyle API
    window.getComputedStyle(this.$refs.名称).width;
    window.getComputedStyle(this.$refs.名称).height;

  5. 元素本身有width、height属性!
    应该可以通过setAttribute()方式设置(没试过~)