JavaScript alert 顯示 undefined：DOM 遍歷路徑錯誤排查

現象

alert(this.parentNode.parentNode.firstChild.innerHTML) 彈出 undefined，預期獲取 <h3> 內容。

原因分析

undefined 意味著屬性訪問鏈中某環節為 null/undefined。常見原因：

• firstChild 返回 **文本節點** (換行/縮進空白) 而非元素節點，文本節點無 innerHTML。
• DOM 結構與預期不符（如多層包裹、動態生成）。
• 事件綁定上下文 this 指向錯誤（箭頭函數/普通函數區別）。

逐步排查法

// 1. 確認 this
console.log(this); 

// 2. 確認 parentNode
console.log(this.parentNode); 

// 3. 確認 parentNode.parentNode
console.log(this.parentNode.parentNode); 

// 4. 確認 firstChild (關鍵)
console.log(this.parentNode.parentNode.firstChild); 
// 可能輸出 #text "\n    " → 無 innerHTML

// 5. 正確獲取第一個元素子節點
console.log(this.parentNode.parentNode.firstElementChild); // 推薦
// 或
console.log(this.parentNode.parentNode.children[0]);

修正代碼

// 使用 firstElementChild 獲取第一個元素節點
alert(this.parentNode.parentNode.firstElementChild.innerHTML);

// 更穩健：查找最近的 h3
alert(this.closest('tr').querySelector('h3').innerHTML);

關鍵 DOM API 對比

1. 上一篇文章： Android Activity 啟動模式 singleTask/singleInstance 返回桌面後圖標啟動行為分析
2. 下一篇文章： ADO 操作 Access 資料庫：重複使用 ADO 物件導致 IDispatch error #3092 之解決方案

程式設計綜合問答

Java EE：Action 可呼叫但無法取得用戶 ID 參數

現象 使用 SSH2 框架開發用戶管理模組，呼叫刪除 Act

移動 App UI 設計尺寸規範：Android 與 iOS 圖標、啟動圖標準尺寸對照表

核心尺寸標準 不同平台對 App 圖片資源有嚴格尺寸要求，設

Java ServerSocket.accept() 迴圈機制：單一 Socket 維持長連線

程式碼片段 while (true) { Socke

SQL 高效統計：依 ID、Time 分組判斷 Pos 1-4 完整且 Result 全 True 的比例

資料樣本 ID Time Pos Resu