Cette page a été traduite à partir de l'anglais par la communauté.Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
HTMLElement : propriété innerText
Baseline Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis mars 2016.
La propriétéinnerText de l'interfaceHTMLElement représente le contenu textuel affiché d'un nœud et de ses descendants.
En lecture, elle correspond approximativement au texte que l'utilisateur·ice obtiendrait en sélectionnant le contenu de l'élément avec le curseur puis en le copiant dans le presse-papiers.En écriture, elle remplace les enfants de l'élément par la valeur donnée, en convertissant les sauts de ligne en éléments HTML<br>.
Note :Il est facile de confondreinnerText avecNode.textContent, mais il existe des différences importantes entre les deux.En résumé,innerText tient compte de l'apparence affichée du texte, alors quetextContent non.
Valeur
Une chaîne de caractères représentant le contenu textuel affiché d'un élément.
Si l'élément lui-même n'est pasaffiché(angl.) (par exemple, s'il est détaché du document ou caché à la vue), la valeur retournée est la même que celle de la propriétéNode.textContent.
Attention :DéfinirinnerText sur un nœud supprimetous les enfants du nœud et les remplace par un seul nœud texte contenant la chaîne de caractères fournie.
Exemples
Cet exemple compareinnerText avecNode.textContent.Remarquez queinnerText prend en compte des éléments comme<br> et ignore les éléments cachés.
HTML
<h3>Élément source :</h3><p> <style> #source { color: red; } #text { text-transform: uppercase; } </style> <span> Regardez<br /> comment ce texte<br /> est interprété ci-dessous. </span> <span>TEXTE CACHÉ</span></p><h3>Résultat de textContent :</h3><textarea rows="18" cols="40" readonly>…</textarea><h3>Résultat de innerText :</h3><textarea rows="6" cols="40" readonly>…</textarea>JavaScript
const source = document.getElementById("source");const textContentOutput = document.getElementById("textContentOutput");const innerTextOutput = document.getElementById("innerTextOutput");textContentOutput.value = source.textContent;innerTextOutput.value = source.innerText;Résultat
Spécifications
| Specification |
|---|
| HTML # the-innertext-idl-attribute |
Compatibilité des navigateurs
Voir aussi
- La propriété
HTMLScriptElement.innerText - La propriété
HTMLElement.outerText - La propriété
Element.innerHTML