jQuery ajouter du texte

Je veux ajouter des données simples dans un div comme:

$('#msg').append('Some text');

Dans le corps, je pense que je vais avoir besoin de placer le code html comme.

<div id="test">    

<div id="msg"></div>  //show text inside it.

</div>

Cependant, je tiens à ajouter un peu de CSS pour le #msg. Par exemple, la couleur d'arrière-plan. Maintenant, le problème est que, depuis les #msg div est présente tout le temps, je vois la couleur d'arrière-plan, même lorsque le texte n'est pas annexé il. J'ai essayé d'ajouter le css comme "display:none, mais dans ce cas je ne vois pas le texte ajouté à la fin.
Puis-je faire en sorte que les #msg div s'affiche à l'intérieur de la #test uniquement lorsque le texte est ajouté à la fin? Merci.

OP, veuillez tenir compte de la modification de la réponse de Hendy Irawan à la accepté de répondre.
Ce post semble contenir deux questions différentes: 1) Comment faire pour ajouter du texte à une <div> et 2) Comment masquer la <div> jusqu'à ce que le texte a été ajouté.

InformationsquelleAutor sunjie | 2011-07-05

-16
```
$('#msg').append('Some text').show();
```
- Merci. Cela fonctionne, mais je me demandais comment? Le #msg div reste dans le html, mais comment il ne s'applique pas le css, à moins que le jquery utilise spectacle?
- enlève juste le display: none et se transforme en display: block
- Ce n'ajoutez pas de texte, il ajoute HTML. Grande différence.
- ummm......
- D'accord avec @usr. Si le "texte" est à venir à partir de la saisie de l'utilisateur, ce sera la cause de JavaScript injection.
- Serait $('#msg').text( $('#msg').text() + 'Some text' ) être plus en sécurité? Selon le jQuery API, .text( [text] ) s'échappe du texte avec .createTextNode().
- Ne sais pas pourquoi les gens sont classement négatif pour votre réponse. Vous avez répondu correctement.
InformationsquelleAutor Neal
146

La bonne façon d'ajouter texte (contraste avec ajout de HTML) serait:
```
var someText = "Hello, World!";
$('#msg').append(document.createTextNode(someText));
```
Si someText est à venir à partir de la saisie de l'utilisateur ou quoi que ce soit d'autre, il sera correctement HTML échappé. Qui devrait éviter les JavaScript injection, le 3ème plus courantes web de la vulnérabilité de sécurité dans le monde.

De https://stackoverflow.com/a/944456/122441
- Ce doit être la accepté de répondre. Merci pour cet affichage le long avec l'explication de pourquoi c'est la bonne façon sécuritaire d'ajouter du texte d'un élément.
InformationsquelleAutor Hendy Irawan
0

Pourquoi ne pas utiliser
```
$('#msg').html('A styled <span style="background: yellow">paragraph</span>');
$('#msg').show();
```
Échapper en cas de besoin.
- La méthode .html() le fait de remplacer le contenu existant par un nouveau. Je pense que l'interlocuteur n'était pas au courant il y a un minuscule différence importante entre le remplacement et l'ajout.
InformationsquelleAutor WesternGun
-1

Je sais que cette question a été répondu avec différentes variantes, mais en voici un de plus. J'ai eu une demande similaire donc passé un peu de temps à essayer de trouver un moyen de le faire.

Si vous de connaître la structure d'une page HTML, vous pouvez obtenir le contenu HTML à l'aide de jQuery, ensuite, modifiez le contenu HTML en ajoutant à cela.

JS:
```
var lastPageText = $('#test p').html();
        $('#test p').html( lastPageText + ' &#128578;' )
```
HTML:
```
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<div id="test"><p>This is how things go perfecting well<span> even in a span</span></p></div>
```
Espère que le ci-dessus permet de quelqu'un qui recherche similaire réponse

Acclamations
- c'est la définition exacte de l'ajouter à mon humble avis
- Je n'ai jamais dit que c'est le meilleur moyen c'est d'une autre façon, si quelqu'un veut l'essayer. Parfois, vous avez une plate-forme de l'élément, vous ne pouvez pas changer.
InformationsquelleAutor Syfer

-1

Gens vous pouvez également utiliser ce moyen pour ajouter du texte.

function escapeHtml(unsafe) {
  return unsafe
     .replace(/&/g, "&amp;")
     .replace(/</g, "&lt;")
     .replace(/>/g, "&gt;")
     .replace(/"/g, "&quot;")
     .replace(/'/g, "&#039;");
}


var text = 'Put any text here';
$('#text').append(escapeHtml(text)).show();

Espère que cette aide.

InformationsquelleAutor طلحة

-5

Vous pouvez le faire à l'aide de plusieurs façons. Vous pouvez créer une classe css et de le faire:

Méthode 1

CSS:
```
.hello{ background-color: green }
```
HTML
```
<div id="msg"></div>
```
Javascript:
```
$("#msg").append("hello world").addClass("hello");
```
Méthode 2

HTML
```
<div id="msg" class="hello" style="display:none;"></div>
```
CSS:
```
.hello{ background-color: green }
```
Javascript:
```
$("#msg").append("hello world").show();
```
Méthode 3
HTML:
```
<div id="msg"></div>
```
Javascript:
```
$("#msg").append("hello world").css("background-color","green");
```
- Parce que .append() ajoute HTML et non du texte.
- Vous avez peut-être besoin de la lire aussi: "contenu: élément du DOM, tableau d'éléments, chaîne HTML, jQuery objet à insérer à la fin de chaque élément de l'ensemble des éléments qui correspondent."
InformationsquelleAutor Michael Schinis

Vous devez vous connecter pour publier un commentaire.