《JavaScript详解》学习笔记

来源:互联网 发布:python sleep函数 编辑:程序博客网 时间:2024/05/19 03:44
第1章  JavaScript简介
web页面可以被分成三层:HTML内容层、CSS样式层、JavaScript行为层
JavaScript事件处理函数:
事件处理函数    如何触发
onAbort        终止图片加载
onBlur        用户移出某表单元素
onChange    用户修改了表单元素的值
onClick        用户单击了类似按钮的表单元素
onError        程序在加载图片的时候出现错误
onFocus        用户激活了某表单元素
onLoad        页面加载完毕
onMouseOut    鼠标从某对象上移出
onSubmit    用户提交表单
onUnload    用户离开了窗口或框架页
<script type="text/javascript"></script>:JavaScript代码放置在两标签之间,type属性用来标识脚本语言和Internet内容类型
<script type="text/javascript" src="http://servername/JavaScriptfile.js"></script>: 引入JavaScript外部文件
www.validome.org:在线验证工具,用来检测标签是否正确

第2章  脚本的安装
//: 单行注释
/* */: 块注释
"hot" + "dog": 使用+号串连字符串
document.write("Hello to you");: JavaScript键当前文档作为文档对象document,write()方法在实质上和writeln()方法是一样的,只有一种情况例外:当文本插入在<pre>标签中时,writeln()方法会换行,<pre>标签用来标示预格式化文本,达到“所见即所得”的效果,显示所有空格和换行
Firebug是一款Firefor插件,用于编辑、调试和监视页面上的CSS、HTML和JavaScript
JavaScript: expression: URL伪协议,将JavaScript:后跟JavaScript表达式或表达式集合输入地址栏,可以得到运行结果,可用于调试或测试代码
<script type="text/javascript">
    <!--在较老的浏览器中隐藏JavaScript
        document.write(<h2>Welcome to Maine!</h2>");
    // -->
</script>: <!--为HTML注释的开始,//为JavaScript注释的开始,JavaScript会将"--"识别为一种特殊符号,因此须将-->注释掉
<noscript>
    Please turn JavaScript on if you want to see this page!<br>
</noscript>: 启用JavaScript的浏览器可以识别<noscript>,其中的内容会被忽略,不支持JavaScript的浏览器不能识别<noscript>,将忽略此标签,并把其中的内容显示出来

第3章  数据类型、字面量和变量
转义序列:转义序列只在<pre>标签内和警告框中起作用
\'    单引号
\"    双引号
\t    制表符
\n    换行符
\r    回车符
\f    换页符
\b    退格符
\e    Escape键
\\    反斜杠
\XXX    由一位到三位八进制数表示的Latin-1字符
\xXX    由两位十六进制数表示的Latin-1字符
\uXXXX    由四个十六进制数表示的Unicode字符
typeof(55): 返回为number,返回值还可能是string,boolean,object,null,undefined
null: 是JavaScript的一种对象,用来初始化变量
undefined: 未初始化的变量的值为undefined,使用这个变量会产生一个运行时错误
var variable_name;: 声明未初始化的变量时必须使用关键字var
局部变量是在函数内声明创建的变量
const FREEZING = 32;: 声明常量

第4章  对话框
alert("Phone number is incorrect");: 警告对话框,窗口对象的方法不需要在前面加上窗口对象名,因为窗口是最顶层的浏览器对象
var name = prompt("What is your name?", "");:提示对话框,第一个参数为提示,第二个参数为文本框中初始值,返回值为文本框中文本,取消则返回null
confirm("Are you really OK?");: 确认对话框,如果用户单击OK按钮,将返回true,如果单击Cancel按钮,将返回false

第5章  运算符
===: 等同(类型相同)
!==: 不等同(类型不相同)
/: 除法运算符返回一个浮点型除法结果,而非取整除法
字符串和数字相等测试:
测试            是否相等
5 == 5.0        true
"54" == 54        true
"5.4" == 5.4        true
NaN == NaN        false
null == null        true
-0 == +0        true
false == false        true
true == 1        true
null == undefined    true
字符串和数字的等同测试:
测试            是否等同
5 === 5.0        true
"54" === 54        false
NaN === NaN        false
null === null        true
-0 === +0        true
false === false        true
true === 1        false
null === undefined    false
逻辑与示例:
表达式            计算规则
"honest" && true    true
true && ""        (空字符串)
true && "honest"    honest
5 && 0            0
5 && -6            -6
5 && false        false
null && 0        null
null && ""        null
null && false        null
"hello" && true && 50    50
"this" && "that"    that
逻辑或示例:
表达式            计算规则
true || false        true
true || true        true
"honest" || true    honest
true || ""        true
true || "honest"    true
5 || 0            5
5 || -6            5
5 || false        5
null || 0        0
null || ""        (空字符串)
null || false        false
"hello" || true || 50    hello
"this" || "that"    this
逻辑非示例:
表达式            计算结果
!"this"            false
!0            true
!2            false
!false            true
!null            true
!undefined        true
位运算符:
运算符            计算规则
&            如果两个相应位都为1则该位返回1
|            如果两个相应位有一个为1则返回1
^            如果两个相应位只有一个为1则返回1
~            将运算符按位取反
<<            x<<y,将二进制数x向左移y位,右边补0
>>            x>>y,将二进制数x向右移y位,左侧用最左边的位来填充
>>>            x>>>y,将二进制数x向右移y位,左边填0
数据类型转换:
String()        转换成字符串
Number()        转换成数字
Boolean()        转换成布尔值
parseInt(字符串,基数);:将字符串转换为整数值,从字符串的开头开始解析,在第一个非整数位置停止解析,并返回当前读到的所有整数,如果字符串不是以整数开头,则返回NaN,默认基数为10
parseFloat(字符串);: 将字符串转换为浮点值,从字符串的开头开始解析,在第一个非数字位置停止解析,并返回当前读到的所有数字,如果字符串不是以数字开头,则返回NaN
eval(字符串);: 将字符串作为JavaScript表达式进行计算,并返回计算结果,如果没有结果则返回undefined
特殊运算符:
运算符            操作
delele            删除对象、对象的属性或者指定索引位置的数组元素
function        定义一个函数
in            如果属性是一个指定对象的属性则返回true
instanceof        如果对象是指定对象则返回true
new            创建一个用户定义的对象类型或一个内置对象类型的实例
this            引用当前对象
void            无返回值

第6章  条件选择
if语句:
if(age > 21) {
    alert("Let's Party!");
}
switch语句:
switch (color) {
case "red":
    alert("Hot!");
    break;
case "blue":
    alert("Cold.");
    bread;
default:
    alert("Not a good choice.");
    break;
}
while语句:
while (i < 10) {
    document.writeln(i);
    i++;
}
do while语句:
do {
    document.writeln(i);
    i++;
} while ( i < 10);
for语句:
for( var i = 0; i < 10 ; i++) {
    document.write(i);
}
标签:
outerLoop: for(var row = 0; row < 10; row++) {
    ....
    break outerLoop;
}

第7章  函数
function greetings(pal) {
    alert("Greetings to you, " + pal);
}: 定义函数,函数一般放在<head>中,函数可以在<script>中调用,在链接中调用或者在事件触发时调用,如果函数定义了两个形参,而我们传递了三个实参,则第三个实参会被忽略,若只传递一个实参,则第二个形参是未定义的,如果函数没有定义return语句,则返回undefined值
<a href="JavaScript:greetings()"></a>: 在链接中调用函数
onClick = "greetings('Dan');": 在事件中调用函数
var greets = function() { return "Greetings to you!";}: 匿名函数变量,其值是函数定义,可被用作函数引用
text = greets;: 其值是函数定义
text = greets();: 函数调用,其值是函数返回值
闭包:
function paint(type, color) { //闭包是定义在另一个函数中的匿名函数
    var str = "The " + type + " is " + color;
    var tellme = function() { //定义匿名函数
        document.write("<big>" + str + ".</big><br />");
    }
    return tellme;//返回函数的引用
}
var say = paint("rose", "red");
say();//调用匿名函数
递归的定义:递归,见递归
主要的错误类型:
错误名        什么时候会引起该错误
EvalError    以错误的方式使用eval()函数
RangeError    数字变量或参数超出允许范围
ReferenceError    使用不合法的引用,如没有定义的变量
SyntaxError    在对eval()中的代码进行语法分析时发现错误
TypeError    变量或参数的类型错误

URIError    encodeURI()或decodeURI()接收到不合法的参数


第8章  对象

创建类:
function Book() {
    this.title = "The White Tiger";
    this.author = "Aravind Adiga";
}
创建对象:
var bookObj = new Book;
this.calculate = function() { return r * t; }: 匿名函数作为对象方法
创建对象字面量:
var soldier = {
    name: undefined,
    rank: "captain",
    fallIn: function() {
        alert("At attention, arms at the side, head and eyes forward.");
    }
};
with关键字中,后面语句块中可以省略对象名和点,直接引用对象的属性和方法
with(employee) {
    document.write(name, ssn, address);
}
Book.prototype.publisher = "Penguin Books";: 通过Book类的prototype属性,给Book类添加publisher属性
Object对象的属性和方法:
constructor        对创建对象函数的引用
prototye        对对象原型的引用
toString()        返回表示指定对象的字符串
valueOf()        返回指定对象的原始值
hasOwnProperty(property    如果指定属性属于该对象,返回真,不包括从它的原型对象链继承来的属性
isPrototypeOf(object)    如果被检测对象是指定对象的父原型对象之一,则返回真
sr1 instanceof String: 判断对象sr1是否是String对象

第9章  JavaScript核心对象
var months = new Array();: 声明一个数组,且没有指定数组大小
var friends = ["John", "Jane", "Niveeta", "Su"];: 使用字面量符号声明数组
数组属性:
constructor    引用对象的构造函数
length        返回数组的元素数
prototype    通过增加属性或方法来扩展数组定义
states["CA"] = "California";: 关联数组,使用字符串代替数字组为索引值
cat.color = "black";与cat["color"] = "black";两者等效
数组方法:
concat()        合并两个数组
join()            把数组的所有元素放入一个字符串,元素通过指定的分隔符进行分隔
pop()            删除并返回数组的最后一个元素
push()            向数组的末尾添加一个或多个元素
reverse()        颠倒数组中元素的顺序
shift()            删除并返回数组的第一个元素
slice()            从已有数组中选取部分元素构成新数组,第一个参数是复制的起始元素,第二个参数是复制的终止元素,且不包括终止元素
sort()            对字符数组或数字数组进行排序
splice()        删除并/或者替换数组元素,第一个参数是起始位置,第二个参数是元素个数,若后跟插入元素则插入之,若没有则删除之
toLocaleString()    把数组转换为本地格式,并返回结果
toString()        把数组转化为字符串,并返回结果
unshift()        向数组开头添加一个或多个数组
创建日期对象:
new Date();: 返回本地日期及时间
new Date("March 15, 2010 09:25:00");
new Date("March 15, 2010");
new Date(10, 2, 15);
new Date(10, 2, 15, 9, 25,0);
new Date(500);
Date对象方法:
getDate()            返回一个月中的某一天(1~31)
getDay()            返回一周中的某一天(0~6),0为周日
getFullYear()            以四位数返回年份
getHours()            返回小时(0~23)
getMilliseconds()        返回毫秒
getMinutes()            返回分钟(0~59)
getMonth()            返回月份(0~11),0为一月
getSeconds()            返回秒数(0~59)
getTime    ()            返回1970年1月1日至今的毫秒数
getTimeZoneOffset()        返回本地时间与UTC时间的分钟差
getUTCDate()            根据世界时返回月中的一天(1~31)
getUTCDay()            根据世界时返回周中的一天(0~6)
getUTCFullYear()        根据世界时返回四位数年份
getUTCHours()            返回世界时小时(0~23)
getUTCMilliseconds()        根据世界时返回毫秒(0~999)
parse()                返回1970年1月1日到指定日期的毫秒数
setDate(value)            设置一月中的某一天(1~31)
setFullYear()            设置年份(四位数)
setHours()            设置一天中的小时(0~23)
setHours(hr, min, sec, msec)    设置本地或UTC时间的小时
setMilliseconds()        设置毫秒(0~999)
setMinutes(min, sec, msec)    设置本地时间或UTC时间的分钟(0~59)
setMonth(month, day)        设置本地时间的月份
setSeconds()            设置秒钟(0~59)
setTime()            以毫秒设置Date对象,从1970年1月1日起
setUTCdate()            根据世界时间设置一个月份中的一天(1~31)
setUTCFullYear()        根据世界时间设置年份(四位数)
setUTCHours()            根据世界时间设置小时
setUTCMilliseconds()        根据世界时间设置毫秒
setUTCMinutes()            根据世界时间设置分钟
setUTCMonth()            根据世界时间设置月份
setUTCSeconds()            根据世界时间设置秒钟
setYear()            设置年份数,从1900年起计数(00~99)
toGMTString()            根据世界时返回日期字符串
toLocaleString()        根据本地时间格式,转换成字符串,10/09/99 12:43:22
toSource()            返回Date对象的源代码
toString()            把Date对象转换成字符串
toUTCString()            根据世界时,把Date对象转换成字符串,10/09/99 12:43:22
UTC()                将逗号分隔表示的时间值转换为毫秒数
valueOf()            返回Date对象的原始值,以毫秒表示
Math对象的属性:
属性                描述
Math.e                欧拉常数、自然对数的底数
Math.LN2            2的自然对数
Math.LN10            10的自然对数
Math.LOG2e            以2为底e的对数
Math.LOG10e            以10为底e的对数
Math.PI                派
Math.SQRTI_2            1除以2的平方根
Math.SQRT2            2的平方根
Math对象的方法:
Math.abs(Number)        返回Number的绝对值
Math.acos(Number)        以弧度形式返回Number的反余弦
Math.asin(Number)        以弧度形式返回Number的反正弦
Math.atan(Number)        以弧度形式返回Number的反正切
Math.atan2(y,x)            返回y/x的反正切
Math.ceil(Number)        对Number向上取整
Math.cos(Number)        以弧度形式返回Number的余弦
Math.exp(x)            返回欧拉常数e的x次幂
Math.floor(Number)        对Number向下取整
Math.log(Number)        返回Number的自然对数(以e为底)
Math.max(Number1, Number2)    返回Number1和Number2中的较大值
Math.min(Number1, Number2)    返回Number1和Number2中的较小值
Math.pow(x, y)            返回x的y次幂
Math.random()            生成0.0~1.0的伪随机数,以计算机的系统时间为种子生成
Math.round(Number)        返回最接近Number的整数,小数部分是0.5时向上取整
Math.sin(Number)        以弧度形式返回Number的正弦
Math.sqrt(Number)        返回Number的平方根
Math.tan(Number)        以弧度形式返回Number的正切
Math.toString(Number)        将Number转换为字符串
创建String对象:
var string_name = "string of text";
var string_name = new String("string of text");
String对象的属性:
length        返回字符串的字符长度
constructor    返回创建String对象的函数
prototype    通过添加属性和方法扩展字符串定义
String对象(HTML)方法
方法                对应的HTML格式表达式
String.anchor(Name)        <a name = "Name">String</a>
String.big()            <big>String</big>
String.blink()            <blink>String</blink>
String.bold()            <b>String</b>
String.fixed()            <tt>String</tt>
String.fontcolor(color)        <font color = "color">String</font>
String.fontsize(size)        <font size = "size">String</font>
String.italics()        <i>String</i>
String.link(URL)        <a href = "URL">String</a>
String.small()            <small>String</small>
String.strike()            <strike>String</strike>
String.sub()            <sub>String</sub>(创建下标)
String.sup()            <sup>String</sup>(创建上标)
String操纵方法:
charAt(index)                返回指定索引位置的字符
charCodeAt(index)            以Unicode编码形式返回指定索引位置的字符
concat(string1, ..., stringn)        将字符串参数串联到调用该方法的字符串
fromCharCode(code)            返回一个由参数中逗号分隔的字符编码序列生成的字符串
indexOf(substr, startpos)        从startpos开始搜索第一个substr,并将搜索结果赋给startpos(索引值)返回,若没有则返回-1
lastIndexOf(substr, startpos)        从startpos开始搜索最后一个substr,并将搜索结果赋给startpos(索引值)返回
replace(searchValue, replaceValue)    用replaceValue替换searchValue
search(regexp)                搜索正则表达式并返回位置索引
slice(startpos, endpos)            返回字符串中startpos到endpos之间的部分
split(delimiter)            以delimiter为准将原字符串分隔开并放到数组中
substr(startpos, number)        返回原字符串中从startpos开始number个字符
toLocalLowerCase()            返回原字符串转换为小写后的一份副本
toLocaleUpperCase()            返回原字符串转换为大写后的一份副本
toLowerCase()                将字符串的所有字符转换为小写
toString()                返回原字符串
toUpperCase()                将字符串的所有字符转换为i大写
valueOf()                返回对象的字符串值
构造Number对象:
var n = new Number(65.7);
Number对象的属性:
MAX_VALUE            可表示的最大数,1.797 693 134 862 315 7e+308
MIN_VALUE            可表示的最小数,5e-324
NaN                非数值
NEGATIVE_INFINITY        负无穷大,溢出时返回该值
POSITIVE_INFINITY        正无穷大,溢出返回该值
prototype            用来增加属性或方法自定义Number对象
Number对象的方法:
toString(radix)            使用指定的基数(radix)将数字转化为字符串
toLocaleString()        根据本地数字格式将数字转化为i字符串
toFixed()            将数字保留小数点后指定位数,进行四舍五入并转化为字符串
toExponential()            将数字以指数形式表示,保留小数点后面指定位数并转化为字符串
toPrecision()            使用指数形式或定点形式表述数,保留小数点后面指定位数并转化为字符串
创建Function对象:
var sum = Function("a", "b", "return a + b;");//最后一个参数是调用函数时被执行的语句体
Function对象的属性和方法:
length        返回期望传递的参数个数
prototype    通过添加属性和方法来定义对象
apply()        可以将一个函数的方法应用于另一个函数
call()        通过另一个对象调用一个方法

第10章  浏览器对象模型:BOM
窗口包括window, navigator, frames[], document, history, location, screen
document包括image, form, link, anchor
navigator对象的属性:
appCodeName    浏览器编码名
appName        浏览器名
appVersion    浏览器版本
mimeTypes    浏览器支持的MIME类型数组
platform    运行浏览器的操作系统
userAgent    浏览器发送给服务器的HTTP用户代理头
plugin对象属性:
description    插件的描述信息
filename    插件的磁盘文件名
length        plugins[]数组的元素个数
name        插件名
MIME: 多用途因特网邮件扩展(Multipurpose Internet Mail Extensions)
mimeType对象的属性:
description    MIME类型的描述信息
enabledPlugin    为指定MIME类型配置好的plugin对象的引用
suffixes    用字符串形式列出该MIME类型所有可能的文件扩展名
type        MIME类型名
window对象的属性:
closed            当窗口关闭时为真
defaultStatus        窗口底部状态栏显示的默认状态消息
document        窗口中当前显示的文档对象
frames            窗口中的框架对象数组
history            history对象保存着窗口最近加载的URL
length            窗口中的框架数
location        当前窗口的URL
name            窗口名
offscreenBuffering    用于绘制新窗口内容并在完成后复制已存在的内容,控制屏幕更新
opener            打开当前窗口的窗口
parent            指向包含另一个窗口的窗口
screen            显示屏幕相关信息,如高度、宽度
self            指示当前窗口
status            描述由用户交互导致的状态栏的临时消息
top            包含特定窗口的最顶层窗口
window            指示被引用的当前窗口,与self等效
window对象的方法:
alert(text)                    创建一个警告对话框
blur()                        将焦点从窗口移除
clearInterval(interval)                清除之前设置的定时器间隔
clearTimeOut(timer)                清除之前设置的超时
close()                        关闭窗口
confirm()                    创建一个需要用户确认的对话框
focus()                        将焦点移至窗口
open(url, name, [options])            打开一个新窗口并返回新window对象
prompt(text, defaultInput)            创建一个对话框要求用户输入信息
scrollTo(x, y)                    在窗口中滚动到一个像素点的位置
setInterval(expression, milliseconds)        经过指定时间间隔后计算一个表达式
setInterval(function, milliseconds, [arguments])经过指定时间间隔后调用一个函数
setTimeout(expression, milliseconds)        在定时器超时后计算一个表达式
setTimeout(function, milliseconds, [arguments])    在定时器超时后调用一个函数
open()方法选项:
选项        值        含义
directories    yes/no或1/0    目录按钮
height        整形值        以像素值表示的高度
location    yes/no或1/0    地址栏
menubar        yes/no或1/0    菜单栏
resizable    yes/no或1/0    调整大小
scrollbars    yes/no或1/0    边框的滚动条
status        yes/no或1/0    状态栏
toolbar        yes/no或1/0    工具栏
width        yes/no或1/0    以像素值表示的宽度
window移动及调整大小的方法:
moveBy(20, 20)        相对方式,将窗口移动20个像素
moveTo(0, 0)        将窗口移动到屏幕左上角
resizeBy(15, 10)    调整窗口大小,相对大小为15*10像素
resizeTo(450, 350)    将窗口大小调整为450*350像素
HTML框架标签:
标签        属性        作用
<frameset>            定义一组框架或其他框架集的集合
        border        设置所有框架之间的框架边框厚度(像素)
        frameborder    在框架集中的框架间生成立体分割线,1或yes表示有边框,0或no表示没有边框
        rows        定义框架集中的行数及行高
        cols        定义框架集中的列数及列宽
<frame>                定义指定框架的属性
        name        用于JavaScript以框架名引用框架
        src        框架的URL或位置
frame对象的属性:
document        框架中当前加载的文档
frames            框架数组
length            框架数组的元素数,及框架数
name            赋给HTML name属性的框架名
parent            定义子框架的主窗口
self            当前框架
top            启动脚本的窗口
window            当前窗口或框架
frame对象的方法:
blur()            将焦点从框架移除
clearInterval()        清除定时器间隔
clearTimeout()        清除超时定时器
focus()            将焦点移至框架
print()            调用打印对话框
setInterval()        设置定时器间隔
setTimeout()        设置超时定时器
unwatch()        移除监视点
watch()            在框架属性上设置一个监视点,如果该属性改变会调用某个函数
if(window != top) {  //window不是层次结构的顶层窗口
    top.location.href = location.href;  //将该窗口置于顶层
}
location对象的属性:
属性        描述的URL内容
hash        如果该部分存在,表示锚点(anchor)部分
host        主机名:端口号
hostname    主机名
href        整个URL
pathname    路径名
port        端口号
protocol    协议部分
search        查询字符串
location对象的方法:
reload()    重加载当前URL
replace()    用新的URL替换当前页面
unwatch()    移除location属性上的监视点
watch()        在location属性上设置一个监视点,即在属性改变时调用某函数
history对象的属性:
current        当前页面的URL
length        history对象中的记录数
next        history对象中下一个页面的URL
previous    history对象中前一个页面的URL
search        查询字符串
history对象的方法:
back()        前往历史列表中的前一个URL条目,类似浏览器的后退按钮
forward()    前往历史列表中的下一个URL条目,类似浏览器的前进按钮
go(2)        向前移动两个页面
screen对象的属性:
availHeight    以像素值表示屏幕高度,并减去工具栏之类的高度
availLeft    第一个像素的x坐标(不计工具栏等)
availTop    第一个像素的y坐标(不计工具栏等)
availWidth    以像素值表示屏幕宽度,并减去工具栏之类的宽度
colorDepth    屏幕可显示的最大颜色数
height        以像素值表示的屏幕高度
pixelDepth    屏幕每像素的比特数
width        像素值表示的屏幕宽度

第11章  表单及输入设备的使用
HTML<body>标签属性:
alink        活动链接的颜色,即当鼠标放置在链接上时链接的颜色
background    背景图片的URL
bgcolor        页面的背景颜色
fgcolor        文本或前景颜色
link        未访问链接的颜色
vlink        已访问链接的颜色
部分document对象属性:
bgColor,fgColor            表示背景色和文本颜色
Cookie                允许读写HTTP cookie
Domain                同一域名下Web服务器的一个安全属性
lastModified            带有页面最后修改日期的字符串
linkColor,alinkColor,vlinkColor    分别表示未访问链接、活动链接和已访问链接颜色
referrer            把浏览器链接到本文档的源文档URL
title                当前文档标题
URL                包含当前文档URL的字符串
document对象的方法:
clear()                清空当前文档所有内容
close()                关闭文档的输入流
focus()                将焦点交给文档
getElementById()        返回具有指定ID的第一个对象的引用
getElementByName()        返回具有指定名字的对象集合
getElementByTagName()        返回具有指定标签的对象集合
open()                打开一份新文档,并擦除旧文档的内容
write()                向当前文档追加写入文本
writeln()            如果在<pre>标签中使用,则追加一个换行
form对象的属性:
action            服务器的URL(表示表单将被发送到哪里)
button            一个表示通用按钮的对象
checkbox        一个表示复选框的对象
elements        一个数组,该数组的元素对应表单中定义的每个字段(单选按钮、复选框、按钮等)
encoding        MIME类型
FileUpload        一个表示上传文件表单字段的对象
hidden            一个表示表单中隐藏字段的对象
length            表单中定义的输入字段个数
method            get或post(表单怎样发送到服务器)
name            表单的名字
password        一个表示密码字段的对象
radio            一个表示单选按钮字段的对象
reset            一个表示重置按钮的对象
select            一个表示选择列表的对象
submit            一个表示提交按钮的对象
target            引用HTML target标签的属性,该属性用来控制表单被提交后,显示返回给用户的响应消息的框架名称
text            一个表示本文框的对象
textarea        一个表示文本区的对象
form对象的方法:
reset()        重置表单字段,使其恢复到默认值
submit()    提交表单
element对象的属性:
form        定义元素的表单对象名(只读)
name        输入设备名,与HTML的name属性值对应(只读)
type        输入设备类型,如radio,checkbox,password等(只读)
disabled    布尔值,真则元素被禁用,也不能被改变,如果表单字段被禁用,则即使该字段已赋值也不会被发送到服务器
value        与输入设备相关的文本,如输入文本区或文本框的文本,按钮上显示的文本等(读/写)
this: 表示触发事件的对象
this.form: 表示创建该对象的表单的引用
text对象的属性:
accessKey        按下某快捷键从而让焦点落在text对象上
alt            设置或返回浏览器不支持文本框时显示的替代文本
defaultValue        赋给value属性的值,文本框第一次出现时显示的默认值
disabled        设置或返回是否禁用文本框
form            定义文本框的表单名
id            设置或返回文本框的id
name            用来引用文本框的名字
type            输入设备的类型,例如text
readOnly        设置或返回文本框是否只读
size            设置或返回文本框的大小
tabIndex        设置或返回文本框的tab键顺序
value            用户输入到文本框的任何内容将赋值给value属性
text对象的方法:
blur()            将焦点从对象移走
focus()            使对象获得焦点
handleEvent(event)    为指定事件调用处理函数
select()        选择或突出显示文本框中的文本内容
unwatch()        取消特定属性的监视
watch()            监视对象,并在属性改变时调用某函数
password对象的属性:
accessKey        设置或返回密码字段的快捷键
alt            设置或返回浏览器不支持密码框时显示的替代文本
defaultValue        赋给value属性的值,即密码框第一次出现时用户看到的默认值
form            定义密码框的表单的引用
id            设置或返回密码框的id
name            密码框的名字
maxLength        设置或返回密码框的最大字符数
readOnly        设置或返回密码框是否只读
size            设置或返回密码框的大小
tabIndex        设置或返回密码框的tab键顺序
type            输入设备的类型
value            表示对象的值
password对象的方法:
blur()            将焦点从密码框移走
focus()            将焦点移到密码框
handleEvent()        调用指定事件的处理函数
select()        选择或突出显示密码框中的文本
unwatch()        取消特定属性的监视
watch()            监视某个属性,并在属性改变后调用一个函数
textarea对象的属性:
accessKey        设置或返回快捷键,通过该快捷键可访问文本区
cols            设置或返回textarea的宽度
defaultValue        赋给value属性的值,当文本区第一次出现时显示的默认值
disabled        设置或返回是否禁用文本区
form            定义文本区的表单
id            设置或返回文本区的id
name            对象名,可用该名字来引用文本区
readOnly        设置或返回文本区是否可读
rows            设置或返回文本区的行数
tabIndex        设置或返回使用tab键遍历该文本区的顺序
type            输入设备的类型
value            表示对象的值,用户输入到文本区的内容将被赋给该属性
textarea对象的方法:
blur()            将焦点从文本区移走
focus()            将焦点移到文本区
handleEvent()        触发一个特定事件的处理函数
select()        选择或突出显示文本区中的文字
unwatch()        取消特定属性的监视
watch(0            监视对象属性,并在属性改变时调用一个函数
select对象的属性:
disabled        设置或获取一个值,表示用户是否可以与下拉菜单进行交互
form            定义select对象的表单的名字
id            设置或获取下拉菜单的id
length            选择列表中的选项个数
multiple        设置或获取是否可以进行多选
name            对象名,可用该名字来引用选择菜单
options[]        option对象的数组
selectedIndex        已选中选项的整数索引,如果没有选择任何选项,则为-1,该值可以被修改
size            设置或获取下拉列表可见行数
tabIndex        设置或获取select对象的tab键顺序的索引
type            如果设置了multiple属性,则type值为select-multipe,否则为select-one
select对象的方法:
blur()            将焦点从选择框移走
focus()            将焦点移到选择框
handleEvent()        触发一个特定事件的处理函数
unwatch()        取消特定属性的监视
watch()            监视对象属性,并在属性改变时调用一个函数
radio对象的属性:
accessKey        设置或获取访问此单选按钮的快捷键
alt            设置或返回浏览器不支持单选按钮时显示的替代文本
checked            如果单选按钮被选中则为true,否则为false
defaultChecked        表示radio输入标签的checked属性,当按钮第一次出现时用户看到默认的复选框
form            定义单选按钮的表单的名字
id            设置或获取单选按钮的id
name            对象的名字
tabIndex        设置或获取单选按钮的tab键顺序索引
type            表示单选输入标签的type属性
value            表示单选输入标签的value属性
radio对象的方法:
blur()            将焦点从选择框移走
click()            模拟鼠标单击按钮的处理
focus()            将焦点交给选择框
handleEvent()        调用一个特定事件的处理函数
unwatch()        取消特定属性的监视
watch()            监视对象属性,并在属性改变时调用一个函数
checkbox对象的属性:
accessKey        设置或获取访问此复选框的快捷键
alt            设置或获取浏览器不支持复选框时显示的替代文本
checked            如果复选框被选中则为true
defaultChecked        默认情况下选中的复选框
disabled        设置或返回复选框是否被禁用
form            定义复选框的表单名
id            设置或获取复选框的id
name            复选框名字
batIndex        设置或获取复选框的tab键顺序索引
type            输入设备的类型
value            赋给value属性的文本
checkbox对象的方法:
blur()            将焦点从复选框移走
click()            模拟鼠标单击复选框的处理
focus()            将焦点交给复选框
handleEvent()        调用一个特定事件的处理函数
unwatch()        取消特定属性的监视
watch()            监视对象属性,并在属性改变时调用一个函数

第12章  图片与链接
image对象的属性:
border            整型,定义图片边框的宽度
complete        布尔型,如果图片下载完成则返回true
height            整型,定义图片的像素高度
hspace            整型,定义图片水平方向的空白像素
lowsrc            为低分辨率设备定义一个可选图片
name            字符串型,定义图片的名称
prototype        用户自定义属性
src            字符串型,定义图片的路径和名称
vspace            整型,定义图片垂直方向的空白像素
width            整型,定义图片的像素宽度
一个完整的URL格式:
<protocol>(协议)//<host>(主机)[:<port>(端口)]/<pathname>(路径)[<hash>(锚)][<search>(查询)]
links对象的属性:
hash            URL中的锚
host            URL中的主机和端口
hostname        URL中的主机名
href            完整的URL
pathname        URL中的路径
port            URL中的端口
protocol        URL中的协议,包含冒号在内
search            URL中的查询部分
target            link的HTML目标属性

第13章  事件处理
JavaScript三种事件模型:內联模型、脚本模型、DOM2模型
內联模型:事件处理函数是HTML标签的一个属性,将函数赋给事件处理函数称为事件注册
JavaScript事件处理函数及其使用列表
事件处理函数    影响的元素            何时发生
onAbort        图像                当图像加载被中断时
onBlur        窗口、框架、所有表单对象    当焦点从对象上移开时(隐藏的除外),例如光标离开文本框
onChange    输入框、选择框和文本区域    当用户改变一个元素的值且失去输入焦点时,用于表单验证
onClick        链接、按钮、表单对象、        当用户单击对象时,返回false来取消默认的动作
        图像映射区域
onDblClick    链接、按钮、表单对象        当用户双击对象时
onDragDrop    窗口                当用户将一个对象(如文件)拖放到浏览器窗口时
onError        脚本                当脚本中发生语法错误等错误时
onFocus        窗口、框架、所有表单对象    当单击鼠标或者将鼠标移动聚焦到窗口或框架时(hidden除外)
onKeyDown    文档、图像、链接、表单        当按键被按下时
onKeyPress    文档、图像、链接、表单        当按键被按下然后松开时
onKeyUp        文档、图像、链接、表单        当按键被松开时
onLoad        主体、框架集、图像        文档或图像加载后
onMouseOut    链接(以及链接中的图像)        当鼠标移除链接时
onMouseOver    链接(以及链接中的图像)        当鼠标移到链接时,返回true以阻止其显示在状态栏
onMove        窗口                当浏览器窗口移动时
onReset        表单复位按钮            单击表单的Reset按钮,返回false以停止复位
onResize    窗口                当浏览器窗口大小改变时
onSelect    表单元素            当选择一个表单对象时
onSubmit    表单                当要发送表单到服务器时,停止提交给服务器时返回false
onUnload    主体、框架集            文件或框架集关闭或复位后
设置事件处理函数分为两步:
1、将事件处理函数指定为文档、表单、图像或链接等HTML标签的属性
2、注册事件处理函数或者叫做事件处理函数赋值,处理函数必须在双引号或单引号内        
事件对象方法:
事件方法    模拟的事件处理函数    影响的对象
blur()        onBlur            将焦点从窗口、框架、表单域移出
click()        onClick            模拟鼠标单击表单字段或按钮
focus()        onFocus            将焦点放在窗口、框架、表单字段
reset()        onReset            清空表单字段
select()    onSelect        选择表单字段中的文本或文本高亮显示
submit()    onSubmit        提交表单
事件对象的属性:Internet Explorer
属性                描述
altKey, ctrlKey,shiftKey    检测事件发生时Alt,Shift,Control键有没有被按下
button                1为左键,2为右键,4为中间键,多个按钮被按下,则该值为两个按钮的总和,如3(2+1)表示左右键都被按下
clientX,clientY            相对于事件发生所在网页的左上角的鼠标水平位置和垂直位置的像素值
fromElement,toElement        用于指示鼠标离开或移入的元素
keyCode                与按键事件相关的Unicode按键值
offsetX,offsetY            相对于事件发生所在容器的鼠标水平位置和垂直位置
returnValue            事件处理函数的返回值,true or false
srcElement            事件的起源元素
srcFilter            指定引起onfilterchange事件的过滤对象
x,y                相对于事件发生所在文档的鼠标水平位置和垂直位置
reason                用来标示数据源对象传送数据的状态
事件对象的属性:Mozilla Firefox
属性                描述
altKey,ctrlKey,metaKey,shiftKey    测试事件发生时Alt,Shift,Control,Meta键有没有被按下
pageX,pageY            相对于文档的位置
bubbles                标示是否存在事件冒泡
button                0标示左键,2标示右键,1标示中间键
cancelable            标示事件是否可以被取消
charCode            标示被按下的按键的Unicode值
clientX,clientY            相对于窗口左上角的位置
currentTarget            事件处理函数当前运行所在的节点
eventPhase            标示事件流的阶段,CAPTURING_PHASE(1),AT_TARGET(2),BUBBLING_PHASE(3)
layerX,layerY            层内鼠标位置
relatedTarget            在mouseover事件中代表鼠标离开的节点,在mouseout事件中,代表鼠标移到的节点
screenX,screenY            相对屏幕的位置
target                事件起源节点
timestamp            事件建立的事件(自纪元起,以毫秒为单位)
type                事件类型
which                在Netscape旧系统中标示按键的Unicode值
modifiers            代表如Alt,Shift,Meta等修饰键的位掩码
data                拖放的URL阵列
height,width            窗口的高和宽
对象事件属性:
事件处理函数属性    事件
onblur            blur
onfocus            focus
onchange        change
onmouseover        mouseover
onmousemove        mousemove
onmousedown        mousedown
onmouseup        mouseup
onclick            click
ondblclick        dblclick
onkeydown        keydown
onkeyup            keyup
onkeypress        keypress
onsubmit        submit
onload            load

onunload        unload


第14章  CSS与JavaScript


第15章  W3C DOM与JavaScript
一些DOM对象:
对象        定义
Node        一种用来表示HTML元素的原始数据类型
Document    文档树的根
Element        HTML文档中的元素
Attribute    HTML标签的属性
Text        标记标签之间的文本
节点属性:
属性            功能
firstChild        返回元素的第一个子节点
lastChild        返回元素的最后一个子节点
nextSibling        返回与当前子节点同级的下一个子节点
nodeName        返回节点名
nodeType        返回表示节点类型的数字:1代表元素,2代表属性,3代表文本
nodeValue        设置节点的文本值
ownerDocument        返回包含该节点的文档的根节点
parentNode        返回包含当前节点的元素
previousSibling        返回与当前子节点同级的前一个子节点
节点方法:
方法                    功能
appendChild(new node)            将新节点追加到子节点列表的末尾
cloneNode(child option)            复制节点
hasChildNodes()                如果节点有子节点就返回true
insertBefore(new node, current node)    在子节点列表插入新节点
removeChild(child node)            从子节点列表移出一个子节点
replaceChild(new child, old child)    使用新的子节点代替原子节点
JavaScript中代表HTML属性的属性:
属性        描述
className    表示CSS元素的类
dir        指定文档的文本方向,ltr从左到右,rtl从右到左
id        当前元素的id值
lang        指定文档的编写语言,en英语,ja日语,sp西班牙语
style        CSS內联样式属性值
title        返回文件<title>和</title>标签之间的标题
DOM方法:
方法                        功能
appendChild(new node)                将新节点追加到子节点列表的末尾
cloneNode(child option)                复制节点
hasChildNodes()                    如果节点有子节点则返回true
getAttribute(attributeName)            返回当前节点的属性
hasAttributes()                    返回节点是否定义了属性
hasChildNodes()                    返回节点是否指定了子节点
insertBefore(new node, current node)        将新节点插入到子节点列表
removeChild(child node)                从子节点列表中删除一个子节点
setAttributeNode(attributereference)        设置或创建当前节点的属性
replaceChild(new child, old child)        使用新的子节点代替旧的子节点
事件方法:
stopPropagation()                停止事件流中事件的进一步传播
preventDefault()                取消可取消的事件,意味着事件发生时的默认操作是不会被取消的
initEvent(eventType, isBubble, isCancelable)    事件类型有单击、鼠标按下等,布尔值决定事件的默认事件流是否冒泡是否可取消
div1.addEventListener("click", sayWelcome, false): 注册事件监听器,click为事件类型,sayWelcome为事件触发后执行的函数,false为开启事件冒泡,true为开启事件捕获
div1.removeEventListener("click", sayWelcome, false): 删除事件监听器
事件属性:
名称            描述
bubbles            测试事件是否可以在文档树冒泡的布尔值
canceleable        测试事件是否可以被取消的布尔值
currentTarget        目前正在被处理函数处理的节点
eventPhase        指定事件传播阶段的数字
fromElement        mouseover事件触发前鼠标所指向的对象
srcElement        指触发事件的标签对象(只在IE中)
target            事件发生的节点,不一定同currentTarget一样
timeStamp        事件发生的事件(日期对象)
type            事件发生的类型

第16章  cookie
escape(): 将所有非字母数字字符转换成对应的十六进制数字,前加%
unescape(): 将URI编码后的字符串转换为原始格式

第17章  正则表达式和模式匹配
/abc/: 正则表达式通常由斜杠来界定
var reobj = /san jose/ig: 字面量方式创建正则表达式对象,其值不可改变,i为忽略大小写,g为全局匹配,m为多行匹配
var reobj = new RegExp("san jose", "ig"): 函数方式创建正则表达式对象,其值可改变
RegExp对象的方法:
exec()        在字符串中执行匹配搜索,返回结果数组,若没有则返回null
test()        在字符串中测试模式匹配,返回true或false
RegExp对象的类属性:
input            当前被匹配的字符串
lastMatch        最后一个匹配字符串
lastParen        最后一对圆括号内的匹配子串
leftContext        最后一次匹配前的子串
RegExp.$*        标示是否多行匹配的布尔值
RegExp.$&        最后一次匹配的字符
RegExp.$_        输入的执行匹配的字符串
RegExp.$`        代表最后一次匹配模式前的子串
RegExp.$'        代表最后一次匹配模式后的子串
RegExp.$+        代表最后一对括号内的模式匹配子串
RegExp.$1,$2,$3...    捕获匹配到的子串
rightContext        最近一次匹配后的子串
RegExp对象的实例属性:
global            标示是否使用了在整个串中匹配的g选项的布尔值
ignoreCase        标示是否使用了匹配时忽略大小写的i选项的布尔值
lastIndex        在使用了g选项时,它标示调用exec()或test()方法找到的最后一个匹配后面的字符索引位置
multiline        标示是否使用了多行匹配的m选项的布尔值
source            正则表达式的文本
String对象中的正则表达式方法:
match(regex)            返回regex中的子串或null
replace(regex, replacement)    用replacement替换regex
search(regex)            返回字符串中regex的开始位置,若没有则返回-1
split(regex)            从字符串中删除所有包含regex的子串
元字符和元符号:
单个数字和字符
.        匹配除换行符外的任意字符
[a-z0-9]    匹配括号中字符集中的任意字符
[^a-z0-9]    匹配任意不在括号中的字符集中的字符
\d        匹配数字
\D        匹配非数字
\w        匹配字母
\W        匹配非字母
空白字符
\0        匹配null字符
\b        匹配空格字符
\f        匹配进纸字符
\n        匹配换行符
\r        匹配回车字符
\s        匹配空白字符、空格、制表符或换行符
\S        匹配非空白字符
\t        匹配制表符
锚字符
^        行首匹配
$        行尾匹配
\A        只匹配字符串开始处
\b        匹配单词边界,词在[]内时无效
\B        匹配非单词边界
\G        匹配当前搜索的开始位置
\Z        匹配字符串结束处或行尾
\z        只匹配字符串结束处
重复字符
x?        匹配0个或1个x
x*        匹配0个或任意多个x
x+        匹配至少一个x
(xyz)+        匹配至少一个xyz模式
x{m,n}        匹配最少m个、最多n个x
替代字符
was|were|will    匹配was或were或will
记录字符
(string)    用于反向引用
\1或$1        匹配第一对括号中的内容
\2或$2        匹配第二对括号中的内容
\3或$3        匹配第三对括号中的内容
JavaScript1.5新引入的字符
(?:x)        匹配x但不记录匹配结果
x(?=y)        当x后接y时匹配x
x(!=y)        当x后不是y时匹配x
/[a-z]+?/: ?关闭贪婪因子,查找到第一个小写字母后就停止检索
/(ma)+/: 分组或聚合,查找ma,mama,mamama等
/(John) (Doe)/: 记录或捕获,如果匹配,则John将被捕获在RegExp.$1中,Doe将被捕获在RegExp.$2中

第18章  Ajax(及JSON)简介
Ajax: Asynchronous JavaScript And XML(异步JavaScript和XML),是JavaScript的一个子集
ajaxRequest = new XMLHttpRequest(): 创建XMLHttpRequest对象
XMLHttpRequest对象属性和事件处理函数:
status            请求响应的HTTP状态码,200或404
statusText        从服务器响应中以字符串形式返回的HTTP状态码,OK或Not Found
readyState        代表当前对象状态的数字
responseText        将未解析字符串文本组为服务器返回的信息
responseXML        如果Content-type是text/html,就将响应结果分解到DOM中,用来获取多重值
onreadystatechange    当readystate改变时调用的事件处理函数
onerror            请求过程中发生错误时调用的Mozilla的事件处理函数
onload            文档加载完成后调用的Mozilla的事件处理函数
XMLHttpRequest方法:
abort()                取消请求
getAllResponseHeaders()        返回由换行符分割开的所有HTTP头的字符串
getResponseHeader("server")    返回指定HTTP头的值,如Server或Last-Modified
open()                用GET、POST、RUL等初始化XMLHttpRequest对象
send()                发送请求
setRequestHeader()        为即将发送到服务器端的消息头增加一个键/值对
objectRequest.open("GET", "http://localhost/hello.php?name=George");: 为同服务器通信的对象做准备并初始化,第三个参数为可选,true代表异步(默认值),false代表同步
objectRequest.send(null);:向服务器发送请求(初始化为GET)
objectRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");:定义Content-type(初始化为POST)
objectRequest.send("first=Joe&last=Blow");:向服务器发送请求(初始化为POST)
ajaxRequest.onreadystatechange = function() {...}:监控服务器响应状态
XMLHttpRequest对象的readyState属性:
状态        值
0        已创建对象,未初始化
1        加载中,还未调用send方法
2        已加载,已调用send方法,头不可用
3        交互,已收到部分数据,状态和响应头不可用
4        完成,所有数据都已接收并可用
一些HTTP状态码:
HTTP状态码            含义
200 OK                OK,服务器成功返回了页面
400 Bad Request            由于语法错误导致服务器不识别请求
401 Unauthorized        请求需要用户认证
404 Not found            指定的URL在服务器上找不到
500 Internal Server Error    服务器遇到意外错误,无法完成请求
503 Server Unavailable        由于服务器过载或维护导致当前无法处理请求
ajaxRequest.responseText: 服务器返回的字符串的文本
ajaxRequest.status: 返回的HTTP状态码
ajaxRequest.responseXML: 返回的XML文档对象
ajaxRequest.getResponseHeader("Content-type"): 返回Content-type响应头
ajaxRequest.getAllResponseHeaders(): 返回所有响应头的列表
var url = "http://mydomain?myParams="+"&pseudoParam="+new Date().getTime();避免缓存
var url = "http://mydomain?myParams="+"&pseudoParam="+Math.random();避免缓存
ajaxRequest.setRequestHeader('If-Modified-Since', 'Sat, 03 Jan 2010 00:00:00GMT');避免缓存
ajaxRequest.setRequestHeaer("Cache-Control", "no-cache");避免缓存
JSON: JavaScript Object Notation(JavaScript对象标记),是JavaScript的一个子集
JSON基本类型:
数据类型    示例
Number        5、5.435
String        "John Doe"、'red'
Boolean        true或false
Array        [1,2,3,4]
Object        {"Name":"John",
        "Age":35,
        "Status":true,
        }
null        null
var myObject = eval(')' + myJSONtext + ')');:eval()函数将myJSONtext文本转换为JavaScript数据结构
var employee = JSON.parse(jsonString);:使用JSON的parse()方法代替eval()函数
0 1
原创粉丝点击