If I have a sequence of multiple <br>s, how do I display how many sequences do I have?
In other words, I'm trying to count how many times we had <br><br> as in two
s in a row.
// Undesired output:
console.log(document.querySelectorAll('br').length) // 8
console.log(document.querySelectorAll('br+br').length) // 7
<div id="test">
Paragraph 1
<br>
<br>
Paragraph 2
<br>Paragraph 2 continued
<br>
<br>
Paragraph 3
<br>Paragraph 3 continued
<br>
<br>
Paragraph 4
</div>
Desired output:
console.log(document.querySelectorAll('?????').length) // 3
You may use regex to find <br><br>s:
var p = /<br>[\r\n]*<br>/g;
console.log([...document.querySelector('#test').innerHTML.matchAll(p)].length); // => 3
<div id="test">
Paragraph 1
<br>
<br>
Paragraph 2
<br>Paragraph 2 continued
<br>
<br>
Paragraph 3
<br>Paragraph 3 continued
<br>
<br>
Paragraph 4
</div>
try this:
var nodes = document.querySelectorAll('br, div');
console.log(nodes);
<div id="test">
Paragraph 1
<br>
<br>
Paragraph 2
<br>Paragraph 2 continued
<br>
<br>
Paragraph 3
<br>Paragraph 3 continued
<br>
<br>
Paragraph 4
</div>
I couldn't think of a better way to do it, hopefully this helps!
const brTags = document.querySelectorAll('br')
let tagCount = 0;
for(let i = 0; i < brTags.length; i++){
const string = brTags[i].nextSibling.textContent
.replaceAll("\n", "")
.trim();
if(string.indexOf("Paragraph") > -1 && string.length === 11){tagCount++}
}
console.log ("Tag count: ", tagCount);
<div id="test">
Paragraph 1
<br>
<br>
Paragraph 2
<br>Paragraph 2 continued
<br>
<br>
Paragraph 3
<br>Paragraph 3 continued
<br>
<br>
Paragraph 4
</div>