JS 初探

JavaScript简单介绍
① JavaScript是一种可以与HTML标记语言混合使用的脚本语言，其编写的程序可以直接在浏览器中解释执行。
② JavaScript与Java没有必然的联系。
③ JavaScript的国际标准时ECMAScript。

JavaScript是一种基于对象和事件驱动并且相对安全性的客户端脚本语言。同时也是一种广泛用于客户端web开发的脚本语言，常用来给HTML网页添加动态功能，比如响应用户的各种操作。它最初是由网景公司的设计人员设计，是一种动态、弱类型、基于原型的语言，内置支持类。JavaScript是sun公司的注册商标。
JavaScript实现包含三个部分：ECMAScript、文档对象模型、字节顺序记号。

如何使用js？
在HTML文档中插入脚本语言可以使用

更多memory 总结看：JSmemory.doc

常见内置对象
时间对象
Math对象
String对象

时间对象Date 需要new
Math对象 不需要new 都是静态方法之类的
String对象就是对字符串的各种操作，

没啥好写的，不懂翻API好吧。
Pass！

Bom 与 Dom
Bom与Dom才是主题，有一个图，我扒过来的，可以很好说明我们后端需要学哪些。

Bom ：Browser object model 也就是浏览器对象模型，主要是理解浏览器，所以我们得知道window对象
Window对象
Window对象：W3C中的解释：
window对象表示一个浏览器窗口或一个框架(frame,iframe标签)。在客户端JavaScript中，window对象是全局对象，所有的表达式都在当前的环境中计算。也就是说，要引用当前窗口根本不需要特殊的语法，可以把那个窗口的属性作为全局变量来使用。
从我扒过来的图也可以看得出来，window对象是浏览器对象中其它大部分对象的共同的祖先，所以很多JS程序中都省略了window对象。例如：可以只写document，不必写window.document。
学习一个对象无非是学习它的属性和方法，在w3c中，可以很清楚的知道各个属性和方法的含义，这里我列举一些比较重要的。也就是上图中的（document放在Dom中总结）

Window对象属性：
History: history对象包含用户在浏览器窗口中访问过的URL（有点像前进、后退的那两个箭头。）
这里只看它的方法：1. back()：加载history列表中的前一个URL
2. forward() : 加载history列表中的下一个URL

3. go()：加载history列表中的某个具体页面
   Location对象：该对象包含当前URL的信息。访问方式：window.location
   属性：1. href 设置或返回完整的URL（都是基于当前页面的）
4. host 当前主机名加URL端口号
5. Hostname 当前主机名
6. Port 当前端口号
   方法：reload() 重新加载当前文档
   Navigator对象：Navigator 对象包含的属性描述了正在使用的浏览器。
   知道一个属性：userAgent 用户代理
   Window.navigator.userAgent 返回由客户机发送服务器的user-agent头部值。

Window方法:
Alert()：警告框
Confirm()：确认框
Prompt()：提示输入框
SetTimeout()：定时器
SetInterval()：间隔提示器
clearTimeout()：取消定时，需要定时器返回的id
ClearInterval()：取消间隔提示，同样需要其返回的id

具体不说了，没意思，不记得了可以去w3c中看
Bom结构
Bom结构就是文档对象，可以看成树形结构，其实这个有点像以前学的dom4j解析技术，应该是一样的，只是一个用在JavaScript 一个用于Java。
Dom是重点，在Ajax开发中，DOM模型其实是最核心结构，是所有Ajax开发的基础架构。如果没有DOM模型，就没有办法在客户端改变页面的内容，所有的局部刷新，异步请求也就无从实现。所以，好啦我还没学过Ajax啦。。。不吹了
结点：
可以说，文档就是由层次不同的多个节点组成，结点就代表了全部内容。

结点的类型：

1. 元素结点element，也就是标签，
2. 属性结点 attribute，标签的属性，
3. 文本结点 ：文本内容，注意，空格也要算是文本内容

中间的text就是文本结点，文本结点和属性结点都看作元素结点的子节点

元素结点的引用，也可以看出是选择器吧，个人觉得。就是根据某个特征定位选取结点。
直接引用：

1. document.getElementById(“id”);
2. Document.getElementByName(“name”);
3. Document.getElementByTagName(“tagName”);
   间接引用（说实话，这个引用很。。。不知道Ajax中使用情况怎么样）
4. 引用子节点：childNodes、firstChild、lastChild
5. 引用父节点：parentNode
6. 引用兄弟结点：element.nextSibling、element.previousSinling;

拿到引用，处理结点：

1. 处理属性结点：
   --元素结点”.”属性名称（可以读写属性值）这个只能操作元素默认的属性，自己添加的属性不能被获取，但是可以获取修改后的值。
   --使用setAttribute（）、getAttribute设置和使用属性，这个只能操作固定的属性值，改变后，不能再获得修改后的值。

2. 处理文本结点：
   innerHTML：获取结点中所有内容，如果节点里面是html语句，会将它一起获取。
   InnerText：只能获得text，无视html语句，专注文本。

当然，DOM模型不会这么简单，还有各种操作结点的方法，以及改变文档的层次结构，动态的添加、删除、修改标签。其实DOM是最适合对文档结构修改的技术，像XPath这种解析技术，适用与查询。用到再深入学习吧。

最后有个很有用的技术，利用Javascript操作CSS，即动态改变标签的衣服。

1. 通过style对象改变结点的css
   --利用style对象来控制元素的css，每个style对象对应为该元素指定的css，而每个css属性一一对应于style对象的属性。
   对于单个单词的css属性，再style对象中的属性名称不变。
   对于双单词或多单词的属性改写为驼峰写法。例如：css中的font-size对应style属性为fontSize。
2. 使用className属性指定结点样式
   --结点的className属性对应于css中的类选择器

我觉得这个bom还是值得练习，好好试一番的。还是写一下表单吧，我们用的最多的也就是表单了。
表单对象的获取

1. document.getElementById(“formId”);
2. Document. FormName属性值
   表单的属性
3. Id
4. Name
5. Action
6. Method
7. Enctype
8. Elements 获取所有表单域对象的一个数组：input textarea select
   表单的方法
9. submit（） 提交表单，调用这个方法可能不会运行onsubmit事件，设计缺陷
10. Reset（） 重置表单
    表单的事件：再表单对象上添加
11. onsubmit（） 表单提交之前 触发该事件
12. Onreset（） 表单重置之前 触发该事件

表单域

1. document.getElementById（“id”）
2. Document.formName.fieldName document.formname.inputname
   表单域的通用属性
3. readonly=”readonly” 只读，不能修改但可以提交该数据
4. Disabled=”disabled” 不可用，不能提交数据
5. Type like text password button and so on
6. Value
7. Name
8. Id
9. Form 过去表单域对象所在的表单对象
10. Focus() 某个表单域对象获取焦点
11. Blur() 某个表单域对象丢失焦点

最后，利用Javascript改变文档的层次结构 API：

1. 创建新节点 document.createElement(“tagName”);
2. 插入子节点 fatherObject.appendChild(“newChild”);
3. 在某个结点前插入子节点 fatherObject.insertBefore(“newChild”,”oldChild”);
4. 替换子节点 fatherObject.replaceChild(“newChild”,”oldChild”);
5. 删除子节点 fatherObject.removeChild(”node”);