网页编程入门1

上传人：2*** IP属地：湖北上传时间：2022-12-30 格式：DOC 页数：22 大小：74KB 积分：30 举报 版权申诉

已阅读5页，还剩17页未读，继续免费阅读

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

PAGE1PAGE22网页编程入门（一）

网络技术飞速发展，互联网正在由以前所说的“走近千家万户”向“走进亿家亿户……”。网络信息主要来自各种形形色色的网站，不少网络发烧友开始追逐着建设网站的热潮。

网站的信息必须通过网页输出信息，于是要想通过网站发布信息，必须首先学会制作网页。谈到制作网页，可用的设计工具就太多太多了，有大家熟悉的Dreamveaver、FrontPage、Flash……不同的工具有不同的特点。

总体上来说，网页发布的信息主要通过以下媒体实现：文字、图片、动画、音频和视频，当然更多的是这几种方式的综合体，也就是我们常说的多媒体了（我以前听过一位领导说多媒体是会议厅里使用的电脑和投影设备，这是不对的哟，呵呵）。

说了这么一大堆不相干的，可能有些朋友等不急了，不是说编程吗？怎么尽是些不上叉的，别急，马上就来了……

为了能够对所发布的信息进行自由的控制，就需要通过编程来实现了，通过编程，我们可以实现对发布的信息进行动态控制和管理，如果学会了网页编程，我们几乎可以用任何文字编程软件都可以制网页了。

网页编程的道路漫长，千里之寻始于足下，就让我们从html代码开始吧（别说你讨厌代码哈，要是这样的话，你还是不要学习编程的好，因为编程从某种意义上来说，就是编写代码）。

下面就以大家熟悉的FrontPage为例来学习以下html编程吧！

先启动FrontPage(如果你的电脑里没有，那么就重新找Office光盘来安装），然后就会进入网页编辑制作界面（上部是菜单、工具栏，左边是视图区，在视图区的右边就是我们设计的主要场所了），我们会看到new_page1.htm标题（是FrontPage默认的网页文件名），在设计区的下面，有三张索引卡可供选择，默认为“普通”，另外还有“html”和“预览”两张。

点击一下"html"你就会看到你所创建网页的代码了，大致代码如下所示：<html><head>

<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">

<metaname="GENERATOR"content="MicrosoftFrontPage4.0">

<metaname="ProgId"content="FrontPage.Editor.Document">

<title>NewPage1</title>

</head><body></body></html>

尽管是空的页面，但在代码上却有不少内容了。

下面解释一下html卡中所显示的代码的意思：

<html>是网页的html代码的开始，在最后，有一个</html>与它相对应，表示代码的结束位置，网页的所有内容都出现在这两个标记(我们把用<>包含起来的这部分称之为标记或标签)之间。

<head>是网页头标记，也有一个</head>与之相对应，在<head>和</head>之间，有许多定义，<meta……>这个标志定义的是网页的元信息（关于元信息等大家对网页有更多认识到再说，有兴趣的朋友也可以先在网上查找相关的介绍），这个我们暂时不管它，下面一个是<title>和</title>，这是网页标题的标记，从上面的代码我们可以看到，默认的标题为NewPage1,要是我们想给页面取一个名称的话，我们就把要改的名称写到<title>和</title>之间。

<body>和</body>是网页正文的标记，基本上，网页所显示的内容全部都包含在这两个标记之间。现在我们看到的这两个标记之间什么也没有，就代表了网页是空的，……

我们把FrontPage文件保存（存到桌面吧，这样好打开），文件名取为：myfirstpage.htm,在后最小化FrontPage，从桌面上双击myfirstpage.htm，在浏览器中，我们就可以看到刚才的网页了（是空白的），注意打开网页的最左上方显示的是什么……（是我们刚才所介绍的<title></title>标签中的那个——NewPage1）。

从上面可以看出，在网页中的代码就就象我们写的文章一样，包括两大部分：第一是头部(<head>和</head>之间的那部分)，第二是正文（<body></body>之间的那部分）。好了，我们总算是对一个页面的总体结构搞清楚了，下面我们试着通过编程的方式修改网页的标题：

点击任务标中的FrontPage任务，这时FrontPage变成最大化，回到我们原来的操作界面，在FrontPage中，点击html选项卡，在把<title>和</title>之的内容改成“我的第一个编程页面”，然后保存，最小化FrontPage，刷新一下我们刚才打现在桌面上的网页（别告诉我你还不会手动刷新网页哦）。

再看一下浏览器的最左上方所显示的网页标题……（应该变成了“我的第一个编程页面”）。

现在关闭FrontPage，打开附件中的记事本，从“文件”菜单中选择“打开……”，指定到桌面位置，然后把打开文件对话框中的“文件类型”改成“*.*”，我们就会看到对话框里出现我们的网页文件（myfirstpage.htm）了，双击打开它，这时，在我们的记事本中就会有我们在FrontPage中所看到的html代码了，修改<title></title>之间的内容为“这个标题被改了”，然后保存，关闭记事本，再刷新一下网页，看一下浏览器左上角的网页标题，是否变化了，……（应该变成了“这个标题被改了”）。

怎么样，好玩吧，通过编程可以对网页进行随心所欲的控制，关键是我们要知道html代码中各个标签的意义和用途。我们可以在浏览网页时，在浏览器的“查看->源文件”中查看网页的html代码，一般会有很多，初学者看了一定会头发晕，所以我们要从最简单的代码开始，慢慢地积累，……

好了，这次就学这么多吧，再讲下去，有些朋友可能就会没兴趣学了（待续)

网页编程入门（二）作者：吴刘平

文章来源：作者原创

更新时间：2006-6-11

上一篇我给大家介绍了网页编程最基本的html知识，但是到目前为止，我们仅学会了通过编程的方式修改网页的标题，但是我想大家有了前面的基础，往后学习就会更容易了，下面还是请大家启动FrontPage程序，让我们继续学习……

对于初学者，大都分都是对网页的代码标签不熟悉，不知道每个标签都是做什么用的，要是我象上次那样把每个标签给大家讲解（如<html>表示XXXX）的话，大家可能会感觉到很枯燥，下面教大学一个学习html代码的简单而又实用的方法。

我们在启动了FrontPage后（这时编辑方式默认为“普通”，不要急着去点击“html”卡），然后我们在网页中输入“我爱网页编程”几个字，然后我们再点击网页底部的"html"选项卡打开该网页的html源代码，这里大家可以看到以下的代码：<html><head>

<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">

<metaname="GENERATOR"content="MicrosoftFrontPage4.0">

<metaname="ProgId"content="FrontPage.Editor.Document">

<title>NewPage1</title>

</head><body><p>我爱网页编程</p></body></html>

现在大家可以看到了在<body></body>之间多了“<p>我爱网页编程</p>”的代码，这里的<p></p>标签指的是段落，我们每在网页里输入一段文字，都会被加到这两个标签之间，有人也许会感到很讨厌<p></p>这个标签，这可是网页的代码哦，如果不讨厌就不会复杂了，不复杂会的人就多了，会的人多了，……编程可就是有点让人讨厌的哟！

我们再点击网页设计区下页的“普通”选项，返回普通编辑状态，在刚才“我爱网页编程”的几个字后面敲回车，然后输入“这里是第二段”几个字。再查看html代码，这里会发觉在<body></body>之间的代码变成如下所示了：<p>我爱网页编程</p>

<p>这里是第二段</p>

在网页里就有两段文字了，我们在进行文字编辑时，遇到要换行的地方时，总是通过输入回车来实现，所以在制作网页时也习惯于这样输入来换行，结果会发觉两行之间怎么那么宽呀？

这就是<p></p>搞的鬼了，你每敲一次回车，网页设计程序认为你另起一段，所以就会增加<p></p>代码，所以两行之就变成了两段字，所以就很宽咯！

下面我们按照添加第二段文字的方法添加第三段，在第三段输入“这里是第三段，换行开始”，然后从“插入”菜单中选择“插入换行符”（换行了耶，两行之间不是很宽了，正是我想要的^-^），再输入“换行结束……”，输入完毕后，查看一个html源代码，这时<body></body>之间的代码变成了：<p>我爱网页编程</p>

<p>这里是第二段</p>

<p>这里是第三段，换行开始<br>

换行结束……</p>

从上面的代码可以看到，原来在html代码中换行是用<br>标签来表示的（这下好了，我想在哪换行就在哪加<br>,嘿嘿，我得意的笑，我得意……）。

下面可以在html代码时输入多个“<p>……</p>”标签和"<br>"标签，练习一下，然后好好理解这两个标签的用途（同学们可一定要多练习哟，不然将来不会了，老师会打屁屁的哟）。

不是说是一个简单而又实用的方法吗？怎么说了半天又是“<p></p>”标签又是“<br>”标签的，好复杂哦，老师，记不住啊？？？？

你可以记不住，但一定要学会通过在“普通”状态和“html”之间的切换来学习标签代码，下面我们再来看几个倒子。

网页上出现得最多的莫过于“链接”了，这个东东使我们可以通过鼠标点击实现在页面间跳来跳去……

请大家在html的<body></body>之间输入下面的代码：<ahref="">百度搜索</a>

然后点击设计区下面的“预览”，这里可以看到页面上的“百度搜索”几个字变蓝了，把鼠标移到上面，呀！有个手形光标耶，我点！我点！真神奇，百度搜索网站首页出来了……

（注意，在进行上面操作时，要保证输入的字符不能有错——编程的要求可严了，今后你会发觉，输错一个标点符号都不行噢！另外你的电脑要可以上网，不然的话会看不到百度网站首页）

如果你以前制作过网页，查看一下网页的html代码，看一下是不是每个链接都有<ahref="XXXX">YYYY</a>的代码啊（其中XXXX是链接目标页面的网址，YYYY是我们在网页上看到的链接提示文字）

上面说了一大堆，总的目的是要让大家知道<a></a>标签是用来做链接的……

再来看一个倒子：

在“普通”状态下，从“插入->表单->单行文本框”菜单中给网页插入文本框，再看一下在代码里增加了以下代码：<formmethod="POST"action="--WEBBOT-SELF--">

<!--webbotbot="SaveResults"U-File="fpweb:///_private/form_results.txt"

S-Format="TEXT/CSV"S-Label-Fields="TRUE"-->

</form>

这么多代码，我晕……（千万别晕噢，不然到不了成功的彼岸了）

这里我简单地介绍一下几个要撑握的：

首先是<form></form>这是代表“表单”，什么是表单呀？说得通俗一点，表单就是我们向网站提交的数据内容（一般都是我们从网站上获取信息，表单可不一样了，是网站向我们获取信息用的），就象我们平时办事时，总要先填个什么登记表之类的，你可以把表单想象成我们日常生活、工作中所用的这些单据……

这个是注解标签，里面的内容只是帮助我们理解设计代码用的，不会输出到网页上，大家可以先不管它。

<inputtype="text"……>这时文本框，就是我们在网页上可以输入文字的地方！

<inputtype="submit"……>提交按钮，我们在填完表单以后，要想把填好的信息发送出去，就靠它了！

啊！！我煮的饭快糊了，交待一下，我们在网页上的所有界面元素（文字、图片、……）都有相应的标签代码表示，如果不晓得哪个标签代码表示什么，或不晓得界面元素用什么表示的话，就在FrontPage中切换"普通"和"html"选择卡吧，相信用这个方法，大家会很快就熟悉常用的标签了:)（待续）

网页编程入门（三）作者：吴刘平

文章来源：作者原创

更新时间：2006-6-17

大家好，这几天因为身体不太好，所以未能及时与大家一起学习网页编程……，闲话少说，还是开始我们的正题吧！

上一次课，主要给大家讲了一下如何通过在“普通”状态和“html”之间的切换来学习标签代码，在网页编辑过程中自动生成的标签代码中，有些简单，有些复杂……所以大家可能还是对这些代码还有很多不解的地方，下面我们还是再来学习一下有关标签的理论。

有些简单的标签里只有签标名，有的则包括了更多的内容，如<br>标签就只有标签名，而<inputtype="submit"value="提交按钮">除了标签名之外还多了两个内容，一个是type，另一个是value，我们把标签的这些部分称为“属性”，它是用来定义标签的状态特征的，上面例子中的type是定义了"类型"属性，value是定义了"值"属性。

第一次接触“属性”这个概念，可能很多学员都得花点时间来理解它。

标签代码其实不是什么复杂的东西，它只是通过另一个角度（开发者角度）来描述网页内容罢了，可以这样理解，每一个标签都代表一个对象，这里所说的对象主要指包含在网页中的东西，如：网页上的链接、图片、文字段落、文字编辑框、按钮……等等，每一个对象都有一定的状态特征，如大小、颜色……，这些我们都称之为属性。

关于属性，大家还必须要注意一点，那就是它的表示方法，我们一般用“名值对”的方式表达，格式为：属性名=属性值，如type="submit"，我们把等号左边的记为属性名，右边为属性值，因为这表示了一个属性与一个值相对应，所以这样一个表示方法，我们把它称为名值对。

不同的标签包含的属性不一样，但是任何一个标签都可以包括"id"属性和"name"属性。id属性是用来识别网页中各个对象的编号，在设置id属性时，必须保证不能有任何两个标签的属性值相同，就象我们每个人都有一个身份证号一样，而且必须保证每个人的身份证号码必须唯一。name属性则是给标签所代表的对象取一个名字，就象我们人一样，每一个人都有一个名字，两个不同对象的name属性值可以相同，就象两个人名字相同这是正常现象。

下面来看一下另一个我们在网页中非常重要的标签——图片标签<img>

<imgsrc="Skin/51dsn03/h_an1.gif">

img是标签名，它表示这是一个图片，src是图片来源属性，这个属性使我们可以指出图片所在的地址（或位置），Skin/51dsn03/h_an1.gif就是这张图片的地址。

下面的小图标就是上页代码在网页中的结果表示

如果是想在网页中插入音乐或视频，又用什么标签呢？——可以试一下<embed>

例如：<embedsrc="file:///E:/音乐/MP3/不要再来伤害我.mp3"width="128"height="128">，这个标签可以播放我电脑中E:/音乐/MP3/不要再来伤害我.mp3这首歌，你也可以根据你的歌曲文件的位置更换“E:/音乐/MP3/不要再来伤害我.mp3”代码就可以了，视频文件也一样，只要把mp3文件改成视频文件的文件名就可以了。(注：<embed>在IE浏览器中得到支持，别的浏览器可能不行)

好了，这一节课我们学习了标签代码中的“属性”，属性在我们编辑过程中使用得非常多，也是学习面向对象编辑技术所必须撑握的基础知识，希望大家好好理会。

最后布置一点课后练习：

（1）在FrontPage中，在“普通”设计模式下输入一些文字，然后给文字设置成不同的颜色，查看所生成的html代码（主要注意各标签中的属性），然后反过来，修改html代颜色属性值，看一下不同的值显示出来的颜色是什么样的？

（2）设置文本的大小，再看一下html代码标签中的大小属性用什么来表示，修改大小属性值，再预览页面，看一下文本大小变化。

（3）从“插入->高级->插件”菜单中插入插件，在数据源中指定音频或视频文件，看一下生成的html代码（注意其中的"src"属性），然后预览一下，看看是否听到了音乐或看到了视频。（待续）

网页编程入门（四）作者：吴刘平

文章来源：作者原创

更新时间：2006-6-19

大家好，欢迎如期来学习网页编程学习！

上次课学习了标签代码的“属性”，这一节我们来学习一下“操作”（也称方法）。

“属性”和“操作”是面向对象编程首先要理解好的概念（不理解的话，恐怕再学下去你会糊里糊涂的哟……），属性是从状态方面来描述对象的特征，通俗点来说就是说明对象是个什么样的，而操作则是从动作方面来描述对象的特征，从对象外部来看，就是说明对象可以做什么的。

还是结合实例来说一下吧。

例如：我们可以把人当成一个对象，身高、体重说明人这个对象是什么样的，而吃饭、睡觉说明的是人这个对象可以做什么，……这样一比，大家应该就明白了。

操作依靠函数（注意，这里的函数可不是数学上的函数，现在大家可以认为它是一段代码的集合这样来理解）来实现，所以学习“操作”，实际上就转化成了学习“函数”了。

下面给出一个代码事例来解说一下：<html><head>

<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">

<metaname="GENERATOR"content="MicrosoftFrontPage4.0">

<metaname="ProgId"content="FrontPage.Editor.Document">

<title>NewPage1</title>

</head>

<scriptlanguage="javascript">

functionshowmessage()

{

alert("轻点，不然会把我点疼的！");

}

</script>

<body>

<inputtype="button"value="点击我"onclick="showmessage()">

</body></html>

大家可以把以上的代码复制到FrontPage的html代码中，然后预览中看一下，是不是有一个按钮（按钮上显示有"点击我"），然后点一下按钮，这时会弹出一个对话框，显示“轻点，不然会把我点疼的！”的提示。

在这个页面中，只有"点击我"这个按钮对象，这个对象它有一个操作，这个操作就是如果我们用鼠标点击它，它就会作出反应——向我们显示一个弹出对话框提示信息。

这个对象的操作实现上是依靠函数“showmessage()"函数来实现，所以我们重点要学习一下函数的有关知识。

下面来分析一下代码：

首先看一下<input……>标签，其中的onclick="showmessage()"是对按钮对象的操作定义，它表示当按钮被点击时，按钮要完成一个操作，这个操作由showmessage()函数来完成。注意，onclick不能乱写，它表示事件名称，所谓事件是指用户或其它外界环境向对象实施的动作，这里的onclick指鼠标点击这一事件，另外还有鼠标移动、鼠标拖动、左键按下或释放、右键按下或释放……大家可以查阅其他相关资料进一步了解。

函数代码

<scriptlanguage="javascript">

functionshowmessage()

{

alert("轻点，不然会把我点疼的！");

}

</script>

可以看到，函数代码被包含到了<scriptlanguage="javascript"></script>中，大家可以先不管这个<script>是什么东西，你只要记住，今后在编写函数时放到这里来就行了。functionshowmessage()

{

alert("轻点，不然会把我点疼的！");

}

是我们关心的核心问题了，function是关键字，每个函数的开头都要这样写，showmessage是函数名，()是构成函数所必须的组成部分，在()之间我们可以加一些其它东西（作为入门教程，就不深入了），由{……}所组成的部分是执行命令的场所了，在这里，这个函数仅仅只执行一条命令——就是向用户显示一个弹出对话框。

函数体里的东西才是我们编程的代码，那么在函数体中的代码该怎么写呢？如果你能回答这个问题，那么你就就是程序员了，哈哈，期待你能早日能回答这个问题：）

下面总结一下标签代码中的“操作”，先要对操作进行定义（用“事件名=函数”这样的格式），然后在<script……></script>代码中编写完成操作任务的函数。与“属性”相比，“操作”相对要复杂一些，而且我们对网页的编程，更多程度上是编写函数，在函数中实现对网页的控制。

好了，我已经教大家学习了html代码的基础知识了，现在只能说已经把大家带到了编程的大门口了，并且通过例子让大家初步感受到了使用编程，我们可以更加自由地控制我们的网页。下次课我们将开始在<script></script>中编写程序代码，那才是我们真正的编程……

最后，还是给出一些代码，大家课后可以去练习，插入到例子中的函数代码，在预览中点击“点击我”按钮，观看一下不同的代码都有什么功能。<html><head>

<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">

<metaname="GENERATOR"content="MicrosoftFrontPage4.0">

<metaname="ProgId"content="FrontPage.Editor.Document">

<title>NewPage1</title>

</head>

<scriptlanguage=javascript>

functionshowmessage()

{

alert("轻点，不然会把我点疼的！");

//弹出显示信息对话框

mpt("请输入姓名","王江");

//弹出输入信息对话框

window.open("","_blank","menubar=no,toolbar=no");

//打开新网页（无菜单、工具栏……），常用于显示广告

document.bgColor="#454323";

//修改网页的背景

t.value="文字变了";

//修改网页输入文字框中的内容，这里用id值代表文字输入框的引用

}

</script>

<body>

<inputid="t"type="text"value="在这里输入文字">

<inputtype="button"value="点击我"onclick="showmessage()">

</body></html>

注意，以上代码必须书写正确（错一个标点符号或大小写互换都不行）待续！

网页编程入门（五）作者：吴刘平

文章来源：作者原创

更新时间：2006-6-22

到第四节课为止，我们总算完成了网页编程的html代码部分的学习，大家知道了html代码是从开发人员的角度来描述网页的一表达方式。

有人也许会觉得即然学完了html，那怎么着也应该算“入门”了吧？嘿嘿，可没那么简单哟，请耐心等待，从这节课开始我们才算是真正打开“编程”这个紧锁的大门，……路还长着嘿，咱们还得慢慢的、一步一个脚印的往前走！

在真正接触代码之前，我们还得先了解点与编程有关的理论知识，如网页编程到底是怎么一回事，要怎么样学习它，它都涉及到哪些东西……

在上次课在我们网页的代码中，我们出现了以下的代码<scriptlanguage="javascript">

functionshowmessage()

{

alert("轻点，不然会把我点疼的！");

}

</script>

下面我们来解释一下其中的代码（上节课不是讲过了吗？怎么又讲……？不一样哦）。

说到编程语言，大家千万记住，任何编程都是指按照某种编程语言的规则要求把计算机所要做的事情通过代码的方式编写出来的过程，编程语言有很多种，大家可能听说过很多，例如C、C++、VC、VB、C#、Java、Delphi、……太多了，不同的语言在某方式面编程时有它自己的优势，所以我们不能一概而论说哪种好哪种不好。

上面所介绍的编程语言主要用来开发传统的Dos、Unix程序或Windows桌面应用程序等等，虽然也可以用上述的语言编写网页程序，但一般我们不这样做，因为用以上的语言写网页程序要求有较高的程序开发水平，而且编程的难度、复杂程度较大，所以我们在进行网络程序开发时，一般会选别的编程语言，如脚本语言。

（以上的C#、Java两种是当前特别受欢迎的语言，学习到一定深度的人，都会学这两种或选其中一种，这两种可以开发传统的桌面程序，也可以开发网络的Web程序）

扯得有点远了哈，其实不然，上面提到了一个新名词——Web程序，我们把凡是应用于网站上的程序都叫Web程序。

网站程序在很大程度上依赖于网页，所以网页程序是Web程序中的重要组成部分。

凡是关于网页程序我们都叫网页程序，其中脚本程序又是网页程序中的一种。

脚本程序根据实现的语言又分为若干，有我们提到的javascript脚本语言，另外还有VBscript脚本语言……

总算搞清楚了javascript在“程序设计”这个大世界中的地位：程序设计->编程->Web程序->网页程序->脚本程序->javascript脚本语言。

当然，你也可以选择别的脚本语言来学习，例如VBScript，这种编程语言是微软的指定语言，IE(就是我们上网用的那个东东)对VBscript的支持是100%的，但其它有些浏览器(除了IE可以用来上网之外还有很多哟）可能会不支持，但全世界用IE上网的人太多了，所以不用愁学习它没有用。

不过javascript也有它的好处，支持javascript的浏览器更多，所以更通用。

没想到这个<script>标签引出的东西会这么多，我讲了这么一大堆，只是为了介绍这个标签里的language属性。

好了，知道了以上的知识，我们再来学习脚步本编程就会有点谱谱了。

注意，我们在写脚本程序时，都会把它写在<script></script>之间。

网页在加载（电脑读取数据的过程我们把它称为加载）时，浏览器会自动按<script></script>之间的代码来一句句执行。

我们在网页html代码中的任何位置加入以下代码：<scriptlanguage=javascript>

alert("浏览器执行了脚本中的代码");

</script>

当你用浏览器打开网页时，都会弹出信息提示对话框（和上次不一样了，上次我们把代码置于函数中，再将函数与对象事件相关联，而且要点击才弹出来）。

在上面的代码中，有一条脚本代码语句：alert("浏览器执行了脚本中的代码");

浏览器正因为执行了这一条才弹出我们所看到的对话框，如果我们在<script></script>之间分别写几条脚本语句，浏览器就为按执照我们所写的代码，一条一条的执行，……所以我们可以控制网页程序按我们的要求来执行，并取得我们所想要的结果……

“嗨，说了半天，还是没有教怎么写代码……我都想回家了，学习编程真累！”

很多人到这个时候可能都会叹气，甚至想放弃了，我可要告诉你了，没有花个一两个月的时间来琢磨实践，就想入门，恐怕编程不象你想像那么容易哦，为了我们的目标，千万别放弃……知道吗？我个人可是花了整整六年的时间来学习编程的哟，到现在才算是掌握了一些道道，所以希望大家能沉住气，请大家坚信有志者事竞成，让我们一道在编程的道路上继续前行吧！

另外请大家注意，编程并非只是写代码，就象我们写作文并不只是写字一个道理，我们必须得掌握更多的知道，理解更多理论，才能知道怎么写代码！

哦，我该煮晚饭吃了，别忘了我们下次的约会……（待续）

网页编程入门（六）作者：吴刘平

文章来源：作者原创

更新时间：2006-7-1

上次课给大家介绍了五花八门的编程语言，由于可用的编程语言太多，我们不可能一一去学习它，我们就以javascript作为学习编程的入门语言吧。

按照现在面向对象的编程方法，编程主要是通过语言来设计和控制各种对象的特征与行为，在前面我们曾经学过了怎么样通过编程的方式来控制网页中的各种对象（在学习“属性”和“操作”过程中涉及到），当时大家虽说能够通过实例实现了一些功能，但是在书写编程代码时，只是照搬，甚至不明白为何要那样写，要想写别的语句又该怎么写呢？

网页编程和别的编程一样，都要通过书写一行行的语句，然后计算机在执行过程中，自动地将我们写的语句进行解释，并输出我们想要的结果。这些语句就象是我们平时人与人交流一样，每条语句都表示一定的语义，而且书写每一条语句都有一定的规则。

javascript语句在书写过程中要注意，字母是区分大小写的，也就是说var和Var是不一样的，所以在书写过程中一定要注意，经常有些人在写代码时，因为一时大意，把大写写成了小写或者把小写写成了大写，后来花很多时间才能找出其中的错误，所以从一开始起大家就要注意这一点。另外，每条语句以“;”（分号）作为结束标志，所以如果我们在一行中写出的语句有多个“;”的话，实际上代表的是多条语句。

语句有简单的，有复杂的，最简单的语句是只有一个“;”的语句，代表空语句，一般来说，如果太复杂的语句我们都会把它分解成若干条简单语句来写，这便于理清我们的编程思路，也便于我们查找和分析程序中的错误（我们把程序中存在错误叫Bug，大家在网上可能经常会看到这个词，经常听说过某某软件又升级了，并且修正了以前版本的某某Bug……）。

语句的类型有很多，下面我们讲一些最常用的语句，有兴趣的朋友可以再查阅相关资料来加深理解，毕竟我们只是入门教程所以就不可能说得太深入了。

1、变量定义语句。这里所说的变量就象我们在数学里学的代数一样，我用一个变量来代表一个可以变化的值，例如我们在数学的用X来代表一个数，它可以代表1、2、3、4……等，实际上我们以前学过的属性就是一种变量。

下面来看一条变量定义语句：varcomputer;

这条语句的"var"是关键字，我们定义的每个变量都用这三个字母开头，computer是变量名，我们定义了变量以后我们就可以在以后的代码中引用这个变量了。

2、赋值语句。变量就好比一个可以存放数据的容器，我们定义了变量，就好比我们准备好了一个容器，里面不没有东西，我们要往容器里放东西，在现实生活中，我们可以倒东西进去，而我们往变量里面存放数据，我们使用的是赋值语句，如：computer="我的电脑";

赋值语句简单的用法是在左边写上“变量名”（上例中的computer），中间写赋值符号（就是我们平时所说的等号——“=”），在右边写“变量值”，变量值如果是字符串我们得用""括起来。

经过使用赋值语句后，我们的变量里面存放的数据就是我们所写的变量值了。我们在以后所引用的变量值都将是我们给变量所赋的值。

变量所保存的值总是最后一次赋的值，假设有以下语句：

varcomputer;

computer="我的电脑";

computer="小王的电脑";

这里变量computer里面存放的是最后一次赋值的数据，所以是“小王的电脑”，而不是我的电脑。

3、信息输出语句。我们定义了变量，并且使用赋值语句在变量里存入了数据，可以我们要想知道里面存放的数据是什么，我们得使用输出语句才能显示出来。在javascript中，我们常用两条语句输出信息：document.write(string)或都alert(string),其中的string代表的时字符串或字符串变量，其中前者将直接在网页中输出字符串内容，后者以弹出对话框形式输出字符串内容，例如：

<scriptlanguage=javascript>

varcomputer;

computer="我的电脑";

document.write(computer);

</script>

我们在网页的任何位置加入以上代码，就会在网页的该位置出现"我的电脑"几个字。

alert语句我们以前使用过就不再举例了。

4、注释语句。有时，我们为了说明清楚我们语句代码的作用，经常在注释语句来进行辅助说明，计算机在执行程序的过程中是不会执行注释语句的，注释语句写法有多种，如果我是只是单行的话就在前面加上"//"两根斜线，如果是多行注释，我们就把注释信息夹在“/*

*/”之间。例如：

//这里是单行注释

这里是多行注释的第一行

这里是多行注释的第二行

……

以上介绍的语句都比较简单，下面介绍一些稍为复杂点的语句。

vara=10;

varb=20;

varc=a+b;

doucment.write(c);

这段代码有三条变量定义语句和一条信息输出语句，在定义变量时，我们同时给定义的变量赋值，第一、二条直接赋常量值（我们把不可变化的值叫常量值），而第三条则使用变量进行运算以后再把运算结果赋值给定义的变量，通过最后一条语句输出的信息为30。

在上面介绍的a+b是将两个变量进行求和运算，这与我们数学里的加法一样，我们也可以进行相减运算、乘法或除法运算如：

a-b;a*b;a/b;(注意编程里乘法符号用*号，除法用/号)。

以上的运算我们称为数学运算。数学运算要求运算的常量或变量要为数字才可以。

再看下面的代码：

varb1=true;

varb2=false;

varb=b1&&b2;

document.write(b);

和上例的代码类似，但这里的b1、b2我们称为布尔变量，布尔变量是一种特殊的变量，里面存放的值只能是true（表示真）或false（表示假）。

b1&&b2表示布尔运算（注意和数学运算不一样）（布尔运算结果还是布尔值，也就是true或false），表示将b1、b2进行“和”运算，“和”运算中如果有一个布尔值（或变量）为false结果变为false，否则结果为false。布尔运算使用在表示判断的语句中，是电脑实现逻辑分析处理的根本，在计算机中使用大量的逻辑运算（布尔运算），所以大家一定要掌握逻辑运算。

布尔运算除了有“和”运算之外，还有“或”、“非等几种。其中“或”运算与“和”运算相反，只要参与“或”运算的布尔值有一个为“true”，“非”运算只能用在一个布尔值（或变量）前，结果是将原来的值变反，如果原来的值是true，那么运算结果就为false，如果原来值是false，运算结果就是true。

举例如下：

varb=true&&true;//和运算，结果为true

********只有两边都为true结果才为true

varb=false&&false;//和运算，结果为false

varb=true&&false;//和运算，结果为false

varb=false&&true;//和运算，结果为false

varb=true

||true;//或运算，结果为true

varb=false

||false;//或运算，结果为false

********只有两边都为false结果才为false

varb=true

||false;//或运算，结果为false

varb=false

||true;//或运算，结果为false

varb=!true;//非运算，结果为false

*********与原值相反

varb=!false;//非运算，结果为true

*********与原值相反

好了，这次先学习这么多，我都觉得有些累了，对于刚学习编程的朋友来说可能一时接受不了太多，我们下次课再见。（待续）

网页编程入门（七）作者：吴刘平

文章来源：作者原创

更新时间：2006-8-16

由于近来网络不太畅通，同时有些琐事不断缠身，所以未能及时为大家继续讲解有关网页入门的知识，在此向大伙深表歉意。

在前面我们学习编写的程序语句中，计算机在执行的时候总是从第一条开始，一条一条地顺序往下执行，这是最常见的也是最基本的执行方式。

想一想我们日常生活中，我们做事情也是这样，一件一件地做，这是最常规的方式。可是我们在从事各种工作、生活活动的过程中，不可能总是按这样的顺序来执行，我们总是根据实际情况，先做一下判断，然后选择做某件事而不做另一件事，计算机在执行程序的过程中也如此。

我们在编写计算机程序时，有一种语句我们称之为判断语句，计算机在执行这样的语句时，要进行一次判断才决定执行哪些操作。

例如：

<scriptlanguage=javascript>

varcd=newDate();

varct=cd.getHours();

vartimestr="";

if(ct<12)

{

timestr="上午";

}

else

{

timestr="下午";

}

document.write(timestr

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

网页编程入门1

文档简介

温馨提示

最新文档

评论

网页编程入门1

文档简介

温馨提示

最新文档

评论

相关文档