技术问答濡備綍缁撳悎offsetWidth鍜孞avaScript - 扬州沐宇科技

瑕佺粨鍚坥ffsetWidth鍜孞avaScript锛屽彲浠ヤ娇鐢╫ffsetWidth灞炴€ф潵鑾峰彇鍏冪礌鐨勫搴︼紝骞跺湪JavaScript涓娇鐢ㄨ繖涓€兼潵杩涜鐩稿簲鐨勬搷浣溿€備緥濡傦紝鍙互閫氳繃JavaScript鍔ㄦ€佽缃厓绱犵殑瀹藉害銆佹牴鎹厓绱犵殑瀹藉害鎵ц涓嶅悓鐨勯€昏緫绛夈€?/p>

涓嬮潰鏄竴涓畝鍗曠殑绀轰緥锛屾紨绀哄浣曠粨鍚坥ffsetWidth鍜孞avaScript鏉ュ姩鎬佽缃厓绱犵殑瀹藉害锛?/p>

<!DOCTYPE html>
<html>
<head>
  <title>OffsetWidth Example</title>
</head>
<body>

<div id="box" style="width: 100px; height: 100px; background-color: red;"></div>

<script>
  var box = document.getElementById("box");
  var currentWidth = box.offsetWidth;
  
  // 鍔ㄦ€佽缃厓绱犵殑瀹藉害
  box.style.width = (currentWidth * 2) + "px";
</script>

</body>
</html>

鍦ㄤ笂闈㈢殑绀轰緥涓紝鎴戜滑棣栧厛閫氳繃document.getElementById鏂规硶鑾峰彇id涓?quot;box"鐨勫厓绱狅紝鐒跺悗浣跨敤offsetWidth灞炴€ц幏鍙栧厓绱犵殑瀹藉害锛屽苟灏嗗叾涔樹互2鏉ヨ缃负鏂扮殑瀹藉害銆傝繖鏍峰氨瀹炵幇浜嗗姩鎬佽缃厓绱犲搴︾殑鏁堟灉銆傛偍鍙互鏍规嵁鍏蜂綋闇€姹傦紝缁撳悎offsetWidth鍜孞avaScript鏉ュ疄鐜版洿澶氱殑鍔熻兘銆?/p>