DEV Community

Discussion on: Reuse navbar & footer using jquery error

View post
Collapse
 
myogeshchavan97 profile image
Yogesh Chavan • • Edited

You need to have separate header and footer tags in you html like this

<body>
    <header></header>
    <p>This is some main content</p>
    <footer></footer>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="script.js"></script>
 </body>

and then for example in script.js you can add the below code

$(function(){
 $('header').load('navbar.html');
 $('footer').load('footer.html');
});

which will give you the result which you're expecting

Collapse
 
johnskiepogi profile image
Johnskie-pogi •

Hi fella!

I already did your recomendation but the result is still the same, but i still try again your recommendation but the result is still the same.

Im still a newbie😔

I appreciate your recommendation😊

Collapse
 
myogeshchavan97 profile image
Yogesh Chavan •

I have created the code here. Check this out codesandbox.io/s/header-footer-jqu...

Thread Thread
 
johnskiepogi profile image
Johnskie-pogi •

Many many thank you brother.💕