Utiliser getElementById pour dupliquer le contenu de la page

Je ne connais pas javascript et j'ai recherché partout cette réponse. Je voudrais dupliquer le contenu dans ma page. Le code HTML et le contenu proviennent directement d'un courtier.Utiliser getElementById pour dupliquer le contenu de la page

Le résultat souhaité est:

Click the button to change the text in this paragraph. 
Click the button to change the text in this paragraph.

Mon HTML est:

<!DOCTYPE html> 
<html> 
<body> 
<p id="demo">Click the button to change the text in this paragraph.</p> 
<script language="javascript" type="text/javascript"> 
var elem = document.getElementById('demo').setAttribute('id', 'nextstep'); 
document.write(elem); 
</script> 
</body> 
</html>

Ce que je veux est:

Click the button to change the text in this paragraph. 
undefined

Quelqu'un peut-il aider à me diriger dans la bonne direction? Merci d'avance!

Source

2013-09-25 Joyce

Je ne Je crois que vous voulez utiliser document.write. Je pense que c'est ce que vous êtes après:

<script language="javascript" type="text/javascript"> 
    // this gets the element 
    var elem = document.getElementById('demo'); 
    // this copies the entire element, including the id 
    var newElem = elem.cloneNode(true); 
    // this sets a new id 
    newElem.setAttribute('id', 'nextstep'); 
    // generic way to make sure you insert properly 
    var before = elem.nextSibling; 
    // there's no insertAfter, only insertBefore, which is why we found the before 
    elem.parentNode.insertBefore(newElem, before); 
</script>

FIDDLE

Source

2013-09-25 14:58:57

J'aurais pu combiner les deux dernières lignes en une seule: 'elem.parent.insertBefore (newElem, elem.nextSibling);', mais j'ai pensé qu'une étape par ligne serait très utile. Dans ce cas précis, au lieu d'utiliser 'insertBefore', j'aurais simplement pu faire' document.body.appendChild (newElem); ', mais j'ai pensé qu'il était préférable d'utiliser l'approche générique. –

+1 pour une bien meilleure réponse que la mienne. –

Merci pour la réponse! Je ne sais pas exactement pourquoi le script ne fonctionne pas sur jsFiddle. Des pensées sur ce que j'ai pu faire de mal? – Joyce

Vous devez saisir le innerHTML et le mettre:

var elem = document.getElementById('demo').innerHTML; 
document.write(elem);

Prenez garde cependant, document.write va écraser tout ..

Source

2013-09-25 14:53:23 tymeJV

Votre code ne fonctionne! Mon but est de donner à l'élément copié un nouvel identifiant afin que je puisse le styler (ajuster la position etc.) sans changer l'identifiant de la div originale. Comment pourrais-je m'y prendre? – Joyce

Vous définissez elem à la valeur de retour de setAttribute, qui est non définie comme il ne retourne rien.

Modifier le code:

var elem = document.getElementById('demo'); 
elem.setAttribute('id', 'nextstep'); 
document.write(elem.innerHTML);

Exemple - http://jsfiddle.net/P8EcL/

Cela ne reste pas fin avec exactement ce que vous voulez car il est copie du contenu de la balise p plutôt que l'étiquette elle-même .

Scott Mermelstein's réponse est ce que vous voulez.

Source

2013-09-25 14:53:33

+1 pour expliquer d'où vient l'indéfini. –

Votre code a bien fonctionné! Mon but est de donner à l'élément copié un nouvel identifiant afin que je puisse le styler (ajuster la position etc.) sans changer l'identifiant de la div originale. Comment pourrais-je m'y prendre? – Joyce

La réponse de @Joyce Scott devrait faire ce que vous voulez. –

var elem = document.getElementById('demo').innerHTML; 
document.write(elem);

Je ne sais pas pourquoi vous essayez de définir un nouvel identifiant sur le div et attendre d'origine pour retourner le HTML, mais il ne va pas travailler;)

Source

2013-09-25 14:53:42

Si u besoin d'obtenir ce

<p id="demo">Click the button to change the text in this paragraph.</p> 
<p id="nextstep">Click the button to change the text in this paragraph.</p>

essayer

<!DOCTYPE html> 
<html> 
<body> 
<p id="demo">Click the button to change the text in this paragraph.</p> 
<script language="javascript" type="text/javascript"> 
    var elem = document.getElementById('demo'); 
    var newElem = document.createElement('div'); 
    newElem.innerHTML = "<p id='nextstep'>" + elem.innerHTML + "</p>"; 
    document.write(newElem.innerHTML); 
</script> 
</body> 
</html>

Source

2013-09-25 15:07:20 tetta

si vous ne voulez pas utiliser l'écriture de document, utilisez document.getElementsByTagName ('body') [0] .appendChild (newElem); – tetta

Cela a fonctionné! Merci beaucoup à vous tous ... Ce système de support est génial. Vous êtes top les gars! – Joyce

Utiliser getElementById pour dupliquer le contenu de la page

Répondre

Questions connexes