web-dev-qa-db-fra.com

Définir le contenu de HTML <span> avec Javascript

Dans une page Web, j'appelle un WebService qui me donne une valeur entière. J'ai besoin d'afficher cette valeur dans un bloc de texte. J'utilise actuellement un code HTML <span>.

Jusqu'ici, j'ai trouvé deux méthodes pour mettre ma valeur dans une durée. innerText() est une manière propriétaire de IE et innerHTML() est une méthode non conforme aux normes, bien que largement prise en charge.

Quel est le moyen correct, conforme aux normes, de définir le texte entre <span> Et </span> À partir de Javascript?

53
Brian Beckett

Ceci est conforme aux normes et peut être utilisé dans plusieurs navigateurs.

Exemple: http://jsfiddle.net/kv9pw/

var span = document.getElementById('someID');

while( span.firstChild ) {
    span.removeChild( span.firstChild );
}
span.appendChild( document.createTextNode("some new content") );
58
user113716

Avec les navigateurs modernes, vous pouvez définir la propriété textContent, voir Node.textContent :

var span = document.getElementById("myspan");
span.textContent = "some text";
43
robinst

Pour le faire sans utiliser une bibliothèque JavaScript telle que jQuery, procédez comme suit:

var span = document.getElementById("myspan"),
    text = document.createTextNode(''+intValue);
span.innerHTML = ''; // clear existing
span.appendChild(text);

Si vous voulez utiliser jQuery, c'est simplement ceci:

$("#myspan").text(''+intValue);
19
Brian Donovan

Pour ce faire, la méthode la plus conforme aux normes consiste à créer un nœud de texte contenant le texte souhaité et à l'ajouter à l'étendue (en supprimant les nœuds de texte existants).

Pour ce faire, j'utiliserais la fonction .text() de jQuery.

1
chaos