Can we call the function written in one JS File in another JS file? Can anyone help me how to call the function ?
As long as both are referenced by the web page, yes.
You simply call the functions as if they are in the same JS file.
yes you can . you need to refer both JS file to the .aspx page
<script language="javascript" type="text/javascript" src="JScript1.js">
</script>
<script language="javascript" type="text/javascript" src="JScript2.js">
</script>
JScript1.js
function ani1() {
alert("1");
ani2();
}
JScript2.js
function ani2() {
alert("2");
}
The function could be called as if it was in the same JS File as long as it is linked first.
I.e.
File1.js
function alertNumber(number) {
alert(number);
}
File2.js
function alertOne() {
alertNumber("one");
}
HTML
<head>
....
<script src="File1.js" type="text/javascript"></script>
<script src="File2.js" type="text/javascript"></script>
....
<head>
<body>
...
<script type="text/javascript">
alertOne();
</script>
...
</body>
The other way won't work.
HTML
<head>
....
<script src="File2.js" type="text/javascript"></script>
<script src="File1.js" type="text/javascript"></script>
....
<head>
<body>
...
<script type="text/javascript">
alertOne();
</script>
...
</body>
if all files are included , you can call properties from one file to another. like function, variable, object etc.
The js functions n variables that you write in one .js file -
say a.js will be available to other js files - say b.js as
long as both a.js and b.js are included in the file
using the following include mechanism -
<script language="javascript" src="a.js"> and
<script language="javascript" src="b.js">
The answer above has an incorrect assumption that the order of inclusion of the files matter. As the alertNumber function is not called until the alertOne function is called. As long as both files are included by time alertOne is called the order of the files does not matter:
[HTML]
<script type="text/javascript" src="file1.js"></script>
<script type="text/javascript" src="file2.js"></script>
<script type="text/javascript">
alertOne( );
</script>
[JS]
// File1.js
function alertNumber( n ) {
alert( n );
};
// File2.js
function alertOne( ) {
alertNumber( "one" );
};
// Inline
alertOne( ); // No errors
Or it can be ordered like the following:
[HTML]
<script type="text/javascript" src="file2.js"></script>
<script type="text/javascript" src="file1.js"></script>
<script type="text/javascript">
alertOne( );
</script>
[JS]
// File2.js
function alertOne( ) {
alertNumber( "one" );
};
// File1.js
function alertNumber( n ) {
alert( n );
};
// Inline
alertOne( ); // No errors
But if you were to do this:
[HTML]
<script type="text/javascript" src="file2.js"></script>
<script type="text/javascript">
alertOne( );
</script>
<script type="text/javascript" src="file1.js"></script>
[JS]
// File2.js
function alertOne( ) {
alertNumber( "one" );
};
// Inline
alertOne( ); // Error: alertNumber is not defined
// File1.js
function alertNumber( n ) {
alert( n );
};
It only matters about the variables and functions being available at the time of execution. When a function is defined it does not execute or resolve any of the variables declared within until that function is then subsequently called.
Inclusion of different script files is no different from the script being in that order within the same file, with the exception of deferred scripts:
<script type="text/javascript" src="myscript.js" defer="defer"></script>
then you need to be careful.