JavaScript 基础
JavaScript是一种描述式语言,它与HTML结合起来,用于增强功能,并提高与最终用户之间的交互性能。
由Netscape公司利用Sun的Java开发,它是与Java完全不同的一种语言。虽然在结构和语法上与Java类似,但是,它只是函数式的语言。
客户端的JavaScript 必须要有浏览器的支持,与一些编译性语言不同,JavaScript是一种解释性语言,其源码不经过编译,而直接在运行时被“翻译”,因而,被成为“脚本式”语言。
一个完整的JavaScript实现是由以下3个不同部分组成的:
核心(ECMAScript)
文档对象模型(DOM)
浏览器对象模型(BOM)
在网页中加入JavaScript
通过在网页中加入标记JavaScript的开始和结束,将JavaScript 代码放到之间;
也可以引入一个外部的JavaScript文件,这个JavaScript文件一般以.js作为扩展名;
原则上,放在
之间。但视情况可以放在网页的任何部分;一个页面可以有几个 ,不同部分的方法和变量,可以共享。
1.在中使用
可以出现在HTML文件中的
之间,也可以出现在中的任何位置。在一个HTML文档中,可以使用多个标签对,嵌入多段JavaScript 代码,并且各段代码之间可以相互访问,如同将所有代码放在一对标签之中效果相同。
【注意】
有些浏览器不能很好地支持JavaScript,在这些浏览器中,需要将JavaScript代码屏蔽,否则,浏览器会把JavaScript代码与Web页面的其他内容一起显示在屏幕上,可以将标签对中的内容用HTML的注释标记括起来,这样,支持标签对中的HTML注释符,会继续执行注释符之间的脚本程序。
2.在单独文件中使用
可以将脚本代码放置在一个单独的文件中,该文件以js为扩展名,称为JavaScript 脚本文件。
在HTML文件中引用JavaScript脚本文件,与将该脚本文件直接插入到一对标签对中的效果相同。
【注意】
(1).js文件中只写js代码,不能写入
3.作为属性值使用
HTML中的超链接标签的href属性值,除了可以使用http和mailto等协议外,还可以使用JavaScript,使用方式如下:
JavaScript基本语法—概述
执行顺序:
JavaScript程序是按照其在HTML文件中出现的顺序逐行执行的。如果需要在整个HTML 文件中执行,最好将其放在HTML文件的
中。某些代码,比如函数体内的代码,不会被立即执行,只有当所在的函数被其他程序调用时,该代码才会被执行。大小写敏感:
JavaScript是大小写敏感的,区分大小写。
空白符与换行符:
JavaScript会忽略关键字、变量名、数字、函数名或其他各种元素实体之间的空格或换行符,除非这些空格是字符串常量的一部分。
语句与分隔符:
分号(;)标识着一个语句的结束。
块:
大括号{ }通常用来括起一行或多行语句。
注释:
JavaScript提供了两种注释符号:
“//”
“/*…*/”
JavaScript基本语法—数据类型
JavaScript的数据类型分为基本数据类型和复合数据类型,复合数据类型主要有对象、数组和函数。
简单数据类型
JavaScript的基本数据类型有数值型、字符型、逻辑型,以及两个特殊的数据类型。1.普通数值型
与C、C++、Java等语言不同,JavaScript中的数值包含整数和浮点数。
2.特殊数值型
特殊数值型包括Infinity和NAN。
Infinity表示值超出了可表示的最大值的范围,而NAN是“not a number”的缩写形式,表示undefined表达式结果为数值型数据。
3.字符型
在JavaScript中,字符串是一组被引号(单引号或双引号)括起来的文本。
注:JavaScript不对字符和字符串加以区分。
字母、数字与标点可以放在字符串内,但诸如换行符等符号,若要在字符串中使用,必须用到转义字符。
【常用的转义字符如下】
【注意】
由于字符串是用单引号或双引号括起来的,所以当字符串中出现引号时,必须进行转义,但若单引号内出现双引号或双引号内出现单引号时,则无需转义。
4.Boolean布尔型(true or false)
特殊数据类型
在JavaScript中,有一些是没有任何类型的变量,称为undefined,还有一种空值数据类型。
1.无定义数据类型(undefined)
undefinded用来表示不存在的值,或者尚未赋值的变量。
如果只声明了m,而没有为其赋值,此时判断m的类型,就是undefined。如果赋予一个不存在的属性值,系统也会认为是undefined。
2.空值(null)
null表示空值,是一个“什么都没有”的占位符。
【null与undefined的区别】
undefined表示一个变量尚未赋值;
null表示该变量被赋予了一个空值。
基本类型与合成类型
基本数据类型在内存中有固定大小,而合成类型(如对象、数组、函数等类型)则可以具有任意长度。因此,不能将合成类型直接存储在关联每个变量的固定内存地址中,实际上存储的只是这个值的引用。
类型转换
JavaScript是一种无类型语言。在声明变量时无需指定数据类型,这使得JavaScript 具有灵活性和简单性。在代码执行过程中,JavaScript会根据需要进行自动类型转换。
转换规则
1. 转换为逻辑型数据
undefined: false
null: false
数值型:若为0或NaN,则结果为false,否则为true
字符串型:若长度为0,则结果为false,否则为true.
其他对象:true
2.转换为数值型数据
undefined: NaN
null: 0
逻辑型:值为true,则结果为1,值为false,则结果为0
字符串型:若内容为数字,则结果为相应数字,否则为NaN
其他对象:NaN
3.转换为字符串型数据
undefined: Undefined
null: NaN
逻辑型:若为true,则结果为”true”
提升基本数据为对象
每一个基本数据类型都存在一个相应的对象,这些对象提供了一些很有用的方法来处理基本数据。
例如,String对象提供了一个toLowerCase()方法来把一个字符串转换为小写格式。
JavaScript基本语法—变量
JavaScript是一门弱类型的语言,所有的变量定义均以var来定义。
JavaScript的变量应该先定义,再使用。虽然JavaScript可以不需定义即可直接使用变量,但不建议这么做。
类型规则
JavaScript、Java和C这样的语言之间存在一个重要的差别:JavaScript是无类型的,即JavaScript的变量可以存放任何数据类型的值,而Java和C的变量都只能存放特定类型的数据。
与HTML不同,JavaScript区分大小写
声明变量
在JavaScript中,变量使用关键字“var”来声明。声明变量必须遵循以下规则:可以使用一个var同时声明多个变量。
可以在声明变量的同时对其进行赋值。
如果只是声明了变量,并未对其赋值,其值默认为undefined。
使用var多次声明同一变量也是允许的,如果重复声明的语句已有一个初始值,此时的声明就相当于对变量的重新赋值。
JavaScript基本语法—数组
数组定义
var arr = new Array(3);
通过arr.length取得数组的长度
Javascript数组可以越界访问元素
创建一个数组有以下3种方式:
new Array();
new Array(len);
new Array([item0,[item1,[…]]]);
【注意】
数组中的每个元素代表了一个变量,而JavaScript中的变量是没有类型的,因此数组
元素也是没有类型的。所以,可以在一个数组中存储不同类型的数据。
数组使用
使用方式:
myarray=new Array(num)
myarray=new Array(value1,value2…)
aa = new Array(3);
aa[20] = 444;
document.write (aa[20]);
num不设定,则按数组默认的最大长度自动设定。例如:
aa = new Array();
aa[20] = 444;
document.write (aa.length);
JavaScript基本语法—表达式
表达式
表达式是一个句子,用于JavaScript脚本进行运行、运算的句子。其可以包含常量、变量、运算符等。表达式的结果通常会通过赋值语句赋值给一个变量,或直接作为函数的参数。
JavaScript基本语法—运算符
算术运算符
运算符是在表达式中用于进行运算的一种符号。JavaScript包括+、-、*、/、%等算术运算符。
减号(-)的特殊含义
减号(-)的另外一种用法是对数值或数值型变量求反。
赋值运算符
赋值运算符只有一个等号“=”,其作用是给变量赋值。
比较运算符
比较运算符用来连接操作数用来组成比较表达式,比较表达式的结果为逻辑值trut 或false。
常用的比较运算符有:< 、 <= 、 > 、>= 、 != 、 == 、 === 、 !==
补充说明
条件语句中使用=符号
在条件语句中如果误将“=”用于“==”,程序将不会报错,但运行结果错误。
比较运算符的自动转换
在比较过程中,“!=”和“==”会进行自动类型转换,而“!==”和“===”则不转换。【注意】
进行相等比较时,如果不希望进行类型自动转换,则应使用“===”。
逻辑运算符
常用的逻辑运算符:&&、||、!
位运算符
常用的位运算符有:&、|、^(异或)、~
其他运算符
递增(++)、递减(--)运算符
?:运算符
?:是构造快速条件分支的运算符,可以看做是“if…else”语句的间歇形式。
逗号(,)运算符
逗号(,)用来将多个表达式连接为一个表达式,新表达式的值为最后一个表达式的值。void运算符
void运算符用来指明一个表达式无返回结果。
typeof运算符
typeof运算符返回一个字符串,指明其操作数的数据类型。
typeof 返回值有六种可能:
number、string、boolean、object、function、undefined
JavaScript基本语法—运算符
字符串运算符
连接运算:+
取子集:substring(index1,index2)
JavaScript基本语法—控制语句
if语句
if(条件) {
}else if(条件1) {
}else
…
}
switch 语句
switch(i)
case i1:…
case i2:…
default:…
while语句
while(条件){
…
}
JavaScript基本语法—循环语句
for(var i=0; i<20;i++)
do{
…
}while(条件);
循环控制:
continue
break
JavaScript基本语法—函数
函数的定义:
利用function来定义一个函数
传入参数
传出值(需要return语句)
定义函数使用function关键字,语法规则如下:
function 函数名([参数列表]){
程序语句;
…
}
函数调用:
全局变量与局部变量
全局变量是在所有函数之外的脚本中定义的变量,其作用范围是该变量定义后的所有语句,包括其后定义的函数中的代码,以及其后的标签对中的代码。
局部变量是定义在函数代码之内的变量,只有在该函数中、且位于该变量定义之后的程序代码,才可以使用这个变量。局部变量对其后的其他函数和脚本代码来说,都是不可见的。函数的参数传递:
preloadTreeImages("1.gif","2.gif","3.gif");
function preloadTreeImages(){
for (var i = 0; i < arguments.length; i++){
var img =
document.createElement("img");
img.src = arguments[i];
div1.appendChild(img);
}
}
JavaScript事件
可将在浏览器中发生的事件分为以下几种类型:
鼠标事件:用户使用鼠标进行特定操作时触发
键盘事件:用户在键盘上敲击、输入时触发
HTML事件:窗口发生变动或者发生特定的客户端-服务器端交互时触发。
1、鼠标事件:
鼠标事件是Web上最常见的事件类型。其中包含以下事件:
onclick:点击鼠标左键时触发(如果鼠标右键也按下则不会触发)。当用户的焦点在按钮上,并按了回车键,同样会触发该事件
ondblclick:双击鼠标左键响应(如果鼠标右键也按下则不会触发)
onmousedown:点击任意一个鼠标按钮时触发
onmouseup:松开任意一个鼠标按钮时触发
onmouseout:鼠标指针在某个元素上,且用户正要将鼠标移出元素的边界时触发onmouseover:鼠标移出某个元素到另一个元素上时触发
onmousemove:鼠标在某个元素上移动时持续触发
鼠标事件的属性
每个鼠标事件都会给以下event对象的属性填入值:
坐标属性(如:clientX和clientY等)
type属性:事件名称
shiftKey:true表示按下Shift键;否则为false
ctrlKey:true表示按下Ctrl键;否则为false
altKey:true表示按下Alt键;否则为false
鼠标事件的执行顺序
onclick事件触发前,会先发生onmousedown事件,然后发生onmouseup事件。
onmousedown
onmouseup
onclick
类似地,要触发ondblclick事件,在同一个目标上要按顺序发生以下事件:onmousedown
onmouseup
onclick
ondblclick
移动鼠标从一个对象进入另一个对象时,先发生的事件是onmouseout(发生在鼠标移出的那个对象)。接着,在这两个对象上都触发onmousemove事件。最后,在鼠标进入的那个对象上触发onmouseover事件。
2、键盘事件:
键盘事件由用户对键盘的动作触发,有以下键盘事件:
onkeydown:用户在键盘上按下某按键时触发。一直按差某键,它则会不断触发(Opera浏览器除外)。
onkeypress:用户按下键盘上的一个按键,并产生一个字符时触发(也就是不管类似Shift、Alt之类的按键)。一直按下按键时,它则会持续触发。
onkeyup:用户释放按着的按键时触发。
尽管所有的元素都支持键盘事件,但在文本框中输入文字时,是最容易触发这些事件的。
键盘事件的属性
对每个键盘事件,会填入以下的事件属性:
keyCode属性:对于onkeypress事件,表示按下按键的Unicode码;对于onkeydown/onkeyup 事件,表示按下按键的数字代码
charCode属性:按下按键的Unicode值。
shiftKey:true表示按下Shift键;否则为false
ctrlKey:true表示按下Ctrl键;否则为false
altKey:true表示按下Alt键;否则为false
键盘事件的执行顺序
用户按一次某字符按键时,会按以下顺序触发事件:
onkeydown
onkeypress
onkeyup
如果用户按一次某非字符按键(如:shift),会按以下顺序触发事件:
onkeydown
onkeyup
如果用户按下一个字符按键且不放,onkeydown和onkeypress事件将逐个持续触发,直到松开按键;如果用户按下非字符按键且不放,将只有onkeydown事件持续触发。
3、HTML事件处理:
onblur:任何元素或窗口本身失去焦点时触发。
onfocus:任何元素或者窗口本身获取焦点时(用户点击它、Tab键切换到它或者任何其他与它交互的手段)触发。
onload:页面完全载入后,在window对象上触发;所有的框架载入后,在框架集上触发;完全载入后,在其上触发;或者元素,当其完全载入后在其上触发。onunload:页面完全卸载后,在window对象上触发;所有的框架卸载后,在框架集上触发;完全卸载后,在其上触发;或者元素,当其完全卸载后在其上触发。onchange:文本框(或)失去焦点时并且在它获取焦点后内容发生过改变时触发;元素的值发生改变时触发。
onselect:用户选择了文本框中的一个或多个字符时触发(或)。onerror:JavaScript脚本出错时,在window对象上触发;某个的指定的图像无法载入时,在其上触发;或元素无法载入时触发;或者框架集中的一个或多个框架无法载入时触发。
onsubmit:点击提交按钮()时,在
上触发。视情况可以对一个对象组合使用这些事件处理。
补充提高部分
JavaScript对象及相关函数
String对象(字符串对象)
Date对象(时间对象)
Math对象(数学对象)
浏览器对象和元素(DOM模型)
其它常用函数
parseInt()函数
parseFloat函数
String对象
一般利用String对象提供的函数来处理字符串。String对字符串的处理主要提供了下列方法:
charAt(idx):返回指定位置处的字符
indexOf(Chr):返回指定子字符串的位置,从左到右。找不到返回-1
lastIndexOf(chr):返回指定子字符串的位置,从右到左。找不到返回-1
substring(m,n):返回给定字符串中从m位置开始,到n位置结束的子串,如果参数n省略,则意味着取到字符串末尾。
toLowerCase():将字符串中的字符全部转化成小写。
toUpperCase():将字符串中的字符全部转化成大写。
字符串对象
属性:length
方法:
字体控制:big() 、link() 、bold() 等
big()、bold()、link()
var strVariable = "This is a string object";
strVariable = strVariable.big().big().big().big().big().big().big().big().big();
strVariable = strVariable.bold();
strVariable = strVariable.link("https://www.doczj.com/doc/e49654074.html,");
document.write(strVariable);
This is a string object
字符串:
toLowCase()
toUpperCase()
indexOf(char,fromIndex)
substring(start,end)
substring、indexOf
substring(start,end) 返回字符串的子字符串
indexOf[charactor,fromIndex] 字符搜索
正则表达式
JavaScript中,正则表达式是由两个斜杠“/”所包围的,由英文字母、数字和一些符号组成的,描述文本模式的表达式对象。例如:
var reg1 = /abc/i;
var reg2 = /a{1,2}b/g ;
var reg3 = /^[\u0391-\Uffe5]+$/ig ;
上面示例,第2个斜杠后的“g”等是匹配模式。可以选取的值有3个:i、g和m或者为这三者的组合。其含义如下:
i :是“ignore case”,即忽略大小写。
g是“global search”,即全局搜索,它会影响正则表达式对象的lastIndex属性值,一会做搜索和替换功能时使用。
m是“multiline search”,即多行搜索。
正则表达式的两个斜杠之间的模式字符串如果为一般的字母或数字,表示直接匹配相应的字符。
RegExp对象
【用RegExp函数创建正则对象】
正则表达式的对象RegExp创建方式有两种:
new RegExp(“pattern”,[“flags”]);
/pattern/[flags];
“pattern”:为必需的字符串型参数,描述需要匹配的模式。
“flags”为可选参数,字符串类型变量,表示需要生成的正则对象的匹配模式,可以取的值有3个:i/g/m或者为三者的组合。
需要注意的是:由于“RegExp”函数接受的模式描述为字符串的格式,因此同样的正则表达式在用斜线“/”生成和用“RegExp”生成的时候有时会有所区别。例如:
reg1=/\w+/;
reg2=new RegExp(“\\w+”);
正则表达式reg1和reg2是完全等同的,但是在书写的时候,使用斜线“/”定义正则表达式时不需要对反斜线进行转义,而在用“RegExp”定义的时候,需要用两个反斜线“\\”来表示实际上的一个反斜线“\”。
例如:var re=new RegExp(“\\d{5}”);
var re = /\d{5}/;
两者等同。
RegExp对象的属性分为两类:
所有RegExp对象示例共享的静态属性包括:index、input、lastMatch、lastPattern、leftContext、rightContext、$1-$9
对象的实例属性包括:global、ignoreCase、multiline、 lastIndex、source(正则表达式的源字符串形式)属性
例:匹配字符串:xxa1b01c001yya2b02c002zz
模式串:/a(\d)b(\d{2})c(\d{3})/gi
示例参见:01.html
RegExp对象的方法:
exec()方法:该方法的格式是pattern.exec(str);该方法如果没有匹配的结果,则返回空值null。如果有匹配的结果,该方法返回一个数组,数组的第1个元素为整个匹配的结果。在正则对象的“全局搜索Global”属性未设置时,exec方法等同于字符串对象的match方法,同样是执行一个正则对象对字符串的匹配。如果正则对象的“全局搜索”属性被设置,则“exec”方法会自上次匹配的结果的“lastIndex”属性(即正则表达式对象的lastIndex 属性)指定的索引位置开始查找。否则的话从字符串对象的头部(即从字符串索引为0的位置)开始匹配。
test()方法:该方法测试字符串是否匹配正则对象。该方法的返回值是true/false。方法的格式:pattern.test(str);
原理同exec方法
示例参见:06.html
【说明】
正则表达式对象的lastIndex属性,当正则表达式g(global)标志设置为true时,正则表达式的exec或test方法将自动设置该属性的值。
如果正则表达式的exec或test方法找到了一个匹配项后,则自动将lastIndex属性值设置为匹配字符串最后一个字符后一个索引位置,如:
var str = “acbc”;
var reg = /c/gi
reg.test(str);//test方法当匹配成功后,马上返回,即只匹配一次
//输出值为:2,即字符串中第一个c的后一个索引位置为:2
document.write(“https://www.doczj.com/doc/e49654074.html,stIndex” + https://www.doczj.com/doc/e49654074.html,stIndex);
reg.test(str);
//输出值为:4,即字符串最后一个c的后一个索引位置为:4
document.write(“https://www.doczj.com/doc/e49654074.html,stIndex” + https://www.doczj.com/doc/e49654074.html,stIndex);
如果正则表达式的exec或test方法没有找到了一个匹配项,则设置lastIndex属性的值为0,如:
var str = “acbc”;
var reg = /e/gi
reg.test(str);//test方法当匹配成功后,马上返回,即只匹配一次
//输出值为:0
document.write(“https://www.doczj.com/doc/e49654074.html,stIndex” + https://www.doczj.com/doc/e49654074.html,stIndex);
lastIndex属性的默认初始值为:0
只有当使用exec或test方法时,lastIndex属性值才会影响,影响的前提是需要设置正则表达式的g(global)标志为true,如:
var reg = /c/g
如果想从头开始匹配,则可以将lastIndex属性值设置为:0,如:
var reg = /a/gi;
https://www.doczj.com/doc/e49654074.html,stIndex = 0;
String对象中与正则表达式有关的方法:
match方法
语法格式:match(rgExp)
说明:与RegExp对象的exec方法类似,它使用正则表达式模式对字符串执行搜索,并返回一个包含搜索结果的数组。
例:参见02.html
var str = "xxa1b01c001yya2b02c002zz";
var reg = /a(\d)b(\d{2})c(\d{3})/gi;
var arr = str.match(reg);
for(var i=0; i document.writeln(arr[i]); } search方法 语法格式:search(rgExp) 说明:返回使用正则表达式搜索时,第一个匹配的字符串在整个被搜索的字符串中的位置。示例参见:03.html replace方法 语法格式: replace(rgExp,replaceText) 说明:使用正则表达式模式对字符串执行搜索,并对搜索到的内容用指定的字符串替换(即 该方法会将所有满足正则表达式的匹配串全部替换),返回值为包含替换后的内容的字符串对象。 示例参见:04.html 例:参见05.html var str = "a12b34c56"; var reg = /(\d)(\d)/gi; var str_new = str.replace(reg, "$2$1"); document.writeln(str); document.writeln(str_new); split方法 语法格式: split([separator[,limit]]) 说明:返回按照某种分隔标志符将一个字符串拆分为若干子字符串时所产生的子字符串数组。 正则表达式-元字符 要灵活运用正则表达式,必须了解其中各种元字符的功能,元字符从功能上大致分为: 限定符 选择匹配符 分组组合和反向引用符 特殊字符 字符匹配符 定位符 限定符: {n} 说明:“n”是一个正整数,表示将前一个字符或子表达式匹配n次。 例:o{2}不能与Bob中的o匹配,但可以与food中的两个o匹配,也可以与fooood中的任意两个连续的o匹配。 {n,} 说明:表示将前一个字符或子表达式至少匹配n次。 例:o{2,}不能与Bob中的o匹配,但可以与foooood中的所有的o匹配。 {n,m} 说明:表示将前一个字符或子表达式至少匹配n次,至多匹配m次。 例:o{1,3}既可匹配food中的两个o。 * 说明:将前一个字符或子表达式匹配(出现) 0次或多次。 例:zo*与z和zoo都能匹配。*等效于{0,} + 说明:将前一个字符或子表达式匹配(出现) 1次或多次。 例:zo+与zo和zoo等在字母z后面连续出现一个或多个字母o的字符串匹配。 ? 说明:将前一个字符或子表达式匹配(出现) 0次或1次。 例:zo?可以匹配z或zo,也可以匹配zoo中的zo部分,但不能匹配整个zoo 贪婪匹配与非贪婪匹配 贪婪匹配 默认情况下,正则表达式使用最长(也叫贪婪)匹配原则。例:要将zoom中匹配zo?的部分替换成r,替换后的结果是rom,而不是room;如果要将zoom是匹配zo*的部分替换成r,替换后的结果是rm,而不是rom或room。 非贪婪匹配 当字符?紧随任何其他限定符(*、+、?、{n}、{n,}、{n,m})之后时,匹配模式变成使用最短(也叫非贪婪或惰性)匹配原则。例:在字符串fooood中,fo+?只匹配fo部分,而fo+匹配foooo部分。 选择匹配符: | 说明:选择匹配符只有一个,即|,用于选择匹配两个选项之中的任意一个 例:chapter|section 1 匹配的是:chapter或section 1,而不是chapter 1或section 1。 示例参见:07.html 分组组合与反向引用符: (pattern) 说明:匹配“pattern”的模式,并返回匹配的结果。此结果可以通过“match”方法的返回值获得,或者使用“$1….$9”来获得。如果需要匹配括号字符本身,应使用“\(”和“\)”等转义。分组就是用小括号括起来,分组的个数,判断方法:从左到右数”(”的个数,按先后顺序,就是第1组、第2组、第3组… \num 说明:num为十进制整数,最大值为99,即分成99组 例:要匹配连续5个数字字符,可以使用\d{5}作为正则表达式模式串,但是要匹配连续的5个相同的数字字符,则需要使用: (\d)\1{4} 其中\1表示引用的是前面匹配的第1组的内容,后面的{4}表示\1所表示的数字再出现4次,这样再加上前面的一次正好是5个连续相同的数字。 示例参见:08.html (?:pattern) 说明:该模式不会创建反向引用,即不保存匹配的字符串-非捕获分组。通过用非捕获性分组,仍然可以拥有与匹配字符串序列同样的能力,而无需存储结果的开销。 例: var str = “#123456789”; var reg = /#(?:\d+)/; alert(str.replace(reg,”abcdRegExp$1”); 输出:abcdRegExp$1 说明:因为该分组为非捕获性的,所以就不能通过RegExp.$X变量来使用任何反向引用,或在正则表达式中使用它。 示例中,因为$1在这里并不被看成是一个反向引用,因此被直接翻译成字符了。 特殊字符: \f 说明:匹配换页符 \n 说明:匹配换行符 \r 说明:匹配回车符 \t 说明:匹配制表符 \v 说明:匹配垂直制表符 \uXXXX: 说明:Unicode码 字符匹配符: […] 说明:一个字符集合,匹配该集合中的任意一个字符。 例:[xyz] [^…] 说明:一个字符集合,匹配不属于该集合中的任意一个字符。 例: [^xyz] [a-z] 说明:一个字符范围集合,匹配属于该集合范围中的任意一个字符。 [^a-z] 说明:一个字符范围集合,匹配不属于该集合范围中的任意一个字符。 注:要在中括号表式达中包括字面意义的连字符(-),可以用反斜杠(\)将它标记为原义字符,例如:[a\-z]。也可以将连字符(-)放在中括号的开始或结尾处,例如:[-a-z]或[a-z-]。 \d 说明:匹配一个数字,等同于[0-9]。 \D 说明:匹配非一个数字,等同于[^0-9] \s 说明:匹配一个空白符,包括空格、制表符和填表符等,等同于[\f\n\r\t\v] \S 说明:匹配一个非空白符。 \w 说明:匹配一个英文字符、数字和下划线,等同于[a-zA-Z0-9_]。 \W 说明:匹配一个非英文字符、数字和下划线 . 说明:匹配所有除换行符“\n”外的单个字符。 补充:(.)\1匹配除\n之外的两个连续的相同字符。若要匹配包括\n在内的任意字符,可 以使用[\s\S],同理还有:[\d\D]、[\w\W]。如果要匹配“.”字符本身,需要使用“\.”。 定位符: ^ 说明:匹配文本的开头。如果正则表达式的“多行搜索”属性被设置(即“m”属性),“^”也匹配每个换行符“\n”或者回车符“\r”之后的位置。 例:^o与ok中的o匹配,但与hello中的o不匹配,即hello中的o不是行首。 $ 说明:匹配文本的末尾。如果正则表达式的“多行搜索”属性被设置(即“m”属性)“^”也匹配每个换行符“\n”或者回车符“\r”之前的位置。 例: o$与hello中的o匹配,但与ok中的o不匹配,即ok中的o不是结尾。 示例参见:10.html \b 说明:单词边界,匹配一个单词的结尾,也就是单词最后一个字母和空格之间的位置。所谓边界即空白字符。 例:er\b匹配never ok中的er,但不匹配verb中的er \B 说明:匹配一个非单词的结尾。 例:er\B匹配verb中的er,但不匹配never ok中的er 原义字符: 在正则表达式中用到的一些元字符不再表示它原来的字面意义,如果要匹配这些具有特殊意义的元字符的字面意义,必须使用反斜杠(\)将它们转义为原义字符,即将反斜杠放在它们的前面。 需要时行转义的字符:$、(、)、*、+、.、[、]、?、\、/、^、{、}、| 常用示例正则表达式 例:较验IP地址 (1)使用JavaScript完成 (2)使用正则表达式完成 字符串: First second\nThird fourch\nFifth sixth 使用正则表达式获取出: First Third Fifth 验证E-mail格式 1、写出模式串 aaa@https://www.doczj.com/doc/e49654074.html, Aa_a-a@https://www.doczj.com/doc/e49654074.html, _a+a@https://www.doczj.com/doc/e49654074.html, 1111@https://www.doczj.com/doc/e49654074.html, Aaa_@https://www.doczj.com/doc/e49654074.html, aa.aa@https://www.doczj.com/doc/e49654074.html, 2、读取文件内容,将Email内容获取出来 验证日期格式:YYYY-MM-DD 验证日期格式:YYYY/MM/DD 验证时间格式:HH:mm:ss 验证日期时间格式: YYYY-MM-DD HH:mm:ss 使用正则表达式分析WebLogic日志文件中的下列部分: 192.168.81.90 - - [04/May/2010:10:55:05 - 500] “Get Time 09-aaa” 使用正则表达式分析: 1、写出模式串 2、按如下格式输出属性内容: face=“Arial, Serif” size=“+3” color=“red” 使用正则表达式匹配所有HTML标记 使用eval 不使用eval alert ("3"+"2"); --〉32 使用eval的上下文环境 alert (eval("3") + eval("2")); --〉5 eval()函数可以把一个字符串当作一个JavaScript表达式一样去执行它 时间对象-Date对象 使用以前必须先申明: 语法:var _date=new Date([arguments]); 参数的形式有以下几种: new Date(“month dd,yyyy hh:mm:ss”); new Date(“month dd,yyyy”); new Date(yyyy,mth,dd,hh,mm,ss); new Date(yyyy,mth,dd); new Date(ms); 注:当不指定参数时,会创建一个表示当前系统时间的对象。 参数详解: month:用英文表示的月份名称。 mth:用证书表示的月份,从0-11。 dd:表示一个月中的第几天,从1-31。 yyyy:四位数表示的年份。 hh:小时数,从0-23。 mm:分钟数。 ss:秒数,从0-59。 ms:毫秒数。 Date常用方法举例 Date对象用于提取具体信息的方法 objDate.getFullYear():以四位数字返回年。 objDate.getYear():根据浏览器不同,以两位或者四位数字返回年。 objDate.getMonth():返回用整数表示的月份,从1-12月,但从0开始表示,0表示1月份。objDate.getDate():返回月中的某日,从1-31。 objDate.getDay():返回星期几,从0-6。 objDate.getHours():返回小时数,从0-23。 objDate.getMinutes():返回分钟数,从0-59。 objDate.getSeconds():返回秒数,从0-59。 objDate.getMilliseconds():返回秒中的毫秒数,从0-999。 objDate.getTime():返回从GMT时间1970年1月1日起经过的毫秒数。 实用方法:setTimeout、setInterval、clearTimeout 示例: //var a = window.setInterval("alert('Hello, world')", 2000); var a = window.setTimeout("alert('Hello, world')", 2000); 实用示例:使用JavaScript实现日期时间的动态显示,格式如下: 2010年05月06日 09:12:05 要求:时间部分是变化的。 Math对象 内置的Math对象可以用来处理各种数学运算 可以直接调用的方法: Math.数学函数(参数列表) 常用方法: abs() 绝对值 sin() , cos() 正弦余弦值 asin() , acos() 反正弦反余弦 tan() , atan() 正切反正切 round() 四舍五入 sqrt() 平方根 pow(x,y) x的y次方 JavaScript常用函数 这些函数不从属于任何的对象 在JavaScript的任何地方都可以直接使用这些函数: parseInt()函数 parseFloat函数 setTimeout()函数 parseInt和parseFloat函数 parseInt函数功能:试图从一个字符串中提出一个整数。 parseInt函数也可以附加一个整数n,可以返回n进制的一个整数。可以利用这个函数从字符串中提取二进制、八进制和十六进制的整数。 如果在字符串中除了数字、符号、小数点和指数符号以外的字符,parseInt就停止转换,返回已有的结果。 如果第一个字符就不可以转换,parseInt就返回”NaN”值,指示字符串中不存在数字。parseFloat函数和parseInt函数相似,只不过它转换的是浮点数。 (isNaN):判断变量是否是数值型 浏览器对象的层次结构 窗口中的对象和元素(BOM) window 打开新窗口(window.open()) 关闭窗口(window.close()) location 获取或设置现有文档的URL history 先前访问过的URL的历史列表 常用方法:back(),go(number) document 当前的文档对象 document.write():向客户端浏览器输出内容 document.formName:可以用这个方法得到表单名称 document.referer DOM模型 所谓DOM是指文档对象模型 利用从属关系一级一级地定位 当我们要读取一个Form表单中的某一个元素的时候,如何来定位呢?这里就要用到DOM了 浏览器对象——window window对象是浏览器对象中其他大部分对象的共同的祖先,所以一般在JavaScript程序中可以省略window对象 常用window对象的方法 open(URL,windowName,parameterList):创建一个新的浏览器窗口,载入一个指定的URL 地址 close():close方法关闭一个浏览器窗口 alert():弹出一个消息框 open方法参数说明 第一个参数:URL 要载入新窗口的页面的URL地址 第二个参数 新窗口的名字 如果用已有的框架的名字作为window.open()方法的第二个参数,那么所指定的URL 所指的页面就会被载入到该框架中。例如,要把页面载入名为“topFrame”的框架,可以使用下面的代码: window.open("https://www.doczj.com/doc/e49654074.html,","topFrame"); 这行代码的行为相当于用户点击一个链接,该链接的href为https://www.doczj.com/doc/e49654074.html,,target 为“topFrame”。专用的框架名:_self、_parent、_top、_blank也是有效的,即第二个参数也可以是专用的框架名。 第三个参数 如果声明的框架名无效,则window.open()将打开新窗口,该窗口的特性由第三个参数(特性字符串)指定。 如果使用第三个参数,open方法就假设应该打开新窗口,特性字符串是用逗号分隔的设置列表,如下所示: 1.在第一次给一个变量赋值的时候要加var 2.使用=== 替换== 3.使用闭包实现私有变量 `function Person(name, age) { this.getName = function() { return name; }; this.setName = function(newName) { name = newName; }; this.getAge = function() { return age; }; this.setAge = function(newAge) { age = newAge; }; //未在构造函数中初始化的属性 var occupation; this.getOccupation = function() { return occupation; }; this.setOccupation = function(newOcc) { occupation = newOcc; }; }` 4.在语句结尾处使用分号 5.创建对象的构建函数 `function Person(firstName,lastName){ this.firstName=firstName; https://www.doczj.com/doc/e49654074.html,stName=lastName; var Saad = new Person("Saad", "Mousliki"); }` 6.小心使用typeof instanceof 和 constructor typeof 用在数据类型上,如果用在引用类型上返回的 object instanceof 判断是那种对象的实例 Object.constructor 是object 的一个属性。他只想:创建对象函数的引用。 7.创建一个自调用函数 `(function(){ // some private code that will be executed automatically })(); Web Crawler A Review 1.分类:通用爬虫、聚焦爬虫、分布式爬虫 2.网络是一个有向图,所以搜索操作可以总结为对有向图的遍历。爬虫通过web页面的图结构从一个页面到另一个页面。 3.Google具有较少的垃圾结果和公平的搜索结果两大优点,其来源于google的pagerank算法和锚点词权重。 4.爬虫技术:A,通用爬虫:从每一个网页尽可能多的找寻链接,去点速度慢占带宽。B,聚焦爬虫:爬取某一主题的文件,节省带宽。C分布式爬虫:多线程爬取。 5.现在爬虫都是同步进行的,有重载、质量和网络等问题。 6.Selberg, E. and Etzioni, O. On the instability of Web search engines. In Proceedings of RIAO ’00, 2000. Teevan, J., E. Adar, R. Jones, and M. A. Potts. Information reretrieval: repeat queries in Yahoo's logs. SIGIR ‘07, 151-158, 2007. 这两篇主要研究识别结果动态改变。 K. S. Kim, K. Y. Kim, K. H. Lee, T. K. Kim, and W. S. Cho “Design and Implementation of Web Crawler Based on Dynamic Web Collection Cycle”, pp. 562-566, IEEE 2012 动态web数据爬取技术包含对web变化的监视,动态获取网页。 Junghoo Cho and Hector Garcia-Molina “Parallel Crawlers”. Proceedings of the 11th international conference on World Wide Web WWW '02”, May 7–11, 2002, Honolulu, Hawaii, USA. ACM 1-58113-449-5/02/0005. 高效的并行爬虫 Alex Goh Kwang Leng, Ravi Kumar P, Ashutosh Kumar Singh and Rajendra Kumar Dash “PyBot: An Algorithm for Web Crawling”, IEEE 2011 广度优先搜素,会输出一个Excel CSV 形式的web架构,存储下来的网页与web结构用于排名, Rajashree Shettar, Dr. Shobha G, “Web Crawler On Client Machine”, Proceedings of the International MultiConference of Engineers and Computer Scientists 2008 V ol II IMECS 2008, 19-21 March, 2008, Hong Kong 异步多线程下载模块 Eytan Adar, Jaime Teevan, Susan T. Dumais and Jonathan L. Elsas “The Web Changes Everything: Understanding the Dynamics of Web Content”, ACM 2009. 对特征化网络变化提出更细微的分析。 A.K. Sharma, J.P. Gupta and D. P. Agarwal “PARCAHYD: An Architecture of a Parallel Crawler based on Augmented Hypertext Documents”, International Journal of Advancements in Technology, pp. 270-283, October 2010. DAY01 基本使用 什么是javascript 发展历史 javascript组成ECMAScript+BOM+DOM 使用标签 document.write方法 注释 使用引入js文件的方式 . 二种:将JS的代码编写到一个.js的文件中,在HTML中引入该JS代码即可. 1.1.3代码实现: ”字符串。例如。浏览器在加载如下代码就会产生一个错误。”); } Hi(); 错误原因:当浏览器解析到字符串””时,会结束JavaScript代码段的执行。解决方法: 使用转义字符把字符串‘’分成两部分来写就不会造成浏览器的误解。 代码测试和错误处理,理解浏览器的不同内核和代码不同的兼容性,在不同浏览器代码报错的时候会有不同的调试方法,学会使用浏览器的调试器对网页开发效率会有很大的提高。现在主流的浏览器是Chrome、Firefox、Safari等。 JavaScript的基本语法和各种变量,各种数据类型及各种数据类型的转换。 重点:避免变量污染 Var foo = function(){ Var a = 1, b = 2; Var bar = function(){ Var b = 3, c=4, //a= 1,b =3, c=4 a+=b + c; // a=8, b=3, c=4 }; //a=1, b=2, c = undefined bar(); //a= 21,b=2,c= undefined } JavaScript运算符的使用。JavaScript定义了51个运算符,主要分为一下几大类,位运算符、算术运算符、逻辑运算符、关系运算符、赋值运算符、对象炒作运算符和其他运算符。设计程序结构。程序都是由一个或多个语句组成的集合,语句表示一个可以执行的命令。用来完成特定的任务。大部分语句用于流程控制,在JavaScript中提供了if条件判断语句、switch多分枝语句、for循环语句、while循环语句、do/while循环语句、break语句、continue语句等7种流行控制语句。 韩顺平html+css+js 之JS笔记 Javascript的基本介绍 ?JS是用于WEB开发的脚本语言: ?脚本语言是什么: ?脚本语言不能独立使用,它和HTML/JSP/PHP/https://www.doczj.com/doc/e49654074.html,配合使用 ?脚本语言也有自己的变量,函数,控制语句(顺序,分支,循环) ?脚本语言实际上是解释性语言(即在执行时直接对源码进行执行) ?Java程序.java→.class→jvm , js→浏览器(js引擎来解释执行) ?Js在客户端(浏览器)执行 ?因为js是由浏览器来执行的,因此这里有个问题,不同类型的浏览器可能对js的支持不一样。 js 读书笔记
网络爬虫学习笔记笔记
javascript笔记总结
韩顺平html+css+js之JS笔记
JS: (1)去掉标签的某个属性: $("#ZHTMC").removeAttr("placeholder"); (2)添加属性: $("#ZHTMC").attr("disabled", "disabled"); (3)控件被移除:$(“#Submint”).remove(); (4)控件被隐藏:$(“#Submit”).hide(); (5)控件显示:$(“#Submit”).show(); (2)escape()该函数对字符串进行编码,这样就可以在所有的机器上读取该字符串(例如汉字,特殊字符-)。 只能用于传递文本比较短的参数例如名字,编号等,如果传递的文本过长就会超出浏览器规定的限制,报错,如果传递的文本过长就必须换方式传递,例如传递GUID,通过GUID 进行查询数据库得到要显示的参数; (3)取得Combobox的值:$(“#Name”).combobox(“getValue”); (4)得到数字文本框numberbox的文本: $(“#number”).numberbox(“getValue”); (5)取得redioButton 的值:$(“input[name=?female?]:check”).val() (6)获取DataGrid的整个列表的数据:$(“#grid”).datagrid(“getData”); (7)重新加载DataGrid: $(“#grid”).datagrid(“reload”);//(刷新列表) (8)不需要刷新Datagrid更新某个状态: Var selectedRow=$(“#grid”).datagrid(“getSelected”);//得到选
三、字面量 字面量:是表示固定值的一种表示方法。字面量的字面含义就是你看到什么就是什么。 字面量也叫常量。 字面量:数字,字符串,undefined,布尔类型的值。今天只学数字字面量和字符串字面量。 3.1 数字字面量 数字字面量包含:整数,浮点数(小数),特殊值。 ①整数: 十进制表示法,八进制表示法,十六进制表示法。 八进制表示法:前缀0,0o,0O,后面数字0-7。 十六进行表示法:前缀0x,0X,后面数字0-9,字母a-f或者A-F 在进行算术运算时,都会转换成十进制。(控制台输出的是十进制的数) 八进制:逢八进一。 4console.log(010000); 八进制每一位数都不能超过7,如果超过了会强制转换成十进制。 1console.log(087); 前缀是0o或者0O会直接报错。 1console.log(0o87); 2console.log(0O87); 十六进制:逢十六进一 1console.log(0X10); 2console.log(0x100); 3console.log(0x1000); 4console.log(0xff);
十六进制每一位数不能超过0-9或者a-f(A-F),超过直接报错。1console.log(0xgh); 以下这些都输出15 1console.log(15); 2console.log(017); 3console.log(0o17); 4console.log(0O17); 5console.log(0Xf); 6console.log(0xf); 以下这些都输出-15 6console.log(-0xf); ②浮点数字面量 整数.小数(浮点数只能用十进制表示) 表示: 1console.log(22.33); 2console.log(-1.8); 3console.log(0.893); 4console.log(.893);
文档从互联网中收集,已重新修正排版,word 格式支持编辑,如有帮助欢迎下载支持。
HTML 概要知识点梳理 .................................................................................................................. 2 1、了解 HTML 的概念 ........................................................................................................... 2 2、熟练掌握 HTML 的文档结构。 ....................................................................................... 2 3、标签的分类..........................................................................................错误!未定义书签。 块记标签: ...................................................................................... 错误!未定义书签。 行级标签:....................................................................................................................... 2 掌握灵活运用实际开发中常用的 4 中布局结构:............................................................... 3 注意编写习惯:....................................................................................................................... 3 超链接的应用:....................................................................................................................... 3 表单的应用:........................................................................................................................... 3 下拉列表框:................................................................................................................... 4 多行文本框....................................................................................................................... 4 只读和禁用属性............................................................................................................... 5 隐藏域:......................................................................................................................... 5
Css 样式表........................................................................................................................................ 5 常用样式设置总结................................................................................................................... 5 超链接伪类样式........................................................................................错误!未定义书签。 各类样式的优先级................................................................................................................... 5
Javascript 知识点汇总...................................................................................................................... 6 一、 JavaScript 理论知识点的理解: ................................................................................... 6 1、 JavaScript 定义 ......................................................................................................... 6 2、 JavaScript 组成。 ..................................................................................................... 6 3、 JavaScript 的基本结构 ............................................................................................. 7 4、 JavaScript 的引用方式 ............................................................................................. 7 二、 JavaScript 核心语法 ....................................................................................................... 7 1、 语法约定:............................................................................................................... 7 2、 变量:....................................................................................................................... 8 3、 数据类型:............................................................................................................... 8 4、 运算符:................................................................................................................... 8 三、 JavaScript 基本应用 ....................................................................................................... 8 1、 消息框:................................................................................................................... 8 2、 数组:....................................................................................................................... 9 JavaScript 中的 for in 迭代语句: ............................................................................ 10 3、 函数:..................................................................................................................... 10 4、 事件:..................................................................................................................... 11 5、 其他注意事项:..................................................................................................... 11 四、 JavaScript 中的对象 ..................................................................................................... 12 一、 BOM 和 DOM 对象有哪些区别:(了解)........................................................ 12 二、 BOM 对象............................................................................................................. 13 Window 对象属性 ................................................................................................................. 13 window 对象常用的方法:........................................................................................... 13 三、 DOM 对象 ............................................................................................................ 14 Document 对象常用的属性 ................................................................................................... 14 Document 对象的常用方法 ........................................................................................... 14
1word 格式支持编辑,如有帮助欢迎下载支持。