I can't understand this for the life of me. I normally work with Python, but am trying to dabble a bit in web development with JQuery. I've used the CDN from google, and have done everything from putting the script below the footer (A site I found said that was the best spot), to moving it up into the header (every other site I've been to since says that is the best spot), and nothing works.
From the error in the inspection tools 'Loading failed for the with source “http://localhost:63342/HTML/Omnifood/resources/javascript/script.js”.' It suggests to me that it can't even find the .js file I created to hold my code, but it is there, defined. (See screenshots attached)
Any help getting this sorted out would be appreciated.
Screenshot of HTML and file structure, as well as error in inspection tool:
Edit: The issue has been resolved in so far as the folder has been moved to the correct location (/resources/javascript/script.js), I even went in and added type="text/javascript" to all the script files just in case. Now when attempting to run script with following JQuery code:
$(document).ready(function() {
$('h1').click(function() {
$(this).css('background-color', '#ff0000')
})
});
I get the following errors in inspection tool:
The path is wrong http://localhost:63342/HTML/Omnifood/resources/javascript/script.js
your script.js is at
http://localhost:63342/HTML/Omnifood/vendors/javascript/script.js
Related
I created a pokedex project with html css and javascript,when I try to open it with VSCODE it works fine,but when I try to open the html local file the broswer doesn't find 2 local files, it keeps saying that:
file:///C:/assets/js/poke-api.js net::ERR_FILE_NOT_FOUND
GET file:///C:/assets/js/main.js net::ERR_FILE_NOT_FOUND
the problem is that the files are working when I try to open in VSCODE.
https://github.com/joaogabriel1902/Pokedex-Challenge - in case someone likes to see the code.
I tried to uninstall some of the extensions that I have to see if would work.But nothing happened it keeps not finding the files.
I think the clue is in the error message
GET file:///C:/assets/js/poke-api.js net::ERR_FILE_NOT_FOUND
GET file:///C:/assets/js/main.js net::ERR_FILE_NOT_FOUND
You should not want your browser to be looking at C:/assets, unless you actually want to use the root folder of your hard disk, as your project folder (since "assets" is in the project folder itself).
Something has gone wrong in how you are telling the browser how to start the project. I suggest trying these steps.
Use Google Chrome
Drag the ".html" file from your explorer window, into the Google Chrome window.
That should trigger Chrome to open the HTML file in the right way.
How to access files in subfolders
Two ways seem to work for me:
<script src="./assets/js/main.js"></script>
or
<script src="assets/js/main.js"></script>
When I try a third way, however, I get an error message just like yours:
<script src="/assets/js/main.js"></script>
Attempt to fix
Your code does seem to be using one method that works on my system, so I am surprised that you are getting an error. However why don't you try the other method that works on my system, and see what happens?
Remove the ./ when accessing the Javascript files, by changing
<script src="./assets/js/main.js"></script>
to this
<script src="assets/js/main.js"></script>
Please let me know how you get on, because I am curious too.
Following way of code:
<script src="../assets/js/main.js"></script>
In an HTML script, a call to fetch a package ending in vega#n where n is a version number, is being incorrectly expanded and causing a 404 error. I'm trying to find out why, and to prevent this.
Apologies in advance for the long-winded explanation, but I'm not sure where the problem lies so I'm trying to be as specific as possible.
I'm following the user guide to try and load a vis into a jupyter notebook. This executes the script in-browser, I believe, but for some reason has support for requireJS, which means that global modules aren't correctly loaded when using the import method, which basically uses html's <script> tags to load the module.
This can be worked around by calling define, as described in a similar problem with D3, here: https://github.com/mpld3/mpld3/issues/33#issuecomment-32101013.
I've written this gist to show a working example:
https://gist.github.com/lJoublanc/439e2f687b7aedd6fbdea5adab5cee0f
However, for some reason (either requireJS or something else - my JS knowledge is limited), expands URLs of the form https://cdn.jsdelivr.net/npm/vega#3 into something like https://cdn.jsdelivr.net/npm/vega#3.js?v=20180324103700 which results in a 404 error.
Using the github URL (i.e. without the #3) works fine though.
Any idea if this is requireJS doing this, or the CDN? How would I work around it?
i want to put a soundcloud music player (http://stratus.sc/) on my drupalgardens page. i added an external source javascript library and uploaded a js file on the system as it says on the pluging website. all this tru the administration website of drupalgardens. When i check the sourcecode of my webpage it appears like the pluging is on the header. But it doesnt work, i cant see it. i activated all the jquery functions.
bit of sourcecode on header where the pluging seems there:
<script type="text/javascript" src="http://stratus.sc/stratus.js"></script>
<script type="text/javascript" src="http://NAMEOFMYSITE/sites/NAMEOFMYSITE/files/js/js_PRNQJr2GPf-FrbaSuV5IDQ1l6Lfby6e79KpPOUTf5kI.js"></script>
link:
http://bit.ly/10nyAHV
Any suggestions?
Note : The player im talking about is NOT the one that can be seen under the rotating banner. the one im talking about its supposed to be globally on the webpage at its seem on the pluging oficcial webpage
For one you're getting this console error: "Uncaught SyntaxError: Unexpected token < "
Not sure how that script is getting added but just removing the script tags may clear it up.
Even if the frame errors mentioned by KG are unrelated, you have to go clean that all up.
Your script should also be loaded after jquery. Since it looks like you have js aggregation turned on, I don't really know how to determine if drupal is loading things correctly. You can just tell your script to load in the footer instead of header if you're unsure. The links below explain how to do that.
Here are some javascript related resources for Drupal. They sometimes expect things to be handled differently.
The plugin is dependent on jQuery. By default, Drupal 7 loads jQuery 1.4. You may need to use the jQuery Update plugin to use 1.5, 1.7 or 1.8
Drupal Community docs about javascript:
http://drupal.org/node/756722
Drupal javascript API:
http://drupal.org/node/751744
I had a similar issue. Some reasons for a not working player are:
For some reason $ is not known (although jQuery is included). I replaced '$' by 'jQuery' and everything worked fine. That means use jquery(document).ready(... instead of $(document).ready(... and jQuery.stratus({.. instead of $.stratus({...
There is a typo on the stratos.sc web site. It should read $.stratus not $stratus (or jQuery.stratus, see previous hint).
Check that the source stratus.js and the initialisation code is included.
Mixture of https and http might be a good guess as reason for problems, but actually it works (I just tried it). If you can't find the problem, try to use a JavaScript debugger and check the error logs first!
I am trying to make my own tree in D3.js, but I am having trouble figuring out how to make one. I have looked at the following links:
http://bl.ocks.org/1249394#interactive_tree.css
d3js Tree square
and even tried copying them to get something working so that I can tinker, but it won't work for me. I have riddled the code with alerts and in both the pedigree and the collapsible tree the code stops working right after the d3.json call. I copied the json files too and renamed them so that they were the same. In the pedigree example
d3.json("info.json", function(json) {
alert(json);
var nodes = tree.nodes(json);
alert('hi');
So here the first alert works and the second doesn't, and this happens in both examples. If anybody knows why, an explanation or fix would be greatly appreciated. Thanks!!!
I figured out that when d3.json("localhost...", callback) is called it is returning null. I read on another post that there are cross domain restrictions. I am not really sure what that means or how to fix it
I have tried it both locally from the same directory as I am running my application from and I have tried it from my Xamp server. And still when the alert(json) is called it shows null.
The d3 documentation has some more information on this. Basically, your browser will not load a JSON file from the local filesystem or a server that the original page is not on. There are ways around this, for example Google Chrome can be started with --disable-web-security to disable those restrictions, but this is not recommended.
All modern browsers have a Javascript error console that will show you the exact reason for the JSON file not loading. Remember that when you serve the page through a local web server, you shouldn't specify localhost:// or similar in the path of the JSON file, just the path relative to the directory that the HTML file resides in.
I copied the generated source code (View Source -> View Generated Source in the Firefox Web Developer Toolbar) of Google's Keyword Tool page to a new HTML file.
But, when I open this new file, some of the items looks stretched for some reason:
The original website looks like this:
I guess that Google create some elements and set various attributes using Javascript, but I copied the page after it has been generated. So, why is this difference?
UPDATE 1
The only JS/CSS file, which is not given as a full path, is:
<script language="javascript" src="/cues/cues.js">
I tried replace this with:
<script language="javascript">
Contents of '/cues/cues.js' here
</script>
but it didn't help.
UPDATE 2
In the browser's error console I found the following 2 errors:
Error: com_google_ads_apps_servers_cues_CuesRelease is not defined
Source File: https://adwords.google.com/cues/768DAEDDB2193AB5B05B9C6A01394D78.cache.js
Line: 1
Error: com_google_ads_apps_targetingideas_client_TargetingIdeas is not defined
Source File: https://adwords.google.com/o/Targeting/756D6AF3BB4DD4A68315E34F50C2BC7E.cache.js
Line: 1
Any ideas why these errors appear?
UPDATE 3
Apparently, the reason is that the DOCTYPE declaration is missing. After I added <!DOCTYPE html> to the stretched version, it solved the problem. Can anyone explain why?
When you save a page, you only get the version of HTML served from the server in its original form. Any mods to the DOM made after load using JS will not be part of the save.
EDIT
I could not trace out the exact reason for the error as the code is really cryptic! In any case, if all you want is to be able to reproduce the exact page offline, then you can do a 'save page as..' from your browser (choose web page, complete). I tried this with FF as well as Chrome and it is working fine in both cases. While opening the saved page, it might be best not to use IE as its a certified choker when it comes to even the slightest error in code. :)
The most likely reason for the error is an cross-domain AJAX security exception (fired when the calling client side script and called server side script are from different domains). The 2 variables namely, com_google_ads_apps_servers_cues_CuesRelease and com_google_ads_apps_targetingideas_client_TargetingIdeas seems to be initialized using the return of some AJAX call (which couldn't execute bcoz of the secu excep), and as a result remain as undefined.
You must be missing some css and js which is not on the page but referred from somewhere else.
The most probable reason is that the CSS and the corresponding images that might be referred within it are not getting applied correctly.
Check the paths of the CSS and for the images (background) within the CSS...You might need to correct the paths to fix the issue.