Regex catch front slash but ignoring html tag

Question

It's been quite a few hours now and I can't figure this out. I'm not good at all at regex but I don't understand.

Using Javascript I'm trying to split the following string at / (front slash) but ignoring html tag such as </.

html(string).split("regex")

Example string:

Area <span>base</span> &times; Height/3

output expected:

Area <span>base</span> &times; Height/3
                                     ^
                                   selected

 outputArray = ["Area <span>base</span> &times; Height", "3"]

I'm trying with this regex:(?!</+)(/) but is not working.

I also tried with this that I got from the internet (/)(?<!</?[^>]*|&[^;]*) and (?<!<)([\/\\]) which "works" in regexr.com but is not actually working in the browser since it uses negative lookbehind.

EDIT: I also tried with \/(?!.*>) and works in the regex checker but not in browser. EDIT2: The above regex did worked, I was adding the regex in the split function with quotes but it's just .split(/\/(?!.*>)/g)

Answer 1

Try with the below regex

let regexp = /(?<!<)\//g
let text = "Area <span>base</span> &times; Height/3"

console.log(regexp.exec(text))

Answer 2

You can try a lookahead combined with a non-capturing group to ensure '<' isn't before the '/'

Try this:

(?:[^<])(?=\/)(\/)

To get the index of the slash, you'll have to add up the index of the entire match and the length of the entire match.

That being said, it will be much easier if you tokenize your input by whitespace or some other means.

Edit: To actually split the input into parts such as the following with javascript's split:

["Area <span>base</span> &times;", "Height", "/", "3"]

You need a (\w+) group to capture the bit before the '/', so it becomes:

(?:[^<])(\w+)(?=\/)(\/)