Hallo Molily,
Er will aber Markup um das Suchwort herumbauen. Markup in einen Textknoten zu schreiben, bringt nichts, es wird nicht als solches verarbeitet.
Ja stimmt. Kann ich mich jetzt darauf herausreden, dass ich keine fertige Lösung liefern wollte? ;-)
Die Schleifenbedingung wird bei _jedem_ Schleifendurchlauf ausgewertet. Wenn Du innerhalb der Schleife also neue Knoten einfügst, wird childNodes.length entsprechend erhöht.
Man müsste das also auch so lösen können:
<html>
<head>
<title></title>
<style type="text/css">
.highlight {color:red}
</style>
<script type="text/javascript">
function ersetzen (element, suchwort) {
for (var i = 0; i < element.childNodes.length; i++) {
var node = element.childNodes.item(i);
if (node.nodeType == 3) {
var pos = node.nodeValue.indexOf(suchwort);
if (pos > -1) {
var string_before = node.nodeValue.substring(0, pos);
var string_after = node.nodeValue.substr(pos + suchwort.length);
var textnode_before = document.createTextNode(string_before)
var suchwort_node = document.createElement('span');
suchwort_node.setAttribute('class', 'highlight');
var suchwort_textnode = document.createTextNode(suchwort);
suchwort_node.appendChild(suchwort_textnode);
var textnode_after = document.createTextNode(string_after);
node.parentNode.replaceChild(textnode_after, node);
textnode_after.parentNode.insertBefore(textnode_before, textnode_after);
textnode_after.parentNode.insertBefore(suchwort_node, textnode_after);
i += 2;
}
} else if (node.nodeType == 1) {
// alert('rekursion');
ersetzen(node, suchwort);
}
}
}
Ich habe meine Zweifel, ob diese Methode robuster als RegExp-Fummelei über innerHTML ist.
Wenn der Browser das DOM gut genug unterstüzt, sollte das recht robust sein.
Deine RegExp Variante ist wirklich recht trickreich, aber austricksen lässt sie sich dennoch, z.B. durch:
<tag attr1=">" attr2="suchwort">
Außerdem dürfte es recht schwierig sein, Textfelder, Scriptbereiche o.ä. auszuschließen. Daher würde ich die DOM-Variante eindeutig bevorzugen.
Grüße
Daniel
Grüße
Daniel