Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 

  • How to load header and footer using Javascript

    @abhishek.tiwari.458
    Recommendations Offline Message

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 1.63k
    Comment on it

    Hello Reader's. If you have developed the header and footer of the website separatly then it's very easy to make them render on a webpage. By using the JS you can call them with a single line of code as written below:-

    1. <html>
    2. <head>
    3. <title></title>
    4. <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    5. <script> 
    6. $(function(){
    7.   $("#header").load("header.php"); //set the path to your header file
    8.   $("#footer").load("footer.php");  // set the path to your footer file
    9. });
    10. </script> 
    11. </head>
    12. <body>
    13. <div id="header"></div>
    14. <div id="footer"></div>
    15. </body>
    16. </html>

    You just have to call the jquery code and give paths to you header and footer files. Div with the 'header' will include the data of header and same as footer also.

    html JQuery Javascript
    Comment on it

 0 Comment(s)

Sign In
Forgot Password?
                           OR                           
Create an account !!
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Reset Password
Fill out the form below and reset your password: