在<p>元素中插入<span>

Question

我喜欢;

<p>Variable Text</p>

我希望它成为;

<p>Variable <span>Text</span></p>

这有可能通过javascript函数吗？/或jQuery.

哦是的,p元素有一个ID,p元素内的文本是可变的,但总是由2个单词组成.我希望通过javascript函数绕过文本的最后一个单词.

Answer 1

试试这个

var txt = "Hello bye";
var dataArr = txt.split(' ');

var paragraph = document.getElementById("pid");
paragraph.innerHTML = dataArr[0]+ " <span>"+dataArr[1]+"</span>";

这是一个演示

Answer 2

这是可能的（下面假设p有一个 ID，就像你说的），以最简单的形式你可以这样做：

var paragraph = document.getElementById("pId");
paragraph.innerHTML = "Hello <span>World</span>";

或者如果你想使用 jQuery：

$("#pId").html("Hello <span>World</span>");

或者（正如您在评论中所说，您想保留现有内容，但将最后一个单词包装在 a 中span，您可以这样做：

var newHTML = $("#pId").html().replace(" ", " <span>");
$("#pId").html(newHTML).append("</span>");

演示版