Javascript 向innerHTML元素添加变量

如何根据分配给eventDiv元素的counterID将下面标签（innerHTML元素）中的文本更改为变量值

function addRow() {
var eventDiv = document.createElement('div');

var counterID = counterID + 1;

eventDiv.setAttribute('id', counterID);

eventDiv.className = 'event_cont';

eventDiv.innerHTML =

'<div class="cont" onclick="addRow()">\
  <div class="dep_cont">\
    <div class="cont_label">\
     <label id="dep_cont_label">Departure</label>\
   </div>\
   <div class="cont_time">\
     <label>10:00 AM</label>\
   </div>\
   <div class="cont_icon">\
     <img src="icons/geo_loc.png" width="30px" height="30px" alt="" title=""/>\
   </div>\
 </div>\
 <div class="des_cont">\
   <div class="cont_label">\
     <label>Destination</label>\
   </div>\
   <div class="cont_time">\
     <label>10:00 AM</label>\
   </div>\
   <div class="cont_icon">\
     <img src="icons/end_RH.png" width="30px" height="30px" alt="" title=""/>\
   </div>\
 </div>\
</div>';

document.getElementById('tab_cont').appendChild(eventDiv);

document.getElementById('dep_cont_label').innerHTML = document.getElementById('dep_loc_input').value;

函数addRow（）{
var eventDiv=document.createElement（'div'）；
var counterID=counterID+1；
eventDiv.setAttribute（'id'，counterID）；
eventDiv.className='event_cont'；
eventDiv.innerHTML=
'\
\
\
离开\
\
\
上午10:00\
\
\
\
\
\
\
\
目的地\
\
\
上午10:00\
\
\
\
\
\
';
document.getElementById（'tab_cont'）.appendChild（eventDiv）；
document.getElementById（'dep_cont_label'）。innerHTML=document.getElementById（'dep_loc_input'）。值；

}

---

上述操作的结果只是更改动态创建的第一个元素的标签文本，因为您为已创建的每个eventDiv使用相同的id

---

首先，应该在函数外部定义CounterID。此外，每次使用此函数创建div并将其附加到“tab_cont”时，都使用相同id的“dep_cont_label”和“dep_loc_input”。Id属性应该是唯一的。

counterId

需要全局声明，并从此方法中删除

var

。^--+使用而不是字符串。如何在元素中实现变量counterId？您应该在函数外部声明它。var-counterID=0；函数addRow（）{counterID++}