Question

我想拆分一组div元素，以便在数组中进行进一步的文本处理。一个简单的模型：

var divElements = prompt('Input');
array = divElements.split('</div>')
console.log(array);

输入：

<div id="1"></div>
<div id="2"></div>
<div id="3"></div>
<div id="4"></div>

现在输出：

array
["<div id="1">", "
<div id="2">", "
<div id="3">", "
<div id="4">", ""]

但我想在数组中包含分隔符（div closing标签）以保持html语法不变。因此，数组应该包含以下四个项目：

<div id="1"></div>
<div id="2"></div>
<div id="3"></div>
<div id="4"></div>

Answer 1

您还可以使用正则表达式来展望下一个div。

＆＃13;

var str = '<div id="1"></div><div id="2"></div><div id="3"></div><div id="4"></div>';

var arr = str.split(/(?=<div)/);

console.log(arr);

＆＃13;

如果您想分开但保留分隔符，可以使用capturing parenthesis。

＆＃13;

var str = '<div id="1"></div><div id="2"></div><div id="3"></div><div id="4"></div>';

var arr = str.split(/(<\/div>)/);

console.log(arr);

＆＃13;

也就是说， 属性可能包含类似HTML的模式，然后你就不幸了。

将其插入容器元素，并以此方式处理，或使用适当的解析器。

＆＃13;
＆＃13;
var data = '<div id="1"></div><div id="2"></div><div id="3"></div><div id="4"></div>'; var ele = document.createElement('div'); ele.innerHTML = data; console.log(ele.childNodes)
＆＃13;
＆＃13;
＆＃13;

Answer 2

split（）方法也使用正则表达式来分割字符串。在你的情况下使用正则表达式（？= \＆lt;）。

    var divElements = prompt('Input');
    array = divElements.split(/\s(?=\<)/);
    console.log(array);

正则表达式解释

\ s - 任何空格字符
（？= \＆lt;） - 后跟＆lt;性格（积极向前看）

JS split方法，包括数组中的分隔符

2 个答案: