javascript中設置元素寬度的方法：1、使用“document.getElementById("id值")”語句獲取元素對象；2、使用“元素對象.style.width="寬度值"”語句來設置元素的寬度；需要在HTML中通過script標簽添加javascript代碼來實現。
具體原理分析：
獲取元素對象
HTML DOM Style 對象的width 屬性設置元素的寬度。
代碼示例：
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<style>
img {
width: 200px;
}
</style>
</head>
<body>
<img id="img" src="img/1.jpg" />
<p id="demo">img圖片寬度為200px。</p>
<button onclick="myFunction()">設置img圖片的寬度</button>
<script>
function myFunction() {
document.getElementById("img").style.width="300px";
document.getElementById("demo").innerHTML="img圖片寬度為300px。";
}
</script>
</body>
</html>
效果圖：
說明：
Style 對象的width 屬性可以設置元素的寬度。
語法：
Object.style.width=auto|length|%
參數分析：
auto：默認參數，瀏覽器可計算出實際的寬度。
%：定義基于其包含塊的百分比寬度。
length：使用 px、cm 等單位定義寬度。
