dúvida incluir uma página html dentro de outra sem iframe

25/11/2016

0

HTML JavaScript

bom dia, como faço pra incluir uma página html dentro de outra sem usar iframe?
Carlos

Carlos

Responder

Post mais votado

25/11/2016

Olá Carlos,

usando Jquery usando a função load vc pode ler um arquivo html e carregar em um elemento da sua página principal, segue exemplo:

arquivo da página principal: Ex: ler-html-sem-iframe.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>Ler página html sem Iframe</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"
			integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
			crossorigin="anonymous"></script>
</head>
<body>
   
   <h1>Ler página <button type="button" id="ler-pagina">Ler página</button> </h1>
   <div id="conteudo-pagina-lida"></div>
   
   <script>
   $(document).ready(function(){
		$("#ler-pagina").click(function(){
			
			$(function(){
				$("#conteudo-pagina-lida").load("pagina-lida.html"); 
			});
		})
   });
   </script>
   
</body>
</html>


Arquivo da outra página a ser lida: Ex : pagina-lida.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>página lida</title>
</head>
<body>
   
  <h2>Html Lido de outra página</h2>
   
</body>
</html>


OBS: execute esses testes rodando em um servidorzinho http local mesmo, se não , não vai funcionar por causa da segurança do ajax, Access Origin, Cors

Kleber Araujo

Kleber Araujo
Responder
Gostei + 1

Mais Posts

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar