JavaScript 動態創建 option 設置文本：innerText 不兼容，用 Option 構造函數或 text 屬性

動態創建 <option> 時，optnode.innerText = citys[x] 在 Firefox 中無效。標準 DOM 方式：用 new Option(text, value) 構造函數，或設置 option.text 屬性。

錯誤代碼

var optnode = document.createElement("option");
optnode.innerText = citys[x]; // ❌ Firefox 不支持
subnode.appendChild(optnode);

正確代碼（跨瀏覽器）

// 方式一：Option 構造函數（最簡潔）
var opt = new Option(citys[x], citys[x]); // text, value
subnode.appendChild(opt);

// 方式二：設置 text 屬性
var opt = document.createElement("option");
opt.text = citys[x];
opt.value = citys[x];
subnode.appendChild(opt);

// 方式三：innerHTML（不推薦，有 XSS 風險）
opt.innerHTML = citys[x];

完整級聯選擇示例

function updateCities(provinceIndex) {
    var citySelect = document.getElementById("subselid");
    citySelect.innerHTML = ""; // 清空
    var cities = provinceData[provinceIndex];
    cities.forEach(function(city) {
        citySelect.appendChild(new Option(city, city));
    });
}

關鍵點

• Option 構造函數自動創建 <option> 元素並設置文本/值。
• option.text / option.value 是標準屬性，跨瀏覽器兼容。
• 避免 innerText/innerHTML 設置選項文本。

標準 DOM API 讓動態下拉選單兼容無憂。