1
我想我會生氣！我無法使用element.style.width獲取Div的寬度。我是否必須使用element.clientWidth？
我開始爲自己寫一點運動，我將會有一些div，我可以在右邊拖動來增加或減小Div寬度。我還有一個容器Div，它有一個設定的寬度，我將用它來確定一個百分比 - 基本上我會製作一些可以編輯的條形圖/直方圖。
我開始寫我的代碼，我想我只是確保我可以輸出百分比。
這裏的代碼初報....
<style>
#container{width:500px;}
#dragDiv{border:1px solid #000;background-color:pink;width:100px;height:100px;}
</style>
</head>
<body>
<div id="container">
<div id="dragDiv"></div>
</div>
<script>
function dragOneSide(innDiv, outDiv){
if(document.getElementById(innDiv) && document.getElementById(outDiv)){
var iDiv = document.getElementById(innDiv),
oDiv = document.getElementById(outDiv);
// write out the width as a percentage
var iDivWidth = parseInt(iDiv.style.width),
oDivWidth = parseInt(oDiv.style.width);
//alert(document.getElementById("dragDiv").style.width);
iDiv.innerHTML = ((iDivWidth/oDivWidth) * 100);
}
}
window.onload = function(){
dragOneSide("dragDiv", "container");
}
</script>
現在在IDIV價值爲喃？我發現這很奇怪。當試圖提醒寬度時，我得到一個空白，字面上是一個空字符串！我覺得奇怪，特別是因爲我沒有試圖做任何複雜的事情。我使用了螢火蟲，設置了一個斷點並觀察了觀察窗口。 Div的寬度沒有任何價值。然後我把一個內嵌樣式上像這樣的DIV ...
<div id="container">
<div id="dragDiv" style="width:300px;">Hello World</div>
</div>
和低看哪，現在我正在對商品的價值！現在我不喜歡內聯樣式（誰有），但是我從來沒有遇到過這個問題，而且我已經使用JavaScript和HTML多年了 - 有沒有人爲此做過解釋？要檢索未由CSS設置的寬度，我必須使用不同的屬性，如clientWidth？
Ps。我還沒有包含任何拖動代碼，所以請不要指出。