I have a lot of javascript in my .html files and I want to clean things up a little by putting all the javascript stuff in a .js file and call that from the html file. How can I do this?<!--content-->i think it be something like this:<br />
<br />
in your actual html pages:<br />
<br />
<script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"wherejavascriptis/actualjavascript.js"></script><br />
<br />
and then put all of the javascripts into a file and name it with a .js extenstion.<!--content--><script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"wherejavascriptis/actualjavascript.js"></script><br />
<br />
will work, but you may like to upgrade to the more technically correct:<br />
<br />
<script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"wherejavascriptis/actualjavascript.js" type="text/javascript"></script><!--content-->Say I put my javascript stuff in javastuff.js. So if I wanted to use the function DoSomething() which is in the file javastuff.js would I do it:<br />
<br />
<script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"javastuff.js" type="text/javascript">DoSomething()</script><br />
<br />
and if I wanted to have DoSomething() called when the user clicks a link would it be:<br />
<br />
<a href=http://www.htmlforums.com/archive/index.php/"<script language='JavaScript' src='http://www.htmlforums.com/archive/index.php/javastuff.js' type='text/javascript'>DoSomething()</script>">Click</a><!--content-->>>> <script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"javastuff.js" type="text/javascript">DoSomething()</script> <<<<br />
<br />
<br />
The usual method for this would be to put this within the HEAD to load the function but not run it yet:<br />
<script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"javastuff.js" type="text/javascript"></script><br />
<br />
<br />
and this within the BODY to actually run it:<br />
<script language="JavaScript" type="text/javascript"><!--<br />
DoSomething()<br />
// --><br />
</script><!--content-->A few things:<br />
<br />
- javascript inside a .js file should NOT have <script> tags. e.g. only everything between and including the <!-- and ---> arrows.<br />
<br />
- a javascript in a .js library is loaded into a page and will thus appear just as if you had hardcoded (written) the javascript statements in directly. Therefore if you want to execute any scripts as the page loads you can just put them outside functions (it works just as if they javascripts were physcially typed into the page).<br />
<br />
- when activating javascripts in a .js file do excactly as for javascript which is directly coded in a regular html page. e.g. no need to write: <script src='http://www.htmlforums.com/archive/index.php/mylib.js">doSomething</script>.. Instead you simply call the function in the normal manner you usually would, e.g. that could be: <a href="javascript: doSomething()">Click here</a><br />
<br />
- Javascripts hardcoded directly in the html page can not assume that an .js library is loaded before the script even if the <script src='http://www.htmlforums.com/archive/index.php/mylib.js'></script> statement appear BEFORE the inpage script. This is because while the external library .js file loads the inpage script may be executed. Always check for existing of variables, etc before using them (e.g. if (window.myDefinedVariable) { var mynewvar = myDefinedVariable }) .. etc<br />
<br />
Let us know if you run into problems with the transfer.<!--content-->that clears a few things up, thx a lot<!--content-->
<br />
in your actual html pages:<br />
<br />
<script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"wherejavascriptis/actualjavascript.js"></script><br />
<br />
and then put all of the javascripts into a file and name it with a .js extenstion.<!--content--><script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"wherejavascriptis/actualjavascript.js"></script><br />
<br />
will work, but you may like to upgrade to the more technically correct:<br />
<br />
<script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"wherejavascriptis/actualjavascript.js" type="text/javascript"></script><!--content-->Say I put my javascript stuff in javastuff.js. So if I wanted to use the function DoSomething() which is in the file javastuff.js would I do it:<br />
<br />
<script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"javastuff.js" type="text/javascript">DoSomething()</script><br />
<br />
and if I wanted to have DoSomething() called when the user clicks a link would it be:<br />
<br />
<a href=http://www.htmlforums.com/archive/index.php/"<script language='JavaScript' src='http://www.htmlforums.com/archive/index.php/javastuff.js' type='text/javascript'>DoSomething()</script>">Click</a><!--content-->>>> <script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"javastuff.js" type="text/javascript">DoSomething()</script> <<<<br />
<br />
<br />
The usual method for this would be to put this within the HEAD to load the function but not run it yet:<br />
<script language="JavaScript" src=http://www.htmlforums.com/archive/index.php/"javastuff.js" type="text/javascript"></script><br />
<br />
<br />
and this within the BODY to actually run it:<br />
<script language="JavaScript" type="text/javascript"><!--<br />
DoSomething()<br />
// --><br />
</script><!--content-->A few things:<br />
<br />
- javascript inside a .js file should NOT have <script> tags. e.g. only everything between and including the <!-- and ---> arrows.<br />
<br />
- a javascript in a .js library is loaded into a page and will thus appear just as if you had hardcoded (written) the javascript statements in directly. Therefore if you want to execute any scripts as the page loads you can just put them outside functions (it works just as if they javascripts were physcially typed into the page).<br />
<br />
- when activating javascripts in a .js file do excactly as for javascript which is directly coded in a regular html page. e.g. no need to write: <script src='http://www.htmlforums.com/archive/index.php/mylib.js">doSomething</script>.. Instead you simply call the function in the normal manner you usually would, e.g. that could be: <a href="javascript: doSomething()">Click here</a><br />
<br />
- Javascripts hardcoded directly in the html page can not assume that an .js library is loaded before the script even if the <script src='http://www.htmlforums.com/archive/index.php/mylib.js'></script> statement appear BEFORE the inpage script. This is because while the external library .js file loads the inpage script may be executed. Always check for existing of variables, etc before using them (e.g. if (window.myDefinedVariable) { var mynewvar = myDefinedVariable }) .. etc<br />
<br />
Let us know if you run into problems with the transfer.<!--content-->that clears a few things up, thx a lot<!--content-->