jQuery set innerText (), innerHtml (), textContent ()

Points de base

• jQuery combinée avec JavaScript peut modifier le contenu texte des éléments HTML pour inclure de nouveaux texte, images, code, etc. Cet article se concentre sur trois fonctions jQuery: innerText(), innerHTML() et textContent().
• innerText() La fonction lit et écrit du texte entre l'étiquette de départ de l'élément et l'étiquette de fin, y compris les ruptures de ligne; innerHTML() La fonction textContent()
a un problème Newline: il n'affiche pas les nouvelles lignes entre deux paragraphes comme la fonction
• . Cette fonction est prise en charge par Firefox, Chrome et Opera, mais ne prend pas en charge Internet Explorer. textContent() innerText() Bien que
et
• soient utilisés pour manipuler le contenu des éléments HTML, ils fonctionnent différemment dans jQuery. innerText Obtenez ou définissez le contenu HTML d'un élément, analysez la chaîne HTML et rendez-la en tant que HTML; innerHTML innerHTML innerText jQuery peut être utilisé conjointement avec JavaScript pour modifier le contenu texte d'un élément HTML et le définir pour contenir de nouveaux contenus, tels que du texte, des images, du code ou ce que vous voulez. Nous présenterons en détail les fonctions JavaScript suivantes et montrerons comment les utiliser, le synchronisation et les scénarios applicables. Cet article couvre les fonctions jQuery suivantes:
,

et

. innerText() innerHTML() textContent() jQuery

fonction

innerText() Grammaire:

document.elementID.innerText = value Fonction:

JavaScript lit et écrit des attributs, spécifiant le texte entre l'étiquette de démarrage de l'élément et l'étiquette de fin.

Comportement:

comprend des pauses de ligne.

Compatibilité du navigateur:

Fonctionne correctement dans tous les navigateurs que nous avons testés. innerText() Exemple de base:

javascript

<p>段落内文本</p>

fonction

innerHTML() Grammaire:

// c'est-à-dire seulement document.getElementById("elementID").innerHTML = value document.all.elementID.innerHTML = value Fonction:

Fonction JavaScript native pour modifier HTML dans les éléments de la page.

Comportement:

supprimer les nouvelles lignes.

Compatibilité du navigateur:

pris en charge dans tous les navigateurs. innerHTML Exemple de base:

Exemple avancé:

<p>段落内文本</p>

Remplacez la balise par

par une expression régulière, en s'assurant qu'elle fonctionne de manière similaire à , et le dernier est une expression régulière qui supprime toutes les balises HTML. n

<p>段落内文本</p>

jQuery textContent() fonction

Grammaire:

<p>段落内文本</p>

Fonction: Fonction Firefox de JQuery, utilisée pour modifier le texte des éléments de la page.

Comportement: supprimer les nouvelles lignes.

Compatibilité du navigateur: Firefox a ses propres attributs textContent, qui sont également pris en charge par Chrome et Opera, mais IE ne les soutient pas!

Exemple de base: étant donné l'extrait HTML suivant: <div id="divA">这是一些文本</div>

var message = div.innerHTML.replace(/<br>/gi,"\n").replace(/(<([^>]+)>)/gi, "");

Problème de caractères de rupture de ligne

innerText() Afficher "para1" et "para2" avec des ruptures de ligne au milieu, mais textContent() ne montre pas:

// ie / innerText (): para1 para2 // ff / textContent (): para1para2

CODE HTML / JS pour tester toutes les fonctions et en sélectionner une!

var text = element.textContent;
element.textContent = "i love jQuery (4u :P )";

Autres fonctions jQuery qui peuvent être utilisées pour modifier les éléments de la page: innerText.replace, innerHTML, innerText, textContent, html(), text(), div.innerHTML.replace, document.body.innerText, $.fn.innerText, div:contains, document.getElementById(id).innerText,

,

, .

<script> document.querySelector('p').innerText = 'InnerText'; </script> (Ce qui suit est la partie FAQ, qui a été réécrite et rationalisée en fonction du texte d'origine pour éviter la duplication) <script> document.querySelector('p').innerHTML = 'InnerHTML'; </script> <script> function GetContent() { var elem = document.getElementById("myDiv"); var message = ""; if (elem.outerHTML !== undefined) { message += "outer HTML : " + elem.outerHTML + "\n"; } if (elem.outerText !== undefined) { message += "outer text : " + elem.outerText + "\n"; } message += "inner HTML : " + elem.innerHTML + "\n"; if (elem.textContent === undefined) { message += "inner text : " + elem.innerText + "\n"; } else { message += "inner text : " + elem.textContent + "\n"; } alert(message); } </script>

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!