Loading a header footer seperatly from another file using jquery Load

Question

I'm trying to add a header, footer and all the script files. Firstly i want to load all the script files which is in another file right next to the tag, How to do this using jquery.

Similar for the header and footer also i want to load separately from a different file.

Thanks

$(document).ready(function(){
    $("head title").load("../scriptincludes.html");
});

Here i'm trying to load a buch of scripts and css after the title tag, but what is happening is this is inserting within the title tag.

Did my answer help? If yes please check it so this topic can be considered closed, if not please provide some feedback or an answer of your own. — Alkis Kalogeris
– Alkis Kalogeris, Commented Jul 19, 2015 at 0:01

Alkis Kalogeris · Accepted Answer · 2013-04-30 06:40:06Z

1

You are getting your result in your title tag because of your selector

$("head title")

You will have to put a proper target selector to achieve what you want. Let's assume the footer example. Place a div with an id #footer that is empty in your html file (the result file). On document ready you can call

$("#footer").load("../scriptincludes.html");

This is the same for the header too. For your script and link tags (js, css).

$("head").load("../scriptincludes.html");

If you have all your dependencies in one file then see this. In your load method you can put your file, but you can put a selector too like this

$('#footer').load('../scriptincludes.html #target');

answered Apr 30, 2013 at 6:40

Alkis Kalogeris

17.9k15 gold badges62 silver badges118 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

PCA Over a year ago

Thanks for the answer. Regarding your second example $("head").load("../scriptincludes.html"), what this is doing is replacing the title tag which is already in the main file. So what i was thinking is to place the dependices right next to the <title>my text</title>

Alkis Kalogeris Over a year ago

Having "head title" as your selector then the dependencies will be put inside the title tag. This places it as a child of head thus a sibling to title.

Collectives™ on Stack Overflow

Loading a header footer seperatly from another file using jquery Load

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related