Maison >interface Web >js tutoriel >Comment puis-je sélectionner efficacement tous les nœuds de texte dans un élément à l'aide de jQuery ?

Comment puis-je sélectionner efficacement tous les nœuds de texte dans un élément à l'aide de jQuery ?

Susan Sarandon
Susan Sarandonoriginal
2024-12-23 13:51:19651parcourir

How Can I Efficiently Select All Text Nodes Within an Element Using jQuery?

Sélection de nœuds de texte avec jQuery

Récupérer tous les nœuds de texte descendants d'un élément en tant que collection jQuery peut être une tâche complexe. Comme jQuery ne dispose pas d'une fonction dédiée pour cela, une combinaison de méthodes est nécessaire.

La solution consiste à utiliser la fonction contents(), qui récupère les nœuds enfants (y compris les nœuds de texte), et la fonction find(), qui sélectionne tous les éléments descendants (à l'exclusion des nœuds de texte). En fusionnant ces résultats, tous les nœuds de texte au sein de l'élément spécifié peuvent être obtenus.

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

getTextNodesIn(el);

Considérations :

  • Cette approche peut être inefficace par rapport à la pure Méthodes DOM.
  • Une solution de contournement est nécessaire en raison de la surcharge du contenu par jQuery() fonction.
  • Les solutions non jQuery, telles que les suivantes, offrent une alternative plus efficace :
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;
}
getTextNodesIn(el);

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn