为什么我不能创建一个具有多个样式元素的div？

Question

我正在尝试使用jQuery创建div：

let gridBlock = $("<div style=width:10px; height:20px; background-color:red;></div>");

然而，当我查看渲染页面时，控制台显示div只有宽度样式：

我做错了什么？

Answer 1

使用引号mate

let gridBlock = $("<div style='width:10px; height:20px; background-color:red;'></div>");

Answer 2

虽然您已经在评论中得到了答案，但有更好的方法可以使用class来实现。原因css-specificity。使用style属性添加样式很难覆盖＆amp;需要使用!important。

为避免这种情况，您可以使用class属性并在css文件中定义样式

<强> some.css

.someClass {
  width: 10px;
  height: 20px;
  background-color: red;
}

在js文件中

let gridBlock = $("<div class='someClass'>Hello</div>");

DEMO