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

Posted 2023-03-05

【中文标题】使用 JavaScript 替换 innerText 中的 ，不起作用

【英文标题】：Using JavaScript to replace   in innerText, does not work

【发布时间】：2019-10-10 21:48:16

【问题描述】：

我正在尝试将多行中的   的每个实例替换为 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);
    

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

【问题讨论】：

我认为您需要“转义” & 和/或 ;

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

【参考方案1】：

  已经在您的 html 中呈现为空格，因此没有任何   实例可以替换。如果您想保持原样，转义它会起作用，允许您使用正则表达式替换来修改它。正如@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 中，  将被替换为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>