Inserer plusieurs lignes dans le DOM

mattmax -  
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   -
Bonjour, je souhaiterais insérer ces lignes de code dans ma page principale
<li class="item">
                <a href="#structures" class="link" id="btn" >Otacos<i class="fas fa-sort-down"></i></a>
                <div class="smenu">
                    <ul>
                    <li><div class="link" data-name="newsite" onclick="<?php $name_str="otacos" ?>"><i class="fas fa-plus">
                    </i>Add new Marketsite</div></li>
                    <li><div class="link" data-name="deliveroo"><i class="fas fa-hamburger"></i>Deliveroo</div></li>
                    <li><div class="link" data-name="justeat"><i class="fas fa-pizza-slice"></i>Just Eat</div></li>
 
                    </ul>
                </div>
 
            </li>


Or je n'y arrive pas en utilisant innerHTML
Voici ce que j'ai essayé de faire sans succès 

base='<li class="item">'+
            '<a href="#structures" class="link" id="btn" >Otacos<i class="fas fa-sort-down"></i></a>'+
            '<div class="smenu">'+
            '<ul>'+
            '<li><div class="link" data-name="newsite" onclick="<?php $name_str="otacos" ?>"><i class="fas fa-plus"></i>Add new Marketsite</div></li>'+
            '<li><div class="link" data-name="deliveroo"><i class="fas fa-hamburger"></i>Deliveroo</div></li>'+
            '<li><div class="link" data-name="justeat"><i class="fas fa-pizza-slice"></i>Just Eat</div></li>'+
            '</ul>'+
            '</div>'+
            '</li>';
        document.getElementById("add_struct").innerHTML=base;


Avez vous une solution pour afficher plusieurs lignes html imbriquées ?
Merci par avance
A voir également:

1 réponse

Réponse 1 / 1
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
Bonjour,

Commence par tester ça : 
var base = '<li class="item">'
      +'<a href="#structures" class="link" id="btn" >Otacos<i class="fas fa-sort-down"></i></a>'
      +'<div class="smenu">'
      +'<ul>'
      +'<li><div class="link" data-name="newsite" onclick="<?php $name_str="otacos" ?>"><i class="fas fa-plus"></i>Add new Marketsite</div></li>'
      +'<li><div class="link" data-name="deliveroo"><i class="fas fa-hamburger"></i>Deliveroo</div></li>'
      +'<li><div class="link" data-name="justeat"><i class="fas fa-pizza-slice"></i>Just Eat</div></li>'
      +'</ul>'
      +'</div>'
      +'</li>';
if(typeof(document.getElementById("add_struct"))!='undefined'){      
  document.getElementById("add_struct").innerHTML=base;
}else{
  alert('add_struct est introuvable dans la page !');
}

Pense à regarder dans la console de ton navigateur si il n'y a pas d'erreur de script

Et bien entendu... ton JS est placé de telle sorte qu'il ne se déclenche qu'une fois tous les éléments de ta page chargés.

0
mattmax
 
merci pour la réponse, le seule problème est qu'il enlève tout les autre lignes de la balise id="add_struct"
Comment est ce que je fait pour ajouter l'élément sans enlever les autres éléments enfants?
0
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752 > mattmax
 
Si je te dis : 
valeur = valeur  + nouvellevaleur

y'a plus qu'à adapter à ton code
0