1.Object
|-1.var 变量=new Object();
|-变量.自定义的属性='值';
|-变量.自定义名称=function(){}
|-2.var 变量={
属性:属性值,
....,
方法名:function(){ ... }
};
2.数组
|-1.var 变量=new Array();
|-2.json: var 变量=[val1,...,valn];
3.字符串
|-API
4.Date类型
|-var 变量=new Date();
5.Math对象
|-random
|-round
|-floor
|-ciel
|-abs
|-sqrt
6.事件处理模型(观察者设计模式)
|-三个要素
|-事件:event
|-事件源:触发事件的标签
|-监听器:事件监听属性
7.常见的事件监听属性
|-onclick:单击
|-ondblclick:双击
|-onfocus:获得焦点
|-onblur:失去焦点
|-onmouseover:鼠标移入
|-onmouseout:鼠标移出
|-onmouseleave:鼠标移出,对于子节点失效的
|-onmousemove:鼠标移动
|-onmousedown:鼠标按下
|-onmouseup:鼠标松开
|-onchange:失去焦点同时内容发生改变触发(使用在select)
|-onload:页面加载完成之后执行
|-onsubmit:在表单提交的时候执行
|-onscroll:页面滚动的时候触发
8.通过JS实现表单的前端验证
|-js中正则表达式的定义 : /正则表达式的语法/;
|-^ 开始
|-$ 结束
使用[]表示字符
|-[1-9]:字符只能从1到9中取一个
|-[0-9a-zA-Z]:表示字符只能从指定的范围获取
预处理的字符集
|-d:等价于[0-9],表示数字
|-D:除了数字以外
|-s:表示空白
|-S:表示非空白
|-.:表示任意字符
|-w:等价于[0-9a-zA-Z_]
|-W
使用{}定义次数
|-{n,m}:表示可以出现n到m次
|-{n,}:表示n次以上
预处理的次数符号
|-?:等价于{0,1},零次或者1次
|-*:等价于{0,},零次以上
|-+:等价于{1,},1次以上
9.通过JS实现DOM的操作(动态效果)
|-DOM:document Objet module:文档对象模型
|-底层的数据结构是:树
|-采用树的结构,对节点进行操作(插入,删除)方便
|-获得指定的标签
|-通过标签名获得
|-document.getElementsByTagName(标签);//返回值为数组
|-document描述DOM树结构的对象
|-document.getElementById(id值);//根据id值获得指定的元素
|-DOM模型中节点的导航
|-domObj.childNodes:表示获得对象的子节点,对于换行认为是文本节点
|-domObj.firstChild:获得第一个子节点
|-domObj.lastChild:获得最后一个子节点
|-domObj.nextSibling:获得下一个兄弟节点
|-domObj.previousSibling:获得上一个兄弟节点
|-domObj.parentNode:获得当前对象的父节点
|-DOM模型中节点的创建
|-document.createElement(标签名);//创建元素
|-document.createTextNode(文本信息);//创建文本节点
|-obj.appendChild(childObj);//将childObj追加到obj当中,作为最后一个子节点
|-obj.removeChild(childObj);//移除指定的子节点
|-obj.insertBefore(newNode,target);//将newNode插入到target的前面
|-obj.replaceChild(newNode,target);//将newNode替换target