Vous voulez probablement faire ceci:

 jQuery("body").html("new content"); 

… où "new content" n’inclurait idéalement que le balisage qui apparaîtrait normalement dans l’élément body et non le rest. Cela remplacera le contenu de l’élément body tout en laissant seul tout ce que vous avez en head (comme les informations de la feuille de style). Si vous souhaitez également mettre à jour le titre, vous pouvez le faire via document.title = "new title";

J’ai commencé à me demander si tout l’élément contenu dans l’élément html devait être remplacé, si cela fonctionnerait et ce qui se passerait. Alors j’ai fait ça:

             
Note now this text current appears in a sans-serif, bold, blue font.
   

Et les résultats ont été assez intéressants – je me suis retrouvé avec une structure DOM qui n’avait ni head ni body , mais html avec les descendants de la head et du body intérieur. C’est probablement ce qui perturbe le (nouveau) style dans le nouveau contenu. J’obtiens essentiellement le même résultat qui donne directement innerHTML (ce qui explique peut-être pourquoi cela ne fonctionne pas dans jQuery; jQuery utilise innerHTML lorsqu’il le peut, même s’il est très sophistiqué de ne pas le faire lorsqu’il ne le peut pas); alors que si je fais quelque chose de similaire en créant explicitement les éléments head et body via document.createElement et document.appendChild , cela fonctionne.

Ce qui signifie presque certainement que cela représente plus d’effort que cela n’en vaut la peine.

Mais notez que changer le contenu des éléments de la head et du body semble bien fonctionner:

             
Note now this text current appears in a sans-serif, bold, blue font.
   

Donc, si vous séparez la "page" que vous chargez dans les parties tête et corps, vous pouvez facilement la mettre à jour sur place.

Non jquery:

 var newSsortingng = [ "" , "" , "" , "" , "" , "
new content
" , "" , "" ].join(""); document.getElementById('myIframeId').contentDocument.documentElement.outerHTML = newSsortingng;