동적으로 추가 된 열/필드 숨기기

Question

동적으로 생성 된 행/열이 있습니다. 내가하고 싶은 것은 그것의 섹션 (txtOffsetID)이 숨겨 지도록 설정되어 있습니다. 나는 이것을 시도했다 : txtOffsetID.setAttribute('type', 'hidden'); 그러나 그것은 작동하지 않았다. 전체 열과 새로운 열을 숨기고 싶습니다. IE에서 작동해야합니다. 감사.

샘플 코드 :

function addNewOffsetItem() 
{ 
    var iX = document.getElementById("txtOffsetIndex").value; 
    iX ++; 
    document.getElementById("txtOffsetIndex").value = iX; 

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

    //This section should be hidden.  
    //txtOffsetID1 
    var tdID = document.createElement("TD"); 
    tr.appendChild(tdID); 

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

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

    txtOffsetID.id = "txtOffsetID" + iX; 
    txtOffsetID.setAttribute('name','txtOffsetID' + iX); 
    **document.getElementById("colOffsetID").style.display="none";** 

    //This section should be visible. 
    //txtOffsetComments1 
    var tdComments = document.createElement("TD"); 
    tr.appendChild(tdComments); 

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

    var txtOffsetComments = document.createElement("textarea"); 
    p.appendChild(txtOffsetComments); 

    txtOffsetComments.id = "txtOffsetComments" + iX; 
    txtOffsetComments.setAttribute('name','txtOffsetComments' + iX);  
} 

<table width="99%" border="1" cellpadding="1" cellspacing="1" id="tblOffsetDetail"> 
    <colgroup> 
    <col id="colOffsetID"> 
    <col id="colOffsetComments"> 
    </colgroup> 
    <tbody>  
     <tr> 
      <td><input type="text" id="txtOffsetID" name="txtOffsetID"></td> 
      <td><p><textarea name="txtOffsetComments" cols="15" rows="3" id="txtOffsetComments"></textarea></p></td>   
     </tr> 
    </tbody> 
</table> 

Answer 1

생성 "TR"요소는이

 
tr.setAttribute('style', 'display: none;'); 

처럼 숨겨져있을 수 있지만 경우에 당신은 당신이 테이블 요소
를 COLGROUP 사용할 필요가보다 전체 열을 숨기려면 예 :

 
<table> 
<colgroup> 
<col id="colOne"> 
<col id="colTwo"> 
<col id="colThre"> 
</colgroup> 
<tbody> 
<tr> 
<td>one</td> 
<td>two</td> 
<td>three</td> 
</tr> 
</tbody> 

당신은 colTwo li KE이

 
document.getElementById('colTwo').style.display = 'none'; 

나는이이 일을