时间戳

首页 > 解决方案 > 在 eventListener 中使用 .replace() 来更改某些文本，但无法正常工作

javascript - 在 eventListener 中使用 .replace() 来更改某些文本，但无法正常工作

问题描述

我试图掌握方法和正则表达式在 HTML 中的工作方式。所以基本上我想做的就是......当我单击按钮时，我想使用 .replace(REGEXP) 方法将上面段落中的“更改”一词更改为“保留”。

有人可以向我解释为什么它不起作用吗？我对此还是很陌生...

 let x = document.getElementById('change').innerHTML;
   let button = document.getElementById('button');
   button.addEventListener('click', function() {
      x = document.getElementById('change').innerHTML.replace(/change/g, 'keep');
   });
<p id="change">Here's an example sentence we want to change</p>
<button id="button">Change</button>

甚至不确定这是否可能，但也许有人可以指出我正确的方向。谢谢！

标签： javascripthtmlmethodsreplaceaddeventlistener

解决方案

您将修改后的文本分配给x恰好是 only 的变量string。不是参考。
你必须使用element.innerHTML = 'some inner content'.

 const targetElement = document.getElementById('change');
 let button = document.getElementById('button');
 button.addEventListener('click', function() {
    targetElement.innerHTML = targetElement.innerHTML.replace(/change/g, 'keep');
 });
<p id="change">Here's an example sentence we want to change</p>
<button id="button">Change</button>

推荐阅读