//jquery获取ID为abc的元素的宽度.
alert($("#abc").width())
//js获取ID为abc的元素的宽度.
alert(parseInt(document.getElementById('abc').style.width))
</script>
js通过html对象的style属性获取元素属性.
获取到的值是包含单位(px像素)的.
将获取到的值转化成整数就可去掉单位.
parseInt() 函数可解析一个字符串,并返回一个整数.
语法
parseInt(string, radix)
参数 描述
string 必需。要被解析的字符串。
radix 可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。
如果省略该参数或其值为 0,则数字将以 10 为基础来解析。
如果它以“0x” 或 “0X” 开头,将以 16 为基数。
如果该参数小于 2 或者大于 36,则 parseInt() 将返回 NaN。
返回值
返回解析后的数字。
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
<style>
#div {
width: 100px
height: 50px
border: 1px solid red
color: green
text-align: center
}
input {
width: 250px
}
</style>
<script>
function test() {
var a = document.getElementById('a')
var b = document.getElementById('b')
var div = document.getElementById('div')
div.style.width = a.value + 'px'
div.style.height = b.value + 'px'
}
</script>
</head>
<body>
<div>宽度(默认100px):<input type="text" id="a" placeholder="输入想要的宽度,点击测试看效果" /></div>
<div>高度(默认50px):<input type="text" id="b" placeholder="输入想要的高度,点击测试看效果" /></div>
<div><button onclick="test()">点击测试</button></div>
<div id="div">来改变我</div>
</body>
</html>