JavaScript 動態在 dt 後插入文本框：innerHTML 追加或 DOM API 創建

需求

在 <dl> 列表的 <dt> 後動態添加 <input> 文本框。

簡單實現（innerHTML）

document.getElementById('targetDt').insertAdjacentHTML('afterend', 
    '');

insertAdjacentHTML('afterend', html) 比操作 innerHTML 更高效、不破壞現有事件綁定。

標準 DOM 實現（推薦）

const dt = document.getElementById('targetDt');
const input = document.createElement('input');
input.type = 'text';
input.className = 'dynamic-input';
input.placeholder = '請輸入';
dt.parentNode.insertBefore(input, dt.nextSibling);

注意

• 若 dt 後已有 dd，插入位置需調整
• 動態元素事件委託給父容器（dl 或 document）