Replace HTML page with contents retrieved via AJAX

Question

I have an HTML page with a typical structure    lt html gt     lt head gt      lt script src        gt  lt  script gt      lt style gt     lt  style gt     lt  head gt     lt body gt     content    lt  body gt     lt script gt      var success callback   function data             REPLACE PAGE CONTENT  amp  STRUCTURE WITH  data            ajax url  params  success callback      lt  script gt   lt  html gt    Do you think it is possible    I ve already tried to give the html tag an id and doing   id  replace data   with no success   Don t ask me why  but that is what I need  I m working with a special  mashup builder  site    it is a long story    EDIT   I forgot to say that scripts in the received content have to be executed  even external scripts included using  lt script src       gt

User · Answer

Here s how to do it in Prototype    id  update data   And jQuery      id   replaceWith data   But document getElementById id  innerHTML data should work too   EDIT  Prototype and jQuery automatically evaluate scripts for you

User · Answer

You could try doing   document getElementById id  innerHTML   ajax response

User · Answer

try this with jQuery       body   load  url  data   callback       Read more at docs jquery com   Ajax   load

User · Answer

Here s how to do it in Prototype    id  update data   And jQuery      id   replaceWith data   But document getElementById id  innerHTML data should work too   EDIT  Prototype and jQuery automatically evaluate scripts for you

User · Answer

The simplest way is to set the new HTML content using   document open    document write newContent   document close

User · Answer

Can t you just try to replace the body content with the document body handler   if your page is this    lt html gt   lt body gt  blablabla  lt script type  text javascript  gt  document body innerHTML  hi     lt  script gt   lt  body gt   lt  html gt    Just use the document body to replace the body   This works for me  All the content of the BODY tag is replaced by the innerHTML you specify  If you need to even change the html tag and all childs you should check out which tags of the  document   are capable of doing so   An example with javascript scripting inside it    lt html gt   lt body gt  blablabla  lt script type  text javascript  gt  var changeme     lt button onClick   document bgColor      000000     gt click lt  button gt    document body innerHTML changeme   lt  script gt   lt  body gt      This way you can do javascript scripting inside the new content  Don t forget to escape all double and single quotes though  or it won t work  escaping in javascript can be done by traversing your code and putting a backslash in front of all singe and double quotes   Bare in mind that server side scripting like php doesn t work this way  Since PHP is server-side scripting it has to be processed before a page is loaded  Javascript is a language which works on client-side and thus can not activate the re-processing of php code

User · Answer

The simplest way is to set the new HTML content using   document open    document write newContent   document close

User · Answer

try this with jQuery       body   load  url  data   callback       Read more at docs jquery com   Ajax   load

User · Answer

You could try doing   document getElementById id  innerHTML   ajax response

User · Answer

Can t you just try to replace the body content with the document body handler   if your page is this    lt html gt   lt body gt  blablabla  lt script type  text javascript  gt  document body innerHTML  hi     lt  script gt   lt  body gt   lt  html gt    Just use the document body to replace the body   This works for me  All the content of the BODY tag is replaced by the innerHTML you specify  If you need to even change the html tag and all childs you should check out which tags of the  document   are capable of doing so   An example with javascript scripting inside it    lt html gt   lt body gt  blablabla  lt script type  text javascript  gt  var changeme     lt button onClick   document bgColor      000000     gt click lt  button gt    document body innerHTML changeme   lt  script gt   lt  body gt      This way you can do javascript scripting inside the new content  Don t forget to escape all double and single quotes though  or it won t work  escaping in javascript can be done by traversing your code and putting a backslash in front of all singe and double quotes   Bare in mind that server side scripting like php doesn t work this way  Since PHP is server-side scripting it has to be processed before a page is loaded  Javascript is a language which works on client-side and thus can not activate the re-processing of php code

User · Answer

try this with jQuery       body   load  url  data   callback       Read more at docs jquery com   Ajax   load

User · Answer

Can t you just try to replace the body content with the document body handler   if your page is this    lt html gt   lt body gt  blablabla  lt script type  text javascript  gt  document body innerHTML  hi     lt  script gt   lt  body gt   lt  html gt    Just use the document body to replace the body   This works for me  All the content of the BODY tag is replaced by the innerHTML you specify  If you need to even change the html tag and all childs you should check out which tags of the  document   are capable of doing so   An example with javascript scripting inside it    lt html gt   lt body gt  blablabla  lt script type  text javascript  gt  var changeme     lt button onClick   document bgColor      000000     gt click lt  button gt    document body innerHTML changeme   lt  script gt   lt  body gt      This way you can do javascript scripting inside the new content  Don t forget to escape all double and single quotes though  or it won t work  escaping in javascript can be done by traversing your code and putting a backslash in front of all singe and double quotes   Bare in mind that server side scripting like php doesn t work this way  Since PHP is server-side scripting it has to be processed before a page is loaded  Javascript is a language which works on client-side and thus can not activate the re-processing of php code

User · Answer

You could try doing   document getElementById id  innerHTML   ajax response

User · Answer

Here s how to do it in Prototype    id  update data   And jQuery      id   replaceWith data   But document getElementById id  innerHTML data should work too   EDIT  Prototype and jQuery automatically evaluate scripts for you

User · Answer

the simplest way is     body   html data

User · Answer

I m assuming you are using jQuery or something similar  If you are using jQuery  then the following should work    lt html gt   lt head gt      lt script src  jquery js  type  text javascript  gt  lt  script gt   lt  head gt   lt body gt     content  lt  body gt   lt script type  text javascript  gt        body   load url    lt  script gt   lt  html gt

User · Answer

You could try doing   document getElementById id  innerHTML   ajax response

User · Answer

I m assuming you are using jQuery or something similar  If you are using jQuery  then the following should work    lt html gt   lt head gt      lt script src  jquery js  type  text javascript  gt  lt  script gt   lt  head gt   lt body gt     content  lt  body gt   lt script type  text javascript  gt        body   load url    lt  script gt   lt  html gt

User · Answer

Here s how to do it in Prototype    id  update data   And jQuery      id   replaceWith data   But document getElementById id  innerHTML data should work too   EDIT  Prototype and jQuery automatically evaluate scripts for you

User · Answer

I m assuming you are using jQuery or something similar  If you are using jQuery  then the following should work    lt html gt   lt head gt      lt script src  jquery js  type  text javascript  gt  lt  script gt   lt  head gt   lt body gt     content  lt  body gt   lt script type  text javascript  gt        body   load url    lt  script gt   lt  html gt

User · Answer

the simplest way is     body   html data

User · Answer

try this with jQuery       body   load  url  data   callback       Read more at docs jquery com   Ajax   load

User · Answer

I m assuming you are using jQuery or something similar  If you are using jQuery  then the following should work    lt html gt   lt head gt      lt script src  jquery js  type  text javascript  gt  lt  script gt   lt  head gt   lt body gt     content  lt  body gt   lt script type  text javascript  gt        body   load url    lt  script gt   lt  html gt

User · Answer

Can t you just try to replace the body content with the document body handler   if your page is this    lt html gt   lt body gt  blablabla  lt script type  text javascript  gt  document body innerHTML  hi     lt  script gt   lt  body gt   lt  html gt    Just use the document body to replace the body   This works for me  All the content of the BODY tag is replaced by the innerHTML you specify  If you need to even change the html tag and all childs you should check out which tags of the  document   are capable of doing so   An example with javascript scripting inside it    lt html gt   lt body gt  blablabla  lt script type  text javascript  gt  var changeme     lt button onClick   document bgColor      000000     gt click lt  button gt    document body innerHTML changeme   lt  script gt   lt  body gt      This way you can do javascript scripting inside the new content  Don t forget to escape all double and single quotes though  or it won t work  escaping in javascript can be done by traversing your code and putting a backslash in front of all singe and double quotes   Bare in mind that server side scripting like php doesn t work this way  Since PHP is server-side scripting it has to be processed before a page is loaded  Javascript is a language which works on client-side and thus can not activate the re-processing of php code

[javascript] Replace HTML page with contents retrieved via AJAX

Examples related to javascript

Examples related to html

Examples related to ajax

Examples related to dom