墨白

相对于人生易老,朱颜易改,大概最易变的还是人心。

博客园 首页 新随笔 联系 订阅 管理

定义  

Javascript是一种由Netscape的LiveScript发展而来的面向对象的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。当时服务端需要对数据进行验证,由于网络速度相当缓慢,只有28.8kbps,验证步骤浪费的时间太多。于是Netscape的浏览器Navigator加入了Javascript,提供了数据验证的基本功能。

  JavaScript 的正式名称是 "ECMAScript"。这个标准由 ECMA 组织发展和维护。ECMA-262 是正式的 JavaScript 标准。这个标准基于 JavaScript (Netscape) 和 JScript (Microsoft)。Netscape (Navigator 2.0) 的 Brendan Eich 发明了这门语言,从 1996 年开始,已经出现在所有的 Netscape 和 Microsoft 浏览器中。ECMA-262 的开发始于 1996 年,在 1997 年 7 月,ECMA 会员大会采纳了它的首个版本。
  在 1998 年,该标准成为了国际 ISO 标准 (ISO/IEC 16262)。这个标准仍然处于发展之中。

历史

  大概在1992年,一家称作Nombas的公司开始开发一种叫做C减减(C-minus-minus,简称Cmm)的嵌入式脚本语言。这个脚本语言捆绑在一个叫做CEnvi的共享软件产品中,当Netscape Navigator崭露头角时,Nombas开发了一个可以嵌入网页中的CEnvi的版本。这些早期的试验称为EspressoPage(浓咖啡般的页面),它们代表了第一个在万维网上使用的客户端脚本语言。而Nombas丝毫没有料到它的理念将会成为因特网的一块重要基石。

基本概念

  在这里只作简单介绍,在以后的例子中结程序再作具体解释其作用。
  1、运算符
  运算符就是完成操和的一系列符号,它有七类:
  赋值运算符(=,+=,-=,*=,/=,%=)、算术运算符(+,-,*,/,++,--)、比较运算符(>,<,<=,>=,==,!=)、逻辑运算符(||,&&,!)、条件运算(?:)、位移运算符(|,&)和字符串运算符。
  2、表达式
  运算符和操作数的组合称为表达式,通常分为四类:赋值表达式、算术表达式、布尔表达式和字符串表达式。
  3、语句
  Javascript程序是由若干语句组成的,语句是编写程序的指令。Javascript提供了完整的基本编程语句,它们是:
  赋值语句、switch选择语句、while循环语句、for循环语句、do while循环语句、break循环中止语句、continue循环中断语句、with语句、try...catch语句、
  if语句(if..else,if...else if ...)。
  4、函数
  函数是命名的语句段,这个语句段可以被当作一个整体来引用不着和执行。使用函数要注意以下几点:
  1)函数由关键字function定义;
  2)函数必须先定义后使用,否则将出错;
  3)函数名是调用函数时引用的名称,它对大小写是敏感的,调用函数时不可写错函数名;
  4)参数表示传递给函数使用或操作的值,它可以是常量,也可以是变量;
  5)return语句用于返回表达式的值,也可以没有。
  一般的函数都是以下格式:
  function myFunction(params){
  //执行的语句
  }
  函数表达式:
  var myFunction=function(params){
  //执行的语句
  }
  匿名函数,它常作为参数在其他函数间传递:
  window.addEventListener('load',function(){
  //执行的语句
  },false);
  5、对象
  Javascript的一个重要功能就是基于对象的功能,通过基于对象的程序设计,可以用更直观、模块化和可重复使用的方式进行程序开发。
  一组包含数据的属性和对属性中包含数据进行操作的方法,称为对象。比如要设定网页的背景颜色,所针对的对象就是document,所用的属性名是bgcolor,如document.bgcolor="blue",就是表示使背景的颜色为蓝色。
  6、事件
  用户与网页交互时产生的操作,称为事件。事件可以由用户引发,也可能是页面发生改变,甚至还有你看不见的事件(如Ajax的交互进度改变)。绝大部分事都由用户的动作所引发,如:用户按鼠标的按钮,就产生click事件,若鼠标的指针的链接上移动,就产生mouseover事件等等。在Javascript中,事件往往与事件处理程序配套使用。
  而对事件的处理,W3C的方法是用addEventListener()函数,它有三个参数:事件,引发的函数,是否使用事件捕捉。为了安全性,建议将第三个参数始终设置为false;
  MSIE的方法就是定义元素的on...事件,它就是W3C的方法中的事件参数前加一个“on”。学习Javascript比较快速有效的方法是先熟悉一些基本概念,然后找几个别人设计好的程序认真仔细地分析一遍,再稍作改动,再看看能否达到预期目的,不断地举一反三,既可以加深对一些参数、设计方法的理解,又可以快速地提高自己的水平。另外,再提醒一下:Javascript对大小写是敏感的,特别是一些对象、方法、属性的大小写一定要一致,要养成一种良好的习惯,否则在调试程序时可要累死你了。
  7、变量
  如 var myVariable = "some value";
  变量有它的类型,上例中myVariable的类型为string(字符串)
  javascript支持的常用类型还有:
  number:数(包括浮点数);
  boolean:布尔值,只有true和false两个值,是所有类型中占用内存最少的;
  null:一个空值,唯一的值是null;
  undefined:没有定义和赋值的变量

特点

  能够具有交互性,能够包含更多活跃的元素,就有必要在网页中嵌入其它的技术。如:Javascript、VBScript、Document Object Model(DOM,文档对象模型)、Layers和 Cascading Style Sheets(CSS,层叠样式表),这里主要讲Javascript。那么Javascript是什么东东?Javascript就是适应动态网页制作的需要而诞生的一种新的编程语言,如今越来越广泛地使用于Internet网页制作上。 Javascript是由 Netscape公司开发的一种脚本语言(scripting language),或者称为描述语言。在HTML基础上,使用Javascript可以开发交互式Web网页。Javascript的出现使得网页和用户之间实现了一种实时性的、动态的、交互性的关系,使网页包含更多活跃的元素和更加精彩的内容。 运行用Javascript编写的程序需要能支持Javascript语言的浏览器。Netscape公司 Navigator 3.0以上版本的浏览器都能支持 Javascript程序,微软公司 Internet Explorer 3.0以上版本的浏览器基本上支持Javascript。微软公司还有自己开发的Javascript,称为JScript。 Javascript和Jscript基本上是相同的,只是在一些细节上有出入。 Javascript短小精悍, 又是在客户机上执行的,大大提高了网页的浏览速度和交互能力。 同时它又是专门为制作Web网页而量身定做的一种简单的编程语言。
  JavaScript 使网页增加互动性。JavaScript 使有规律地重复的HTML文段简化,减少下载时间。JavaScript 能及时响应用户的操作,对提交表单做即时的检查,无需浪费时间交由 CGI 验证。JavaScript 的特点是无穷无尽的,只要你有创意。

与Java的不同

  Java之于Javascript就好比Car(汽车)之于Carpet(地毯)。
  ——来自Usenet上的Javascript讨论组
  很多人看到 Java 和 JavaScript 都有“Java”四个字,就以为它们是同一样东西,连我自己当初也是这样。其实它们是完完全全不同的两种东西。Java在客户端的运行的应用程序叫做 Java Applet,是嵌在网页中,而又有自己独立的运行窗口的小程序。Java Applet 是预先编译好的,一个 Applet 文件(.class)用 Notepad 打开阅读,根本不能理解。Java Applet 的功能很强大,可以访问 http、ftp等协议,甚至可以在电脑上种病毒(已有先例了)。相比之下,JavaScript 的能力就比较小了。JavaScript 是一种“脚本”(“Script”),它直接把代码写到 HTML 文档中,浏览器读取它们的时候才进行编译、执行,所以能查看 HTML 源文件就能查看JavaScript 源代码。JavaScript 没有独立的运行窗口,浏览器当前窗口就是它的运行窗口。它们的相同点,我想只有同是以 Java 作编程语言一点了。
  Java是由Sun Microsystems公司于1995年5月推出的Java程序设计语言和Java平台的总称。用Java实现的HotJava浏览器(支持Java applet)显示了Java的魅力:跨平台、动感的Web、Internet计算。从此,Java被广泛接受并推动了Web的迅速发展,常用的浏览器现在均支持Java applet。另一方面,Java技术也不断更新。
  Java平台由Java虚拟机(Java Virtual Machine)和Java 应用编程接口(Application Programming Interface、简称API)构成。Java 应用编程接口为Java应用提供了一个独立于操作系统的标准接口,可分为基本部分和扩展部分。在硬件或操作系统平台上安装一个Java平台之后,Java 应用程序就可运行。现在Java平台已经嵌入了几乎所有的操作系统。这样Java程序可以只编译一次,就可以在各种系统中运行。
  Java分为三个体系JavaSE,JavaEE,JavaME。

开发工具

  一个 JavaScript 程序其实是一个文档,一个文本文件。它是嵌入到 HTML 文档中的。所以,任何可以编写 HTML 文档的软件都可以用来开发 JavaScript。可以使用 FrontPage 2000 附带的 Microsoft 脚本编辑器(在 FrontPage 菜单 | 工具 | 宏 | Microsoft 脚本编辑器)编辑。它是个像 Visual Basic / C++ 一样的程序开发器,能对正在输入的语句作出简要提示。配合 FrontPage 2000,使工作量大大减少。常用的网页开发工具都能编辑Javascript

使用方法

  一、Javascript在网页的用法
  Javascript加入网页有两种方法:
  1、直接加入HTML文档
  这是最常用的方法,大部分含有Javascript的网页都采用这种方法,如:
  <script language="Javascript">
  <!--
  document.writeln("这是Javascript!采用直接插入的方法!");
  //-Javascript结束-->
  </script>
  在这个例子中,我们可看到一个新的标签: <script>……</script>,而<script language="Javascript"> 用来告诉浏览器这是用Javascript编写的程序,需要调动相应的解释程序进行解释。(w3c已经建议使用新的标准:<script type="txet/javascript">)
  HTML的注释标签<!--和-->:用来去掉浏览器所不能识别的Javascript源代码的,这对不支持 Javascript 语言的浏览器来说是很有用的。
  //-Javascript结束:双斜杠表示 Javascript的注释部分,即从//开始到行尾的字符都被忽略。 至于程序中所用到的document.write()函数则表示将括号中的文字输出到窗口中去, 这在后面将会详细介绍。 另外一点需要注意的是,<script>……</script>的位置并不是固定的,可以包含在<head>......</head> 或<body>.....</body>中的任何地方。
  还有一个更高级版本的嵌入脚本,它使用了HTML中的CDATA语法(Character Data,就是把CDATA中的文本全部当作纯文本处理,除非遇到CDATA的结束)
  <script language="javascript" type="text/javascript"><!--//--><!CDATA[[//><!--
  //javascript代码
  //--><!]]></script>
  2、引用方式
  如果已经存在一个Javascript源文件(以js为扩展名),则可以采用这种引用的方式,以提高程序代码的利用率。其基本格式如下:
  <script src=url language="Javascript"></script>
  其中的Url就是程序文件的地址。同样的,这样的语句可以放在HTML文档头部或主体的任何部分。 如果要实现“直接插入方式”中所举例子的效果,可以首先创建一个Javascript源代码文件“Script.js”,其内容如下:
  document.writeln("这是Javascript!采用直接插入的方法!");
  在网页中可以这样调用程序:<script src="Script.js" language="Javascript"></script> 。

在web编程中一些比较常用的javascript函数

  /**
  * 一些常用的javascript函数(方法)
  *
  * 为便于使用,均书写成String对象的方法
  * 把他保存为.js文件,可方便的扩展字符串对象的功能
  *
  * 方法名 功 能
  * ----------- --------------------------------
  * Trim 删除首位空格
  * Occurs 统计指定字符出现的次数
  * isDigit 检查是否由数字组成
  * isAlpha 检查是否由数字字母和下划线组成
  * isNumber 检查是否为数
  * lenb 返回字节数
  * isInChinese 检查是否包含汉字
  * isEmail 简单的email检查
  * isDate 简单的日期检查,成功返回日期对象
  * isInList 检查是否有列表中的字符字符
  * isInList 检查是否有列表中的字符字符
  */
  /*** 删除首尾空格 ***/
  String.prototype.Trim = function() {
  return this.replace(/(^\s*)|(\s*$)/g, "");
  }
  /*** 统计指定字符出现的次数 ***/
  String.prototype.Occurs = function(ch) {
  // var re = eval("/[^"+ch+"]/g");
  // return this.replace(re, "").length;
  return this.split(ch).length-1;
  }
  /*** 检查是否由数字组成 ***/
  String.prototype.isDigit = function() {
  var s = this.Trim();
  return (s.replace(/\d/g, "").length == 0);
  }
  /*** 检查是否由数字字母和下划线组成 ***/
  String.prototype.isAlpha = function() {
  return (this.replace(/\w/g, "").length == 0);
  }
  /*** 检查是否为数 ***/
  String.prototype.isNumber = function() {
  var s = this.Trim();
  return (s.search(/^[+-]?[0-9.]*$/) >= 0);
  }
  /*** 返回字节数 ***/
  String.prototype.lenb = function() {
  return this.replace(/[^\x00-\xff]/g,"**").length;
  }
  /*** 检查是否包含汉字 ***/
  String.prototype.isInChinese = function() {
  return (this.length != this.replace(/[^\x00-\xff]/g,"**").length);
  }
  /*** 简单的email检查 ***/
  String.prototype.isEmail = function() {
  var strr;
  var mail = this;
  var re = /(\w+@\w+\.\w+)(\.\w*)(\.\w*)/i;
  re.exec(mail);
  if(RegExp.!="" && RegExp.!="." && RegExp.!=".")
  strr = RegExp.+RegExp.+RegExp.;
  else
  if(RegExp.!="" && RegExp.!=".")
  strr = RegExp.+RegExp.;
  else
  strr = RegExp.;
  return (strr==mail);
  }
  /*** 简单的日期检查,成功返回日期对象 ***/
  String.prototype.isDate = function() {
  var p;
  var re1 = /(\d)[年./-](\d)[月./-](\d)[日]?$/;
  var re2 = /(\d)[月./-](\d)[日./-](\d)[年]?$/;
  var re3 = /(\d)[月./-](\d)[日./-](\d)[年]?$/;
  if(re1.test(this)) {
  p = re1.exec(this);
  return new Date(p[1],p[2],p[3]);
  }
  if(re2.test(this)) {
  p = re2.exec(this);
  return new Date(p[3],p[1],p[2]);
  }
  if(re3.test(this)) {
  p = re3.exec(this);
  return new Date(p[3],p[1],p[2]);
  }
  return false;
  }
  /*** 检查是否有列表中的字符字符 ***/
  String.prototype.isInList = function(list) {
  var re = eval("/["+list+"]/");
  return re.test(this);
  }

Javascript 脚本的调试

  随着用JavaScript编程的深入,你会开始理解那些JavaScript给出的不透明错误信息。一旦你理解了你常犯的一般性错误,你就会很快知道怎样避免它们,这样你写的代码中的错误将越来越少。编程实际上是一种能随着时间不断飞快进步的技术。但是不管变得多么熟练,你仍然要花一些时间调试你的代码。如果你做过家庭作业,或有过JacaScript编程经验,你会知道相当多的时间是花在调试上。这很正常 - 这只是编程者必须做的事之一。实际上,按照大量的研究,程序员平均百分之五十的时间花在解决代码中的错误。
  关键是学会怎样有效地调试你的程序。我有一些技巧可以帮助你解决程序为什么没有象应该的那样运行,或者帮你首先避免写有很多错误的代码:
  1.用不同方式打印出变量
  2.注意一般性错误
  3.编码之前先想好
  --------------------------------------------------------------------------------
  如果JavaScript没能捕获你的错误,你也没有通过查看代码发现错误,有时打印出变量会对你有所帮助。最简单的方法是象下面这样使用一个alert():
  // theGreeting gets a name using getName, then presents
  // one or two alert boxes depending on what the name is
  function getName()
  {
  var first_name = prompt("what's your first name?","");
  var last_name = prompt("what's your last name?","");
  var the_name = first_name + " " + last_name;
  alert("in getName, the_name is: " + the_name);
  }
  -------------------------------------------------------------------------------
  1.一般性程序错误
  多数错误只是无聊的语法错误。记住关闭那些引号,大括号和小括号会花费很长时间,不过幸运的是JavaScript自动错误检测器能捕获大部分此类错误。虽然JavaScript错误检测器随着日渐复杂的流览器而不断完善,但是一些错误仍会溜走。下面是一些需要留意的常见错误:
  2.混淆变量名或函数名
  大写和复数变量和函数名产生的错误令人烦恼地经常出现,有时JavaScript错误检测器不能捕获它们。通过建立和坚持使用一种对变量和函数的命名协定,会大大减少这些麻烦的数量。例如,我全部用小写字母定义变量,并用下划线代替空格 (my_variable,the_data, an_example_variable),用内置符号表示函数 (addThreeNumbers(), writeError()等)。我避免使用任何复数,因为我总是忘记那些变量是不是复数。
  3.偶然地使用了保留字
  一些字不能作为变量名,因为它们已经被JavaScript使用。例如,不能定义一个叫“if”的变量,因为它实际上是JavaScript的一部分 - 如果使用“if”,你会遇到各种麻烦。当你因为使用命名为“if”的变量而变得疯狂时,一个叫做“document”的变量是很诱人的。不幸的是,“document”是一个JavaScript对象。另一个经常遇到的问题是把变量命名为“name”(窗体元素有“names”属性)。把变量命名为“name”不会总出问题,只是有时 - 这会更使人迷惑 - 这就是避免使用“name”变量的原因。
  不幸的是,不同的流览器有不同的保留字,所以没有办法知道该回避哪些字。最安全的办法是避免使用已经成为JavaScript一部分的字和HTML使用的字。如果你因为变量遇到问题,并且不能发现哪儿错了,试着把变量改个名字。如果成功了,你或许就避开了保留字。
  4.记住在逻辑判断时应该用两个等号
  一些流览器能捕获这种错误,有些却不能。这是一种非常常见的错误,但是如果流览器不能替你指出来,你就很难发现。下面是一个这种错误的例子:
  var the_name = prompt("what's your name?", "");
  if (the_name = "the monkey")
  {
  alert("hello monkey!");
  } else {
  alert("hello stranger.");
  }
  这段代码将产生“hello monkey!”警告对话框 - 不管你在提示里敲的是什么 - 这不是我们希望的。原因是在if-then语句中只有一个等号,这句话告诉JavaScript你想让一件事等于另一件。假设你在提示中敲的是“robbie the robot”。最开始,变量the_name的值是“robbie the robot”,但是随后if语句告诉JavaScript你想把the_name设为“the monkey.”。于是JavaScript很高兴地执行你的命令,送一个“true”消息给if-then语句,结果警告对话框每次都出现“hello monkey!”。这种阴险的错误会使你发疯,所以注意使用两个等号。
  5.偶然给变量加上了引号,或忘了给字符串加引号
  我不时遇到这个问题。JavaScript区分变量和字符串的唯一方法是:字符串有引号,变量没有。下面有一个明显的错误:
  var the_name = 'koko the gorilla';
  alert("the_name is very happy");
  虽然the_name是一个变量,但是程序还会产生一个提示“the_name is very happy,”的警告对话框。这是因为一旦JavaScript看见引号包围着某些东西就不再考虑它,所以当你把the_name放在引号里,你就阻止了JavaScript从内存中查找它。下面是一个不太明显的此类错误的扩展(我们已经在第三天的课程里见过):
  function wakeMeIn3()
  {
  var the_message = "Wake up! Hey! Hey! WAKE UP!!!!";
  setTimeout("alert(the_message);", 3000);
  }
  这里的问题是你告诉JavaScript三秒后执行alert(the_message)。但是,三秒后the_message将不再存在,因为你已经退出了函数。这个问题可以这样解决:
  function wakeMeIn3()
  {
  var the_message = "Wake up!";
  setTimeout("alert('" + the_message+ "');", 3000);
  }
  把the_message放在引号外面,命令“alert('Wakeup!');”由setTimeout预定好,就可以得到你想要的。这只是一些可能在你的代码中作祟的很难调试的错误。一旦发现了它们,就有不同的或好或差的方法来改正错误。你很幸运,因为你能从我的经验和错误中获益。
  -------------------------------------------------------------------
  找到错误,有时候虽然很难,却只是第一步。然后你必须清除错误。下面是一些在清除错误时应该做的一些事:
  
  首先拷贝你的程序

  有些错误很难清除。实际上,有时在根除错误时,你会破坏整个程序 - 一个小错误使你疯狂。在开始调试前保存你的程序是确保错误不会利用你的最好方法。
  一次修正一个错误
  如果你知道有好几个错误,应该修正一个,检验其结果,再开始下一个。一次修正许多错误而不检验你的工作只会招致更多的错误。
  警惕迷惑性错误
  有时你知道存在一个错误,但不真正知道为什么。假设有一个变量“index”,由于某种原因“index”总比你期望的小1。你可以做下面两件事中的一件:在那儿坐一会儿,解决它为什么变小了,或只是耸耸肩;在使用“index”之前加1,然后继续进行。后一种方法称为迷惑编程。当你开始思考“究竟是怎么了 - 为什么index是2而不是3呢?好吧...我现在先让它正常工作,以后再修改错误。”时,你正在把一块护创膏布贴到一处潜在的硬伤上。
  迷惑编程可能在短期内有用,但是你可以看到长期的厄运 - 如果你没有完全理解你的代码到可以真正清除错误的程度,那个错误将会回来困扰你。它或者以另一种你不能解决的怪异错误的方式回来,或者当下一个可怜的被诅咒的灵魂读你的代码时,他会发现你的代码非常难以理解。
  寻找小错误
  有时候,对程序员来说,剪切和粘贴代码的能力是一种很坏的事。通常,你会在一个函数中写一些JavaScript代码,然后把它们剪切和粘贴到另一个函数中。如果第一个函数有问题,那么现在两个函数都有问题。我并不是说你不应该剪切和粘贴代码。但是错误会以某种方式繁殖,如果你发现了一个错误,你就应该寻找与其相似的其它错误。(或者在制作它的若干版本之前确切知道会发生什么。)变量名拼写错误在一段JavaScript代码中会突然多次出现 - 在一个地方把the_name错拼成teh_name,你就有机会在其它地方发现这个错误。
  如果所有其它的方法都失败了
  如果你正坐在那儿盯着一个错误,并且不能指出是怎么回事(或者根本没有发现错误,但是因为程序不能正确运行,你知道存在错误),你最好从计算机前走开。去读一本书,在角落散散步,或者拿一杯可口的饮料 - 做些事,任何事,但不要去想程序或问题。这种技术在某种情况下叫做“酝酿”,效果非常好。在你稍做休息和放松后,再试着找出错误。你会得到一幅比较清晰的景象。“酝酿”起作用是因为它使你从思维混乱中解脱出来。如果沿着一条错路走太远,你有时会发现无法转身。这种情况下最好开辟一条新路。我知道这会令人发火,但确实有效。真的!
  如果上面的方法还不成功...
  请求别人的帮助。有时你的思想会形成定式,只有换一种眼光才能洞察问题之所在。在结构化编程环境中,程序员们定期地互相复查别人的代码。这可以适当地叫做“代码复查”,不仅可以帮助消除错误,还可以得到更好的代码。不要怕把你的JavaScript代码给别人看,它会使你成为更好的JavaScript程序员。
  
  但是消除错误的绝对最好的办法是...

  一开始就创建没有错误的代码。
  ----------------------------------------------------------------------
  编好程序的关键是程序是写给人的,不是写给计算机的。如果你能明白其他人或许会阅读你的JavaScript,你就会写更清晰的代码。代码越清晰,你就越不容易犯错误。机灵的代码是可爱的,但就是这种机灵的代码会产生错误。最好的经验法则是KISS,即Keep It Simple,Sweetie(保持简单,可爱)。另一个有帮助的技术是在写代码之前作注释。这迫使你在动手之前先想好。一旦写好了注释,你就可以在其下面写代码。
  下面是一个用这种方法写函数的例子:
  第一步:写注释
  第二步:填充代码
  这种先写注释的策略不仅迫使你在写代码前思考,而且使编码的过程看起来容易些 - 通过把任务分成小的,易于编码的各个部分,你的问题看起来就不太象珠穆朗玛峰,而象一群令人愉悦的起伏的小山。
  最后... 总以分号结束你的每一条语句。
  虽然并不是严格必需,你应该养成以分号结束每一条语句的习惯,这样可以避免这行后面再有代码。忘了加分号,下一行好的代码会突然产生错误。把变量初始化为“var”,除非你有更好的理由不这样做。用“var”把变量局域化可以减少一个函数与另一个不相关函数相混淆的机会。
  好了,既然你已经知道了如何编码,下面就让我们学习怎样使
  你的JavaScript快速运行。>>
  ---------------------------------------------------------
  按速度优化JavaScript代码
  1.限制循环内的工作量
  2.定制if-then-else语句,按最可能到最不可能的顺序
  3.最小化重复执行的表达式
  使用调试工具
  如果你是Firefox的用户,那么你可以到添加组件的网页中搜索一些用于网页开发的组件
  推荐:Firebug
  一款非常优秀的组件,可以指出你的脚本中的错误,查看DOM树,并且还有CSS的调试工具

编写第一个JavaScript程序

  <html>
  <head>
  <Script Language ="JavaScript">
  // JavaScript Appears here.
  alert("这是第一个JavaScript例子!");
  alert("欢迎你进入JavaScript世界!");
  alert("今后我们将共同学习JavaScript知识!"); </Script>
  </Head> </Html>
  JavaScript代码由 <Script Language ="JavaScript">...</Script>说明。在标识<Script Language ="JavaScript">...</Script>之间就可加入JavaScript脚本。 alert()是JavaScript的窗口对象方法,其功能是弹出一个具有OK对话框并显示()中的字符串。 通过<!-- ...//-->标识说明:若不认识JavaScript代码的浏览器,则所有在其中的标识均被忽略;若认识,则执行其结果。使用注释这是一个好的编程习惯,它使其他人可以读懂你的语言。 JavaScript 以 </Script> 标签结束。

第三方Javascript(库)

  库,指得是可以方便应用到现有开发体系中的、现成的代码资源。库不仅为大部分日常的DOM教本变成工作提供了快捷的解决方案,而且也提供了许多独特的工具。虽然库使用起来很方便,但它们也并非能解决你所有的问题。在使用库之前,一定要保证真正理解javascript的DOM原理。
  这些库一般是一个(或多个)js文件,只要把他们导入你的网页就能使用了,常用的库有:
  DOMAssistant http://www.robertnyman.com/domass/
  jQuery http://jquery.com/
  MochiKit http://mochikit.com/
  Prototype http://prototypejs.org/
  YUI(Yahoo! User Interface) http://developer.yahoo.com/yui/
  不建议你把这些库全部下载并导入你的网页,因为它们的文件都是很大的,很容易影响网页的下载速度,你可以选择其中一个你需要的。
  在下载前请确认这些库的使用许可。
  下面一一介绍这些库的主要功能
  DOMAssistant
  是一个轻量级和模块化的库,对于保持文件的最小化很合适。虽然缺少Ajax通信方法意味着你可能还需要其他库来获得相应功能,但考虑到Ajax对网站的破坏,这也不一定是一件坏事。此外,使用这个库选择元素有一点受限——只包含通过id和通过classname两种方法。而这方面其他库有更高级的CSS选择符的选择方法。
  操作DOM文档的说明:http://www.robertnyman.com/domass/modules-domass-content.htm
  jQuery
  是一个快速、简明的javascript库,它能够简化遍历HTML文档、处理事件、生成动画以及为网页添加Ajax交互功能的过程。通过jQuery极其强大的选择方法,可以组合使用CSS3(甚至包括元素的属性选择符)、Xpath(XML的一种定位语言)的选择符取得DOM元素。而简化的Ajax和事件方法与连缀语法的结合运用,则能够让代码更整洁也更容易理解。在jQuery背后有一个非常大的社区,其中许多插件开发者为这个库添加了很多超出其基本功能之外的特性
  要了解jQuery与其他库的更多注意事项,请参考http://docs.jquery.com/Using_jQuery_with_Other_Libraries/
  操纵DOM文档的说明:http://docs.jquery.com/DOM/Mainpulation/
  MochiKit
  据其网站说,MochiKit ”让Javascript不那么差劲“。经过了完备的测试而且文档也很完善的MochiKit库,也提供了与其他库相同的DOM操作方法。而且通过将色彩和视觉效果,以及它自己的调试用的日志面板整合起来,使得其他库变得不再必要。此外,这个库中的自定义事件和内置的拖放支持也会使创建Web应用程序更加容易。
  操纵DOM文档的说明:http://www.mochikit.com/doc/html/MochiKit/DOM.html
  Prototype
  Prototype ”是一个针对简化动态Web开发的框架“。这个库中还包含许多好用的DOM操作函数,以及一个比众所周知的$()函数更加流行的Ajax对象。Prototype唯一不足的地方就是它缺乏对命名空间的支持,也就是说在将它与其他的库公用时还不够方便。
  操纵DOM文档的说明:http://www.prototypejs.org/api/element/
  
  YUI

  YUI库是一组以javascript编写的,为使用诸如DOM脚本、DHTML以及Ajax等技术构建丰富的交互式Web应用而开发的实用工具和控件的集合。YUI库中也包含一些核心的CSS资源。YUI库拥有庞大的开发者社区以及大量的文档。这个库中包含了从简单的DOM操作到高级效果以及全部功能饰件(widget)在内的、你所能够想象出来的各种特性。虽然这个库整体上划分成了许多小文件和命名空间,但有为了确定要使用哪个文件和找到这个文件也是件令人烦恼的事——仅仅从简单的说明就长达20页就能看出这个库有多大来。
  操纵DOM文档的说明:http://developer.yahoo.com/yui/dom/
posted on 2009-02-08 19:53  墨白  阅读(349)  评论(0编辑  收藏  举报