This question already has answers here:
Dynamically load JS inside JS [duplicate]
(12 answers)
Closed 4 years ago.
I have a script tag with an src, how can I reload the src with java script code, this is the code I have:
<script src='./script.php'>
<script>
function reload() {
//the code to reload the src
}
</script>
Snippet:
<script>
function reload() {
var head= document.getElementsByTagName('head')[0];
var script= document.createElement('script');
script.src= './script.php';
head.appendChild(script);
}
reload();
</script>
Related
If I include this script tag in the header or the body of an HTML document, then the external script it points to will be executed:
<script type="text/javascript" src="http://www.example.com/script.js"></script>
If I add that same script tag to the page AFTER it has finished loading, either by using another script in the page or by running a javascript: URI, the external script will not load.
This is an HTML document that tries to do what I'm talking about:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function f () {
var s;
s = document.createElement("script");
s.setAttribute("type", "text/javascript");
s.setAttribute("src", "https://code.jquery.com/jquery-3.4.1.min.js");
document.body.appendChild(s);
alert(typeof $);
}
</script>
</head>
<body onload="f();">
</body>
</html>
If you open this document in a web browser, the JavaScript pop-up dialogue will say "undefined" instead of "object". If it said "object", then that would mean that the jQuery code had been loaded.
Another case would be a bookmarklet that requires JavaScript code that is not used by the page it is run on. For example, if a bookmarklet needs jQuery and the page that it is run on does not use jQuery, it might do this:
s = document.createElement("script");
s.setAttribute("type", "text/javascript");
s.setAttribute("src", "https://code.jquery.com/jquery-3.4.1.min.js");
document.body.appendChild(s);
The above code does not result in jQuery being loaded.
What can I do to load a script after an HTML page has loaded? I do not want to use any JavaScript libraries because that would require the library code to have already been loaded by the page.
Appending scripts with javascript loads them asynchronously. Add an onload handler to execute what code you want
<script type="text/javascript">
function f () {
var s;
s = document.createElement("script");
s.setAttribute("type", "text/javascript");
s.setAttribute("src", "https://code.jquery.com/jquery-3.4.1.min.js");
document.body.appendChild(s);
s.onload=function(){alert(typeof $)};
}
</script>
What can I do to load a script after an HTML page has loaded?
Put
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js">
after the closing of the body. An html page is rendered from top to bottom so only when the body has been loaded the browser will download the script (if not already in cache). In this way you can put another script after this to console log typedef if your really need it
This question already has answers here:
Conditionally load JavaScript file
(8 answers)
Closed 4 years ago.
I have specific javascript code
<script type="text/javascript" async="true" data-ad-type="iframe v2.0" charset="utf-8" src="//mydomaincom.com/generic/uni.php?g=5"></script>
that work on all pages, but on /ucp.php?mode=register I dont want to execute the code. How to do this?
I made this code but not working (two script inside?)
<script>
if ( window.location.pathname == '/ucp.php?mode=register'{
} else {
<script type="text/javascript" async="true" data-ad-type="iframe v2.0" charset="utf-8" src="//sk.search.etargetnet.com/generic/uni.php?g=5"></script>
}
</script>
The answer should be with PHP too, if with PHP i can make it.
Try this.
if ( window.location.pathname != '/ucp.php'){
var fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript")
fileref.setAttribute("src","//sk.search.etargetnet.com/generic/uni.php?g=5")
fileref.setAttribute("async","true")
fileref.setAttribute("data-ad-type","iframe v2.0")
fileref.setAttribute("charset","utf-8")
}
This question already has answers here:
JavaScript Code Inside <script> Tag
(3 answers)
Closed 8 years ago.
I'm messing around with objects and methods, and I have this really simple example that I use to test with:
var shout = {
hello: function(variable){
console.log("Hello " + variable);
}
};
shout.hello("World");
And this works fine. However, if I place the object shout in an external file, and then run shout.hello("world"); I get nothing:
//external file: test.js
var shout = {
hello: function(variable){
console.log("Hello " + variable);
}
};
<!-- my html document -->
<script src="test.js">
shout.hello("World");
</script>
What am I doing wrong?
From MDN:
script elements with an src attribute specified should not have a script embedded within its tags.
You need two separate script tags, one to import your external script, and another to call the function, for example:
<script src="test.js"></script>
<script>
shout.hello("World");
</script>
You need two separate script tags, the content of a tag with src attribute is ignored.
<script src="test.js"></script>
<script>
shout.hello("World");
</script>
This question already has answers here:
JQuery to load Javascript file dynamically
(2 answers)
Dynamically load a JavaScript file
(30 answers)
Closed 8 years ago.
Inside one of my views, I'd like to load this script:
<script type="text/javascript" src="https://domain.com" id="hello" name="abc"></script>
Is it possible to do that?
Manually appending it:
$('head').append('<script type="text/javascript" src="https://domain.com" id="hello" name="abc"></script>')
Using $.getScript:
$.getScript('https://domain.com').done(function () {
// loaded!
});
RequireJS:
require.config({
paths: {
"myscript": "https://domain.com"
}
});
require(['myscript'], function () {
// loaded!
});
This question already has answers here:
Can we call the function written in one JavaScript in another JS file?
(10 answers)
Closed 8 years ago.
I have a function in my separate js file called hello().
On my page I have this js:
<script type='text/javascript'>//do hello fnc</script>
How can I get the on page script to call the function in my main js file?
Call it in the src attribute of another script tag, before referring to any of its functions in this script.
<script type='text/javascript' src='main.js'></script>
<script type='text/javascript'>
hello();
// Anything defined in previously included js files like main.js
// is now available, as well as anything defined on this page.
</script>
Load the external file first and call the function:
<script src=external.js></script>
<script>
hello();
</script>
You just need to include the external js file:
<script type="text/javascript" src="MyOtherFile.js"></script>
And then wherever in you code you want to call the funciton:
<script type="text/javascript">hello();</script>