札记

函数的声明,有两种:

1.var 函数名=function(parameter){}

2.function 函数名(parameter){}

// {}中每行必须用semi-colon结尾;

 

对象

创建方法:

1. var myObj={

type:'fancy',

disposition:'sunny',

};

var emptyObj={};   //直接创建

2.对象构造器

var myObj=new Object();

添加属性有两种方法:

1. myObj["name"]="Charlie";

2. myObj.name="Charlie";

3.自建构造器constructor

function myObj(){}

myObj1=myObj();

 

添加方法的两种方法:

literal notation:

var someObj = {

aProperty: value,

someMethod: function(some, params) { }

};

constructor notation:

function someObject() {

this.someMethod = function() {

};

}

 

var aProperty="job";

console.log(james[aProperty]);

is the same as:

console.log(james["job"]) or console.log(james.job);

而:var aProperty=(james.job)  ===  james.james.job;

var aProperty= "programmer" something like: console.log(james.programmer) whereas programmer (or james.job) is not a property of james so it is undefined.

 

curly bracket 花括号

parenthese 括号

精粹 第一、二章 精华,语法

1、注释

     在JS中,/* */也可能出现在正则表达式上,所以块注释对于被注释的代码来说不安全,例如:
     /*
          var rm_a=/a*/.match(s);
     */
     导致了一个语法错误,所以,避免使用/* */注释,而用//注释代替;
 
2、标示符
     不能使用保留字,标示符被用于语句,变量,参数,属性,运算符和标记;
     
3、数字
     JS只有单一的数字类型,它在内部被表示为64位浮点数,与大多数编程语言不一样,它没有分离出整数类型,所以1和1.0是相同的值;
     如果一个数字字面量有指数部分,那么这个字面量的值是由e前面的部分乘以10的e后部分次方计算出来的;
     NaN是一个数值,它表示一个不能产生正常结果的运算结果。NaN不等于任何值,包括自己,可以用函数isNaN(number)检测NaN;
     值Infinity表示所有大于1.797e+308的值;
     数字拥有方法,JS有一个Math对象,可以与用如Math.floor(number)方法将一个数字转换成一个整数;
 
4、字符串
     字符串可以包括在单引号和双引号中,它可能包含0个或多个字符。\是转义字符。所以字符都是16位;
     JS没有字符类型,要表示一个字符,只须包含一个字符的字符串即可;
     转义字符允许把那些正常情况下不被允许的字符插入到字符串中,比如反斜杠,引号和控制字符。\u
 
5、语句
     for in语句对一个对象的所有属性名进行枚举;
 
6、表达式
     最简单的表达式是字面量值,变量,内置的值,以new前导的调用表达式,以delete前导的属性存取表达式

w3school JS 高级

浏览器检测

     JS包含一个名为Navigator的对象,包含了有关访问者的信息,包括浏览器类型,版本等等;
     Navigator对象有两个属性,appName保存浏览器类型,appVersion存有浏览器的版本信息;
     // 在IE5.0及以后的版本中,版本号是不正确的。
    
JS cookie
     存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个cookie。可以使用JS来创建和取回cookie的值;
     创建和存储cookie
     
JS 表单验证
     在数据被送往服务器前对HTML表单中的这些输入数据进行验证;
     必填或必选项目;
     E-mail验证;
     
JS 动画
JS 地图

W3school JS 对象

JS 对象简介

     JS是面向对象的程序语言,使我们能够自定义对象和变量类型; //对象只是一种特殊的数据,对象拥有属性和方法
     属性,指与对象有关的值;
     方法,指对象可以执行的行为(或可以完成的功能);
     
JS 字符串对象
     字符串对象用来处理已有的字符块;
     
JS 日期对象
     定义日期,可以通过new关键字来定义Date对象;
     操作日期,setFullYear;
     比较日期;
 
JS 数组对象
     使用单独的变量来存储一系列的值;
     定义数组,使用new来创建数组对象;
     有两种向数组赋值的方法,1: var mycars=new Array() 或 var mycars=new Array(3);
                                            2: var mycars=new Array("saab","Volvo","BMW");
     访问数组,通过制定数组名以及索引号码,可以访问特定元素;
     修改已有数组中的值,只要向制定下标号添加一个新值即可:mycars[0]="opel";
 
JS 逻辑对象
     Boolean对象用于将非逻辑值转换为逻辑值(true或false);
     创建逻辑对象,使用关键词new来定义; //若漏极对象无初始值或者其值为0、-0、null、“”、false、undefined或者NaN,那么对象值为false。否则为true(即使当自变量为字符串"false"时)
     
JS 算术对象
     执行常见的算术任务;
     Math对象提供多种算数值类型和函数;
     算数值,提供8种可被Math对象访问的算数值;
     算数方法,round方法进行四舍五入,random()方法返回一个介于0和1之间的随机数;
 
JS RegExp对象
     用于规定在文本中检索的内容;
     定义RegExp,RegExp用来存储检索模式;
     RegExp有三个方法:test(),exec()以及complie();
     test()方法检索字符串中的指定值。返回true或false;
     exec()方法检索字符串中的指定值。返回被找到的值;
     complie()用于改变RegExp,既可以改变检索模式,也可以添加或删除第二个参数;
 
JS HTML DOM对象
     除了内置的JS对象外,还可以通过JS访问并处理所有的HTML DOM对象;
     HTML DOM定义了用于HTML的一系列标准的对象,以及访问和处理HTML文档的标准方法;
     

w3school JS 基础

如何实现JS

 

     在老浏览器中避免把脚本内容当做页面内容显示,使用HTML注释标签。 
     <!–
     document.write("h")
 
JS语句
     JS语句是发给浏览器的命令。这些命令是告诉浏览器要做的事情;
JS代码
     JS代码是JS语句的序列;
JS代码块
     JS语句的组合;
 
JS注释
     单行用 //;
     多行用/*开头,*/结尾;
     用注释来防止执行, //document.write();
     句末注释,document.write();//输出;
 
JS变量
     变量是用来存储信息的容器:x=5;
     规则:a,区分大小写;b,以字母和下划线开始;
     声明变量:var x;
     向变量赋值: x = 5;
     向未声明的变量赋值: x=5;      //与声明过的相同效果
     重新声明变量:var x=5; var x; //重新声明不会改变原始值
    
JS运算符
     算术运算符: + – * / % ++ — ; //用于执行变量与/或值之间的算术运算
     赋值运算符:=      +=      -=      *=      /=    %=;  //对字符串和数字进行加法运算:结果为字符串
     比较运算符:==     ===(全等 值或类型)     !=     <     >     >=     <=;  //测定变量或值是否相等
     逻辑运算符:&&     ||     !; //用于测定变量或值之间的逻辑
     条件运算符,语法:variablename=(condition)?value1:value2; //基于条件对变量赋值  greeting=(visitor=="PRES")?"Dear President ":"Dear"
 
JS If语句
     If语句,语法:if(条件){条件成立时的代码};
     If…else语句;
     If…else if…else,语法: if(条件1)
                                                  {条件成立时代码} 
                                       else if(条件2)
                                                  {条件成立时} 
                                        else{条件1和2都不成立时}
 
JS Switch语句
     语法:     swich(n)               //(n)既可以是表达式,也可以是变量。然后表达式中的值与case中的数字作比较。
                               {
                                   case 1:
                                        执行代码块 1
                                        break
                                   case 2:
                                        执行代码块 2
                                        break
                                   default:
                                        如果n既不是1也不是2,则执行此代码
                              }
 
JS 消息框
     可以在JS中创建三种消息框:警告框,确认框,提示框;
     警告框,语法:      alert("文本");     //用于确保可以得到某些信息
     确认框,语法:     confirm("文本");     //用于使用户可以验证或者接受某些信息,确认为true,取消为false
     提示框,语法:     prompt("文本","默认值");     //用于提示用户在进入页面钱输入某个值,确认为输入的值,取消为null
 
JS 函数
     函数是由事件驱动的或者当它被调用时执行的可重复使用的代码;
     函数在页面起始位置定义,即<head>部分。
     定义函数,语法:     function 函数名(var1,var2,…,varx){
                                                                                        代码}   //var1,var2等指的是传入函数的变量或值
     return语句  //规定从函数返回的值
     生存期:在函数内声明变量,就只能在该函数内访问变量,若在函数之外声明,则页面所有函数都可以访问;
 
JS For 循环
     循环是用来将同一段代码执行指定的次数(或者当指定的条件为true时);
     for循环,在脚本的运行次数已确定的情况下使用for循环,语法: for(变量=开始量; 变量<=结束值;变量=变量+步进值){
                                                                                                                                                                需执行的代码};
 
JS While 循环
     while循环用于在指定条件为true时循环代码,语法: while(变量<=结束值){
                                                                                                                需执行的代码}
     do…while 循环,是while循环的变种。该循环程序在初次运行时会首先执行一遍其中的代码,然后当指定的条件为true时,它会继续循环。所以,     
     do…while循环为执行至少一次其中的代码,即使条件为false,因为其中代码执行后才会进行条件验证;
 
JS Break和Continue
     这是两种可用在循环内部的特殊语句;
     Break命令可以终止循环的运行,然后继续执行循环以后的代码;
     Contine命令会终止当前的循环,然后从下一个值继续执行: for(i=0;i<=10;i++){
                                                                                                                        if(i==3){continue}
                                                                                                                        document.write("the number is " + i)
                                                                                                                        document.write("<br />")}
 
JS For…in声明
     用来遍历数组或者对象的属性(对数组或者对象的属性进行循环操作);
     for…in循环中的代码每执行一次就会对数组的元素或者对象的属性进行一次操作,语法: for (变量 in 对象){ 执行代码 };
     
JS 事件
     事件是指可以被JS侦测到的行为; //鼠标点击、页面或图像载入、鼠标悬浮于页面的某个热点上、在表单中选取输入框、确认表单、键盘按键
     onload和onUnload,当用户进入或离开页面时就会触发这两个事件;
     onload用来检测访问者的浏览器类型和版本,然后根据这些信息载入指定版本的网页; //这两个事件也用来处理用户进入或离开页面时所建立的cookies。
     onFocus,onBlur和onChange,通常互相配合用来验证表单。
     onSubmit,用来在提交表单之前验证所有的表单域。
     onMouseOver和onMouseOut,用来创建’动态的“按钮;
 
JS Try…Catch 语句
     用来测试代码中的错误;
     在网页中捕获错误的方法:使用try…catch语句、使用onerror事件  // chrome和opera、safari不支持onerror事件
     try…catch语句,try部分包含所需运行的代码,而catch部分包含错误发生时运行的代码,语法:try{ 代码}catch(err){错误代码}
     
JS Throw声明
     声明的作用是创建exception。和try…catch声明配合使用,以达到控制程序流并产生精确错误消息的目的;
 
JS onerror事件
     只要页面中出现脚本错误,就会产生onerror事件;
     如需利用onerror事件,则必须创建一个错误处理的函数,叫做onerror事件处理器。这个事件处理器使用三个参数来调用:msg(错误信息),url(发生错误的页面url),line(发生错误的代码行),语法: onerror=handleErrfunciton handleErr(msg,url,l){//handle the error here}
     
JS 特殊字符
     使用反斜杠来向文本字符串添加特殊字符;
     反斜杠用来在文本字符串插入省略号、换行符、引号和其他特殊字符;
     

第二章 使用JavaScript

1、<script>元素

HTML4.01为<script>元素定义了5个属性。
charset:可选
defer:可选。表示脚本可延迟到文档完全被解析和显示后再执行。
language:已废弃。
src:可选。表示包含要执行代码的外部文件。
type:必需。可以看做是language的替代属性;表示编写代码所使用的脚本语言内容类型(称为MIME)。实际上,服务器在传送JS文件时使用的MIME类型通常是application/x-javascript,但在type中设置这个值会被忽略。
 
如果要通过<script>元素来包括外部JS文件,那么src属性不可少,例如:
<script type="text/javascript" src="example.js"> </script>
如果在XHTML文档中,也可以省略</script>,如
<script type="text/javascript" src="example.js"/> 
但是不能再HTML中使用。原因是不符合HTML规范,也不能得到浏览器的正确解析。
 
2、标签的位置
<script>应该都放在页面<head>元素中,例如
<html>
     <head>
          <title>example</title>
          <script type="text/javascript" scr="example.js"></script>
     </head>
     <body>
     </body>
</html>
这样的做法目的是把所有外部文件的引用都放在相同的地方。可是,在文档head元素中包含所有JS文件,意味着必须等到全部JS代码都被下载,解析和执行完成后,才能开始呈现页面的内容。对于需要很多JS代码的页面来说,将JS引用放在body元素中。
 
3、延迟脚本
defer属性,用于不影响页面构造,等页面解析完毕后再运行,与将script元素放在页面最底部效果相同。
 
4、XHTML中的用法
XHTML中较严格,若使用特殊字符需要用CData来包含JS代码,如:
<script type="text/javascritpt"><![CDATA[
    function...
]]></script>
若不兼容XHTML,则:
<script type="text/javascritpt">
//<![CDATA[
          function
//]]>
</script>
 
5.嵌入代码以及外部文件
尽可能使用外部文件,但是也可以看情况嵌入代码。
 
6、文档类型
规范浏览器行为。
 
7、<noscript>元素
仅在两种情况下显示出来:
  • 浏览器不支持脚本
  • 支持但被禁用
小结

将JS插入到HTML页面中需要script元素,可以把代码与标记混合,或者包含外部文件。
  • 都必须type属性
  • 包含外部文件时,src必需设置URL。而这个文件既可以是包含位于同服务器的还可以使其他域的文件。
  • script元素按顺序被解析
  • defer适用范围。

第一章 JS简介

1、JavaScript与ECMAScript

JavaScript比ECMA-262规定的要多。
其包括:
  • 核心(ECMAScript)
  • 文档对象模型(DOM)
  • 浏览器对象模型(BOM)
2、ECMA规定的内容

  1. 语法
  2. 类型
  3. 语句
  4. 关键字
  5. 保留字
  6. 操作符
  7. 对象
3、DOM

文档对象模型是针对XML但经过扩展用于HTML的应用程序编程接口(API,Application programming Interface)。
DOM1级主要目标是映射文档结构,DOM2级在DOM基础上扩充了鼠标和用户界面事件、范围、遍历等细分模块,而且通过对象接口增加了对CSS的支持。
 
4、BOM
使用BOM控制浏览器显示的页面以外的部分。
 
小结
JavaScript是一种专为与网页交互而设计的脚本语言,由下列三个不同部分组成:
ECMAScript,由ECMA-262定义,提供核心语言功能;
DOM,提供访问和操作网页内容的方法和接口。
BOM,提供与浏览器交互的方法和接口。

HTML5 API

DOM标准现在是HTML5的一部分。

 

多媒体、交互性、互动性

内置APIs:

  • 音频、视频API
  • inline editing API
  • 办公应用API
  • 历史API
  • Web协议API
  • 拖拽API

相应APIs:

  • 地理定位API
  • 2D绘画API
  • 本地存储API
  • Web workers API
  • Web sockets API
  • messaging API

HTML5 New Tags

 

结构标签   有7

<section></section>

<section> 标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。

<article></article>

<article> 标签定义独立的内容。

可能的 article 实例:

  • 论坛帖子
  • 报纸文章
  • 博客条目
  • 用户评论

HTML5

HTML5是HTML4和DOM的进化。
对标记的重新定义和简化。
标准化基础的API。
浏览器程序平台化的进化。
 
新特性:
新的语义化元素和属性。
创建web应用的内置API。
附加对音频和视频的支持。
HTML5将会减少对插件的需求。
 
HTML5与HTML4的不同点:
  • HTML5能够取代HTML4、XHTML1.0、DOM level2.
  • DOCTYPE更加简化了:
HTML4
<meta http-equiv="Content-Type" content="text/html"; Charset="UTF-8" />
HTML5
<meta charset="UTF-8" />
  • HTML的表单:Web Forms 2.0整合进入HTML5,PUT以及DELETE现在被支持。
  • 整合的APIs:音频、视频、离线应用、内容编辑、拖拽、历史、协议
  • 其他的APIs:地理定位、信息发送