Remplacer la page HTML par des contenus récupérés via AJAX

J'ai une page HTML avec une structure typique:

<html> <head> <script src="..." ></script> <style>...</style> </head> <body> content </body> <script> var success_callback = function(data) { // REPLACE PAGE CONTENT & STRUCTURE WITH "data" } ajax(url, params, success_callback); </script> </html> 

Pensez-vous que c'est possible? J'ai déjà essayé de donner à la balise html un identifiant et de faire $(id).replace(data); Sans succès.

Ne me demandez pas pourquoi, mais c'est ce dont j'ai besoin (je travaille avec un site spécial "mashup builder" … c'est une longue histoire).

EDIT : J'ai oublié de dire que les scripts dans le contenu reçu doivent être exécutés , même des scripts externes inclus en utilisant <script src="..."> .

Essayez ceci avec jQuery :

 $('body').load( url,[data],[callback] ); 

En savoir plus sur docs.jquery.com / Ajax / load

Le moyen le plus simple consiste à définir le nouveau contenu HTML en utilisant:

 document.open(); document.write(newContent); document.close(); 

Voici comment procéder dans Prototype : $(id).update(data)

Et jQuery : $('#id').replaceWith(data)

Mais document.getElementById(id).innerHTML=data devraient également fonctionner.

EDIT: Prototype et jQuery évaluent automatiquement les scripts pour vous.

Vous pourriez essayer de faire

 document.getElementById(id).innerHTML = ajax_response 

Je suppose que vous utilisez jQuery ou quelque chose de similaire. Si vous utilisez jQuery, alors, le suivant devrait fonctionner:

 <html> <head> <script src="jquery.js" type="text/javascript"></script> </head> <body> content </body> <script type="text/javascript"> $("body").load(url); </script> </html> 

Est-ce que vous ne pouvez pas essayer de remplacer le contenu du corps par le docteur document.body?

Si votre page est la suivante:

 <html> <body> blablabla <script type="text/javascript"> document.body.innerHTML="hi!"; </script> </body> </html> 

Il suffit d'utiliser le document.body pour remplacer le corps.

Cela fonctionne pour moi. Tout le contenu de la balise BODY est remplacé par innerHTML que vous spécifiez. Si vous devez même modifier la balise html et tous les enfants, vous devez vérifier quelles étiquettes du «document». Sont capables de le faire.

Un exemple avec javascript scripting à l'intérieur:

 <html> <body> blablabla <script type="text/javascript"> var changeme = "<button onClick=\"document.bgColor = \'#000000\'\">click</button>"; document.body.innerHTML=changeme; </script> </body> 

De cette façon, vous pouvez faire des scripts javascript dans le nouveau contenu. N'oubliez pas d'échapper à toutes les citations doubles et simples, sinon cela ne fonctionnera pas. Échapper à javascript peut être fait en parcourant votre code et en mettant une barre oblique inverse devant toutes les guillemets et doubles.

N'oubliez pas que les scripts côté serveur comme php ne fonctionnent pas de cette façon. Puisque PHP est un script côté serveur, il doit être traité avant qu'une page ne soit chargée. Javascript est une langue qui fonctionne sur le côté client et ne peut donc pas activer le ré-traitement du code php.

La manière la plus simple est

 $("body").html(data);