Discussion :

[dzaohfz]

Bonjour,

j'aimerai intercepter les document.write et faire un innerhtml mais dans le div où le script se situe ou bien juste après ce script. Est-ce possible ?
Pour l'instant j'ai ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
document.write = function(parameter) {
    if (!parameter) return; 
   document.getElementById("script").innerHTML = parameter;
};
</script>
 
Bienvenue
<div id="script">
<script src="https://scriptquifaitundocument.write" async></script>
</div>

Mais pour le coup c'est moi qui défini le lieu alors que j'aimerai que cela soit automatique selon le script lancé car si plus loin dans une div "script2" j'ai un autre script avec document.write il va se mettre dans ma première div et pas dans la div où le script ce situe.

Merci d'avance pour vos réponses.

[javatwister]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.write = function(parameter) {...}

Cette instruction n'existe pas en JS.

document.write(chaîne_contenant_éventuellement_du_html) est la seule utilisation possible de cette méthode;

Et puis, ce qui est drôle c'est que tu as la solution: garde uniquement document.getElementById("script").innerHTML = parameter; et enlève tout le reste de ton script (surtout le script src=...), tu verras.

[dzaohfz]

ok tu n'a pas compris...
suivant lol

[ProgElecT]

Salut

ok tu n'a pas compris...

Moi non plus

...
suivant lol

[dzaohfz]

Mais lol, bizarre.
Bon je rexplique...
j'ai des script externe qui ont des document.write
j'aimerai donc avec

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
document.write = function(parameter) {
    if (!parameter) return; 
   document.getElementById("script").innerHTML = parameter;
};
</script>

qui existe
intercepter les document.write pour les mettre donc en innerHTML à l'endroit du script
script appelé en asyn....

Merci de m'indiquer ce que vous ne comprenez pas ?

[javatwister]

intercepter les document.write

Ta réponse est fort sympathique, mais ce que tu dis et ce que tu veux restent hermétiques;

[dzaohfz]

Ta réponse est fort sympathique, mais ce que tu dis et ce que tu veux restent hermétiques;

qu'est-ce que tu a toujours pas compris ?
je récris la fonction document.write pour la traiter à ma façon quand elle est appelé dans un script externe.....
(c'est vieux comme le monde...)

[javatwister]

c'est vieux comme le monde...

Mais où (dans le monde) as-tu trouvé cette "réécriture" de document.write()?

[dzaohfz]

Mais où (dans le monde) as-tu trouvé cette "réécriture" de document.write()?

partout... il faut sortir un peu


Edit : bon bref j'ai trouvé 2 solution.... une ou je défini mes div par exemple "div1" "div2" etc juste avant mes scripts et du coup je rajoute une var i que j'incremente de 1 du coup le premier appel à ma nouvelle fonction document.write met le contenu dans div+i donc div1 etc... Sauf que si le premier repond pas ou que le second répond avant l'autre ça décale tout l'affichage...
Donc après ça je suis tombé sur document.currentScript qui est the solution ça marche très bien mais pas partout.... pas de ie donc faut que je paufine dans ce sens en espérant trouver un équivalent

[Golgotha]

javatwister ne comprends pas, parce que ça n'a ni queue ni tête.

Y'a aucune raison d'utiliser document.write à moins d'être resté bloqué en 1965, et encore moins de créer une variable qu'on incrémente pour choper les bonnes div, c'est juste n'importe quoi

Enfin bref.. c'est du code bien dégueulasse

Sur ce, bon courage.

[dzaohfz]

Mais comme je l'ai dit c'est pas moi qui fait ce document.write, c'est un script externe.... Et justement c'est pour cela que je veux l'intercepter pour pouvoir l’implémenter en async.
Donc ça a complement une queue et une tete :p Désolé de te decevoir

[Watilin]

Je trouve que le besoin est légitime. On ne maîtrise pas les scripts externes et c’est bien chiant quand ceux-ci utilisent du code dégueulasse, justement.

L’existence de document.write est la seule raison pour laquelle les interpréteurs HTML sont obligés, encore aujourd’hui, de faire une pause à chaque fois qu’une balise <script> (non marquée asynchrone) est rencontrée, pour passer la main à l’interpréteur JS au cas où il y aurait l’éventualité d’une probabilité de possibilité que le script contiendrait un appel à document.write. C’est une perte sèche de performance qu’on ne peut pas empêcher, malheureusement.

Mais on peut au moins maîtriser l’endroit et le moment où les scripts externes injectent leur HTML. Parce que l’interpréteur HTML est en pause au moment d’un appel à document.write, on a la garantie que le script en cours d’interprétation est la dernière balise <script> existant dans la page à ce moment. On peut utiliser un bout de code comme :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
var scripts = document.getElementsByTagName("script");
var lastScript = scripts[scripts.length - 1];

Pour reléguer à plus tard l’injection du HTML de la façon dont toi tu l’entends, tu peux t’accrocher à des évènements comme "DOMContentLoaded" (sur document) ou "load" (sur window). Imaginons qu’au moment où tu redéfinis document.write, tu déclares également un tableau (ou autre structure) dans lequel tu stockes côte à côte :

• le script qui appelle document.write ;
• le paramètre passé.

Il devient alors simple d’itérer sur ce tableau pour injecter les paramètres au voisinage des balises <script> correspondantes.

Tu peux même encapsuler le tout dans une fermeture (closure) pour garder les choses propres :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
;(function () {
  "use strict"; // https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Strict_mode
 
  var monTableau = [];
 
  // redéfinition
  document.write = function (parameter) {
    if (!parameter) return;
 
    var scripts = document.getElementsByTagName("script");
    var lastScript = scripts[scripts.length - 1];
 
    monTableau.push({
      "script": lastScript,
      "parameter": parameter,
    });
  };
 
  // injection au moment voulu
  document.addEventListener("DOMContentLoaded", function () {
    var len = monTableau.length;
    for (var i = 0; i < len; i++) {
      monTableau[i].script.insertAdjacentHTML("afterend", monTableau[i].parameter);
    }
  }, false);
}());

la doc de insertAdjacentHTML

[dzaohfz]

AH merci voilà quelqu'un qui a compris.
Je vais tester ça et voir si ça fonctionne mieux que mon currentScript qui n'était pas compatible partout.


Edit :

j'ai testé donc ça ne fonctionne pas en async dommage

[Golgotha]

On ne maîtrise pas les scripts externes

C'est à dire ? je vois toujours pas dans quel cas (concret) s'inscrit la démarche. Si vous voulez bien m'éclairer...

[dzaohfz]

bah un script "externe"... donc c'est externe.... donc on maitrise pas car c'est quelqu'un d'autre qui le code.....

En clair à l'heure actuel on ne code plus avec document.write.... mais certain site le font encore et quand on une obligation de travailler avec eux bah on subit les soucis que le document.write peut causer.
Donc c'est pour ça qu'il peut être intéressant de pouvoir intercepter ces document.write pour les implémenter d'une autre façon afin de régler certains problèmes que ça peut engendrer.


Pour ce qui est du cas concret.. Si l'on utilise par exemple un script externe (donc que l'on ne maitrise pas nous...) pour faire afficher un encart à un endroit spécial de notre site... Si la personne qui a fait le script externe n'utilise pas document.write on peut alors charger le script en async et il s'affichera à l'endroit voulu ( selon le codage fait bien sur..) Si la personne le fait avec document.write dans ce cas là on ne peut pas faire de async et là ça peut poser problème si le script externe met une plombe a se charger car tout le reste de la page va attendre ce foutu script...

[javatwister]

A la limite, pour mettre en forme le contenu du write ou en supprimer les balises mais quand même...;

Tiens, je te mets un exemple directement inspiré de Maître Watilin:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8"> 
<title>...</title>
 
<style>
strong {display:block;margin:20px;color:red}
</style>
 
<script>
 
document.write = function(parameter){
        const scripts = document.querySelectorAll("script");
        const lastScript = scripts[scripts.length - 1];
        const elem=document.createElement("strong");
        elem.textContent=parameter;
        lastScript.insertAdjacentElement("afterend",elem);
}
 
</script>
 
</head>
<body>
 
<div>Des éléments, du texte, tout ce que vous voulez.</div>
 
<script>
document.write("un document.write anachronique")
</script>
 
<div>Des éléments, du texte, tout ce que vous voulez.</div>
 
<script>
document.write("un autre document.write anachronique")
</script>
 
<div>Des éléments, du texte, tout ce que vous voulez.</div>
 
<script>
document.write("Tiens, encore un document.write anachronique")
</script>
 
</body>
</html>

[dzaohfz]

@javatwister mais il n'y a pas de chargement de script externe en async la

[javatwister]

Ben peu importe: imagine que tu as un script externe à la place de chaque script en dur; c'est ça qui n'avait pas marché dans le code de Watilin? Je n'avais pas compris;

[Golgotha]

bah un script "externe"... donc c'est externe.... donc on maitrise pas car c'est quelqu'un d'autre qui le code.....

En clair à l'heure actuel on ne code plus avec document.write.... mais certain site le font encore et quand on une obligation de travailler avec eux bah on subit les soucis que le document.write peut causer.
Donc c'est pour ça qu'il peut être intéressant de pouvoir intercepter ces document.write pour les implémenter d'une autre façon afin de régler certains problèmes que ça peut engendrer.


Pour ce qui est du cas concret.. Si l'on utilise par exemple un script externe (donc que l'on ne maitrise pas nous...) pour faire afficher un encart à un endroit spécial de notre site... Si la personne qui a fait le script externe n'utilise pas document.write on peut alors charger le script en async et il s'affichera à l'endroit voulu ( selon le codage fait bien sur..) Si la personne le fait avec document.write dans ce cas là on ne peut pas faire de async et là ça peut poser problème si le script externe met une plombe a se charger car tout le reste de la page va attendre ce foutu script...

Qu'est-ce qui vous empêche de modifier le script en lui même ? (vous récupérer le script et faites votre version)

Après y'a aussi la solution de dire à ceux qui ont fait le script de se mettre à jour .. parce que ça fout la merde partout

[dzaohfz]

Qu'est-ce qui vous empêche de modifier le script en lui même ? (vous récupérer le script et faites votre version)

Après y'a aussi la solution de dire à ceux qui ont fait le script de se mettre à jour .. parce que ça fout la merde partout

hé non car leur script affiche quelque chose de dynamique sinon oui je l'aurai déjà mis en dur sur mon site...

Ben peu importe: imagine que tu as un script externe à la place de chaque script en dur; c'est ça qui n'avait pas marché dans le code de Watilin? Je n'avais pas compris;

ce qui ne marche pas c'est avec le async