如何使用 jquery 将字符串中的 span 标签合并到数组中

Question

我有一个字符串，它的值是

“Your <span>name</span>  <span class=“icon icon>is</span>  <span class=“alt”>Henry</span>.May i help you ”

我需要根据开始和关闭 span 标签拆分这些，并且需要最终输出应该是

var newArray=[<span>name</span>,<span class=“icon icon>is</span>,<span class=“alt”>Henry</span>]

也就是说，我也需要在包含 span 标签内容的数组中获取 span 标签。所以我的数组长度将是 3

任何帮助都将非常有帮助，并提前表示感谢

Answer 1

创建一个临时 DOM 元素，然后获取所有span标记，然后遍历集合以获取outerHTML

var str = "Your <span>name</span><span class=“icon icon>is</span>  <span class=“alt”>Henry</span>.May i help you";
var spList = $("<div>").html(str).find("span");
var array = [];
for (i = 0; i < spList.length; i++)
{
array.push(spList[i].outerHTML);
}
console.log(array);

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

Answer 2

试试这个：

var str = 'Your <span>name</span>  <span class="icon icon">is</span>  <span class="alt">Henry</span>.May i help you';
str = '<customtag>' + str + '<customtag>';
var parser = new DOMParser()
var el = parser.parseFromString(str, "text/xml");
var spans = el.getElementsByTagName('customtag')[0].getElementsByTagName('span');
var spanArString = [];
var spanArDom = [];
console.log(spans)
for (var i = 0; i < spans.length; i++) {
spanArString.push(spans[i].outerHTML);
spanArDom.push(spans[i]);
}
console.log(spanArString);
console.log(spanArDom);

根据需要使用 spanArString 或 spanArDom。 通知我它是否适合您。

Answer 3

你可以使用正则表达式来实现这一点

var arr = "Your <span>name</span>  <span class=“icon icon>is</span>  <span class=“alt”>Henry</span>.May i help you"
var newArray = arr.match(/<span[^>]*>[sS]+</span>/)[0].split("  ");