一、序言：
- 在开始之前我们先谈谈什么叫做大前端吧。所谓“大前端”，顾名思义应该是比“小前端”承担更多职责。传统上，Web应用可分为前端（在浏览器中执行的部分）和后端（在服务器中执行的部分）。前端工程师的职责是以Web技术（HTML、CSS、JavaScript、DOM、Ajax等）实现基于浏览器的用户界面。以相衔接的工作来说，是将视觉设计师、交互设计师的工作成果转化为可运行代码，完成的代码则要交付给后端工程师，进一步完成代码集成、测试、发布和部署。这样一种体系可能存在不少问题，具体就不展开了。“大前端”则是将传统上归于后端的服务器脚本和模板划归到前端。
- 我学东西比较急，通常都是把逻辑搞懂了，然后语法这方面就靠查看手册，今天就好好复习一下吧。
二、进入主题
定义变量:var
定义函数function()
输出内容：document.write();
警告弹出：alert()
确认：confirm()
消息对话框：prompt()
打开新窗口：window.open(“http://#######","打开方式","width=#","height=#","top=#","left=#“)
打开方式：_blank,_self,_top;
关闭窗口：obj.close();
通过id获取元素：document.getElementById(“id”);
获取或者替换HTML元素的内容：obj.innerHTML;
改变HTML样式：Obj.style.property = new style;例：mychar.style.color = “red”;
显示和隐藏：obj.style.display = block(显示)/none(隐藏);
控制类名:obj.className = classname 例：p1.classname = “two”
数组定义:var myarr = new Array(),myarr[0] = 80; myarr = new array(11,22,33);
使用一个新索引，即可为数组增加新元素
数组长度:myarray.length;
二维数组：
- var myarr=new Array(); //先声明一维 for(var i=0;i<2;i++){ //一维长度为2 myarr[i]=new Array(); //再声明二维 for(var j=0;j<3;j++){ //二维长度为3 myarr[i][j]=i+j; // 赋值，每个数组元素的值为i+j } }
事件：
- 鼠标单击事件：onclick = “function()”
- 鼠标经过事件：onmouseover = “function()”
- 鼠标离开事件：onmouseout = “function()”
- 光标聚焦事件：onfocus = “function()”
- 失焦事件：onblur = “function()”
- 内容选中事件：onselect = “function()”
- 文本框内容改变事件：onchange = “function()”
- 加载事件：onload = “function()”
- 卸载事件：onunload = “function()”
内置对象：
- 访问对象属性的方法：objName.propertyName;
- 访问对象的方法：objName.methodName()
- 日期对象；var Udate = new Date(); / var Udate = new Date(2012,10,1);
- 返回/设置日期：get/setDate()
- 返回/设置年份（四位数）：get/setFullYear()
- 返回/设置年份：get/setYear()
- 返回/设置月份：get/setMonth()
- 返回/设置小时(24小时):get/setHours()
- 返回/设置分钟：get/setMinutes()
- 返回/设置秒钟：get/setSeconds()
- 返回/设置时间(毫秒为单位)：get/setTime()
- 字符串对象:
- 定义：var mystr = “I love Javasript!”
- 访问长度：mystr.length
- 访问方法：mystr.function()
- 返回指定位置字符串:mystr.charAt()
- 返回指定字符串值首次出现的位置：mystr.indexof(“o”,5)
- 字符串分割：
- mystr.split(“se”,”limit”)——se代表以什么分割，如：”_或者.”当se为空字符串””时将分割每一个单词
- limit是要分割的字符数，可省略；
- 字符串提取：mystr.substr(start,stop);
- Math对象：
- Math.PI
- 向上取整：Math.ceil(x)
- 向下取整：Math.floor(x)
- 四舍五入：Math.round(x)
- 随机数：Math.random()
- 数组对象：
- 数组连接：arr1.contact(arr2,arr3)
- 指定分隔符连接数组元素：arr.join(“分隔符”)——arr.join(“.”)
- 颠倒数组：arr.reverse()
- 选定元素：arr.slice(start,end)
- 数组排序：arr.sort();
浏览器对象：
- 计时器：
- 设定计时器每隔指定时间调用一次函数：setInterval(“function()”,time)
- 取消计时器：clearinterval(id_ofsetinterval)
- 载入后延迟指定时间去执行一次代码(仅一次)：setTimeout(“代码”,time)
- 取消计时器：clearTimeout(id_ofsetTimeout)
- history对象：
- history中url数量：window.history.length
- history中的前一个url：window.history.back()
- history中的下一个url：window.history.forward()
- history中的某个具体页面：window.history.go()
- location对象：
- 设置或返回以#开头的URＬ：window.location.hash
- 设置或返回主机名和当前URL端口号：window.location.host
- 设置或返回当前URL的主机名：window.location.hostname
- 设置或返回完整的URL：window.location.href
- 设置或返回当前URL的端口号：window.location.port
- 设置或返回当前URL的协议：window.location.protocol
- 设置或返回从问号（？）开始的URL（查询部分）:window.location.search
- 加载新的文档：window.location.assign()
- 重新加载文档：window.location.reload()
- 用新的文档代替当前文档：window.location.repalce()
- Navigator对象：
- 浏览器代码名的字符串表示：navigator.appCodeName
- 返回浏览器名称：navigator.appname
- 返回浏览器的平台和版本信息：navigator.appVersion
- 返回浏览器的操作系统平台：navigator.platform
- 返回由客户发送的user.agent头部的值
- Screen对象：
- 窗口可使用的屏幕高度，单位像素：window.screen.availHeight
- 窗口可使用的屏幕宽度，单位像素：window.screen.availWidth
- 用户浏览器表示的颜色位数：window.screen.colorDepth
- 屏幕的高度，单位像素：window.screen.height
- 屏幕的宽度，单位像素：window.screen.width
- 计时器：
DOM对象：
返回带有指定名称节点的对象组合：document.getElementsByName(name);
返回带有指定标签名节点的对象组合：document.getElementsByTagName(Tagname)
通过元素节点的属性名称获取属性的值：elementNode.getAttribute(name)
通过元素节点的属性名称设置属性值（增加）：elementNode.setAttribute(name,value)
节点属性：
- 节点名称：node.nodeName
- 节点的值：node.nodeValue
- 节点的类型：node.nodeType
访问子节点：elementNode.childNodes
访问子节点的第一项和最后一项：node.firstchild——node.lastchild
访问父节点：elementNode.parentNode
访问兄弟节点：node.nextSibling
插入节点(最后一个子节点之后)：node.appendChild(newnode)
在已有子节点之前插入一个新的子节点：node.insertBefore(newnode,node)
删除节点：node.removeChild(node)
替换元素节点：node.removeChild(newnode,oldnode)
创建元素节点：document.createElement(tagName)
创建文本节点：document.createTextNode(data)
浏览器窗口可视区域大小：var w = document.documentElement.clientWidth||document.body.clientWidth,
var h = document.documentElement.clientHeight||document.body.clientHeight
获取网页内容高度和宽度：
var w = document.documentElement.scrollWidth||document.body.scrollWidth
var h = document.documentElement.scrollHeight||document.body.scrollHeight
网页尺寸：offsetHeight = clientHeight+滚动条+边框