Document.createRange um mehrere Textübereinstimmungen herum ergibt IndexSizeError
Posted: 03 Jan 2025, 16:54
Ich schreibe eine Suchmaschine und bin auf ein Problem gestoßen. Ich verwende document.createRange, um die Übereinstimmungen auszuwählen, und ich habe den AND-Operator verwendet.
Ich habe den folgenden Text, die Hälfte davon sind ungarische Farben bereits hervorgehoben:
und ich muss Code für „sárga“ hervorheben, etwa so, was einen Fehler außerhalb des zulässigen Bereichs ausgibt:
Mein Suchmuster sieht etwa wie folgt aus:
Das Hauptproblem hier besteht darin, dass die vorherigen SurroundContents etwas HTML zum Text hinzugefügt haben, sodass sich setStart(x, 33) irgendwo im HTML-Attribut befindet. Highlight-Occurrence", was offensichtlich zu einer Abweichung außerhalb des zulässigen Bereichs führt. Dies liegt daran, dass ich beim Hervorheben mit dem AND-Operator die Ergebnisse separat hervorhebe. Also hebe ich zuerst die Vorkommen von „fehér“ hervor, dann hebe ich die Vorkommen von „sárga“ hervor. Es wäre schön, das so beizubehalten, anstatt meinen Code komplett zu überschreiben, um die Ergebnisse für beide Wörter zu vermischen und immer vom Ende bis zum Anfang des Textes hervorzuheben.
Mein echter Code sieht so aus So ist es lustig, so viele Schleifen zu verschachteln:
Ich habe mich gefragt, ob es eine Lösung gibt, bei der die Reihenfolge der Texthervorhebung keine Rolle spielt, sodass ich nur die Funktion „highlight“ anstelle der Funktion „highlightMatches“ überschreiben müsste der Match-Generator?
Ich habe den folgenden Text, die Hälfte davon sind ungarische Farben bereits hervorgehoben:
Code: Select all
fehér, fekete, vörös, kék, zöld, sárga, narancs, rózsaszín, barna, lila, türkízkék, szürke
Code: Select all
const x = document.getElementById("x");
const startOffset = 33;
const endOffset = 38;
const range = document.createRange();
range.setStart(x, startOffset);
range.setEnd(x, endOffset);
Code: Select all
{"and": [
{"contains": "fehér"},
{"contains": "sárga"}
]}
Mein echter Code sieht so aus So ist es lustig, so viele Schleifen zu verschachteln:
Code: Select all
function highlightMatches(pattern, evidence){
for (var match of evidence)
for (var perMatcherTypeResults of match.evidence)
for (var locations of perMatcherTypeResults)
if (locations instanceof Array)
for (var location of locations){
var sectionIndexes = location.slice(0, location.length-1);
var positionRanges = location[location.length-1];
for (var i=positionRanges.length-1; i>=0; --i)
highlight(match.term.checksum, sectionIndexes, positionRanges[i]);
}
}
function highlight(id, sectionIndexes, positionRange){
var selector = `#results-${id}-${sectionIndexes.join("-")}`;
var element = selectOne(selector);
element.classList.add("highlight-sentence");
var range = new Range();
range.setStart(element.firstChild, positionRange[0]);
range.setEnd(element.firstChild, positionRange[1]);
var highlightOccurrence = document.createElement("span");
highlightOccurrence.className = "highlight-occurrence";
range.surroundContents(highlightOccurrence);
}