Alternative Javascript à document.write not innerHTML

Question

Alternative Javascript à document.write not innerHTML

Demandé el 18 de Février, 2013: Quand la question a-t-elle été
9168 affichage: Nombre de visites la question a
3 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

J'ai modifié un petit js script qui compare une date à aujourd'hui et calcule la différence. (Je suis un novice) Cependant, il utilise document.write, dont on m'a dit qu'il était mauvais. Je ne sais pas pourquoi c'est mauvais, les gens disent simplement que c'est mauvais et n'expliquent jamais pourquoi. Quoi qu'il en soit, je cherche une alternative. innerHTML ne semble pas fonctionner, et les autres questions auxquelles on a répondu sur ce site ne font que pointer vers des références de manipulation du DOM sans vraiment répondre à la question.

Voici mon script :

    //Set the two dates
    var iquit =new Date(2013, 1, 15);
    today=new Date();
    //Get 1 day in milliseconds
    var one_day=1000*60*60*24;
    var day_numeric=Math.ceil((today.getTime()-iquit.getTime())/(one_day));
    //Calculate difference btw the two dates, and convert to days
    document.write("<p>"+day_numeric+
            " days have gone by since you quit smoking!</p>"+
            "<p>You have saved "+ day_numeric*7+" pounds</p>");

Si quelqu'un peut me dire une meilleure façon d'écrire ça, ce serait génial.

Demandé el 18 de Février, 2013 par dmc

Answer 1

3 Réponses

Answer 2

2voto

Christofer Eliasson Points 16563

Le problème avec document.write() est que si vous l'appelez après que le DOM soit prêt, il écrasera le DOM existant. Ceci Réponse SO a une explication plus approfondie de la raison pour laquelle document.write() est rarement le meilleur choix.

Utilisation de .innerHTML devrait fonctionner correctement, mais vous devez sélectionner l'élément auquel vous voulez ajouter le contenu. Donc quelque chose comme ça :

document.getElementById("idOfSomeElement").innerHTML = "your content";

Exemple concret

La méthode à utiliser pour obtenir l'élément approprié dépend de ce que vous devez sélectionner, mais si possible, le moyen le plus simple est probablement d'attacher un ID à l'élément auquel vous voulez ajouter du contenu, et d'utiliser la méthode ci-dessus.

Répondu el 18 de Février, 2013 par Christofer Eliasson (16563 Points )

Answer 3

2voto

Matías Fidemraizer Points 16842

Si vous utilisez du JavaScript pur, l'une des meilleures façons d'obtenir ce résultat peut être :

var paragraph1 = document.createElement("p");
paragraph1.appendChild(document.createTextNode(day_numeric+" days have gone by since you quit smoking!"));

var paragraph2 = document.createElement("p");
paragraph1.appendChild(document.createTextNode("You have saved "+ day_numeric*7+" pounds"));

document.body.appendChild(paragraph1);
document.body.appendChild(paragraph2);

100% standard DOM.

A propos de document.write : bien ou mal...

Je suppose que certains considèrent document.write comme une mauvaise pratique parce qu'il s'agit de la manière la plus basse de transmettre le contenu brut au document (X)HTML.

Étant donné que le (X)HTML est essentiellement un dialecte du XML (ou du moins, basé sur le XML et le SGML), l'approche du droite y attendu La façon d'écrire un document consiste à créer des nœuds et à les ajouter à l'ensemble du document.

document.write écrit le contenu après le dernier élément écrit et vous perdez beaucoup de contrôle lorsque vous voulez décider où placer l'élément nouvellement créé dans le document.

Par exemple, voulez-vous éditer un paragraphe à partir d'une fonction JavaScript chargée dans l'application <head> élément ? Ce serait difficile car il ne sera pas nécessairement rendu dans le corps. C'est dommage. .

Il est préférable de créer des éléments/nœuds DOM et de les ajouter au document à l'aide de la fonction appendChild(...) .

Répondu el 18 de Février, 2013 par Matías Fidemraizer (16842 Points )

Answer 4

0voto

cernunnos Points 1852

Consultez ce lien pour connaître les raisons pour lesquelles cette pratique est considérée comme mauvaise : Pourquoi document.write est-il considéré comme une "mauvaise pratique" ?

Et comment utilisez-vous innerHTML ?

Avez-vous essayé quelque chose comme

<script>
...
document.getElementById('container-id').innerHTML = "<p>"+day_numeric+" days have gone by since you quit smoking!</p>"+"<p>You have saved "+ day_numeric*7+" pounds</p>";
</script>

Cela nécessite un élément avec l'identifiant container-id quelque part dans la page, comme :

<div id='container-id'></div>

Répondu el 18 de Février, 2013 par cernunnos (1852 Points )

Alternative Javascript à document.write not innerHTML

Réponses

A propos de document.write : bien ou mal...

Questions en vedette

Top Tags

Prograide.com

Powered by:

Alternative Javascript à document.write not innerHTML

Réponses

A propos de document.write : bien ou mal...

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: