Include content from one HTML page in a div on another

Im looking for a relatively easy way to Include content from one HTML page into a div on another. Specifically, I'm hoping to designate a character count or line count to include on div.

I greatly appreciate any help.

Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

That's not a CSS or HTML thing, you need javascript or PHP or something similar to do that, unless you use an iframe and only display what you want in the iframe.

Both javascript and PHP offer the include function.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
TinTodAuthor Commented:
Okay. I thought that might be the case. I prefer to stay away from iframes. Is there a php or JavaScript solution that someone could point me to? I'm afraid I'm not saavy enough to write something like that from scratch. I am already utilizing jquery  on the site.
Are you hosted on a server that has PHP enabled?
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

TinTodAuthor Commented:
Then you're stuck with javascript includes.  There are several ways to do it, just google javascript includes.

Or create a file called includes.js

Inside add this at the top:

var head = new Array();

Replace head with whatever you want that section named.

Then for your "head" area insert this:

head[0] = '[this is where you put your code or text including html]';

Increment the number in the square brackets for each line, here's an example:

head[0]            = '<html xmlns=""><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />';
head[1]            = '<link href="css/Demo.css" rel="stylesheet" type="text/css" />';
head[2]            = '<link href="css/Dem_2Graphs.css" rel="alternate stylesheet" title="Graphs2Across" type="text/css" />';
head[3]            = '<link href="css/Demo_3Graphs.css" rel="alternate stylesheet" title="Graphs3Across" type="text/css" />';
head[4]            = '<link href="css/dropline_nav.css" rel="stylesheet" type="text/css" />';
head[5]            = '<!--[if IE 6]> <link href="css/Demo_IE6.css" rel="stylesheet" type="text/css"> <![endif]-->';
head[6]            = '<!--[if IE 7]> <link href="css/Demo_IE7.css" rel="stylesheet" type="text/css"> <![endif]-->';
head[7]            = '<!--[if IE 8]> <link href="css/Demo_IE8.css" rel="stylesheet" type="text/css"> <![endif]-->';
head[8]            = '<script type="text/javascript" src="Scripts/AC_RunActiveContent.js"></script>';
head[9]            = '<script type="text/javascript" src="Scripts/script.js"></script>';
head[10]      = '<script type="text/javascript" src="Scripts/styleswitcher.js"></script>';
head[11]      = '<script type="text/javascript" src="Scripts/browser_detect.js"></script>';
head[12]      = '<script type="text/javascript" src="Scripts/popup.js"></script>';
head[13]      = '<script type="text/javascript" src="Scripts/tabs_optimized.js"></script>';
head[14]      = '</head>';
head[15]      = '<body>';
head[16]      = '<table align="center" cellpadding="0" cellspacing="0" border="0" width="974" style="margin: 0px auto;"><tr><td width="309"><!-- Required to center in all browsers. -->';
head[17]      = '<div id="left_shadow"><div id="right_shadow">';
head[18]      = '<div id="container">';

Then add a var line and a chunk of text like the above to create your entire document.  This way you only need one includes.js file and you can fill it with as much content as you want.  For example:

var head      = new Array();  // This includes everything in the Head tags.
var header      = new Array();  // This includes the header information.
var content_start      = new Array(); // This is the start of the content area.
var navigation      = new Array();  // This is for the navigation.

Then at the very bottom of the includes.js add this:

function show(i)
  for (x in i)

Then in each file you'll use the text in the include.js file include the .js script:

<script type="text/javascript" src="includes.js"></script>

Then use script to include the sections:

<script type="text/javascript">show(head);</script>

Does that make sense?

TinTodAuthor Commented:
It does. Thanks so much. I really appreciate your time.

Take care.
You're welcome.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.