Invoke JavaScript function in ".js" file after a page loads from HTML file

In external .js-file you can do the same. But file should be after jQuery in DOM.

Without jQuery you can use next code:

window.onload = function () {alert('Hello World!')

And another question please, can "src" tag have a value like this: src = "http://google.com"? I mean without the ".js"suffix at the end of it.

Yes, you can.

All the JavaScript files you load are on same scope: your DOM. So it doesn't matter from which file you are loading one function and from which file you are loading another function. As long as you load all required files there's no problem.

For instance I recently developed an OOP JS project and I had js/namespace/class.js files. Of course on class used another one (even from different namespaces). I had an insane long head (with lot of imports) but everything just worked fine.

Regarding your second question: The src field must point to a valid JS resource. src="//something.org/resource" in valid if it's a REST js resource (routed by server) instead a plain file. It just matters that it is a valid JS "string"

Let's take this example:

//mysite.org/rest/js1

var greet = function() {
    alert("Hello World!");
}

//mysite.org/rest/js2

$(document).ready(function() {
    greet();
}

http[s]://mysite.org

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script src="//mysite.org/rest/js1" type="text/javascript"></script>
<script src="//mysite.org/rest/js2" type="text/javascript"></script>

Swapping import for js1 and js2 may break it all, so be carefull with order.

Probably you can use the same

$(document).ready(function() {  
   alert("Hello World!");  
});

In the external file?

Yes, it doesn't need to have a .js extension you can load any js file from any server, no matter how malicious the site may be. It does have to be a valid js file served with the appropriate header though. Google.com isn't one... it's a html file. If you are on https: domain all resources will also need to be HTTPS or they will be skipped

In your above example $ is an external function loaded from one of googles pages!

<script type="text/javascript">
function myfunction() {
   alert('it has loaded');
};
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript" onload="myfunction()">  

Just make sure to define your function BEFORE the code that calls the external code. Just in case the code is cached and executed immedeately before the page arrives at your code.

You can do a complete javascript version too:

function myfunction() {
    alert('script has loaded');
}
function loadJS(url, callback){
    //url is URL of external file, callback is the code
    //to be called after file has loaded

    var scriptTag = document.createElement('script');
    scriptTag.src = url;

    scriptTag.onload = callback;
    scriptTag.onreadystatechange = callback;

    document.body.appendChild(scriptTag);
};

loadJS('http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js', myfunction);

You can load all javascript files inside script tag, then you can call any function like :

$(document).ready(function() {  
       yourFuntion();  
    }); 

PS: do not forget to call your function before javascript files.