《javascript高级程序设计》学习笔记二
事件
javascript和html之间的交互是通过用户和浏览器操作页面时引发的事件来处理的。
事件流：意味着页面上可能有不止一个，甚至有多个元素响应同一个事件。
冒泡型事件：（IE） 事件按照最特定的事件目标到最不特定的事件目标的顺序触发
捕获型事件：事件从最不精确的对象开始触发，最后到最精确
DOM同时支持两种事件模型，但是捕获型的先发生，两种事件流会触及DOM中的所有对象，从document开始到document结束
事件处理/监听函数
在IE中，每个元素和window对象都有两个方法：
[object].attachEvent("name_of_event_handler",fnHandler);附加事件处理函数
[object].detachEvent("name_of_event_handler",fnHandler);分离
用这种方式可以对一个事件添加多个处理函数
事件对象
事件对象只有在发生事件的时候才被创建，且只有事件处理函数才可以访问。所有事件处理函数执行完毕后，事件对象就被销毁
事件的类型
鼠标事件
键盘事件
html事件：窗口发生变动或者发生特定的客户端-服务器交互式触发
突变事件：底层的DOM结构发生改变时触发
获取事件对象
注意IE和DOM获取event对象的方法不同
IE中，event对象是与window对象相关的，而在DOM中，他独立于任何其他对象，并且作为参数传递的。
getEvent方法，可以同时在两种浏览器中使用并获取event对象
不接受任何参数，唯一的目的就是返回event对象
////////////////////////////////////////////////////////////////////////////////////////////////////////
样式编程
每一个页面上的元素都引入了一个style对象来管理元素的css样式
要用javascript来更改样式的值，只需要将css的字符串分配给他们的样式对象的特性就行
var oDiv = document.getElementById("div1");
oDiv.style.border = "1px solid black";
style对象还包含cssText特性，这个特性包含了所有描述元素样式的css字符串
innerText 和 inner HTML
为所有的元素引入的两个特性，以更方便的进行文档操作
innerText特性是用来修改起始标签和结束标签之间的文本的
oDiv.innerText = "hello world！"可以再空的<div/>中插入，变成<div/>hello world!</div>
还会自动将小于号、大于号、引号和&进行html编码，所以不用担心这些字符
可是只能返回文本表示。
如果要在元素中包含html标签，就需要用innerHTML，返回所有元素和文本的html代码
outerText和outerHTML 替换的是整个目标节点，删除标签本身并且把它替换成文本节点。
outerHTML的行为也差不多，创建用HTML是字符串表示的所有必要的DOM节点。
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
表单
html表单是通过<form/>元素来定义的，主要特性如下
method 表示浏览器发送GET请求还是发送POST请求
action 表示表单所要递交到的地址URL
<input/> 主要html输入元素。通过type特性来判断是哪种输入控件
text单行文本框
radio单选
checkbox复选框
file文件上传文本框
button一般按钮
submit递交按钮
reset重置按钮
image图像，和递交按钮功能一样
<select/>渲染组合框或者下拉列表框
<textarea/>渲染多行文本框
访问表单字段
每个表单的字段，不论是什么形式的内容，均包含在表单的elements集合中，可以用name特性或是他们在集合中的位置在访问不同的字段
myform[0] myform["textbox1"]
每个表单的字段都是表单的特性，可以直接通过名字来访问
myform.textbox1
若名字中有空格，则可以用方括号标记
myform["text box 1"]
也可以用getElementById和表单字段来直接获取这个元素
表单字段的共性：包含同样的特性方法和事件
disabled表单是否被禁用
form指向字段所在表单
blur失去焦点
focus表单字段获得焦点
失去或者得到焦点时触发onblur和onfocus事件处理函数
递交表单
使用递交按钮或者扮演递交按钮角色的图像来递交表单
<input type="submit" value="Submit" />
也可以使用submit方法，可以在页面的任何位置使用
先通过getElementById或者document.forms集合来获取form元素的引用
oForm = document.getElementById("form1")
..... = document.forms["form1"]
..... = document.forms[0]
然后可以立即调用submit方法
oForm.submit()
文本框
分为单行或者多行
获得文本框内容：value属性获得字符串 length属性获得长度
选择文本：select()方法 选中文本框中的所有文本，必须已经获取焦点 之前先调用focus()
文本框事件：change用户更改内容后文本框失去焦点时发生；select当一个或者多个字符被选中时发生
允许有效字符\禁止无效字符 validchars invalidchars
列表框和组合框
<select/>
两种框使用相同的代码 默认为组合框
<option/>的value特性来确定控件所有可能的值，所选的选项可将它的value值指定给控件
访问选项：options集合， text返回显示文本， value返回值特性
获取\更改选中项：selectedIndex特性，总是包含目前选中的选项的索引
////////////////////////////////////////////////////////////////////////////////////////////////////////
表格排序
数组排序
sort方法 默认以ASCII码的升序进行排列的
sort方法还可以接受一个参数，即比较函数，来判定大小
revers 顺序倒转
对表格排序
单列的表格排序：
为表格的头部创建<thead/>元素，为存放数据的列创建<tbody/>元素
比较函数：使用包含在行内的值对<tr/>元素进行排序
在函数内获取这个值，在获取这些值之后可以使用localCompare对他们进行排序
sortTable函数，接受一个参数，要进行排序的表格的ID
对行排序：
创建一个数组，将表格的元素放入其中，对数组排序后使用DOM将行按顺序逐个放置
//复杂的表格排序先不看了 暂时没用
