js学习

一.  数据类型转换

number：能转换大多数数据类型

var a1=' '  ;          var a2=true ;      var a3=[1] ;        var a4=[1,2,3]

number(a1)=0   number(a2)=1    number(a3)=1    number(a4)=NuN

parseInt:只能转换整数，遇小数或其他字符则舍弃

var a1='200px'        var a2='12.34'

parseInt(a1)=200    parseInt(a2)=12

parseFloat:转换小数   var a1='12.34'   parseFloat(a1)=12.34

隐式数据类型转换

+       200+‘3’    变成字符串

-*、%    ‘200’ - 3   变成数字

++ --    变成数字

><       数字的比较、字符串的比较

！取反       把右边的数据类型转换成布尔值

NaN：not a number  不是个数字的数字类型

isNaN：is not a number  是不是不是一个数字 （不是数字）

二.  return：返回值

1. 函数名+括号：fn1() ==> return 后面的值；
2. 所有函数默认返回值：未定义；
3. return后面任何代码都不执行

三.  系统时间对象：new Date()

1. getFullYear()
2. getMonth()
3. getDate()
4. getDay()
5. getHours()
6. getMinutes()
7. getSeconds()

四.  系统方法

1. charAt();转换成字符串
2. charCodeAt();转换成编码
3. formCharCode();从编码获取字符；例：string.fromCharCode(22937);获取‘妙’字
4. indexOf();从字符串里找某个字符；例：indexOf(‘a’);  indexOf('a',5)从第五个元素开始找a
5. subString();从字符串的第几位开始截取，例：str.subString(3,4)  var str='北方民族大学';   截取后结果为：族大。
6. toUpperCase();转换为大写，toLowerCase();转换为小写
7. split();把一个字符串分割，例：var str='www.baidu.com'   str.split('.')结果为：['www','baidu','com']，把字符串形式变成了数组形式
8. push();往数组里面添加元素，元素添加在数组后面，并返回数组的长度
9. unshift();往数组里添加元素，元素添加在数组前面，也返回数组的长度
10. pop();删除数组最后一个元素，并返回被删除的元素。
11. shift();删除数组里第一个元素，并返回被删除的元素。
12. Math.random();返回一个0到1之间的随机数，Math.round(Math.random()*(y-x)+x));返回x到y之间的值，random()四舍五入原则,ceil()向上取整原则，用法跟random相似。
13. concat();把一个数组跟另一个数组链接 
14. reverse();把数组中的内容颠倒排序

五.  DOM节点

1. DOM的节点类型有12种
   元素.nodeType：只读、属性、当前元素的节点类型
   节点类型编号：
   元素节点：1
   属性节点：2
   文本节点：3
2. 元素.attributes：只读、属性、属性列表集合
   例：oUl.attributes.length  //元素长度
   oUl.attributes[0].nodeType  // oUl的第一个元素的节点类型编号
   oUl.attributes[0].name //oUL的第一个元素的属性名称（id)
   oUl.attributes[0].value //oUL的第一个元素的属性的值（Ul)
3. 元素.childNodes：只读、属性、子节点列表集合
   标准下：包含了文本和元素类型的集合
   非标准下：包含元素类型的节点
   childNodes只包含一级子节点，不包含后辈孙级以下的节点
4. 元素.children：只读、属性、子节点列表集合
   标准下：只包含元素类型的集合
   非标准下：只包含元素类型的节点
   
5. 元素.firstChild：只读、属性、第一个子节点
   标准下：firstChild会包含文本类型的节点
   非标准下：只包含元素节点
   元素.firstElementChild：只读、属性、标准下获取第一个元素类型的子节点
   
   如需获取元素的第一个节点可用方法：
   var str=oUl.firstElementChild || oUl.firstChild;  //考虑标准下和非标准下两种情况
6. 元素.lastChild || 元素.lastElementChild  //最后一个子节点
7. 元素.nextSibling  ||  元素.nextElementSibling     下一个兄弟节点
8. 元素.previousSibling  ||  元素.previousElementSibling        上一个兄弟节点
9. 元素.lastChild  ||  元素.lastElementChild     最后一个子节点
   
10. 元素.firstChild  ||  元素.firstElementChild     第一个子节点
11. 元素.parentNode；//只读、属性、当前节点的父节点
12. 元素.offsetParent；离当前元素节点最近的一个有定位的父节点，如果没有定位父级，默认是body
13. 元素.offsetLeft[Top]；当前元素到定位父级的距离（偏移值），如果没有定位父级，默认是html
14. document.createElement(标签名称)；创建元素
15. 父级.appendChild(要添加的元素)；为父级元素追加子元素
16. 父级.insertBefore(新的元素，被插入的元素)；在指定元素前面插入一个新元素 （在ie下如果第二个参数的节点不存在，会报错，其他浏览器如果第二个参数节点不存在，则会以appendChild的形式进行追加。
17. 父级.removeChild(要删除的元素);   删除元素，必须在父节点下删除
18. 父级.replaceChild(新节点，被替换节点)；//替换子节点，此处的父级为被替换节点的父级

appendChild，insertBefore，replaceChild 都可以操作动态创建出来的节点，也可以操作已有节点

六.  DOM节点二：

1. confirm();   弹出框询问用户是否执行操作，并返回布尔值。
2. window.open(页面的地址url，打开的方式);     打开一个新窗口，如果打开方式为空，默认用新窗口方式，返回值为新打开的窗口的window对象
3. window.close()；关闭窗口
4. document.documentElement.clientWidth；获得可视区的宽（不是页面尺寸）
5. document.documentElement.clientHeight；获得可视区的高
   
6. document.documentElement.scrollTop；滚动条滚动距离
   
7. oDiv.scrollHeight(width)；内容高；document.getElementById('div1').scrollHeight;获取div1的内容高。
8. document.documentElement.offsetHeight；文档高度；document.body.offsetHeight；
   
9. onscroll：当滚动条滚动时触发。
10. onresize：当窗口大小发生改变时触发。

七.  焦点：是浏览器能够区分用户输入的对象，当有一个元素有焦点的时候，它就可以接收用户的输入。

给元素设置焦点的方法：1.点击；2.tab切换；3.js

不是所有元素都能够接收焦点，能够响应用户操作的元素才能够接收焦点

1. 元素.onfocus；获取焦点事件：当元素获取到焦点触发
2. 元素.onblur；失去焦点事件：当元素失去焦点的时候触发
3. obj.focus()；给指定的元素设置焦点
4. obj.blur()；取消指定元素的焦点
5. obj.select()；选择指定元素里面的文本内容（只能是用户输入的内容）

八.  事件

• event ：事件对象，当一个事件发生的时候，和当前这个对象发生的这个事件有关的一些详细信息都会被临时保存到一个指定的地方——event对象。（供我们需要时调用）
  
• 事件对象必须在一个事件调用的函数里面使用才有内容 
  
• 如果一个函数是被事件调用的，那么这个函数定义的第一个参数就是事件对象
• clientX[Y]：当一个事件发生的时候，鼠标到页面可视区的距离。
• onmousemove：当鼠标在一个元素上移动的触发（触发频率不是像素，而是时间间隔。
• 事件冒泡：当一个元素接收到事件的时候，会把他接收到的所有传播给他的父级，一直到顶层window
• 事件捕获：当一个元素接收到事件的时候，会把他接收到的所有传播给他的子级，一直到最低层
• 阻止冒泡：当前要阻止冒泡的事件函数中调用 event.cancelBubble=true;
• 给一个元素绑定事件函数的第二种形式：
• （1）ie：obj.attchEvent(事件名称，事件函数）；取消事件函数：obj.detachEvent（事件名称，事件函数）
• a. 没有捕获
• b.事件名称有on
• c.标准ie：正序     非标准ie：倒序
• d.this指向window
• （2）标准：obj.addEventListener(事件名称，事件函数，是否捕获)；取消事件函数：obj.removeEventListener（事件名称，事件函数）
• a.有捕获
• b.事件名称没有on
• c.事件执行的顺序：正序
• d.this指向触发该事件的对象
• call()；该方法的第一个参数可以改变函数执行过程中的内部指向，call()方法的第二个参数开始就是原来函数的参数列表

九.  鼠标键盘事件：

event.keyCode ：数字类型，键盘按键的值，键值

ctrlKey,shiftKey,altKey  布尔值

当事件发生的时候，如果ctrl ||  shift  ||  alt 是按下状态，返回true，否则返回false

1. onkeydown  :  当键盘按下的时候触发
2. onkeyup  :  当键盘抬起的时候触发
3. oncontextmenu：右键菜单事件，当右键菜单显示出来时触发
4. onmousedown：选择元素
5. onmouseover：移动
6. onmouseup：释放元素
7. 元素.setCapture()；设置全局捕获：当有一个元素设置全局捕获时，这个元素就会监听后续发生的所有事件，如果有事件发生，就会被当前设置了全局捕获的元素触发

十.  cookie：存储数据，当用户访问了某个网站（网页）的时候，我们就可以通过cookie来像电脑上存储数据

1. 不同的浏览器存放cookie的位置不一样，也是不能通用的
2. cookie的存储是以域名形式进行区分的
3. cookie的数据可以设置名字

document.cookie='名字=值';  例：document.cookie='username=leo'；

我们可以通过document.cookie来获取当前网站下的cookie，得到的字符串形式的值，他包含了当前网站下所有的cookie。他会把所有的cookie通过一个分号+空格的形式串联起来

十一.鼠标滚轮事件：

ie/chrome：onmousewheel

event.wheelDelta   上：120   下：-120

firefox：DOMMouseScroll，必须用addEventListener

event.detail   上：3   下：-3

return false阻止的是    obj.on事件名称=fn  所触发的默认行为

addEventListener绑定的事件需要通过event下面的preventDefault();阻止