Creating external .js - javascript

I'm trying to put a code snippet into an external .js. Works fine as is inside the page file but stops working if I pull out the script to an external file. I'm thinking it's a variable issue but I'm not entirely clear how to fix that. Little help. Thanks.
Here's the current working internal code:
<script src="scripts/jquery-1.12.4.min.js"></script>
<script src="scripts/jquery.flurry.js"></script>
<script>
$(document).ready(function(){
$("body").flurry({height:300,frequency:98,speed:4321,small:11,large:61,wind:40,windVariance:98,rotation:272,rotationVariance:98,
startOpacity:1,endOpacity:0,opacityEasing:"cubic-bezier(1,.3,.6,.74)",blur:true,overflow:"hidden",zIndex:9999});
$(".toggle-snow").on("click",function(event){
event.preventDefault();
try{
$("body").flurry("destroy");}
catch(err){
$("body").flurry();}
});
});
</script>
When I pull that third script into a fall.js file, the code stops working. Is there something that I need to add to the external script or the internal file?
--
Ah! Silly me. Needed to just remove the open / closing tag in the fall.js file.

Why do you have the "?>" and inside the fall.js remove the opening and closing tags.
Keep references to the other external files in the html
Before referring to fall.js

How are you trying to register the script?
<script src="scripts/jquery-1.12.4.min.js"></script>
<script src="scripts/jquery.flurry.js"></script>
<script src="fall.js"></script>
This should be enough to make the script work, as long as the fall.js file is served in the /fall.js route

Related

Why my script.js file doesn't work but the JavaScript code inside of the index.html file works?

When i add this:
<script src="script.js"></script>
<script src="jquery-3.5.1.min.js"></script>
to my index.html file in the head of the file, and i create a JavaScript file, it looks like the html doesn't recognize it.
But when i add this:
<script type="text/javascript">
//code
</script>
to my index.html file in the body of the file, all of the code i done in JavaScript works.
Can somebody explain why this happens?
It’s always a good practice to add jQuery code just before the closing </body> tag. If you have not done that, then use the defer attribute.
Also if you’re writing jQuery code make sure that your code is placed after the jQuery link code.
Don't add your JS files in the head. You are most likely going to be accessing DOM elements, and those elements are defined in the HTML. If you insert a script above the html, the elements won't be recognized because they're not defined yet. Add all of your scripts after the body, I add mine after the closing html just to be safe. And please add your script after your jQuery script.

Get content of a external script included on page

I have a script include on a page as following.
<script src="https://domain/demo.js" type="text/html" id="google_script"></script>
Once the demo.js is loaded, I need to grab the content of loaded demo.js without recalling it with ajax. Please share your thoughts if that's possible and how.
Sadly no.
With pure JavaScript you can't get content of other JavaScript file without executing it.
Possible solutions:
Use PHP
Save your JS file as text file and then load it to iframe and get the source
Get the source, but run the script
EDIT:
With JavaScript you can't get full script, but function like:
var funcsourcecode = functionname.toString();

Java script doesn't work on an external sheet but it works on the main html file. Why is that and how do I fix it?

Here is my first main html code
Main HTML file picture
and here is my second of my external file
$(document).ready(function() {
alert("hello");
});
I already tried putting the alert outside of the document ready function it still doesn't work.
I don't know why only the first one works please help. Also when I opened up my devtools and went to console it had a lot of but i can't put most of them because I don't have enough reputation to post more than one link. But here is one,
GET http://online-dnbard.rhcloud.com/tick/5620f410e59615263f000006 net::ERR_NAME_NOT_RESOLVED
ps. I am using brackets.
Note That you load up your external js file before jquery:
<script src="Javascript.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
When you load up your file, you reffer to "$(document).ready", which isn't defined yet, so your browser throws an error.
Just change the order:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="Javascript.js"></script>
ps. Using the console in the future will save you a lot of time ;)

Highchart plugin does not work

I am using a simple plugin from http://www.highcharts.com/demo/pie-basic which has a javascript file stored in view options. I am using this file in my index.html code as <script src="js/pie1.js"></script> inside <body> tag where pie1 is a javascript file stored in js folder. When i run my html page nothing happens.
can anyone help me where I am getting wrong? I am new to using plugins so please bear with me and correct me if anything is wrong.
Most likely you have this situation because javascript start running the plugin before your html is ready.
Place <script src="js/pie1.js"></script> just before closing tag </body>

Disabling single script within a webpage

By searching a bit, one could find this question about stopping chrome from loading a javascript file.
But this doesn't work for a script which is not linked, for example:
<!-- Some html here -->
<script id="script">
//Some script here
</script>
The script here is coded inside the html page and not linked from an external .js file. As you can see, I'm looking for a way to disable that and only that #script before it gets loaded.
Thanks in advance for your help.

Categories

Resources