javascript - 获取没有“px”的按钮Javascript的宽度

Question

我有一些代码可以获取按钮的宽度，但它总是返回最后带有“px”的按钮的宽度。有没有一种简单的方法（不创建删除最后两个字符的函数）在没有“px”部分的情况下获取宽度，但仍然以像素为单位？

jsfiddle 示例

<button name="test" id="mybutton" onclick="alert(this.style.width);" style="width:200px;">Click me</button>

提前致谢

Answer 1

嘿，一个简单的答案是在数字上使用 parseInt

<button name="test" id="mybutton" onclick="alert(parseInt(this.style.width,10));" style="width:200px;">Click me</button>

在这里查看小提琴http://jsfiddle.net/XdADS/6/

Answer 2

最后能不能换一个？

<button name="test" id="mybutton" onclick="alert(this.style.width.replace('px', ''));" style="width:200px;">Click me</button>

请记住，如果您有 em、rem 或百分比等的宽度......这将为您提供 CSS 声明大小，例如 12 表示 12em 而不是实际大小，否则您将需要使用类似这样的东西：

this.offsetWidth

Answer 3

利用 parseInt()

onclick="alert(parseInt(this.style.width,10));

小提琴示例

Answer 4

正确代码：

<button name="test" id="mybutton" onclick="alert(this.style.width.replace('px',''));" style="width:200px;">Click me</button>

Answer 5

如果没有明确声明宽度，那么唯一的选择是使用：

id_of_btn.offsetWidth

根据 w3school，offsetWidth：“返回元素的宽度，包括填充、边框和滚动条”

来源：https ://www.w3schools.com/jsreF/dom_obj_all.asp

Answer 6

您可以使用 jQuery 的width()功能来实现这一点。