javascript - javascript:使用replace()替换html中的文本

Question

我正在尝试使用 replace() 函数来调整上面的代码以显示文本：这就是全部吗？！同时保留innerHTML中添加的文本

 <p id="str">Click the button for a surprise.</p>
 <form action="#">
 <input type="submit" onclick="myFunction()" value="Enter">
 </form>

 function myFunction(){
 document.getElementById('str').innerHTML = "Is this all there is?";
 str.replace(str, "Is this all?!")
 }

Answer 1

你可以试试这个

<p id="str">Click the button for a surprise.</p>
<form action="#">
<input type="submit" onclick="myFunction()" value="Enter">
</form>


function myFunction(){
var str = document.getElementById('str');
str.innerHTML = "Is this all there is? <moretext>";
str.innerHTML.replace("<moretext>", "Is this all?!");
}

Answer 2

首先，你需要知道它的replace()功能是什么。此函数将某个字符串替换为另一个字符串，这不用于替换整个字符串值。这不是用来替换 HTML 文本的！

在 javascript 中查看替换示例：

var str = "Visit Microsoft!";
var res = str.replace("Microsoft","W3Schools");

结果将是：“访问W3Schools！” ， 好的？

了解更多信息：http ://www.w3schools.com/jsref/jsref_replace.asp

现在，看一个替换 HTML 文本的示例：

 document.getElementById('str').innerHTML = "Is this all?!"

所以，这就是你的代码应该是：

function myFunction(){
     //Set value at innerHTML
     document.getElementById('str').innerHTML = "Is this all there is?";

     //now "Is this all there is?" is stored in str variable
     var str = document.getElementById('str').innerHTML;

     //set another text for innerHTML
     document.getElementById('str').innerHTML = "Is this all?!"


 }

此外，您不能在不为用户更改的情况下将文本存储在 innerHTML 中。所以现在你要存储的文本是str变量

基本上你误解了replace()函数

Answer 3

function myFunction(){
  var currentText = document.getElementById('str').innerHTML;
  var resultText = currentText + " Is this all?!";
  document.getElementById('str').innerHTML = resultText;
}