LESSON-12 · TOPIC 04
能分辨原生 disabled 會退出焦點／操作與表單提交，aria-disabled 則仍需程式阻止動作並可保留可發現性。
能分辨原生 disabled 會退出焦點／操作與表單提交，aria-disabled 則仍需程式阻止動作並可保留可發現性。
只加 aria-disabled 不會自動停止 click；反之原生 disabled 無法聚焦，使用者可能無法讀到不可用原因。
要修改的檔案：files/starter/index.html
定位：先檢查兩個按鈕各自的 attribute，不以灰色外觀判斷。｜依 module-4 定位，只修改「disabled 與 aria-disabled」的責任。
先結果，再原理；完成後要能說出自己看見的證據。
方案尚未選擇前『下一步』要保留在 Tab 流程並說明原因，但不能真的前進。
起始狀態：原生 disabled 與 aria-disabled 按鈕並列；aria 按鈕事件守門計數從0開始。
現有 runtime 聚焦 aria-disabled button 成功；required facts disabledFocused=false、ariaDisabledFocused=true、blockedClicks=1。
驗收證據：activeId=aria-disabled-button、focused=true；required facts disabledFocused=false、ariaDisabledFocused=true、blockedClicks=1
完全不可操作時優先原生 disabled；需要保持可聚焦以說明原因時才考慮 aria-disabled 並實作阻止。
常見混淆：aria-disabled 不等於 disabled attribute，也不會自動套用瀏覽器 disabled 樣式。
這段程式是理解起點，不是要你直接跳過 Starter。
disabled 是瀏覽器真的關掉按鈕；aria-disabled 是你宣告它目前不可用，但程式還要自己守門。
正式說法：The HTML disabled state suppresses focus/activation and excludes form controls from submission；aria-disabled exposes an accessibility state without changing native behavior。
button.setAttribute('aria-disabled','true');button.addEventListener('click',e=>{if(button.ariaDisabled==='true')e.preventDefault()})每一步都留下可觀察結果；如果沒看到，先看「卡住先查」。
檔案：files/starter/index.html 定位：先檢查兩個按鈕各自的 attribute，不以灰色外觀判斷。
要做：先重新載入 Starter，記錄目前畫面、DOM、Computed、Console 或文件內容。
預期：能指出「先檢查兩個按鈕各自的 attribute，不以灰色外觀判斷。」目前的缺口。
證據：保存 files/starter/index.html 的目前狀態，並指出下一步只會修改哪個檔案責任。
卡住先查：確認開啟的是 files/starter/index.html，且定位到 先檢查兩個按鈕各自的 attribute，不以灰色外觀判斷。。
檔案：files/starter/index.html 定位：先檢查兩個按鈕各自的 attribute，不以灰色外觀判斷。
要做：執行 focus runtime 聚焦 aria-disabled 按鈕；完整 probe 再比較 disabled focus 與兩者 click。
預期：現有 runtime 聚焦 aria-disabled button 成功；required facts disabledFocused=false、ariaDisabledFocused=true、blockedClicks=1。
證據：activeId=aria-disabled-button、focused=true；required facts disabledFocused=false、ariaDisabledFocused=true、blockedClicks=1
卡住先查：先檢查兩個按鈕各自的 attribute，不以灰色外觀判斷。
檔案：files/starter/index.html 定位：先檢查兩個按鈕各自的 attribute，不以灰色外觀判斷。
要做：重新整理頁面，再逐項比對預期結果與 evidence。
預期：現有 runtime 聚焦 aria-disabled button 成功；required facts disabledFocused=false、ariaDisabledFocused=true、blockedClicks=1。
證據：activeId=aria-disabled-button、focused=true；required facts disabledFocused=false、ariaDisabledFocused=true、blockedClicks=1
卡住先查：先檢查兩個按鈕各自的 attribute，不以灰色外觀判斷。
這個示範只讓你看懂概念，不會替你修改 Starter，也不會自動宣告完成。
勾選只是學習紀錄；真正完成仍要回到 Starter 的實際結果。
先決定按鈕是否需要保持可聚焦與可說明。
原生 disabled 交給瀏覽器；aria-disabled 必須在 click/keyboard handler 阻止。
完整解答與原因：disabled 無法聚焦；aria-disabled 可聚焦但仍會收到 click，因此 handler 必須阻止並提供狀態說明。