Wie kann ich mit jQuery oder reinem JavaScript Textknoten innerhalb eines Elements effizient auswählen?

Auswählen von Textknoten mit jQuery

Das Auswählen von Textknoten innerhalb eines Elements kann in jQuery eine herausfordernde Aufgabe sein. Glücklicherweise gibt es verschiedene Ansätze, um dies zu erreichen.

Ansatz 1: Contents() und Find() kombinieren

jQuery bietet keine dedizierte Funktion zum Auswählen Textknoten. Eine Problemumgehung besteht jedoch darin, die Methode content() zu verwenden, die untergeordnete Knoten einschließlich Textknoten abruft, und sie mit der Methode find() zu kombinieren, die untergeordnete Elemente auswählt, aber Textknoten ausschließt.

var getTextNodesIn = function(el) {
    return $(el).find(":not(iframe)").addBack().contents().filter(function() {
        return this.nodeType == 3;
    });
};

Hinweis: Ersetzen Sie für jQuery-Versionen vor 1.7 addBack() durch andSelf() und verwenden Sie für Versionen 1.8 oder höher addBack().

Ansatz 2: Reine DOM-Lösung

Wenn Sie eine effizientere Lösung bevorzugen, kann eine Nicht-jQuery-Methode verwendet werden. Dabei handelt es sich um eine rekursive Funktion, die den DOM-Baum durchläuft:

function getTextNodesIn(node, includeWhitespaceNodes) {
    var textNodes = [], nonWhitespaceMatcher = /\S/;

    function getTextNodes(node) {
        if (node.nodeType == 3) {
            if (includeWhitespaceNodes || nonWhitespaceMatcher.test(node.nodeValue)) {
                textNodes.push(node);
            }
        } else {
            for (var i = 0, len = node.childNodes.length; i < len; ++i) {
                getTextNodes(node.childNodes[i]);
            }
        }
    }

    getTextNodes(node);
    return textNodes;
}

Beispielverwendung

Mit beiden Ansätzen können Sie alle Textknoten innerhalb eines angegebenen Elements abrufen.

var textNodes = getTextNodesIn(el);

Durch Anpassen des Parameters includeWhitespaceNodes können Sie auswählen, ob Leerzeichen-Textknoten einbezogen werden sollen oder nicht das Ergebnis.

Das obige ist der detaillierte Inhalt vonWie kann ich mit jQuery oder reinem JavaScript Textknoten innerhalb eines Elements effizient auswählen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!