javascript - Document.getElementById 问题（访问宽度属性）

Question

我尝试在 JavaScript 的所有部分添加.style、.style.width和.style.width.value，但到目前为止无济于事。

本质上，我想要两件事。

1. 要通过单击“动画”按钮获取值的警报50px，运行该anim8函数。换句话说，我想要width.div

2. 在第二组代码 ( anim82) 中，我希望能够width通过单击按钮来设置/更改它。我想10px在单击按钮时添加。首先，我需要访问该变量，即width, ，然后才能更改任何内容。

HTML

 <div id="mainTxt">Dag!</div>
 <form NAME="myForm" ACTION="" METHOD="GET">
 <input type="button" name="button" value="Animate" onClick="anim8(this.form)">
 <input type="button" name="button" value="Animate2" onClick="anim82(this.form)">

CSS

#mainTxt{width:60px;}

Javascript

var divAlert;
var divSize;

function anim8(form)
{
    divAlert=document.getElementById("mainTxt");
    alert(divAlert);
}

function anim82(form)
{
    divSize=document.getElementById("mainTxt");
    divSize.style.width=parseInt(divSize.style.width)+10+'px';
}

Answer 1

试试这个

function anim82(form)
{
    divSize=document.getElementById("mainTxt");
    var width=divSize.offsetWidth + 100;
    divSize.setAttribute("style","width:"+ width +"px")    
}

JS 小提琴示例

Answer 2

您的第一步应该是查看是否有错误。如果您收到错误，请尝试此代码

var div1 = document.getElementById("mainTxt");
var align = div1.getAttribute("width");

来源