使用 JavaScript 替换 innerText 中的，不起作用答案

【问题标题】：Using JavaScript to replace   in innerText, does not work使用 JavaScript 替换 innerText 中的，不起作用
【发布时间】：2019-10-10 21:48:16
【问题描述】：

我正在尝试将多行中的 &nbsp; 的每个实例替换为 w（如字符“w”。）这些行如下：

<li class="list-group-item horaire-list-item">
    Monday,&nbsp;Tuesday,&nbsp;Thursday,&nbsp;Friday :  12:00 to 14:00 et  18:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
    Wednesday :  12:00 to 14:00 et  16:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
    Saturday :  12:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
    Sunday,&nbsp;Holidays :  09:00 to 20:30
</li>

我已经使用 replace(/a/g, 'e') 成功地使用代码打击将“a”的实例替换为“e”，所以我知道我的代码是有效的。

我的代码如下：

var laHoraireElements = document.getElementsByClassName('list-group-item horaire-list-item');
    for ( liJ = 0; liJ < laHoraireElements.length; liJ++ ) {
        laHoraireElements[liJ].innerText = laHoraireElements[liJ].innerText.replace(/&nbsp;/g, 'w');
        alert(laHoraireElements[liJ].innerText);
    }

预期结果是&nbsp; 的实例将被替换为“w”，但&nbsp; 的实例不会被修改。可能是什么原因？

【问题讨论】：

我认为您需要“转义” & 和/或 ;
您能浏览一下答案，然后回复（带有评论）和/或投票和/或接受答案吗？这就是这个网站应该如何运作的:-)

标签： javascript html regex dom replace

【解决方案1】：

&nbsp; 已经在您的 HTML 中呈现为空格，因此没有任何 &nbsp; 实例可以替换。如果您想保持原样，转义它会起作用，允许您使用正则表达式替换来修改它。正如@barmar 提到的，使用innerHTML 也可以解决问题：

var laHoraireElements = document.getElementsByClassName('list-group-item horaire-list-item');

for (liJ = 0; liJ < laHoraireElements.length; liJ++) {
  laHoraireElements[liJ].innerHTML = laHoraireElements[liJ].innerHTML.replace(/&nbsp;/g, 'w');
}

<li class="list-group-item horaire-list-item">
  Monday,&nbsp;Tuesday,&nbsp;Thursday,&nbsp;Friday : 12:00 to 14:00 et 18:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
  Wednesday : 12:00 to 14:00 et 16:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
  Saturday : 12:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
  Sunday,&nbsp;Holidays : 09:00 to 20:30
</li>

【讨论】：

【解决方案2】：

使用innerHTML 而不是innerText。 innerText 包含呈现的文本，但实体是 HTML 标记的一部分。

【讨论】：

【解决方案3】：

您需要使用innerHTML 属性，因为在innerText 中，&nbsp; 将被替换为char(160) 字符。

演示：

var items = document.getElementsByClassName('list-group-item horaire-list-item');

for (var i = 0; i < items[0].innerText.length && i < 20; i++)
{
  console.log(
      i + ": " +
      items[0].innerText.charAt(i) + " | CharCode = " +
      items[0].innerText.charCodeAt(i));
}

for (var liJ = 0; liJ < items.length; liJ++ ) {
    items[liJ].innerHTML = items[liJ].innerHTML.replace(/&nbsp;/g, 'w');
}

<li class="list-group-item horaire-list-item">
    Monday,&nbsp;Tuesday,&nbsp;Thursday,&nbsp;Friday :  12:00 to 14:00 et  18:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
    Wednesday :  12:00 to 14:00 et  16:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
    Saturday :  12:00 to 20:30
</li>
<li class="list-group-item horaire-list-item">
    Sunday,&nbsp;Holidays :  09:00 to 20:30
</li>

【讨论】：