Inserer plusieurs lignes dans le DOM

Fermé

mattmax - 7 févr. 2020 à 10:39
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 - 7 févr. 2020 à 13:52

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:

Inserer plusieurs lignes dans le DOM
Insérer signature word - Guide
Insérer une vidéo dans powerpoint - Guide
Insérer liste déroulante excel - Guide
Insérer sommaire word - Guide
Aller à la ligne dans une cellule excel - Guide

1 réponse

Réponse 1 / 1

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
7 févr. 2020 à 12:31

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.

mattmax
7 févr. 2020 à 12:58

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?

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > mattmax
7 févr. 2020 à 13:52

Si je te dis :

valeur = valeur  + nouvellevaleur

y'a plus qu'à adapter à ton code

Discussions similaires

Afficher toutes les lignes masquées excel

Insérer un pdf de plusieurs pages dans word.

Chemin Logo du site de la Cité de l'espace

Discussions similaires

Newsletters