Is it more efficient to use jQuery or Javascript to load html content such as a side menu to a static html page?

Starting off 1st, I do know that jQuery is a Javascript library. I also cannot use, PHP or server side includes to make this easier.

So, what would be the preferred method? I would like to use a couple of menus that will be on all of my web pages, both side & top.

I know I can convert the html content to a series of document.write lines of code give it a function, load the script, & call the function where that menu would appear in the web page.

Javascript file: menu.js
function writeEAsideNav(){
document.write("        <li><a href='1.html'>Link1</a></li>");
document.write("        <li><a href='2.html'>Link2</a></li>");
document.write("        <li><a href='3.html'>Link3</a></li>");
}

Open in new window

<div id="content">      
<script>writeEAsideNav();</script>
</div>

Open in new window


I've just learned that I could use jQuery, which I'm using anyway for a banner slider; to do the same thing, but I could just create an html file for the menu and within a Jquery function use this method

$(function(){
  $("#content").load("/testmenu.html");   
});

Open in new window


testmenu.html
        <li><a href="1.html">Link1</a></li>
        <li><a href="2.html">Link2</a></li>
        <li><a href="3.html">Link3</a></li>

Open in new window


Then on the main web page
<div id="content"></div>

Open in new window


I hope I'm asking my question clearly. Just looking to find out what the best way to do this is.
Again, PHP is not an option as well as server-side includes.

I appreciate any help with this.
Thank you
Tony
function writeEAsideNav(){
document.write("        <li><a href='1.html'>Link1</a></li>");
document.write("        <li><a href='2.html'>Link2</a></li>");
document.write("        <li><a href='3.html'>Link3</a></li>");
document.write("    </ul>");
}

Open in new window

mackulaAsked:
Who is Participating?
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.

gr8gonzoConsultantCommented:
You can use jQuery, sure. You just have to recognize that it'll be a little slower than just having the content already there. jQuery will only run once the jQuery library has been loaded, and (typically) the rest of the document has finished loading.

The performance difference between the options you showed are going to be minimal for almost everyone except someone on a REALLY REALLY old computer. They might see a small bit of difference, but those people probably won't even be running new enough versions of their browsers to make the whole thing work anyway.

I would suggest using the load() approach for simplicity.

Also, just out of curiosity, why is PHP (I'm assuming ANY dynamic scripting language here) nor SSI an option? That's very unusual to have no dynamic options at all ...
0

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
mackulaAuthor Commented:
gr8gonzo,

Thank you so much for the speedy response :)

One of the menus that will load is a pretty big megamenu. I'm wondering if that would be an issue.
Also, I think I read that some versions of IE might have an issue with the "load" function. I may have misread that

Another item is that I cannot use /testmenu.html to call that file within subdirectories due to the server it resides on. There are issues with the domain. I would need to use an absolute reference ie "http://www.example.com/testmenu.html" And within that would be absolute references to those links.

I'm wondering if that would be a problem using jQuery.

I know this isn't an optimal position to be in...
0
gr8gonzoConsultantCommented:
I don't quite understand the problem. My understanding of your follow-up is:

If you have a webpage that sits in a subdirectory, e.g. http://www.example.com/foobar/page.html, then you cannot use page.html to load /testmenu.html for some reason related to the server.

Can I ask what kind of server / situation you are on ? It is strange enough that the server does not have the capability of running any sort of dynamic scripting, but Javascript is all client-side, so for it not to be able to access a file when it's in a different folder is pretty strange...
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

gr8gonzoConsultantCommented:
I'll be honest - I see questions all day long from people ranging in experience, and nobody comes right out and says, "I am experienced and have tested all of the potential avenues already or I am completely new and don't really understand that there may be other avenues to explore." So that said, are you 110% certain that your server doesn't support any kind of dynamic scripting? And can you explain why a subfolder would cause an issue with a jQuery load?
0
mackulaAuthor Commented:
My apologies... I lost my train of thought about the subdirectory / folder part & rambled. I'll skip that.

As for 110% being certain on using PHP, I'm 150% certain. I had already asked the server admins several times if they could enable PHP on the server. I was told no.  I asked for a reason & was told that it is just not allowed.

A newer site that I created, I was able to use SSI's for the menus. But I have an existing site that's around 7 years old & 1000 pages that I have to edit. I cannot change the extensions from .html to .shtml so that I could use SSI's.

This is where we host our "public" web site. On our Intranet we have PHP enabled, so I have no issues with that.

I thank you for your response. It was extremely helpful & explained so that I understood.
0
gr8gonzoConsultantCommented:
How strange. Is there any other dynamic scripting on the server? There are several types of scripting languages aside from just PHP and SSI.

Also, if SSI is enabled but only on .shtml pages, then you can always try to tell Apache to use SSI on the .html extension, too. It should be just a matter of adding this line of configuration to either to .htaccess (if you can use .htaccess files), or to the main Apache config:

AddHandler server-parsed .html
0
mackulaAuthor Commented:
It's frustrating. Right now I'm limited to HTML. It sucks.
Like I said, on my Intranet, I'm free to use PHP which makes my life easier.

I will ask them about allowing SSI's within .html files. I did not think about that.

I appreciate that suggestion. Thank You!!!
0
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
jQuery

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.