javascript - Unable to link js file to html to load local files -
what i'm trying do
load html file content block on page .load function in linked .js file using local server.
what i'm using
html
css
javascript/jquery
wamp
chrome
windows 10
the problem
i can inside page, can't working when using linked files (as matter of fact, can't any javascript work when use linked files), , i'd rather able maintain separate .js file.
what i've done
- checked spelling
- checked file paths
- read similar questions , comments (didn't help)
- restarted computer (why not?)
- before using wamp, tried starting chrome local file access allowed. worked several minutes... until didn't anymore.
notes
- i'm new javascript , jquery.
- the linked .css files have never given me trouble.
- yes, nav.html in same directory index.html.
- yes, js folder in same directory index.html, , design.js indeed inside folder.
- wamp icon green , able set virtualhost succesfully.
code doesn't work me
index.html
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script> <script src="js/design.js"></script> </head> <body> <header> </header> <nav> </nav> <article> <section> </section> </article> <footer> </footer> </body> </html>
design.js
$(document).ready(function() { loadnav(); }); function loadnav(){ $('nav').load('nav.html'); }
or
design.js
$(document).ready(function() { $('nav').load('nav.html'); });
code works me
index.html
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script> <script> $(document).ready(function(){ $('nav').load('nav.html'); }); </script> </head> <body> <header> </header> <nav> </nav> <article> <section> </section> </article> <footer> </footer> </body> </html>
or
index.html
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script> </head> <body> <header> </header> <nav> </nav> <article> <section> </section> </article> <footer> </footer> <script> $('nav').load('nav.html'); </script> </body> </html>
if open console you'll see
xmlhttprequest cannot load file:///.../nav.html. cross origin requests supported protocol schemes: http, data, chrome, chrome-extension, https.
it's browser politics. works in firefox, not in chrome. if want work may run web server on local machine serve files.
more information:
xmlhttprequest cannot load file. cross origin requests supported http
"cross origin requests supported http." error when loading local file
Comments
Post a Comment