使用谷歌聚合物，如何获得元素的宽度

Question

请让我问一个非常基本的技巧。即如何获得聚合物元件的当前宽度。我尝试了以下代码。但是它没有用。

模板

    <template> 
    <paper-input id="id1"></paper-input>
    <button on-tap="ontap">ontap</button>
    </template>

聚合物功能

   ontap:function(){alert (this.$.id1.width);}

在网络浏览器中，纸张输入元素的宽度与页面相同。

Answer 1

您可以使用this.$.id1.clientWidth。如果您愿意，clientWidth也不会包含填充和边框，也会包含在您的宽度使用中offsetWidth

  

clientWidth会将值四舍五入为整数。如果需要小数值，请使用element.getBoundingClientRect（）。

this.$.id1.getBoundingClientRect().width如果您使用内联样式，则this.$.id1.style.width也可以使用。

参考链接：clientWidth                  offsetWidth getBoundingClientRect()