如何獲取 JavaScript 中附加元素的值？

Question

我正在創建一個需要多次輸入的計算器，我需要獲取已附加的已創建 div 元素的值。

這是附加元素的代碼

let div - document.createElement("div"); 
div.innerHTML = html; 
schedule.appendChild(div.firstElementChild); 

這是正在創建的 html 元素的代碼：

<div class = "times"> 
 <input id = "start" type = "time" value = ""> 
 <input id = "end" type = "time"  value = ""> 
</div> 

我需要獲取 JavaScript 代碼在 JavaScript 中創建的時間輸入值。我該怎么做？

Answer 1

我想我理解和你需要的是下面的代碼。 . .檢查出來，讓我知道你的想法。 . .. 當您選擇時間時， onchange事件將觸發並且值將是 append 作為“<p>”標記到它的父 div。 如果您願意，您也可以將 append 的值設置為 body。 . .

 let div1 = document.createElement("div"); const html1=` <div class = "times" style='border:1px solid red;width:300px;height:100px;padding:10px;margin:5px;'> <input onchange='change(this)' type = "time" value = "" /> <input onchange='change(this)' type = "time" value = "" /> </div> `; div1.innerHTML = html1; let div2 = document.createElement("div"); const html2=` <div class = "times" style='border:1px solid red;width:300px;height:100px;padding:10px;margin:5px;'> <input onchange='change(this)' type = "time" value = "" /> <input onchange='change(this)' type = "time" value = "" /> </div> `; div2.innerHTML = html2; let schedule=document.getElementById("schedule"); schedule.appendChild(div1); schedule.appendChild(div2); function change(e){ let par=e.parentNode; let p=document.createElement('p'); p.innerHTML=`${e.value}`; par.appendChild(p); }

 <div id="schedule" style="border:1px solid blue;width:500px;height:300px;padding:20px;"> shedule div </div>

Answer 2

我有一個類似的問題。 檢查 html 中的所有 id 值，確保沒有兩個元素具有相同的 id。 遵循您的 javaScript 邏輯，以確保您沒有 append 具有相同 ID 的孩子。