Using External JavaScript FilesWritten by Amrit Hallan
When you have lots of JavaScript functions and you plan to use them on many web pages, it is always advisable to keep them in a separate file, and then include that file on every page where those functions are required. This way, you can better organize them, you don't have to copy/paste code again and again (imagine if it runs to 100 or more lines!!), and you'll be forced to write more generalized code for better integration and scalability.Besides, enclosing common JavaScript routines in external files keeps your web pages uncluttered and search engine spiders and crawlers are able to reach important content easily. They don't have to shuffle through tens of lines of scripts. In first edition [that appeared in my newsletter - BYTESWORTH REACHOUT] of my article I had omitted process of creating external JavaScript files, but when one of my readers asked me how to do it, I had to re-write article. It's very simple. Use any text editor of your liking (if you hand-code your HTML, you can use same editor that you use for your HTML editing). Write required code, and save file with .js (dot js) extension.
| | Some Useful JavaScript TricksWritten by Mitchell Harper
JavaScript can be one of most useful additions to any web page. It comes bundled with Microsoft Internet Explorer and Netscape Navigator and it allows us to perform field validations, mouse-overs images, open popup windows, and a slew of other things.In this article I will show you how to: - Display browser name and version number - Change text in status bar of browser - Use an input box to get text from user - Use a message box to display text to user - Change title of browser window Before that, however, we need to know how to setup our web page so that it can run JavaScript. JavaScript code is inserted between opening and closing script tags: , like this: These script tags can be placed anywhere on page, however it's common practice to place them between and tags. A basic HTML page that contains some JavaScript looks like this: My Test Page < itle> <script language="JavaScript"><p> function testfunc() { var x = 1; }<p></script> </head> <body> <h1>Hello</h1> </body> </html><p>For<IMG height=12 src="/the2.jpg" alt="repparttar 105612"> examples in this article, you should use<IMG height=12 src="/the2.jpg" alt="repparttar 105613"> basic document format I have just shown you, inserting<IMG height=12 src="/the2.jpg" alt="repparttar 105614"> JavaScript code between<IMG height=12 src="/the2.jpg" alt="repparttar 105615"> <script> and </script> tags. When you load<IMG height=12 src="/the2.jpg" alt="repparttar 105616"> page in your browser,<IMG height=12 src="/the2.jpg" alt="repparttar 105617"> JavaScript code will be executed automatically.<p>----------------------------------------------- Displaying<IMG height=12 src="/the2.jpg" alt="repparttar 105618"> browsers name and version number -----------------------------------------------<p>The "navigator" object in JavaScript contains<IMG height=12 src="/the2.jpg" alt="repparttar 105619"> details of<IMG height=12 src="/the2.jpg" alt="repparttar 105620"> users browser, including its name and version number. We can display them in our browser using<IMG height=12 src="/the2.jpg" alt="repparttar 105621"> document.write function:<p> document.write("Your browser is: " + navigator.appName); document.write(" Its version is: " + navigator.appVersion);<p>I run Windows 2000 and Internet Explorer version 6, so<IMG height=12 src="/the2.jpg" alt="repparttar 105622"> output from<IMG height=12 src="/the2.jpg" alt="repparttar 105623"> code above looks like this in my browser window:<p> Your browser is: Microsoft Internet Explorer Its version is: 4.0 (compatible; MSIE 6.0b; Windows NT 5.0)<p>----------------------------------------------- Changing<IMG height=12 src="/the2.jpg" alt="repparttar 105624"> text in<IMG height=12 src="/the2.jpg" alt="repparttar 105625"> status bar of<IMG height=12 src="/the2.jpg" alt="repparttar 105626"> browser ----------------------------------------------- <br><br></font></td><!-- google_ad_section_end --></tr><tr><td>Cont'd on page 2 ==<a class="mlink" href="2-Using_External_JavaScript_Files-5602.htm">></a></td></tr></table><script type="text/javascript"><!--
google_ad_client = "pub-5766870852072819";
google_ad_width = 728;
google_ad_height = 90;
google_ad_format = "728x90_as";
google_ad_channel ="8831454965";
google_color_border = "CFB9A1";
google_color_bg = "CFB9A1";
google_color_link = "000000";
google_color_url = "431B02";
google_color_text = "431B02";
//--></script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</td>
</tr>
</table>
<table width="770" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
<tr>
<td height="48" align="center" background="images/bg_nav_bottm.jpg"><span class="style3">ImproveHomeLife.com © 2005<br> <a href="terms.html" rel="nofollow">Terms of Use</a></span></td>
</tr>
</table></td>
</tr>
</table>
<script type="text/javascript">
var HASH_ESCAPED="%23";
function TrackIt(adUnit){
if (window.status)
{
var adDomain = escape(window.status.substring(6));
var pyPage = document.location.pathname;
var params = document.location.search;
var hasAnchor = params.lastIndexOf(HASH_ESCAPED)!= -1;
params = hasAnchor? (params.substring(0, params.lastIndexOf(HASH_ESCAPED))) : params;
pyPage = escape(pyPage.substring(pyPage.lastIndexOf('/') + 1));
pyPage = pyPage + params;
var curTime = new Date().valueOf();
var bug = new Image();
bug.src = '/track/adsenseTrack.php?pyPage=' + pyPage + '&adDomain=' + adDomain + '&adUnit=' + adUnit + "&time=" + curTime;
}
}
function TrackIt0() {TrackIt(0); }
function TrackIt1() {TrackIt(1); }
function TrackIt2() {TrackIt(2); }
var elements = document.getElementsByTagName("iframe");
for (var i = 0; i < elements.length; i++)
{
if(elements[i].src.indexOf('googlesyndication.com') > -1)
{
//elements[i].onfocus = TrackIt;
if (i==0) elements[i].onfocus = TrackIt0;
if (i==1) elements[i].onfocus = TrackIt1;
if (i==2) elements[i].onfocus = TrackIt2;
}
}
</script>
<!--WEBBOT bot="HTMLMarkup" startspan ALT="Site Meter" -->
<script type="text/javascript" language="JavaScript">var site="s19improve"</script>
<script type="text/javascript" language="JavaScript1.2" src="http://s19.sitemeter.com/js/counter.js?site=s19improve">
</script>
<noscript>
<a href="http://s19.sitemeter.com/stats.asp?site=s19improve" target="_top">
<img src="http://s19.sitemeter.com/meter.asp?site=s19improve" alt="Site Meter" border=0></a>
</noscript>
<!-- Copyright (c)2002 Site Meter -->
<!--WEBBOT bot="HTMLMarkup" Endspan -->
</body>
</html>
|
