Partage
  • Partager sur Facebook
  • Partager sur Twitter

Element enfant

Ajouter des données dans un élément enfant

Dji-Bi
    15 décembre 2009 à 15:12:27

    Salut,

    je butte sur un problème en DHTML, je vous montre...

    J'ai ce code XHTML :
    <div id="maDiv">
<div class="titre">Titre</div>
<div class="content">Content</div>
</div>


    Je fais une fonction ajax pour charger un document html dans la DIV ".content" mais je ne sais pas trop comment arriver à sélectionner l'élément enfant ".content" de "#maDiv" :-°

    Comment faire ?

    J'ai trouvé une solution mais est-ce qu'elle est bonne ?

    var block = document.getElementById("maDiv").childNodes;
for(var i = 0; i < block.length; i++)
	{
		if(block.item(i).className == 'content')
			{
				var contentDiv = block.item(i);
			}
	}
    • Partager sur Facebook
    • Partager sur Twitter
    linvi
      15 décembre 2009 à 15:28:43

      Je pense que ca devrais marcher:

      var block = document.getElementById("maDiv").childNodes;
for(var i = 0; (i < block.length) && (block[i].className != 'content'); ++i);
var contentDiv = block[i];
      • Partager sur Facebook
      • Partager sur Twitter
      Dji-Bi
        15 décembre 2009 à 15:39:48

        C'est plus ou moins preil :p
        • Partager sur Facebook
        • Partager sur Twitter
        linvi
          15 décembre 2009 à 15:43:38

          Je viens de test et cela fonctionne, voila mon test:
          <body>
<div id="maDiv">
<div class="titre">Titre</div>
<div class="content">Content</div>
</div>
<script type="text/javascript">
var block = document.getElementById("maDiv").childNodes;
for(var i = 0; (i < block.length) && (block[i].className != 'content'); ++i);
var contentDiv = block[i];
contentDiv.innerHTML = 'salut';
</script>
</body>


          'Content' est bien remplacer par 'salut'.
          • Partager sur Facebook
          • Partager sur Twitter
          Dji-Bi
            15 décembre 2009 à 15:45:18

            Je confirme, ça marche :)

            Je laisse ouvert au cas ou un AS des AS du Javascript passerait par là et aurait une meilleur idée que celle là ^^

            Merci à toi ;)
            • Partager sur Facebook
            • Partager sur Twitter
            restimel
            • Javascript
              15 décembre 2009 à 17:04:53

              ben dans le principe c'est ça (après on peut toujours critiquer côté optimisation mais ce n'est pas fondamentalement important)

              Vu que IE n'accepte pas le getElementsByClassName on ne peut pas s'en servir si on souhaite une bonne compatibilité

              Sinon il reste querySelectorAll mais n'est compatible qu'avec les versions IE8, FF 3.6, Opera 10, safari 3.1, chrome 1(et+) donc seulement pour les navigateurs (très) récents
              pour reprendre le code de linvi ça donnerait ceci:
              <body>
<div id="maDiv">
<div class="titre">Titre</div>
<div class="content">Content</div>
</div>
<script type="text/javascript">
  var contentDiv = document.querySelectorAll('#maDiv .content'); //il s'agit d'un selecteur CSS
  contentDiv[0].innerHTML = 'salut'; //ATTENTION querySelectorAll retourne un tableau d'éléments
</script>
</body>
              • Partager sur Facebook
              • Partager sur Twitter

              Element enfant

              × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
              × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
              • Editeur ●
              • Markdown