Question

我有一个Javascript HTML字符串，如下所示，

var stringCheck = 'Test<a href="http://testdomain.com?data=new" target="_blank">partial string data</a> Test Data<span class="spanClass">XYZ</span>';

现在想要拆分这个字符串，以便在一个变量中我的值为

var split1 = 'Test<a href="http://testdomain.com?data=new" target="_blank">partial string data</a> Test Data';

和第二个变量如下，

var split2 = '<span class="spanClass">XYZ</span>';

我想拆分具有spanClass类的span元素。有没有人知道如何使用RegEx或其他方式来实现它？

Answer 1

DOM和jQuery的一些操作应该这样做 - 比RegEx更受欢迎：

var stringCheck = 'Test<a href="http://testdomain.com?data=new" target="_blank">partial string data</a> Test Data <span class="spanClass">XYZ</span>';

function splitText(html) {
  var $div = $("<div/>").html(html),
  $span = $div.find("span").remove();
  
  return [$span[0].outerHTML,$div[0].innerHTML]; // you may want to add a trim too
}
console.log(splitText(stringCheck));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

Answer 2

您可以创建一个jQuery对象并提取所需的文本。

var stringCheck = 'Test<a href="http://testdomain.com?data=new" target="_blank">partial string data</a> Test Data <span class="spanClass">XYZ</span>';

//Create a jQuery object
var div = $('<div>').html(stringCheck);
//Extract span
var str1 = div.children('span.spanClass').prop('outerHTML');
//Remove it
div.children('span.spanClass').remove();
//Get rest of string
var str = div.html();

console.log(str);
console.log(str1);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 3

要实现此目的，您可以使用正则表达式在<span>之前的空格分割，如下所示：

var stringCheck = 'Test<a href="http://testdomain.com?data=new" target="_blank">partial string data</a> Test Data <span class="spanClass">XYZ</span>';

var arr = stringCheck.split(/\s(?=<span)/i);
console.log(arr);

Answer 4

使用此类内容

var String = 'Test<a href="http://testdomain.com?data=new" target="_blank">partial string data</a> Test Data <span class="spanClass">XYZ</span>';
String = String.replace(/\s(?=<span class="spanClass")/ig, "|||");
var arr = String.split("|||");
console.log(arr);

**这将分散在您所有的课程spanClass **

上

按元素和类拆分html

4 个答案: