1.通过ID或者其他元素找到要处理的HTML对象：（举例通过ID） var obj=document.getElementById('id');2.操作此对象 添加属性：obj.setAttribute('attr_name','attr_value'); 获取属性值：obj.getAttribute('attr_name'); 删除属性：obj.remo...
DOM是Document Object Modeule的缩写，一般来说，DOM
分成3个方面。
1、DOM Core
DOM Core并不专属于javascript，任何一种支持DOM的程序设计语言都可以使用它，用途也远不止仅限于网页，也可以用来处理任何一种使用标记语言编写出来的文档，如XML。
例如：document,getElementsByTagName(“form”);//使用DOM Core来
Javascipt示例
本文档包含创建Go by Example之类的注释，例如Java语言概述。 随着生态系统和语言规范的发展，随着时间的推移，这肯定会被
添加
，
删除
和测试。
循环：对于
函数：将函数作为参数传递
函数：接收可变数量的参数
函数：返回可变数量的参数
函数：递归函数
更改
标签
值
更改输入
元素
鼠标X / Y坐标
通过
标签
名称
获取
元素
元素
样式
操纵URL
编辑子节点
设定
属性
添加
元素
面向对象JavaScript
异常处理正则表达式
一世。 index.
html
ii。 导入JavaScript iii。 介绍性例子
一世。 index.
html
<!DOCTYPE
html
>
<
html
lang =" en " >
< meta charset =" U
JavaScript：定义行为和动作
(基于对象和事件驱动的客户端脚本语言；也是一种广泛应用于客户端Web开发的脚本语言)
基于对象：网页中的一切
元素
都是假象！不需要new，即可直接使用
事件驱动：JavaScript的执行都是由事件引发
解释执行：先读到的先执行，后读到的会替代先读的
可以使用任何文本编辑工具编写 JavaScript 代码，然后由浏览器解释执行。
JavaScript常用于实现如下功能：
|--控制文档的外观和
内容
；
|--对浏览器的控制；
|--与
HTML
表单的交互；
|--与用户的交互；
|--执行计算等。
1.单击事件：定义在按钮的开始
标签
中
语法：onclick="
js
语句"
弹出警告：alert(‘字符串’)
强调：1.
js
区分大小写
2.字符串单双引号不区分
[removed]
标签
：页面中专门集中编写JavaScript的区域
js
的方法定义：function方法名([参数列表]){
[return 返回值]
注意：
js
中的方法可以直接写在代码中，不需要“类”包裹
使用方法：方法名()-->方法调用-->立即执行
2.
js
文件：网页外专门保存
js
脚本的文件--推荐
强调：
HTML
、CSS、
JS
都要使用UTF-8编码保存(window系统)
使用
js
文件引入网页：[removed][removed]
强调：一旦定义src
属性
则其中的代码失效
解释执行：语句也可以直接写在
js
文件中，边解释边执行
3.***调试***
|--①.只有在执行时，才会报错
|--②.错误信息，浏览器页面看不到--没效果
| 解决：控制台--（工具-->JavaScript控制台或F12）
| 包含错误信息；指向错误位置的超链接
|--③.打桩：在指定变量位置输出变量或对象的
内容
console.log(
内容
);-->出现在控制台-->日志
4.变量：
js
中的变量不需要提前指定类型，由赋值时动态决定
所有的变量都用var声明
5.数据类型：
|--String(字符串类型)
|--Number(数字类型)
|--Boolean(布尔类型)0、-0、null、""、false/undefined或NaN,则该对象设置为false。其余都可以当true
6.数据类型的隐式转换：
|--数字 + 字符串：数字转换为字符串
|--数字 + 布尔值：true转换为1，false转换为0
|--字符串 + 布尔值：布尔值转换为字符串true或false
|--布尔值 + 布尔值：布尔值转换为数值1或0
7.数据类型转换函数 ：(方法前不需要对象调用的：全局函数)
|--toString()：转换成字符串。所有数据类型均可转换为 string 类型；
|--parseInt()：强制转换成整数。如果不能转换，则返回 NaN（not a number）；
|--parseFloat()：强制转换成浮点数。如果不能转换，则返回 NaN(Not a Number)
|--typeof()：查询数值当前类型。
|--isNaN()：判断是否为数字。返回 true：不是数字/false：是数字
| |--isNan(""):对空字符串不验证，直接返回false
| |--如果输入的是字符串类型的数字，返回false--不能判断数据类型，只判断
内容
| |--如果输入的是boolean，返回false。因为boolean可以和number类型直接做计算
| |--和任何数字计算都得NaN;和任何数字作比较都得false
|--注：[removed]();节点输出，即在当前位置输出括号里的
内容
*凡是从页面上进入
js
的都是字符串类型
8.查找
元素
：抓住根节点，就等于抓住整棵树
网页的根节点：document对象
要找
元素
，必须利用document对象（当前网页文件）
精确查找某个ID的
元素
：document.getElementById(id名)；
9.null和undefined：
|--null：一个特殊的值，表示“无值”--空对象。数据类型为Object
|--undefined：表示声明了变量但从未赋值或者对象
属性
不存在
10.双等号（==）和全等号（===）：
|--“==”为确定两个运算数是否相等，“==”运算符会进行类型转换。转换后运算数相等就返回true，否则返回false
|--“===”不执行类型转换，即，只有在无需类型转换运算数就相等的情况下，才返回true，否则返回false
|--附：if(null)、if(defined)、if(NaN)都相当于if(false)
-----猜数字游戏-----
失去焦点时，判断猜对猜错
获得焦点：onfocus 失去焦点：onblur
当事件就发生在获得
内容
的当前
元素
上：
this直接获得当前
内容
对象。可以代替当前对象完成一切
操作
，拥有当前对象的所有
属性
前端优化：
js
中最好用三目运算代替if else
11.String：
|--查找：x.indexOf(‘关键字’[，开始位置下标])
| 每次只查找第一次出现的位置
|--替换：x.replace(‘关键字’[,‘替换
内容
’])--不会修改原x字符串
| 每次只替换第一次找到的
|--查找和替换所有：while循环
|--String 对象的常用方法有：
|--x.toLowerCase()、x.toUpperCase()：大小写转换方法；
|--x.charAt(index)：返回指定位置的字符；
|--x.charCodeAt(index)：返回指定位置字符的Unicode编码；
|--x.indexOf(findstr,index)、x.lastIndexOf(findstr,index)：
获取
指定字符；
|--x.substring(start, end)：
获取
子字符串；
|--x.replace(findstr,tostr)：替换子字符串；
|--x.split(bystr)： 拆分子字符串。
|--String与正则表达式
|--str.match(regExp);--查找str中匹配正则表达式的关键字
| 返回：如果没找到，返回null。若找到，返回1个数组，数组的每个
元素
是每个找到的匹配关键 | |--str.replace(regExp,"替换值")--替换str中所有匹配的关键字
| 强调：replace方法不改变元字符串，只能返回新字符串。必须用变量接收新字符串
|--
js
中正则表达式语法：/正则表达式/[
属性
后缀]--其中
属性
后缀，g：全局匹配 i：忽略大小写(仅英文有效)
如果不适用模式匹配方式，将执行原文匹配
结果：如果正则表达式写错，也将执行原文匹配
12.Array笔试题：
js
中数组声明方式：
A new Array(7)
B new Array(7，‘a’，true)
C [7，'a',true]--
js
中所有[]都表示数组
D []--实例化一个空数组对象 实例化空数组：var arr=[];
特点：
元素
个数不限定，
元素
类型不限制
13.Array 对象的常用方法：
|--1.join()方法--用于把数组中的所有
元素
放入一个字符串
| eparato表示要使用的分隔符。如果省略该参数，则使用逗号作为分隔符
|--2.toString()方法--可把数组转换为字符串，并返回结果
|--3.concat()方法--用于连接两个或多个数组，该方法不会改变现有的数组
|--4.slice()方法--截取
元素
。根据给定的范围可从已有的数组中返回选定的
元素
14.Function：
js
中一切都是对象，连方法都是1个对象！！
笔试题：
js
中方法定义集中方式：
A：function compare(a,b){return a-b;}---*可以任意地方声明方法*
B：var compare=function(a,b){return a-b;} ---|
--其实方法名也是方法对象的变量名;等号右边其实就是1个匿名方法对象 |--*必须在传递之前声明方法对象*
C：var compare=new Function('a','b','return a-b') ---|
--其实
js
底层就是new Function;构造函数中的参数都是字符串
结论：所有的方法都是function类型的。
15.JavaScript中的所有事物都是对象，分为三类：
|--简单对象：String、Number、Boolean
|--组合对象：Array、Math、Date
|--复杂对象：Function、Regex、Object等
16.Array排序：
|--升序：function compare(a,b){return a-b;}
|--降序：function compare(a,b){return b-a;}
比较器用法：arr.sort(比较器方法名);
遍历：for(var i=0;i<arr.length;i++)--等同Java
Array倒转：arr.reverse();用于颠倒数组中
元素
的顺序
17.Array
元素
操作
：
|--arr.push(x);向数组
增加
1个新
元素
x（位于数组最后位置）
|--arr.splice(开始位置，
删除
几个[,x1,x2,x3...])
|--arr.indexOf(x) 返回x在数组中的下标---经常用于判断
元素
是否存在。如返回-1，x则不在数组中
18.Number对象：
|--x.toFixed(num):可把Number四舍五入为指定小数位数(num:0-20)的数字
|--x.toString():用于把一个 Number 对象转换为一个字符串，并返回结果
19.正则表达式对象:(专门用于查找和验证)
reg.test(‘要验证的完整字符串’)匹配返回true，否则返回false
强调：如果正则表达式使用了^和$，必须完整匹配才行。反之则部分匹配
20.Date对象：（计算方法：先get，再计算，最后set回去）
|--1.每个分量上都有一对get/set方法
|--2.命名：get|set年月日，单数；get|set时分秒，复数（s）
|--3.除了日期从1开始到31结束外，其余都从0开始到-1结束
|--Date对象的常用方法
|--1.
获取
日期数据 getDate()、getDay()、getFullYear()等
|--2.修改日期数据 setDate()、setDay()、setFullYear()等
|--3.
获取
日期格式的字符串 toString()、toLocaleTimeString()、toLocaleDateString()等
21.argument参数：所有方法都隐藏的一个数组对象
作用：不设置任何的形参的情况下，自动接收所有传入参数
arguments.length：获得参数个数
arguments[i]：获得每个参数--都要判断和类型转换
22.全局函数：不用任何对象点(.)就可以调用--可用于所有的 JavaScript 对象
常用的全局函数有：parseInt/parseFloat、isNaN、eval、decodeURI/encodeURI等。
encodeURI和decodeURI：
|--encodeURI：可把字符串作为 URI 进行编码
|--decodeURI：decodeURI()函数可对encodeURI()函数编码过的 URI 进行解码
eval() 函数可计算某个字符串，并执行其中的的JavaScript代码
23.BOM:
操作
浏览器窗口的对象模型。
--即浏览器对象模型 ，用来访问和操纵浏览器窗口，使 JavaScript 有能力与浏览器“对话”
DOM：
操作
网页中
元素
对象的对象模型--即文档对象模型，用来
操作
文档
window对象的常用
属性
：
|--document：窗口中显示的
HTML
文档对象
|--history：本次浏览过窗口的历史记录
| --前进：history.go(1);后退：history.go(-1);刷新：history.go(0);
|--location：窗口文件地址对象（地址栏）
|--event：事件对象
|--screen：屏幕对象
|--name：窗口名称
|--opener：打开当前窗口的 window 对象
|--navigator：有关浏览器的信息
|--cookieEnable：判断当前浏览器是否启用cookie
|--userAgent:获得浏览器的名称和版本号
window 对象的常用方法有：
|--alert();--警告框--只能点确认
|--confirm();确认框--可以选择确认或取消
|--prompt();对话框--用于显示可提示用户进行输入
|--window.open('url'[,'name'])：打开1个选项卡
|--window.close()：关闭当前选项卡
24.定时器：凡是网页中自动动态的效果都是用计时器实现的
|--周期性定时器：每隔一个时间段自动执行一次，循环执行
| |--setInterval() 启动-->用于启动一个周期性定时器
| 语法：timer=setInterval(方法名，间隔毫秒数)
|--clearInterval() 停止-->用于停止一个周期性定时器
语法：timer=clearInterval(timer)
|--1次性定时器：先等待一段时间，再自动执行一次，自动结束
|--setTimeout() 启动-->用于启动一个一次性定时器
|--clearTimeout() 停止-->用于停止一个一次性定时器
|--表单控件，读写
内容
：.value
|--普通
html
元素
，要想读写开始
标签
和结束
标签
之间的
内容
：[removed]
计时器：1.做什么事：方法；
2.一个变量：存计时器的线程号
3.何时启动计时器：事件
25.document：1.代表当前网页文档；
2.所有网页
元素
的根
元素
；
3.查找和
操作
元素
，都要依靠document；
节点：nodeName--
标签
名或
属性
名
DOM
操作
样式：对象.className
属性
等效于<
标签
class="">
DOM树：当前节点向上：txtObj[removed]（）
向下：txtObj.getElementByTagName（）
26.表单中查找控件对象：document.getElementsByName('name
属性
')
DOM
增加
新节点：两种方法
创建新节点：document.creatElement('
标签
名')
--此时新
元素
对象仅在内存中游离，页面看不见！
添加
新节点：找到父
元素
！
|--appendChild() 方法只能将新节点作为某节点的最后一个子节点
| --此时新
元素
追加到了父
元素
的末尾
|--parentNode.insertBefore()(新
元素
对象，A)--其中A为新
元素
要插入位置的后一位
元素
DOM
删除
元素
：node.removeChild(childNode)--node为父节点，childNode为要
删除
的节点
27.
HTML
DOM
Select和Option对象：
select对象：代表
HTML
表单中的一个下拉列表，每个<select>
标签
即表示一个 Select 对象
|--
属性
：
|--options：返回包含<select>
元素
中所有<option>的一个数组，每个
元素
对应一个<option>
标签
，索引从0开始
|--selectedIndex：设置或返回下拉列表中被选选项的索引号
|--size：设置或返回下拉列表中一次显示显示的选项数
|--方法：
|--add(option)：用于向<select>
添加
一个<option>
元素
。
|--remove(index)：从下拉列表
删除
选项
Select对象有事件onChange当改变选择时调用的事件句柄。Select对象的onChange
属性
引用了一个事件句柄函数。当用户选
中一个选项，或者取消了对一个选项的选定时，就会调用该句柄。这个事件不会指定新的选项是什么，必须通过Select对象的 selectedIndex
属性
，或者各个Option对象的selected
属性
来确定这一点。
option对象：代表
HTML
表单中下拉列表中的一个选项，每个<option>
标签
表示一个Option对象
|--创建：var o = new Option(text,value);
|--
属性
：
|--index：返回下拉列表中选项的索引位置
|--text：设置或返回选项的文本值；
|--value：设置或返回选项的值；
|--selected：设置或返回选项的 selected
属性
的值，该
属性
设置选项的当前状态，如果为 true，则该选项被选中
28.table对象：
rows数组：表中所有行对象
方法：var row=table.iusertRow(i);--返回刚
添加
的新行
table.deleteRow(i); --i：行的下标。如果i取-1，即在表格末尾追加一行
tableRow对象：
cells数组：当前行中所有单元格的对象
方法：var 刚
添加
的新单元格=tr.iusertCell(i);
tr.deleteCell(i);
tableCell对象：取单元格
内容
--td[removed]
29.事件冒泡：
|--1.由外向内，捕获事件：记录哪级
元素
有什么事件
|--2.由内向外，冒泡执行：按记录的顺序由内向外执行
取消冒泡：
|--1.获得事件对象！--event
onclick="func(event)"--其中event和this都是关键字，表示事件对象
func(e)--此时e就是事件对象
|--2.取消冒泡：e.cancelBubble=true;
何时用：如果大量子
元素
拥有相同事件，应将相同事件统一定义在1个父
元素
上1次即可
转自：http://blog.csdn.net/fengspg/article/details/7085872
区别jquery对象跟dom对象，首先做好好的编程习惯：
一般jquery对象前面加"$"：var $sure = $("#sure");dom对象直接编写：var sure = document.getElementById("sure").value。
jquery给
html
标...
