Prashant Mishra
Prashant Mishra

Reputation: 23

How to include style, js, meta etc elements into <head> section from a single file using jQuery?

I use single file each for header and footer that I include in all the pages by using:

<script>
   $(function(){
     $("#header").load("header.html");
     $("#footer").load("footer.html");
}
</script>

and adding this in the <body> section:

<body>    
<div id="header"></div>
<div id="footer"></div>
</body>

I want to keep the following in a single separate file and include in all pages' <head> section.

<script type="text/javascript" src="signupjs/jquery.reveal.js"></script>
<link rel="stylesheet" href="signupjs/reveal.css">
<!-- some more elements -->

I tried applying the known method, ie, .load() and <div id=""></div> in <head> section but as obvious, it didn't work. The contents got loaded in the <body> section.

Is there a technique to achieve this?

Upvotes: 2

Views: 1688

Answers (2)

Yerko Palma
Yerko Palma

Reputation: 12329

As said on this question, you can add your css like this

$('head').append( $('<link rel="stylesheet" type="text/css" />').attr('href', 'your stylesheet url') );

You can do the same for javascript, but you also have a few other options. You can use $.getScript of jQuery, or you can use requirejs. I recommend require.js, with that librarie you can do

var librari = require("js/librarie.js");

Upvotes: 0

I&#39;m Geeker
I&#39;m Geeker

Reputation: 4637

Html

<head>

// we can append here

</head>

Jquery

$('head').append('<link rel="stylesheet" type="text/css" href="signupjs/reveal.css">');

$('head').append('<script type="text/javascript" src="signupjs/jquery.reveal.js"></script>');

Upvotes: 2

Related Questions