javascript 为 Internet Explorer 设置 className 属性答案

【问题标题】：javascript set className property for Internet Explorerjavascript 为 Internet Explorer 设置 className 属性
【发布时间】：2011-12-20 06:41:30
【问题描述】：

我使用以下代码设置动态生成的选择控件的 className 属性：

oField.className ="select";

它适用于 Firefox，不适用于 Internet Explorer。如何在 IE 上设置此属性？

代码：

var oField = document.createElement("select");  
if(browser == "IE"){  
    oField.size = 1;  
    oField.setAttribute("name","sele"+num); 
    oField.onChange = function(){
        AggiungiRiga(oField.name,oField.value)
    };
}  
else{  
   oField.setAttribute("size",1);
   oField.setAttribute("name","sele"+num);
   oField.setAttribute("onChange","AggiungiRiga(this.name,this.value)");
}  
oField.className ="select";

这里我将它添加到文档中：

oTd1.appendChild(oField);

（oTd1 是必须放置选择控件的<td> 元素）。我知道代码质量不好，因为是遗留代码。

【问题讨论】：

假设oField 是一个HTMLElementNode，在IE 中应该可以正常工作。您的问题可能出在其他地方。
oField 只是一个变量。我设置了 id、name、value、className，然后将其添加到文档中。
显示将“oField”设置为值的代码。
以及将其添加到文档中的代码。
你不应该使用“setAttribute()”来处理你在该代码中所做的任何事情。

标签： javascript internet-explorer classname

【解决方案1】：

我没有看到appendChild() 方法，你在哪里附加select element？

不将oField 附加到文档可能会导致您出现问题。

例如：

document.body.appendChild(oField);

还有变量browser 和num 是从哪里声明的？我想如果它在 FF num 中的工作被声明了。

 var oField = document.createElement("select");

 oField.size = 1;
 oField.name = "sele" + num; 

 oField.onChange = function(){AggiungiRiga(oField.name,oField.value)};

 oField.className = "select";

 document.getElementById('tabella').getElementsByTagName('TBODY')[0].childNodes[0].firstChild.appendChild(oField)

你知道是什么让我有一个id 为TD 很容易吗，如果你有一个TD id=""，我会更容易，如果你想把选择放在第一个 TD 这将完成上面显示的示例

   document.getElementById('tabella').getElementsByTagName('TBODY')[0].childNodes[0].firstChild.appendChild(oField)

但是你需要让表格紧凑

<table id="tabella"><tr><td></td></tr></table>

【讨论】：

@AntonioF 看着你的代码，你不需要检查 if(browser == "IE")，因为只需附加 onchange 就可以了，我更新了我的答案
oTd1 是附加到 oTr（一个对象）的对象，该对象通过以下方式附加到表中：document.getElementById('tabella').getElementsByTagName('TBODY')[ 0].appendChild(oTr);

【解决方案2】：

你为什么不尝试用 jquery 来做呢：

$('#idElement').attr('class', 'classname');

或者只用javascript：

document.getElementById("idElement").setAttribute("class", "className");

【讨论】：

没有理由使用“setAttribute()”来设置真实DOM元素的“className”属性。
setAttribute 在（不多）旧版本的 IE 中被破坏，特别是如果您尝试设置 class 属性，那么它将尝试设置 class property 而不是className 属性，所以这不起作用。
如果我不喜欢“运行到 jQuery 来解决最琐碎的问题”的答案，那么如果你打算使用 jQuery 来处理类名，那么它有addClass 和朋友，所以使用attr 通常是该任务的糟糕选择。