Javascript Girl
  1. Javascript Girl
  3. Obtenir du contenu d'un DIV à l'aide de JavaScript
Intereting Posts
Comment définir une variable en JavaScript avec fonction echo PHP? Intercepter l'appel sur le bouton de retour dans mon application AJAX: Je ne veux pas qu'il fasse n'importe quoi! Mettre à jour de grandes parcelles dans Shiny sans Re-Rendering Jquery ouvre le menu contextuel sur le bouton cliquez pour démarrer Javascript / jQuery – Comment puis-je obtenir le nom de la classe d'élément cliqué? Info-bulle dynamique pour multilignes dans d3.js Remplacer les espaces par & nbsp; Erreur du compilateur typographique – les paramètres fournis ne correspondent à aucune signature de cible d'appel Bouton simple en toile HTML5 Webpack et bibliothèques externes Var myArray = , nom ;? Comment définir une liaison personnalisée qui utilise la valeur précédente pour déterminer la classe dans Knockout? Javascript BBCode Parser ne reconnaît que l'élément de la première liste Passez les événements de souris via un élément absolument positionné Quelle est la différence entre l'héritage combiné parasitaire et l'héritage combiné en javascript?

Obtenir du contenu d'un DIV à l'aide de JavaScript

J'ai deux DIV appelés DIV1 et DIV2 et DIV1 se compose de contenu dynamique et DIV2 est vide. J'ai besoin que le contenu de DIV1 soit affiché dans DIV2. Comment puis-je le faire.

J'ai codé ci-dessous, ce qui ne fonctionne pas. Quelqu'un corrigez-le. 

<script type="text/javascript"> var MyDiv1 = Document.getElementById('DIV1'); var MyDiv2 = Document.getElementById('Div2'); MyDiv2.innerHTML = MyDiv2; </script> <body> <div id="DIV1"> // Some content goes here. </div> <div id="DIV2"> </div> </body>

(1) Votre <script> doit être placée avant la </body> fermeture. Votre JavaScript essaie de manipuler des éléments HTML qui n'ont pas encore été chargés dans le DOM.
(2) Votre affectation de contenu HTML semble dérangé.
(3) Soyez cohérent avec le cas dans votre ID d'élément, c'est-à-dire 'DIV2' vs 'Div2'
(4) minuscule utilisateur pour l'objet 'document' (crédit: ThatOtherPerson) 

 <body> <div id="DIV1"> // Some content goes here. </div> <div id="DIV2"> </div> <script type="text/javascript"> var MyDiv1 = document.getElementById('DIV1'); var MyDiv2 = document.getElementById('DIV2'); MyDiv2.innerHTML = MyDiv1.innerHTML; </script> </body>

À l'heure actuelle, vous définissez innerHTML sur un élément entier de division; Vous souhaitez le configurer uniquement sur innerHTML. De plus, je pense que vous voulez que MyDiv2.innerHTML = MyDiv 1 .innerHTML. De plus, je pense que l'argument de document.getElementById est sensible à la casse. Vous Div2 lorsque vous vouliez DIV2 

 var MyDiv1 = Document.getElementById('DIV1'); var MyDiv2 = Document.getElementById('DIV2'); MyDiv2.innerHTML = MyDiv1.innerHTML;

De plus, ce code fonctionnera avant que votre DOM ne soit prêt. Vous pouvez soit mettre ce script au bas de votre corps comme dit paislee, ou le mettre dans la fonction de surcharge de votre corps 

 <body onload="loadFunction()">

et alors 

 function loadFunction(){ var MyDiv1 = Document.getElementById('DIV1'); var MyDiv2 = Document.getElementById('DIV2'); MyDiv2.innerHTML = MyDiv1.innerHTML; }

Vous devez configurer Div2 dans le fichier innerHTML de Div1. En outre, le JavaScript est sensible à la casse – dans votre HTML, l'ID Div2 est DIV2 . De plus, vous devez utiliser le document , pas Document : 

 var MyDiv1 = document.getElementById('DIV1'); var MyDiv2 = document.getElementById('DIV2'); MyDiv2.innerHTML = MyDiv1.innerHTML;

Voici un JSFiddle: http://jsfiddle.net/gFN6r/ .

Tout simplement vous pouvez utiliser le plugin jquery pour obtenir / définir le contenu de la div.

Var divContent = $ ('#' DIV1) .html (); $ ('#' DIV2) .html (divContent);

Pour cela, vous devez inclure la bibliothèque jquery.

Function add_more () { 

 var text_count = document.getElementById('text_count').value; var div_cmp = document.getElementById('div_cmp'); var values = div_cmp.innnerHTML; var count = parseInt(text_count); divContent = ''; for (i = 1; i <= count; i++) { var cmp_text = document.getElementById('cmp_name_' + i).value; var cmp_textarea = document.getElementById('cmp_remark_' + i).value; divContent += '<div id="div_cmp_' + i + '">' + '<input type="text" align="top" name="cmp_name[]" id="cmp_name_' + i + '" value="' + cmp_text + '" >' + '<textarea rows="1" cols="20" name="cmp_remark[]" id="cmp_remark_' + i + '">' + cmp_textarea + '</textarea>' + '</div>'; } var newCount = count + 1; if (document.getElementById('div_cmp_' + newCount) == null) { var newText = '<div id="div_cmp_' + newCount + '">' + '<input type="text" align="top" name="cmp_name[]" id="cmp_name_' + newCount + '" value="" >' + '<textarea rows="1" cols="20" name="cmp_remark[]" id="cmp_remark_' + newCount + '" ></textarea>' + '</div>'; //content = div_cmp.innerHTML; div_cmp.innerHTML = divContent + newText; } else { document.getElementById('div_cmp_' + newCount).innerHTML = '<input type="text" align="top" name="cmp_name[]" id="cmp_name_' + newCount + '" value="" >' + '<textarea rows="1" cols="20" name="cmp_remark[]" id="cmp_remark_' + newCount + '" ></textarea>'; } document.getElementById('text_count').value = newCount; }