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

【问题标题】：Using google polymer, how to get the width of an element使用谷歌聚合物，如何获得元素的宽度
【发布时间】：2016-06-24 05:50:16
【问题描述】：

请让我问一个非常初级的技术。即如何获得聚合物元素的当前宽度。我尝试了以下代码。但是它没有工作。

模板

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

聚合物功能

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

在网络浏览器上，paper-input 元素的宽度看起来与页面相同。

【问题讨论】：

【解决方案1】：

您可以使用this.$.id1.clientWidth。 clientWidth 将不包括填充和边框，如果您希望也包含在您的宽度中，请使用 offsetWidth

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

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

【讨论】：