我已经创建了以下…
var menu = document.createElement('select');
我现在如何设置CSS属性，如宽度:100px?
当前回答
<body>
<h1 id="h1">Silence and Smile</h1><br />
<h3 id="h3">Silence and Smile</h3>
<script type="text/javascript">
document.getElementById("h1").style.color = "Red";
document.getElementById("h1").style.background = "Green";
document.getElementById("h3").style.fontSize = "larger" ;
document.getElementById("h3").style.fontFamily = "Arial";
</script>
</body>
其他回答
使用element.style:
var element = document.createElement('select');
element.style.width = "100px";
<body>
<h1 id="h1">Silence and Smile</h1><br />
<h3 id="h3">Silence and Smile</h3>
<script type="text/javascript">
document.getElementById("h1").style.color = "Red";
document.getElementById("h1").style.background = "Green";
document.getElementById("h3").style.fontSize = "larger" ;
document.getElementById("h3").style.fontFamily = "Arial";
</script>
</body>
这适用于大多数CSS属性，如果他们没有连字符。
var element = document.createElement('select');
element.style.width = "100px";
对于带有连字符的属性，如max-width，您应该将香肠大小写转换为骆驼大小写
var element = document.createElement('select');
element.style.maxWidth = "100px";
如果你想添加一个全局属性，你可以使用:
var styleEl = document.createElement('style'), styleSheet;
document.head.appendChild(styleEl);
styleSheet = styleEl.sheet;
styleSheet.insertRule(".modal { position:absolute; bottom:auto; }", 0);
当调试时，我喜欢能够在一行中添加一堆css属性:
menu.style.cssText = 'width: 100px';
习惯了这种风格，你可以在一行中添加一堆css，像这样:
menu.style.cssText = 'width: 100px; height: 100px; background: #afafaf';
