javascript若干要点总结.ppt

1、RegExp 对象表示正则表达式，它是对字符串执行模式匹配的强大工具 。 创建 RegExp 对象的语法： new RegExp(pattern, attributes);,JavaScript RegExp 正则表达式,正则表达式中有许多特殊字符，在这里列出常用字符：, 做为转意，即通常在“”后面的字符不按原来意义解释，如/b/匹配字符“b”，当b前面加了反斜杆后/b/，转意为匹配一个单词的边界。 匹配一个输入或一行的开头，/a/匹配“an A”，而不匹配“An a“。 $ 匹配一个输入或一行的结尾，/a$/匹配“An a”,而不匹配“an A”。 abc查找方括号之间的任何字符。 abc查

2、找任何不在方括号之间的字符。 0-9查找任何从 0 至 9 的数字。 a-z查找任何从小写 a 到小写 z 的字符。 A-Z查找任何从大写 A 到大写 Z 的字符。 A-z查找任何从大写 A 到小写 z 的字符。 例：匹配32位的16进制字符串，正确的写法应为： var reg = /0-9A-F32/;,正则表达式可用来验证、匹配字符串，在网页前端使用正则表达式可以提高效率和安全性。,/验证用户名 (只能输入5-20个以字母开头、可带数字、“_”、“.”的字串) function isRegisterUserName(s) var patrn = /a-zA-Z1(a-zA-Z0-9|._)

3、4,19$/; if (!patrn.exec(s) return false; else return true; ,/验证手机号是否正确 function regIsPhone(fData) var reg = /(13,5,8d9)$/; return reg.test(fData); RegExp 对象方法 compile编译正则表达式。 exec检索字符串中指定的值。返回找到的值，并确定其位置。 test检索字符串中指定的值。返回 true 或 false。 正则表达式除了可以用来检测、验证字符串之外，还可以对字符串中的数据进行替换、检索等操作。,DOM文档对象模型,文档对象模型（D

4、ocument Object Model，简称DOM）,1）DOM树定义了HTML/XML文档的逻辑结构，给出了一种应用程序访问和处理XML文档的方法。 2）在DOM树中，有一个根节点，所有其他的节点都是根节点的后代。 3) 在应用过程中，基于DOM的HTML/XML分析器将一个HTML/XML文档转换成一棵DOM树，应用程序通过对DOM树的操作，来实现对HTML/XML文档数据的操作。,关于节点的访问,DOM中提供了忽略节点结构直接访问节点的功能 1. document.getElementById() 此方法可以无视文档结构直接访问节点，这样可以快速的获得一个节点进行后续操作。 2. ge

5、tElementsByTagName() 它通过标签名tagName来获取当前节点node的所有元素子节点中标签名是tagName的所有子节点列表。 例如： b1 b2 b3 在这里，document.getElementsByTagName(b).length 将得到3。表示该文档中共有3个b标签的子节点。,使用document文档对象可以创建DOM支持的任何类型的节点，在HTML中经常使用的有下面几种：,1.document.createElement(tagName) 创建一个指定标签名的元素节点，标签名可以是任何名字。 2.document.createTextNode(text) 创

6、建一个文本节点，并以text参数为文本的值。 3.node.cloneNode(deep) 克隆节点，此方法可以完全复制当前节点的所有属性，如果deep参数为true，还会复制当前节点的所有子节点。在大批量创建节点操作中，此方法效率较高。,innerHTML属性,通过innerHTML属性可以完成例如节点创建、删除、修改等操作，非常方便。 通常在javascript代码中，用innerHTML可以直接动态操作DOM节点，效率较高，而且使得代码易维护。,JS + CSS,通过javascript，可以对css进行控制。主要有以下几点： 1. 基本样式控制 2. 定位控制 2.1 文档流 2.2

7、浮动定位 2.3 相对定位 2.4 绝对定位,通过javascript可以动态改变原先页面中元素的样式，这些样式包括了背景色，字体颜色，字体大小，边框等。 例如：var para = document.getElementById(example);/改变style的属性para.style.color= red;alert(para.style.color);para.style.fontSize = 2em; 也可以直接更改样式名称： document.getElementById(t1).removeAttribute(class); document.getElementById(t1

8、).className = “newclass; document.getElementById(t2).setAttribute(class,current);,定位控制,1.文档流 文档流，指的就是在不使用其他的与排列和定位相关的特殊css规则时，各种元素的排列规则。它限定了html元素中出现的顺序，也就是说后面的元素永远不会出现在前面，具体详情可以参考链接： 2.浮动定位 浮动定位类似于table中的左右对齐属性align。适合进行页面大框架的布局使用。float:left和float:right可以对div或span进行浮动定位。 3.相对定位 position:relative,配合

9、指定的偏移量使用。它可以使元素相对于自己所处的原有位置进行偏移。,4.绝对定位 position:absolute; 也需要配合偏移量。 绝对定位和相对定位是可以配合使用的。举一个本人工作中的例子： 需要在页面的图片上覆盖2个div层，用来添加向左和向右按钮函数，这个时候，可以把整个图片的position:relative，然后里面的div是absolute，并且设置一定的偏移量，让坐标位置精确，最后用两张透明图片做div的背景，添加自定义函数就可以了。这个方法比较实用。,左边div,右边div,多媒体内容管理,Image 对象 Image 对象代表嵌入的图像。 标签每出现一次，一个 Imag

10、e 对象就会被创建。 Image 对象的常用属性 src设置或返回图像的 URL width读取或设置图片的宽度 height读取或设置图片的高度 alt读取或设置无法显示图像时的文本 动态创建Image对象： var img = new Image(); img.src=“路径”; /最重要的一步，必须附加到当前的DOM树中 document.body.appendChild(img);,标签,标签是在html中展示多媒体文件所使用的，如flash,mp3,midi,wav文件等。 使用方法： 标签的常用属性： src媒体文件路径，相对或绝对都可以 autostart是否自动播放，true为

11、自动，false为不自动 loop循环播放次数 starttime设置文件的播放起始时间 controls设置面板显示样式，controls=console全界面，smallconsole不显示视频窗口 例如：一个自动播放音乐并循环两次的embed标签定义格式如下： ,面向对象的javascript,JavaScript 是面向对象的编程语言。在js中对象一般采用函数来定义，声称对象的三种方法： 1.函数构造法 function funcName(); 2.对象生成法 var obj=; obj.x=1; obj.y=2; 3对象直接生成法： var obj=x:1,y:2,function

12、Person()var p1=new Person();var p2=new Person();alert(p1=p2);/这里结果是false，因为地址不相等var p3=p2;alert(p3=p2);/这里是true /定义一个类（原型对象）function Cat() /看起来和函数一样的，主要是看怎么去用Cat();/这样用，它就是一个函数var cat1 = new Cat();/这里cat1就是一个对象（实例）了；/定义这个对象的属性=小白;cat1.age=3;cat1.color=白色;/从上面可以看出：/1、JS中的对象的属性可以动态的添加/2、属性没有限

13、制,访问对象的属性有两种方法：1、普通方式对象名.属性名2、动态访问对象名属性名例：function Person()/定义一个类var p1=new Person();/创建一个对象=“qqzone”;/给对象的name属性赋值alert();/这里是普通方式访问alert(p1name);/这里是动态方式访问var val = qq+zone;alert(p1val);/这里就体现出动态的好处了，属性名可以是字符串拼接出来的 Object是javascript中所有类的基类 var p1=new Object();/通过Object直接创建对象，这里p1就是对象

14、了=test;/给p1的属性赋值,本地对象,在javascript中，根据对象的作用范围，对象被分为本地对象和宿主对象。常用的本地对象包括： Object，Function，String，Date，Math，RegExp，Array等。 每个对象可以用构造方法生成新的对象和方法，其中，Function类对象也是一种对象， 当开发者使用function关键字定义了一个函数的时候，在系统内部的实际上是创建了Function类的一个对象实例，也就是说javascript中的函数也是对象。 例如： var func = new Function(a,b,return a-b); aler

15、t(func(3,4); 这种方法是可以提高效率的，简便易读。返回值为-1，形式参数也可以有多个，根据需要来设定。,javascript中的多线程,所谓多线程，一般意义上理解，就是两段程序块，在操作系统的分时调配下，交错运行。 每个程序在运行后都成为操作系统的一个进程。线程可以被看做进程内部的子进程，每个进程都包含了1个多N个线程。多线程可以理解为多任务，在使用定量的内存情况下，多线程机制可以完成更多的工作。 Javascript没有提供原生的多线程机制。默认情况下，javascript代码必须想流水一样从上到下串行执行。 1. 每个程序块需要有自己独立的线程运行环境以及独立上下文 2. 每个程序块包含多个语句块，每个语句块