Question

给出以下HTML代码：

<div id="content"> 
Lorem ipsum <b>dolor sit</b> amet... 
<myTag>Blablabla</myTag>
consectetur <b>adipiscing</b> elit...
</div>

我想要做的是分开提取

Lorem ipsum <b>dolor sit</b> amet...

和

consectetur <b>adipiscing</b> elit...

换句话说，我想提取元素<myTag>之前div中包含的所有内容以及元素<myTag>之后div中包含的所有内容

我怎样才能做到这一点？

Answer 1

试试这个：

var contentStr = $('#content').html();
var splitPos = '<myTag>' + $('myTag').html() + '</myTag>';
contentStr.split(splitPos);

现在你有一个包含之前和之后的数组。

Answer 2

之前：

$('#content').html().split(/<mytag>.*<\/mytag>/)[0]

后：

$('#content').html().split(/<mytag>.*<\/mytag>/)[1]

Answer 3

您可以从div html中获取字符串，并使用substr()

var myString = $('#content').html();
var firstPart =  myString.substr(0,myString.indexOf('<myTag>'));
var secondPart = myString.substr(myString.lastIndexOf('</myTag>')+8);

Fiddle

Answer 4

从父元素中获取文本并从中剪切myTag文本

var a = $("myTag").parent().text();
a = a.replace($("myTag").text(), "");

这就是你想要的吗？

编辑：哦，你想要他们分开，Y.Puzyrenko已经发布了如何做到这一点的答案

Answer 5

这个怎么样：

var content = $("#content").find('myTag').remove().end().html();

这会按ID获取元素，找到＆＃34; myTag＆＃34;，将其删除，然后返回HTML。

Answer 6

尝试

  var content = $.map(
    $("#content").contents()
  , function(val, idx) {
      return $(val).is("myTag") ? null : val.outerHTML || val.textContent
  })

var content = $.map(
    $("#content").contents()
  , function(val, idx) {
      return $(val).is("myTag") ? null : val.outerHTML || val.textContent
  })
console.log(content)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="content"> 
Lorem ipsum <b>dolor sit</b> amet... 
<myTag>Blablabla</myTag>
consectetur <b>adipiscing</b> elit...
</div>

在给定元素之前和之后选择div内容

6 个答案: