Ich möchte ein Element zu einem textNode hinzufügen. Zum Beispiel: Ich habe eine Funktion, die im textNode des Elements nach einer Zeichenkette sucht. Wenn ich es finde, möchte ich es durch ein HTML-Element ersetzen. Gibt es dafür einen Standard? Danke.JavaScript: Hinzufügen von Elementen in textNode
Antwort
Sie können nicht einfach die Zeichenfolge ersetzen, müssen Sie das gesamte TextNode-Element ersetzen, seit TextNode elements can't contain child elements im DOM.
Also, wenn Sie Ihren Text-Knoten finden, Ihre Ersatzelement erzeugen, dann ersetzen Sie den Text-Knoten mit einer ähnlichen Funktion wie:
function ReplaceNode(textNode, eNode) {
var pNode = textNode.parentNode;
pNode.replaceChild(textNode, eNode);
}
Für das, was es scheint, was Sie tun wollen, müssen Sie brechen Trennen Sie den aktuellen Textknoten in zwei neue Textknoten und ein neues HTML-Element. Hier einige Beispiel-Code, den Sie hoffentlich in die richtige Richtung weisen:
function DecorateText(str) {
var e = document.createElement("span");
e.style.color = "#ff0000";
e.appendChild(document.createTextNode(str));
return e;
}
function SearchAndReplaceElement(elem) {
for(var i = elem.childNodes.length; i--;) {
var childNode = elem.childNodes[i];
if(childNode.nodeType == 3) { // 3 => a Text Node
var strSrc = childNode.nodeValue; // for Text Nodes, the nodeValue property contains the text
var strSearch = "Special String";
var pos = strSrc.indexOf(strSearch);
if(pos >= 0) {
var fragment = document.createDocumentFragment();
if(pos > 0)
fragment.appendChild(document.createTextNode(strSrc.substr(0, pos)));
fragment.appendChild(DecorateText(strSearch));
if((pos + strSearch.length + 1) < strSrc.length)
fragment.appendChild(document.createTextNode(strSrc.substr(pos + strSearch.length + 1)));
elem.replaceChild(fragment, childNode);
}
}
}
}
Vielleicht würde jQuery dies einfacher gemacht haben, aber es ist gut zu verstehen, warum all dieses Zeug so funktioniert, es funktioniert.
Haben Sie Beispiele? Vielen Dank. – thomas
Können/möchten Sie jQuery verwenden? –
Sorry, ich kann nicht. Aber BTW, zeigen Sie Ihre Lösung zu den anderen Jungs ... – thomas
Sie haben bereits die Funktion, nach der Zeichenfolge zu suchen, oder Sie fragen darüber auch? – palswim