使用javascript动态更改跨度文本并保留原始文本

我有一个html页面，其中包含以下代码段，具体取决于我们所遵循的情况：

CASE 1)    <p> <span id ="xyz">  some code here  </span> </p>
CASE 2)    <p> <span id ="xyz">   </span> some code here </p>

案例1）这里有一些代码

案例2）这里有一些代码

现在在我的javascript代码中，我必须动态地在span

xyz

中写入值。如果我尝试按id获取对span

xyz

的引用，然后尝试更改其内部html，则span

xyz

中已经存在的html将丢失

如果我将额外的代码保留在范围之外，由于一些css效果，它会出现在新行上。由于某些原因，我无法更改css

document.getElementById('xyz').innerHTML = 'some code here' + 'dynamically code';

或

或

---

您可以将当前值存储在字符串中，然后修改此字符串：

var mySpan = document.getElementById('xyz').innerHTML;
mySpan += ' and this gets added after the some code here';
document.getElementById('xyz').innerHTML = mySpan;

或者更快更快捷

document.getElementById('xyz').innerHTML = document.getElementById('xyz').innerHTML + ' new text after'; //to add text after the existing text
document.getElementById('xyz').innerHTML = 'your new text before ' + document.getElementById('xyz').innerHTML; //to add text before.

---

您可以将当前值存储在字符串中，然后修改此字符串：

var mySpan = document.getElementById('xyz').innerHTML;
mySpan += ' and this gets added after the some code here';
document.getElementById('xyz').innerHTML = mySpan;

或者更快更快捷

document.getElementById('xyz').innerHTML = document.getElementById('xyz').innerHTML + ' new text after'; //to add text after the existing text
document.getElementById('xyz').innerHTML = 'your new text before ' + document.getElementById('xyz').innerHTML; //to add text before.

---

如果要保留旧文本，可以将新文本节点附加到span

var newtext = document.createTextNode(" new text ");
var spanXyz = document.getElementById("xyz");
spanXyz.appendChild(newtext);

请参阅：

编辑：要在开头添加新文本，可以使用

spanXyz.textContent = "new text " + spanXyz.textContent;

---

如果要保留旧文本，可以将新文本节点附加到span

var newtext = document.createTextNode(" new text ");
var spanXyz = document.getElementById("xyz");
spanXyz.appendChild(newtext);

请参阅：

编辑：要在开头添加新文本，可以使用

spanXyz.textContent = "new text " + spanXyz.textContent;

---

如果您没有使用jquery：

document.getElementById('xyz').innerHTML=   document.getElementById('xyz').innerHTML + "XYZ";

如果您使用的是jquery：

 $("#xyz").append("xyz");

---

如果您没有使用jquery：

document.getElementById('xyz').innerHTML=   document.getElementById('xyz').innerHTML + "XYZ";

如果您使用的是jquery：

 $("#xyz").append("xyz");

---

你的问题不清楚。我要注意的一点是：不要在多个元素上使用相同的“id”值。（我甚至不知道你是不是在这样做。）我刚才提到了两种可能的方法，每种方法都面临着一个问题。你的问题不清楚。我要注意的一点是：不要在多个元素上使用相同的“id”值。（我甚至不知道你是不是在这么做。）我刚才提到了两种可能的方法，我在每种方法中都遇到了一个问题。这个解决方案的一个小小的修正是innerHTML是属性而不是函数。因此，您必须去掉括号，并将HTML部分大写。@Dan感谢-jQuery的

HTML（）

总是让我对旧的javascript:）这个解决方案的一个小修正是innerHTML是属性而不是函数。所以你必须去掉括号，把HTML部分大写。@Dan谢谢-jQuery的

HTML（）

总是让我对旧的javascript这样做：）+1：我喜欢这种方式，但我可能会用它做一行：

document.getElementById（“xyz”）.appendChild（document.createTextNode（“新文本”）是的，我只是在为OP拼写。谢谢。我喜欢这种方法，但我想出现的文本应该出现在span的开头而不是结尾。例如，如果span由文本B组成，那么我想将其设为AB。这只是一个Eg。我实际上有一些html代码作为a和B+1：我喜欢这种方式，但我可能会把它写成一行：
document.getElementById（“xyz”）.appendChild（document.createTextNode（“新文本”）是的，我只是在为OP拼写。谢谢。我喜欢这种方法，但我想出现的文本应该出现在span的开头而不是结尾。例如，如果span由文本B组成，那么我想将其设为AB。这只是一个Eg。我实际上有一些html代码作为a和B