Javascript 高效地断开html标记

我有一个简单的标记：

<p> some content here </p>

这里有一些内容

我想把它分成几个部分

<p> some </p> content <p> here </p>

这里有一些内容

使用javascript（或jQuery帮助）。
我想打断html

p

标记，这样我的特定单词（例如

content

）就不会出现在

p

中。我想找到跨浏览器和高效的解决方案。

---

提前谢谢。

试试这个。。只需更改选择器和要拾取并从选择器中排除的单词

$('p').text($('p').text().replace('content','</p>content<p>'));

$（'p'）.text（$（'p'）.text（）.replace（'content'，'
content）；

试试这个。。只需更改选择器和要拾取并从选择器中排除的单词

$('p').text($('p').text().replace('content','</p>content<p>'));

$（'p'）.text（$（'p'）.text（）.replace（'content'，'
content）；

看一看和示例。

看一看和示例。

试试以下方法：

$('p').each(function() {
    $(this).html($(this).html().replace('content','</p>content<p>'));​
})

试试这个：

$('p').each(function() {
    $(this).html($(this).html().replace('content','</p>content<p>'));​
})

我为你做了这个：

现场演示：

这将适用于

标记中所需的任何文本

HTML:

希望这有帮助：-） ​

我为你做了这个：

现场演示：

这将适用于

标记中所需的任何文本

HTML:

希望这有帮助：-） ​

演示：

---

演示：

您想要打断的单词总是为人所知吗？或者你总是打断句子中的中间词？这是为了什么？看起来他们可能是一个更好的解决方案。那句话属于段落标记。它可以是任何标记，我无意中选择了

p

。你想打断的词总是已知的吗？或者你总是打断句子中的中间词？这是为了什么？看起来他们可能是一个更好的解决方案。那个句子属于段落标记。它可以是任何标记，我无意中选择了

p

。您可以像这样使用

html

函数：以避免重复的选择器求值。@Yoshi nice。。。你能给我解释一下

\uu

吗？jQuery将把元素的索引作为第一个参数传递给我，我使用

\u

作为它的名称只是为了表明我实际上并不需要它。使用类似show的

html

，也不需要在元素上循环（因此不需要

每个

。@Yoshi:-）感谢您的解释！我确实一时糊涂了！！用你的答案更新了我的答案suggestion@OscarJara从函数硬编码解决方案中导出参数化解决方案可能是整个过程中最简单的部分。您可以像这样使用

html

函数：以避免重复的选择器求值。@Yoshi nice。。。你能给我解释一下

\uu

吗？jQuery将把元素的索引作为第一个参数传递给我，我使用

\u

作为它的名称只是为了表明我实际上并不需要它。使用类似show的

html

，也不需要在元素上循环（因此不需要

每个

。@Yoshi:-）感谢您的解释！我确实一时糊涂了！！用你的答案更新了我的答案suggestion@OscarJara从函数式硬编码解决方案派生参数化解决方案可能是整个过程中最简单的部分。$（'p'）.html（$（'p'）.html（）.replace（'content'，'

content'）$（'p'）.html（$（'p'）.html（）.replace（'content'，'

content'））；

$('#btn').click(function(){

    // clean the "result" div each time you invoke "click"
    $('#result').html('');

    // get the text inside "<p></p>" tags
    var str = $('p').html();

    // make an array for all elements inside tag
    // result: ["", "some", "content", "here", ""]
    var substr = str.split(' ');

    // remove "space" elements from the array
    // result: ["some", "content", "here"]
    removeFromArray(substr, '');

    // populate the "result" div where i = index, e = element
    // result:
    //   some
    //   content
    //   here
    $.each(substr, function(i, e){
         $('#result').append('<p> ' + substr[i] + ' </p>');
    });
});

/* Function to remove element from js array */
function removeFromArray(arr){
    var what, a= arguments, L= a.length, ax;
    while(L> 1 && arr.length){
        what= a[--L];
        while((ax= arr.indexOf(what))!= -1){
            arr.splice(ax, 1);
        }
    }
    return arr;
}

div#result{
   color: red; 
}​

(function () {
  $.fn.extend({
    splitAt: function (splitter) {
      this.each(function () {
        var $replacement = $(), $org = $(this);

        $.each($org.text().split(splitter), function (_, val) {
          $replacement = $replacement.add($org.clone().html(val)).add(document.createTextNode(splitter));
        });

        $org.replaceWith($replacement.slice(0, -1));
      });

      return $(this.selector, this.context);
    }
  });
}(jQuery));

$('p').splitAt('content').css('background', 'lightblue');
​