JavaScript初体验之更进一步

本文介绍了一种在HTML页面中实现脚本代码复用的方法，通过将脚本保存为独立的.js文件并引用，避免了多次复制粘贴导致的维护困难。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
  <title>test01</title>
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
  <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
  <meta content="JavaScript" name="vs_defaultClientScript">
  <meta content=" http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
  <script language="javascript">
  function selectAllContent1()
  {
   Form1.aaa.select();
  }
  function selectAllContent()
  {
   alert("你点着我了!@");
   document.all.aaa.select();
  }
  </script>
</HEAD>
<body MS_POSITIONING="GridLayout">
  <form id="Form1" method="post" runat="server">
   <INPUT id="aaa" style="Z-INDEX: 104; LEFT: 184px; POSITION: absolute; TOP: 120px" type="text"
    value="获得焦点选中内容" onfocus="selectAllContent()"></form>
</body>
</HTML>

-------------------------------------------------------------------------------------------------------------------
首先声明:帖子没发重,请往下看,
上面这个例子我已经贴过了,但有些脚本代码是需要重用的,我们当然不想每次都拷贝一份再粘到别处
让我们来解决脚本重用性的问题吧!!!!

把脚本代码写到一个文本文件内:
  <script language="javascript">
  function selectAllContent1()
  {
   Form1.aaa.select();
  }
  function selectAllContent()
  {
   alert("你点着我了!@");
   document.all.aaa.select();
  }
  </script>
把这个文本文件命名为AXzhz.js (注意:文件后缀改为了js,文件类型已改变)
然后使用下面这句代码调用AXzhz.js文件
<script src=AXzhz.js type=text/javascript></script>

上边的例子变为:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
  <title>test01</title>
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
  <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
  <meta content="JavaScript" name="vs_defaultClientScript">
  <meta content=" http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">

  <script src=AXzhz.js type=text/javascript></script>

   </HEAD>
<body MS_POSITIONING="GridLayout">
  <form id="Form1" method="post" runat="server">
   <INPUT id="aaa" style="Z-INDEX: 104; LEFT: 184px; POSITION: absolute; TOP: 120px" type="text"
    value="获得焦点选中内容" onfocus="selectAllContent()"></form>
</body>
</HTML>

当然,其它的文件也可以使用上面的方法调用该脚本