My code:
var str = '<td>a</td><td>b</td>'; console.log(str.split(/</?td>/g));
That outputs ["", "a", "", "b", ""].
Why are the empty strings present?
Quoting https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split ,
If separator is a regular expression that contains capturing parentheses, then each time separator is matched, the results (including any undefined results) of the capturing parentheses are spliced into the output array. However, not all browsers support this capability.
That’s clearly not relevant, however, because capturing parenthesis are not present.
Advertisement
Answer
Let’s look at a more minimal example:
",a,,b,".split(",")
// ["", "a", "", "b", ""]
What does this have to do with your case? Well, if you have two delimiters next to each other, a leading delimiter, or an trailing delimiter, you’ll get an empty string in the result, since that’s what’s between them (and in order to maintain the behavior that x.split(a).join(a) should equal x). In your case, both </td> and <td> in the middle are matched, which means there are 2 “delimiters” right next to each other, leading to the empty string in the middle. The <td> at the start and the </td> at the end lead to a leading and trailing delimiter, leading to the empty strings at the start and the end.