jQuery 拆分字符串并在其中添加新的 HTML 标记？

Question

在前端，我将从一个特定的数据库表中获取数据。 输出是这样的：

<p class="one">2. April 1507  in Plessis-les-Tours in Frankreich</p>

但我需要将这些字符串分成两个单独的段落

像这样：

<p class="one">2. April 1507</p>
<p class="two">in Plessis-les-Tours in Frankreich</p>

分割字符每次都是 first "in" 在我的字符串中，而不是第二个。我正在使用 jquery 1.11。 目前我不确定 SPLIT 命令是否正确？！如果我的文本中只有一个“in”（单词）会怎样？

第二个例子，我的代码不起作用：

<p class="test">1. April 1647  in Plessis-les-Tours, Frankreich</p>

Here's my fiddle. 它适用于该字符串，但如果有其他内容则无效。 我只能在第一个单词“in”处拆分吗？ 感谢您的帮助！

Answer 1

试试这个方法：

var myString = $('.one').html();
var index = myString.indexOf("in");  
var first = myString.substr(0, index); // Gets the first part
var second = myString.substr(index); //Gets second part

Demo

我认为这对你来说已经足够了，现在你可以像你一样使用这些字符串了 想要

Answer 2

解决办法：

<p class="born">1. November 1507 in Tours in Frankreich</p>

和js

var myElement = $('p.born');
var myString = myElement.html();

var index = myString.indexOf("in");  
var first = myString.substr(0, index); // Gets the first part
var second = myString.substr(index); //Gets second part 

myElement.html(first);
myElement.after("<p class='bornin'>" + second + "</p>");

非常感谢！ 你太棒了！

Answer 3

这是您的代码，可以根据您的需要完美运行。

<p class="one">2. April 1507  in Plessis-les-Tours in Frankreich</p>


$(document).ready(function(){
  var myString = $('.one');
  var ary = myString.text().split('in');
  myString.html("<span>"+ary[0]+"</span><br/><br/><span>"+ary[1]+"</span>");    
 });

我已经更新了你的 js fiddle 来解决这个问题

http://jsfiddle.net/xb7Lcm9z/3/