如何更改我的div JavaScript的宽度

Question

大家好，我正在尝试使用Javascript更改div元素的宽度和高度，当用户插入值时，我想自动更改大小，因此我尝试了以下方法：

<br><p>chose button color</p>
<a href="#" onclick="redBtn()">red</a>
<a href="#" onclick="blueBtn()">blue</a>
<a href="#" onclick="greenBtn()">Green</a>
<a href="#" onclick="yellowBtn()">Yellow</a>
<a href="#" onclick="whiteBtn()">White</a><br>
OR type your own: <input type="text" id="ownBtn"> <button onclick="submitBtn();" href="javascript:;">Submit</button><br>
Type your width: <input type="text" id="userWidth"><button onclick="submitWidth()" href="javascript:;">Submit Width</button> </input><br>

<div class="div1" id="div1" class="class1">    
    <div class="div2" id="div3">     
      <a href="https://calendly.com/dumbomoving">

      </a>                  
    </div>
</div>
<script>
function submitWidth() {
    var userWidth = document.getElementById();
    document.getElementById("div2").style.width = userWidth.value + "px";
}
  function submitBtn()
{
    var userBack = document.getElementById('ownBtn');
    document.getElementById("btn1").style.backgroundColor =ownBtn.value;    
}
</script>

因此，对于按钮颜色来说还可以，但是对于宽度而言则不行！ 那么，有人知道如何做到这一点吗？

Answer 1

你写了

document.getElementById("div2")

但我在您的HTML中看不到ID为div2元素。

你做了

<div class="div2" id="div3">

但是你可能想写

<div class="div2" id="div2">

毕竟，您所有的JavaScript确实很奇怪。 也许试试这个：

function submitWidth() {
    var userWidth = document.getElementById("userWidth");
    userWidth.style.width = userWidth.value + "px";
}

Answer 2

这是非常愚蠢的错误

function submitWidth() {
    var userWidth = document.getElementById('userWidth');
    document.getElementById("div2").style.width = userWidth.value + "px";
}

我忘了把id放在getElement中。 Bu现在我有问题，我在div中的图片不想调整大小。 因此，如果有人提出建议，我们欢迎您。