我已经创建了以下…

var menu = document.createElement('select');

我现在如何设置CSS属性,如宽度:100px?


当前回答

这其实用JavaScript很简单:

menu.style.width = "100px";

其他回答

使用element.style:

var element = document.createElement('select');
element.style.width = "100px";

仅供在2018年想做同样事情的人使用

你可以为你的元素指定一个CSS自定义属性(通过CSS或JS)并更改它:

通过CSS分配:

element {
  --element-width: 300px;

  width: var(--element-width, 100%);
}

通过JS赋值

ELEMENT.style.setProperty('--element-width', NEW_VALUE);

通过JS获取属性值

ELEMENT.style.getPropertyValue('--element-width');

以下是有用的链接:

https://developer.mozilla.org/en-US/docs/Web/CSS/-- * https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration/getPropertyValue https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration/setProperty https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration/removeProperty

这其实用JavaScript很简单:

menu.style.width = "100px";

只需设置样式:

var menu = document.createElement("select");
menu.style.width = "100px";

或者如果你喜欢,你可以使用jQuery:

$(menu).css("width", "100px");

当调试时,我喜欢能够在一行中添加一堆css属性:

menu.style.cssText = 'width: 100px';

习惯了这种风格,你可以在一行中添加一堆css,像这样:

menu.style.cssText = 'width: 100px; height: 100px; background: #afafaf';