javascript3.htm

javascript基础教程适合初学javascript的人下载一个很快就能掌握其中的知识.

    value=&quot; &quot; onclick=alert(&quot;这是一个例子&quot;);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">（２）onChange改变事件</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">当利用text或texturea元素输入字符值改变时发该事件，同时当在select表格项中一个选项状态改变后也会引发该事件。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">例： &lt;Form&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;Input type=&quot;text&quot; 
    name=&quot;Test&quot; value=&quot;Test&quot; onCharge=&quot;check('this.test)&quot;&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;/Form&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">（３）选中事件onSelect</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">当Text或Textarea对象中的文字被加亮后，引发该事件。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">（４）获得焦点事件onFocus</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">当用户单击Text或textarea以及select对象时，产生该事件。此时该对象成为前台对象。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">（５）失去焦点onBlur</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">当text对象或textarea对象以及select对象不再拥有焦点、而退到后台时，引发该文件，他与onFocas事件是一个对应的关系。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">（６）载入文件onLoad</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">当文档载入时，产生该事件。onLoad一个作用就是在首次载入一个文档时检测cookie的值，并用一个变量为其赋值，使它可以被源代码使用。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">（７）卸载文件onUnload</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">当Web页面退出时引发onUnload事件，并可更新Cookie的状态。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">　<font color="#00cc33">四、范例</font></span></p>
    <p><span style="color: rgb(125,125,125)" class="text">　 范例1：下例程序是一个自动装载和自动卸载的例子。即当装入HTML文档时调用loadform()函数,而退出该文档进入另一HTML文档时则首先调用unloadform()函数,确认后方可进入。 
    </span></p>
    <p><span style="color: rgb(125,125,125)" class="text">test3_1.htm </span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;HTML&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;HEAD&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;script 
    Language=&quot;JavaScript&quot;&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;!--</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">function loadform(){</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">alert(&quot;这是一个自动装载例子!&quot;);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">function unloadform(){</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">alert(&quot;这是一个卸载例子!&quot;);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">//--&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;/Script&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;/HEAD&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;BODY 
    OnLoad=&quot;loadform()&quot; OnUnload=&quot;unloadform()&quot;&gt; </span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;a href=&quot;test.htm&quot;&gt;调用&lt;/a&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;/BODY&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;/HTML&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">见图1所示：</span></p>
    <p><img src="javascript/003.jpg" tppabs="http://www.4gee.com/colleges/homepages/javascript/003.jpg" width="204" height="114" alt="003.jpg (6362 字节)"></p>
    <p><span style="color: rgb(125,125,125)" class="text">图1</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">范例2：这是一个获取浏览器版本号的程序。该程序首先显示一个波浪一提示信息。之后显示浏览器的版本号有关信息。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">test3_2.htm</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;html&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;head&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;script 
    language=&quot;JavaScript&quot;&gt;&lt;!--</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">// --&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">function makeArray(n){</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">this.length=n</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">return this</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">function hexfromdec(num) {</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">hex=new makeArray(1);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">var hexstring=&quot;&quot;;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">var shifthex=16;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">var temp1=num;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">for(x=1; x&gt;=0; x--) {</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">hex[x]=Math.round(temp1/shifthex - 
    .5);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">hex[x-1]=temp1 - hex[x] * shifthex;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">temp1=hex[x-1];</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">shifthex /= 16;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">for (x=1; x&gt;=0; x--) { 
    hexstring+=getletter(hex[x]); }</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">return (hexstring);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p>　</p>
    <p><span style="color: rgb(125,125,125)" class="text">function getletter(num) {</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (num &lt; 10) { return num; } </span></p>
    <p><span style="color: rgb(125,125,125)" class="text">else {</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (num == 10) { return 
    &quot;A&quot; }</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (num == 11) { return 
    &quot;B&quot; }</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (num == 12) { return 
    &quot;C&quot; }</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (num == 13) { return 
    &quot;D&quot; }</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (num == 14) { return 
    &quot;E&quot; }</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (num == 15) { return 
    &quot;F&quot; }</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">function rainbow(text){</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">var color_d1;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">var allstring=&quot;&quot;;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">for(i=0;i&lt;text.length;i=i+2){</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">color_d1=255*Math.sin(i/(text.length/3));</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">color_h1=hexfromdec(color_d1);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">allstring+=&quot;&lt;FONT 
    COLOR=&quot;+color_h1+&quot;ff&quot;+color_h1+&quot;&gt;&quot;+text.substring(i,i+2)+&quot;&lt;/FONT&gt;&quot;;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">return allstring;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p>　</p>
    <p><span style="color: rgb(125,125,125)" class="text">function sizefont(text){</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">var color_d1;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">var allstring=&quot;&quot;;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">var flag=0;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">for(i=0,j=0;i&lt;text.length;i=i+1){</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (flag==0) {</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">j++;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (j&gt;=7) {</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">flag=1;}}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (flag==1) { </span></p>
    <p><span style="color: rgb(125,125,125)" class="text">j=j-1;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (j&lt;=0) {</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">flag=0; }}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">allstring+=&quot;&lt;FONT 
    SIZE=&quot;+ j + &quot;&gt;&quot; + text.substring(i,i+1) + &quot;&lt;/FONT&gt;&quot;;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">return allstring;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(&quot;&lt;font 
    size=8&gt;&lt;CENTER&gt;&quot;)</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(&quot;&lt;BR&gt;&lt;BR&gt;&quot;)</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write( sizefont(&quot;这是一个获取WEB浏览器的程序&quot;))</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(&quot;&lt;/CENTER&gt;&lt;/font&gt;&quot;)</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(&quot;浏览器名称: 
    &quot;+navigator.appName+&quot;&lt;br&gt;&quot;);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(&quot;版本号: 
    &quot;+navigator.appVersion+&quot;&lt;br&gt;&quot;);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(&quot;代码名字: 
    &quot;+navigator.appCodeName+&quot;&lt;br&gt;&quot;);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(&quot;用户代理标识: 
    &quot;+navigator.userAgent);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;/script&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;body&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;/body&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;/html&gt;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">输出结果图2所示。</span></p>
    <p><img src="javascript/003.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/003.gif" width="496" height="294" alt="003.gif (16450 字节)"></p>
    <p>　</p>
    <p><span style="color: rgb(125,125,125)" class="text">图2</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">本讲介绍了JavaScript程序设计的有关内容。程序流、函数、事件是我们学习掌握JavaScript编程的重点。</span></td>
  </tr>
</table>

<p align="center"><small><a href="JavaScript2.htm" tppabs="http://www.4gee.com/colleges/homepages/JavaScript2.htm">上一页</a> 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="JavaScript4.htm" tppabs="http://www.4gee.com/colleges/homepages/JavaScript4.htm">下一页</a></small></p>

</body>
</html>