createElement图片来源

我在此代码中动态添加行/字段。我有一个日期文本字段，旁边是一个日历按钮/图像，用户可以使用它来选择适当的日期。但是，如果我点击“添加新项目”按钮添加一个新行，我无法完全让这个图像重新正确显示日历。行正在被添加，并且该字段被添加用于日历按钮，但它没有定位我的图像源，我不能选择它来选择日期。有人能告诉我我做错了什么，有什么可以改正的吗？谢谢。createElement图片来源

<html> 
<head> 
<script language="javascript"> 
function addNewItem() 
{ 
    var iX = document.getElementById("txtIndex").value; 
    iX ++; 
    document.getElementById("txtIndex").value = iX; 

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

    //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); 

    var imgOffsetDateClearedCalendar = document.createElement("img"); 
    p.appendChild(imgOffsetDateClearedCalendar); 

    txtOffsetDateCleared.id = "txtOffsetDateCleared" + iX; 
    txtOffsetDateCleared.setAttribute('size',10); //Set width using HTML 
    //txtOffsetDateCleared.style.width = '85px'; //Set width using CSS 

    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); 
     }  

    //imgOffsetDateClearedCalendar 
    var imgOffsetDateClearedCalendar1 = document.getElementById("imgOffsetDateClearedCalendar1"); 
    var i = 0; 

    for (i = 0; i < imgOffsetDateClearedCalendar1.children.length; i++) 
     { 
      var opt = document.createElement("img"); 
      opt.setAttribute('src', '../images/cal.gif'); 
      opt.setAttribute('Pick a date', 'alternate text'); 
      opt.setAttribute('height', '16px'); 
      opt.setAttribute('width', '16px'); 
      //opt.value = imgOffsetDateClearedCalendar1 [i].value; 
      //opt.innerText = imgOffsetDateClearedCalendar1 [i].innerText; 
      imgOffsetDateClearedCalendar1.appendChild(opt); 
     } 
</script> 
</head> 


    <body> 
    <table width="99%" border="1" cellpadding="2" cellspacing="2" class="WebApps" id="tblOffsetDetail"> 
    <tbody> 
    <tr> 
    <input type="button" class="button" value= "Add New Item" id="btnNewItem" name="btnNewItem" onClick="javascript:addNewItem();"> 
    <input type="text" id="txtIndex" name="txtIndex" value="1"> 
<td><p><a href="javascript:NewCal('txtOffsetDateCleared1','mmmddyyyy')"> 
       <input name="txtOffsetDateCleared1" type="text" id="txtOffsetDateCleared1" size="10" maxlength="10"> 
       <img src="../images/cal.gif" width="16" height="16" border="0" alt="Pick a date" id="imgOffsetDateClearedCalendar1" name="imgOffsetDateClearedCalendar1"></a></p>  

    </td> 
    </tr> 
    </tbody> 
    </table> 
    </body> 
    </html>

来源

2010-01-11 SeanFlynn