user926321 user926321 - 2 months ago 7
HTML Question

how to search and highlight terms excluding content inside a tag?

HTML:

Our formula is this: We go out, we hit people in the mouth.<sup id="cite_ref-9" class="reference"><a href="#cite_note-9">[9]</a></sup> The team went 5–4 overall


I'm trying to match:

in the mouth. The team went


Basically trying to ignore the text inside the
<sup>
tag

I've adapted code from this answer.

document.designMode = "on";
var sel = window.getSelection();
sel.collapse(document.body, 0);
while (window.find(search_string)) {
document.execCommand("backColor", false, "yellow");
}
sel.collapseToEnd();
document.designMode = "off";


While this ignores the tag, it doesn't ignore text within the tag.

Answer

If you know it's always a sup that you want to remove then you should be able to do something like

function stripSupFromText(text) {
  var div = document.createElement('div');
  div.innerHTML = text;
  div.removeChild(div.getElementsByTagName('sup')[0]);
  return div.innerText;
}