⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 javascript3.htm

📁 javascript基础教程适合初学javascript的人下载一个很快就能掌握其中的知识.
💻 HTM
📖 第 1 页 / 共 2 页
字号:
🔍
12 
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
<!--
a{ text-decoration: none }
p{ line-height:140% }
.text{ font-size: 9pt }
.text{ text-align:justify }
.text11{ font-size: 11pt }
.text11{ text-align:justify }
-->
</style>
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
<title>网页教程－JavaScript技术讲座:第三讲 JavaScript程序构成 </title>
</head>

<body>

<p><span class="text">您现在的位置：<a href="javascript:if(confirm('http://www.4gee.com/Index.htm  \n\nThis file was not retrieved by Teleport Pro, because it is addressed on a domain or path outside the boundaries set for its Starting Address.  \n\nDo you want to open it from the server?'))window.location='http://www.4gee.com/Index.htm'" tppabs="http://www.4gee.com/Index.htm">主页</a>－<a
href="javascript:if(confirm('http://www.4gee.com/colleges/Index.htm  \n\nThis file was not retrieved by Teleport Pro, because it is addressed on a domain or path outside the boundaries set for its Starting Address.  \n\nDo you want to open it from the server?'))window.location='http://www.4gee.com/colleges/Index.htm'" tppabs="http://www.4gee.com/colleges/Index.htm">网络教室</a>－<a href="Index.htm" tppabs="http://www.4gee.com/colleges/homepages/Index.htm">主页工厂</a>－JavaScript技术讲座:第三讲 
JavaScript程序构成</span></p>

<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>

<table border="0" width="100%">
  <tr>
    <td width="100%"><p align="center"><span style="color: rgb(252,177,3)" class="text11">JavaScript技术讲座<br>
    第三讲 JavaScript程序构成 </span></td>
  </tr>
</table>

<table border="0" width="100%">
  <tr>
    <td width="100%"><span style="color: rgb(125,125,125)" class="text">JavaScript脚本语言的基本构成是由控制语句、函数、对象、方法、属性等,来实现编程的。</span><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">在任何一种语言中，程序控制流是必须的，它能使得整个程序减小混乱，使之顺利按其一定的方式执行。下面是JavaScript常用的程序控制流结构及语句: 
    </span></p>
    <p><span style="color: rgb(125,125,125)" class="text">１、if条件语句</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">　基本格式</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if（表述式）</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">else</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">　功能：若表达式为true，则执行语句段１；否则执行语句段２。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">　说明：</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if -else 语句是JavaScript中最基本的控制语句，通过它可以改变语句的执行顺序。 
    <br>
    表达式中必须使用关系语句，来实现判断，它是作为一个布尔值来估算的。 
    <br>
    它将零和非零的数分别转化成false和true。 <br>
    若if后的语句有多行，则必须使用花括号将其括起来。 <br>
    　</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if语句的嵌套</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if（布尔值）语句１；</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">else if（布尔值）语句３；</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">……</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">else 语句４；</span></p>
    <p>　</p>
    <p><span style="color: rgb(125,125,125)" class="text">在这种情况下，每一级的布尔表述式都会被计算，若为真，则执行其相应的语句，否则执行else后的语句。</span></p>
    <p>　</p>
    <p><span style="color: rgb(125,125,125)" class="text">２、For循环语句</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（初始化；条件；增量）</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">　说明：</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">初始化参数告诉循环的开始位置，必须赋予变量的初值； 
    <br>
    条件：是用于判别循环停止时的条件。若条件满足，则执行循环体，否则 
    跳出。 <br>
    增量：主要定义循环控制变量在每次循环时按什么方式变化。 <br>
    三个主要语句之间，必须使用逗号分隔。 <br>
    　</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">３、while循环</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">　基本格式</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">while（条件）</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语句一样，当条件为真时，重复循环，否则退出循环。 
    </span></p>
    <p><span style="color: rgb(125,125,125)" class="text">　For与while语句</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">两种语句都是循环语句，使用For语句在处理有关数字时更易看懂，也较紧凑；而while循环对复杂的语句效果更特别。</span></p>
    <p>　</p>
    <p><span style="color: rgb(125,125,125)" class="text">４、break和continue语句</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">与C++语言相同，使用break语句使得循环从For或while中跳出，continue使得跳过循环内剩余的语句而进入下一次循环。</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">函数为程序设计人员提供了一个丰常方便的能力。通常在进行一个复杂的程序设计时，总是根据所要完成的功能，将程序划分为一些相对独立的部分，每部分编写一个函数。从而，使各部分充分独立，任务单一，程序清晰，易懂、易读、易维护。JavaScript函数可以封装那些在程序中可能要多次用到的模块。并可作为事件驱动的结果而调用的程序。从而实现一个函数把它与事件驱动相关联。这是与其它语言不样的地方。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">１、JavaScript函数定义</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">Function 函数名 （参数,变元）{</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 表达式;</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">　当调用函数时,所用变量或字面量均可作为变元传递。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">　函数由关键字Function定义。</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">　通过指定函数名（实参）来调用一个函数。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">　必须使用Return将值返回。</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">２、函数中的形式参数：</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">在函数的定义中，我们看到函数名后有参数表，这些参数变量可能是一个或几个。那么怎样才能确定参数变量的个数呢？在JavaScript中可通过arguments 
    .Length来检查参数的个数。例：</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">Function 
    function_Name(exp1,exp2,exp3,exp4)</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">Number =function _Name . arguments 
    .length;</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (Number&gt;1）</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.wrile(exp2);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if (Number&gt;2)</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(exp3);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">if(Number&gt;3)</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">document.write(exp4);</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">...</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">１、基本概念</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">JavaScript是基于对象(object-based)的语言。这与Java不同,Java是面向对象的语言。而基于对象的基本特征，就是采用事件驱动(event-driven)。它是在用形界面的环境下，使得一切输入变化简单化。通常鼠标或热键的动作我们称之为事件（Event），而由鼠标或热键引发的一连串程序的动作，称之为事件驱动（Event 
    Driver）。而对事件进行处理程序或函数，我们称之为事件处理程序（Event 
    Handler）。</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">２、事件处理程序</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">在JavaScript中对象事件的处理通常由函数(Function)担任。其基本格式与函数全部一样，可以将前面所介绍的所有函数作为事件处理程序。格式如下：</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">Function 
    事件处理名（参数表）{</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">}</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">３、事件驱动</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">JavaScript事件驱动中的事件是通过鼠标或热键的动作引发的。它主要有以下几个事件：</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">（１）单击事件onClick</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">当用户单击鼠标按钮时，产生onClick事件。同时onClick指定的事件处理程序或代码将被调用执行。通常在下列基本对象中产生：</span></p>
    <p><span style="color: rgb(125,125,125)" class="text">button（按钮对象） <br>
    checkbox（复选框）或（检查列表框） <br>
    radio （单选钮） <br>
    reset buttons（重要按钮） <br>
    submit buttons（提交按钮） <br>
    例：可通过下列按钮激活change()文件：</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;button&quot; 
    Value=“ ” onClick=&quot;change()&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">在onClick等号后，可以使用自己编写的函数作为事件处理程序，也可以使用JavaScript中内部的函数。还可以直接使用JavaScript的代码等。例： 
    </span></p>
    <p><span style="color: rgb(125,125,125)" class="text">&lt;Input type=&quot;button&quot;
12

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -