使用JavaScript设置div的高度和宽度？

我试图通过javascript设置div的高度和宽度，但没有效果。我尝试过很多事情，但迄今为止运气不佳。请告诉我哪里出了问题？我以为这会很直接

我不确定这里的问题是什么，在这种情况下，我不能使用CSS来设置在JavaScript中执行此操作所需的变量，尽管这是另一个主题

<div id="demo">Demo Div</div>

<script>
    var test = document.getElementById("demo");
    test.style.width = "100px";
    test.style.height = "100px";
    test.style.cssText = 'border:1px solid black;'
</script>

Demo Div
var test=document.getElementById（“demo”）；
test.style.width=“100px”；
test.style.height=“100px”；
test.style.cssText='边框：1px纯黑色；'

提前谢谢。（我也愿意接受jQuery替代方案）

---

-Epik-

问题在于，您的最后一行正在设置

cssText

，这将覆盖前两行上设置的样式，而不是添加到它们。请尝试以下方法：

var test = document.getElementById("demo");
test.style.width = "100px";
test.style.height = "100px";
test.style.border = '1px solid black'

演示：

既然您提到了jQuery，这里有一种方法可以使用它做同样的事情：

$("#demo").css({
    width : "100px",
    height : "100px",
    border : '1px solid black'
});

---

问题是您的最后一行正在设置

cssText

，这将覆盖前两行上设置的样式，而不是添加到它们中。请尝试以下方法：

var test = document.getElementById("demo");
test.style.width = "100px";
test.style.height = "100px";
test.style.border = '1px solid black'

演示：

既然您提到了jQuery，这里有一种方法可以使用它做同样的事情：

$("#demo").css({
    width : "100px",
    height : "100px",
    border : '1px solid black'
});

---

cssText将覆盖您设置的高度和宽度，以及您使用的任何其他样式。

，感谢：

---

我建议将

cssText

中的

border

删除，如下所示：

var test = document.getElementById("demo");
test.style.border = '1px solid black';
test.style.width = "100px";
test.style.height = "100px";

但如果您确实需要

cssText

，请首先使用它：

var test = document.getElementById("demo");
test.style.cssText = 'border:1px solid black;';
test.style.width = "100px";
test.style.height = "100px";

最后一个可行的解决方案是使用

cssText

：

var test = document.getElementById("demo");
test.style.cssText = 'border:1px solid black; width: 100px; height: 100px';

---

cssText将覆盖您设置的高度和宽度，以及您使用的任何其他样式。

，感谢：

---

我建议将

cssText

中的

border

删除，如下所示：

var test = document.getElementById("demo");
test.style.border = '1px solid black';
test.style.width = "100px";
test.style.height = "100px";

但如果您确实需要

cssText

，请首先使用它：

var test = document.getElementById("demo");
test.style.cssText = 'border:1px solid black;';
test.style.width = "100px";
test.style.height = "100px";

最后一个可行的解决方案是使用

cssText

：

var test = document.getElementById("demo");
test.style.cssText = 'border:1px solid black; width: 100px; height: 100px';

---

啊，谢谢你的友好、简单、快速的回复！啊，谢谢你的友好、简单、快速的回复！