javascript - document.createElement 文本字段长度

Question

我正在使用以下代码通过触摸按钮动态添加带有文本字段的行。我遇到的问题是在这些行中创建的文本字段不是我想要的大小。在这种情况下，有没有办法指定文本字段的长度？

function addNewRow()
{
    var iX = document.getElementById("txtIndex").value;
    iX ++;
    document.getElementById("txtIndex").value = iX;

    var tbl = document.getElementById("tblDetail").getElementsByTagName("TBODY")[0];
    var tr = document.createElement("TR");
    tbl.appendChild(tr);

         //Text Field:  txtOffsetDateCleared1
    var tdOffsetDateCleared = document.createElement("TD");
    tr.appendChild(tdOffsetDateCleared);

    var p = document.createElement("P");
    tdOffsetDateCleared.appendChild(p);

    var txtOffsetDateCleared = document.createElement("input"); 
    p.appendChild(txtOffsetDateCleared);

    txtOffsetDateCleared.id = "txtOffsetDateCleared" + iX;

    var txtOffsetDateCleared1 = document.getElementById("txtOffsetDateCleared1");
    var i = 0;

    for (i = 0; i < txtOffsetDateCleared1.children.length; i++)
        {
            var opt = document.createElement("option");
            opt.value = txtOffsetDateCleared1 [i].value;
            opt.innerText = txtOffsetDateCleared1 [i].innerText;
            txtOffsetDateCleared.appendChild(opt);
        }
}

Answer 1

您可以设置 width CSS 属性或 size HTML 属性:

txtOffsetDateCleared.setAttribute('size',10); // HTML attribute
txtOffsetDateCleared.style.width = '200px';   // CSS property

我建议使用 CSS 属性而不是 HTML 属性，因为后者将宽度指定为文本框中显示的字符数。 CSS 属性将设置元素的精确宽度。