Contact Us
  
 
 
    SearchSearch   RegisterRegister   Log inLog in 

how to include other html file in html page

how to include other html file in html page

 
Post new topic   Reply to topic     Forum Index -> HTML, CSS
View previous topic :: View next topic  
Author Message
juniormember



Joined: 28 Jun 2008
Posts: 154

PostPosted: Mon Oct 06, 2008 5:30 pm    Post subject: how to include other html file in html page Reply with quote

Hi,
Can anybody tell me how to include static content of other html page into html page. for example

I have a html page main.html

<html>
<title>test</title>
<body>

<!-- include the content of content.html -->

</body>
</html>

i want to include the content of content file in main.html

I know include can be used in php language jsp language as well other common language.

But how can in html?
Back to top
View user's profile Send private message
calwell



Joined: 08 Dec 2008
Posts: 4

PostPosted: Fri Dec 12, 2008 4:11 pm    Post subject: Reply with quote

Including HTML page in HTML !!
HTML is client side language and you can not include HTML in HTML by in built function.

Include HTML file have to need server side script. HTML can not include itself HTML or any file.

Yeah JavaScript can include js file through

<script src="include.js"></script>

But still we can include HTML page with HTML with AJAX or jQuery or any Javascript API

Ajax can load dynamic or static content in HTML file.

Main.html
include.html

can include through Ajax and jQuery

main.html
Code:
<html>
<head>
<title>Main</title>
<script>
function loadContent()
{
   xmlHttp=GetXmlHttpObject()
   if (xmlHttp==null)
   {
       return;
   }
      var url="include.html"
      
      xmlHttp.onreadystatechange=stateChanged;
      xmlHttp.open("GET",url,true)
      xmlHttp.send(null)
      
    return   
}

function stateChanged()
{
   if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
   {
     document.getElementById("includedContent").innerHTML=xmlHttp.responseText
   }
}
function GetXmlHttpObject()
      {
      var objXMLHttp=null
      if (window.XMLHttpRequest)
         {
         objXMLHttp=new XMLHttpRequest()
         }
      else if (window.ActiveXObject)
         {
         objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
         }
      return objXMLHttp
}

</script>
</head>

<body>
<div id="includedContent"></div>
<script>loadContent()</script>
</body>
</html>



in same folder
include.html

Code:
<table width="100%" border="1">
  <tr>
    <td bgcolor="#99CCFF">&nbsp;</td>
  </tr>
  <tr>
    <td bgcolor="#CC6633">&nbsp;</td>
  </tr>
  <tr>
    <td bgcolor="#669933">&nbsp;</td>
  </tr>
</table>
Back to top
View user's profile Send private message
calwell



Joined: 08 Dec 2008
Posts: 4

PostPosted: Fri Dec 12, 2008 4:28 pm    Post subject: Reply with quote

Include HTML file through jQuery is another easy option

jQuery can have to be included and download from http://jquery.com/

main.html

Code:
<html>
<head>
<title>Main</title>
<script src="jquery.js"></script>
<script>
function loadContent()
{
   $("#includedContent").load("include.html");
}

</script>
</head>

<body>
<div id="includedContent"></div>
<script>loadContent()</script>
</body>
</html>


include.html

Code:
<table width="100%" border="1">
  <tr>
    <td bgcolor="#99CCFF">&nbsp;</td>
  </tr>
  <tr>
    <td bgcolor="#CC6633">&nbsp;</td>
  </tr>
  <tr>
    <td bgcolor="#669933">&nbsp;</td>
  </tr>
</table>


This will help to include HTML page in HTML

But no direct way to include HTML page by HTML itself
Back to top
View user's profile Send private message
Display posts from previous:   
Post new topic   Reply to topic     Forum Index -> HTML, CSS All times are GMT
Page 1 of 1

 
Jump to:  
  Quick Post a Reply Topic
     
  Name (required)  
     
  Email Address (will not be published) (required)  
     
  Subject of topic (required)  
     
   
     
   
     
  Advertisement  
     
 
     


  More Links  
 
JSP Introduction
JSP Setup
Simple JSP Example
JSP Variable
Array Declaration in JSP
JSP Forms and User Input
Form Validation
JSP Cookies
JSP Session Object
Loop, content collection, iterator, conditional check in JSP
JSP Application Object
JSP Include
JSP Response Object
JSP Request Object
JSP Error Handling
JSP File Handling Object
JSP Action Tag
JSP Implicit Objects
JSP Declaration
JSP Directive
JDBC Introduction
JDBC Driver
JDBC Connection
JDBC Prepared/Statement
JDBC ResultSet
JDBC Close Connection object
JDBC Insert
JDBC Display Records
JDBC Update
JDBC Delete
JDBC Sorting
JDBC Query
JDBC Exception
JDBC Add Batch
JDBC Transaction/RollBack