我已经创建了以下…

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

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


当前回答

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

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

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

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

其他回答

对于大多数样式,这样做:

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

对于名称中有连字符的样式,这样做:

var obj = document.createElement('select');
obj.style["-webkit-background-size"] = "100px"

使用element.style:

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

所有的答案都正确地告诉你如何做你问的事情,但我建议使用JavaScript在元素上设置一个类,并使用CSS设置它的样式。这样你就能正确区分行为和风格。

想象一下,如果你有一个设计师重新设计网站的风格……他们应该能够完全在CSS工作,而不必与你的JavaScript工作。

在原型中我会这样做:

$(newElement).addClassName('blah')

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

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

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

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

这适用于大多数CSS属性,如果他们没有连字符。

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

对于带有连字符的属性,如max-width,您应该将香肠大小写转换为骆驼大小写

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