Remplissez div avec html en utilisant javascript / jquery
voici mon problème:
J'ai un div:
<div id="legend"></div>
et je veux le remplir, sous certaines conditions, avec ce code:
<p>Showing results....
Key:
<img src="/...."><=1
<img src="/..."><=2
<img src="/..."><=3
<img src="/..."><=4
<img src="/..."><=5
<p>
Comme vous pouvez le voir c'est une légende, et la question principale je pense, c'est que j'ai des guillemets qui ne peuvent pas facilement être inclus en utilisant par exemple la solution ici:
Remplir div avec du texte
Merci pour votre aide!
source d'informationauteur valenz
Vous devez vous connecter pour publier un commentaire.
Selon ma compréhension, vous essayez de faire quelque chose comme ceci:
Pour insérer du code HTML, vous devez utiliser
.html()
CEPENDANT, il serait beaucoup plus efficace d'utiliser Vanilla JS comme suit:Maintenant, vous avez également mentionné avoir des problèmes avec des guillemets. Eh bien, il y a deux solutions possibles.
1: Utiliser des guillemets simples autour de votre chaîne:
'<img src="/..." />'
2: s'Échapper les guillemets:
"<img src=\"/...\" />"
Et encore une chose: Si les retours à la ligne sont en fait dans votre code HTML pour insérer, vous ne pouvez pas avoir un multi-ligne de chaîne de caractères en JavaScript. Vous avez deux options ici:
1: Échapper à la nouvelle ligne:
2: Concaténer:
Assembler votre code html dans une variable en fonction de vos conditions (dont nous ne savons pas), puis utilisez
html()
de le mettre à l'élément.Que pour traiter avec les guillemets, vous pouvez utiliser des guillemets simples dans une variable, tels que:
ou vous pouvez échapper les guillemets:
var str= <p>write your complete code here</p>
$('#legend').html(yourconditionSatisfies?str:'')