Javascript import html ¿es posible?

Question

Tengo algunas páginas html con el mismo pie de página. Con javascript y solo javascript podría importar otra página html dentro de él?

Answer 1

Como arriba, un método es usar jQuery load. Yo estaba haciendo exactamente lo mismo ahora, así que publicaré un ejemplo rápido.

Usando jQuery:

$("#yourDiv").load('readHtmlFromHere.html #readMe'); 

y su página readHtmlFromHere.html consistiría en:

<div><div id="readMe"><p>I'm some text</p></div></div> 

Answer 2

Puede usar ajax para devolver una página HTML completa. Si quisiera reemplazar toda la página, podría reemplazar la etiqueta del cuerpo y todos sus elementos actualmente en la página con la etiqueta corporal devuelta por la llamada ajax.

Si quisiera simplemente reemplazar una sección, tendría que escribir una secuencia de comandos del lado del servidor para crear esa sección, luego use ajax como arriba pero simplemente reemplace un elemento en lugar de la página completa.

Answer 3

Puede incluir un lado del servidor, dependiendo de su servidor web. pero la forma más rápida probablemente sea crear un archivo JavaScript que use document.write o similar para generar la sintaxis html. y luego simplemente incluya el archivo JavaScipt creado de la manera normal. información más en: http://webdesign.about.com/od/ssi/a/aa052002a.htm

Answer 4

Junto con lo @Alex mencionó, jQuery tiene un método .load() que se puede usar para traer una parte específica de una página (Ver Fragmentos Carga de encabezamiento de página de esa página). Especifique la URL que desea recuperar junto con un selector (por lo tanto, si solo desea un contenido específico de <DIV>, por ejemplo).

Answer 5

que definitivamente se podría, pero si todo lo que estamos haciendo es de plantillas te recomiendo que hagas esto en el servidor.

Answer 6

Así es como podría usar solo javascript para agregar un pie de página a su página.

var ajax = new XMLHttpRequest(); 
ajax.open("GET", "footer.htm", false); 
ajax.send(); 
document.body.innerHTML += ajax.responseText;