loading on header and footer file

Question

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

I added the script part to load header file and footer file on everypage, but it is loading only on firefox. Why it is not loading in chrome?

Answer 1

Solution 1) It's the "same origin policy" as interpreted by Chrome (or a bug with the same effect). Try running Chrome with --allow-file-access-from-files.

Reference stackoverflow

Solution 2) The issue is just that .load() for local files is blocked by Chrome for security reasons. If you are using it on a server it works, given that all of the files originate from the same place.

To enable a working version locally, try:

In Mac OS X, quite Chrome, enter in Terminal:

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --allow-file-access-from-files

Referance : stackoverflow