html - ejemplo - iframe javascript
¿Cómo incluir una página HTML en otra página HTML sin frame/iframe? (14)
Quiero incluir una página HTML dentro de una página HTML. ¿Es posible?
No quiero hacerlo en PHP, sé que en PHP, podemos usar include para esta situación, ¿cómo puedo lograr lo mismo puramente en HTML sin usar el concepto de frame iframe y frame ?
La mejor solución de nginx: http://sysoev.ru/nginx/docs/http/ngx_http_ssi_module.html
Lo mejor que tengo: incluye en tu archivo js y para incluir vistas que puedes agregar de esta manera
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Bootstrap</title>
<!-- Your custom styles (optional) -->
<link href="css/style_different.css" rel="stylesheet">
</head>
<body>
<script src="https://www.w3schools.com/lib/w3data.js"></script>
<div class="">
<div w3-include-html="templates/header.html"></div>
<div w3-include-html="templates/dashboard.html"></div>
<div w3-include-html="templates/footer.html"></div>
</div>
</body>
<script type="text/javascript">
w3IncludeHTML();
</script>
</html>
Puede usar HTML5 para esto:
<link rel="import" href="/path/to/file.html">
Puedes decir que es con PHP, pero en realidad solo tiene un comando PHP, todos los demás archivos son solo * .html.
- Debería tener un archivo llamado .htaccess en el directorio / public_html de su servidor web, o en otro directorio, donde estará su archivo html y procesará un comando dentro de él.
- Si no lo tiene, (o podría estar oculto (debe consultar esta lista de directorios al buscar en el directorio los archivos ocultos)), puede crearlo con un bloc de notas y simplemente escribir una fila en él:
AddType application/x-httpd-php .html - Guarde este archivo con el nombre .htaccess y cárguelo en el directorio principal del servidor.
- En su archivo html donde quiera que aparezca un archivo "meniu.html" externo, agregue el comando te:
<?php include("meniu.html"); ?>.
¡Eso es todo!
Observación: todos los comandos como <? ...> <? ...> serán tratados como ejecutables php, por lo que si tu html tiene signos de interrogación, entonces podrías tener algunos problemas.
Puedes usar un elemento de objeto
<object type="text/html" data="urltofile.html"></object>
o, en su servidor local, AJAX puede devolver una cadena de HTML (responseText) que puede usar para documentar. escribir una nueva ventana, o editar las etiquetas de cabeza y cuerpo y agregar el resto a un div u otro elemento de bloque en el página actual.
Roadkill confirmado, cree un archivo .htaccess en la raíz web con una sola línea que le permita agregar un código php a un archivo .html.
Aplicación AddType / x-httpd-php .html
Si está dispuesto a usar jquery, hay un útil complemento jquery llamado "inc".
Lo uso a menudo para la creación de prototipos de sitios web, donde solo quiero presentar al cliente HTML estático sin capa de fondo que se pueda crear / editar / mejorar / re-presentar rápidamente
Por ejemplo, cosas como el menú y el pie de página deben mostrarse en cada página, pero no desea terminar con una función de copiar y pegar.
Puede incluir un fragmento de página de la siguiente manera
<p class="inc:footer.htm"></p>
Si está utilizando NGINX en Linux y quiere un bash / html puro, puede agregar una máscara en su plantilla y canalizar las solicitudes para usar el comando sed para hacer una sustitución utilizando una expresión regular.
De todos modos, prefiero tener un script bash que tome de una carpeta de plantillas y genere el HTML final.
Si se refiere al lado del cliente, entonces deberá usar JavaScript o marcos.
Una forma simple de comenzar, prueba jQuery
$("#links").load("/Main_Page #jq-p-Getting-Started li");
Más en jQuery Docs
Si desea usar IFrames, comience con Wikipedia en IFrames
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Example</title>
</head>
<body>
The material below comes from the website http://example.com/
<iframe src="http://example.com/" height="200">
Alternative text for browsers that do not understand IFrames.
</iframe>
</body>
</html>
Si solo intenta insertar su propio HTML desde otro archivo, y considera que Server Side Include es "HTML puro" (porque parece un comentario HTML y no usa algo "sucio" como PHP) )
<!--#include virtual="/footer.html" -->
También asegúrese de ver cómo se usa Angular includes (usando AngularJS ). Es bastante sencillo ...
<body ng-app="">
<div ng-include="''myFile.htm''"></div>
</body>
$.get("file.html", function(data){
$("#div").html(data);
});
<html>
<head>
<title>example</title>
<script>
$(function(){
$(''#filename'').load("htmlfile.html");
});
</script>
</head>
<body>
<div id="filename">
</div>
</body>
<iframe src="page.html"></iframe>
Deberá agregar un poco de estilo a este iframe. Puede especificar ancho, alto y si desea que se vea como una parte de la página original, incluya frameborder="0" .
No hay otra manera de hacerlo en HTML puro. Para esto fueron construidos, es como decir que quiero freír un huevo sin huevo.