javascript - .className() 似乎不起作用

Question

我有一个表，其中动态添加了行。这些行包含日期选择器和下拉列表，我可以使用 .className() 在日期选择器和下拉列表上设置类名，但不能在日期选择器和下拉列表上设置类名

var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
row.className = "row1 part";

var cell1 = row.insertCell(0);
cell1.className = "value";
var element1 = document.createElement("input");
element1.type = "text";
element1.name = "txtbox[]";
element1.className = "date-pick"; // this fails
element1.setAttribute('value', '2013/10/04');
cell1.appendChild(element1);

var cell2 = row.insertCell(1);
var element2 = document.createElement("select");
element2.name = "prddrop[]";
element2.id = "prddrop[]";
element2.className = "bankopt"; //this also fails
element2.options[element2.length] = new Option("[-- Please Choose --]", "[-- Please Choose --]");
var arr_items = [{
    "IssuingBank": " --- "
}, {
    "IssuingBank": " --- "
}];
$(document).ready(function () {
    for (var i = 0; i < arr_items.length; i++) {
        element2.options[element2.length] = new Option(arr_items[i].IssuingBank, arr_items[i].IssuingBank);
    }
});
cell2.appendChild(element2);

请帮我解决这个问题...谢谢!

Answer 1

请记住，.appendChild() 返回元素。

所以你可以这样做:

cell1.appendChild(element1).className = "class_to_add";

另一种方式:

您可以使用setAttribute(注意:这在 IE8 及更早版本上不起作用，如 @om 在评论中所述。)

var i = document.createElement('input'); 
i.setAttribute('class', 'myclass');
document.forms[0].appendChild(i);