替換span元素的文本

Question

我想用一個箭頭►代替方形圖標（html文件中的span元素中的文本：■）。 當菜單項前面的圖標與頁面ID匹配時，就會發生這種情況，從而使訪問者知道他在此菜單項指示的頁面上。

我經歷過很多問題，但始終堅持這一問題。

var newIcon = "►"; // arrow icon
for (var j = 0; j < rightMenuIDs.length; j++){
    var thisID = rightMenuIDs[j];
    var thisSpanIcon = rightMenu[j].children[0].children[0].childNodes[0].nodeValue;
    if(thisID === bodyIDsliced){
        thisSpanIcon = newIcon;
    }
}

我檢查了console.log，它說thisSpanIcon已更新為箭頭圖標。 但是頁面上沒有任何變化。 我嘗試了replace（）和其他方法無濟於事。

如果有更好/正確的方法可以有人躺在我身上？

謝謝！

Answer 1

當你說：

thisSpanIcon = newIcon;

您只是覆蓋了局部變量thisSpanIcon ，該變量包含節點現有的nodeValue屬性的副本 ，而不更改屬性（並因此更改了節點）本身。

嘗試：

var thisSpanNode = rightMenu[j].children[0].children[0].childNodes[0];
if (thisID === bodyIDsliced) {
    thisSpanNode.nodeValue = newIcon;
}

它應該改為更改節點的實際屬性。

另請注意，您應該對字符串使用Unicode格式，而不是HTML實體，即\► 。

Answer 2

您必須使用elem.innerHTML或elem.innerText來更新元素/節點的文本。 （ 小例子 ）

另外，尋找一些現代的選擇元素的方法。