innerText/textContent vs. récupération de chaque nœud de texte

Question

J'ai entendu dire qu'utiliser el.innerText||el.textContent peut donner des résultats peu fiables, et c'est pourquoi j'ai toujours insisté pour utiliser la fonction suivante dans le passé :

function getText(node) {

    if (node.nodeType === 3) {
        return node.data;
    }

    var txt = '';

    if (node = node.firstChild) do {
        txt += getText(node);
    } while (node = node.nextSibling);

    return txt;

}

Cette fonction parcourt tous les nœuds d'un élément et rassemble le texte de tous les nœuds de texte, ainsi que le texte des descendants :

Par exemple

<div id="x">foo <em>foo...</em> foo</div>

Résultat :

getText(document.getElementById('x')); // => "foo foo... foo"

Je suis tout à fait Je suis sûr qu'il y a des problèmes avec l'utilisation innerText y textContent mais je n'ai pu trouver de liste définitive nulle part et je commence à me demander si ce n'est pas juste une question d'argent. ouï-dire .

Quelqu'un peut-il fournir des informations sur le manque éventuel de fiabilité de textContent/innerText ?

EDIT : Trouvé cette excellente réponse par Kangax -- L'option "innerText" fonctionne dans IE, mais pas dans Firefox.

Answer 1

Tout est une question de lignes de fin et d'espaces blancs - les navigateurs sont très incohérents à cet égard, en particulier Internet Explorer. Effectuer la traversée est un moyen infaillible d'obtenir des résultats identiques dans tous les navigateurs.