码迷,mamicode.com
首页 > Web开发 > 详细

js总结

时间:2015-05-25 09:45:25      阅读:111      评论:0      收藏:0      [点我收藏+]

标签:

一、事件  1、onmousedown 定义:onmousedown事件会在鼠标按键被按下时发生

2、onmouseup 定义:onmouseup事件会在鼠标按键被松开时发生

3、onmousemove 定义:onmousemove事件会在鼠标指针移动时发生 支持该事件的js对象:document 但是onmousemove默认情况下没有任何对象的一个事件; 因为鼠标移动频繁发生。

4、onmouseover 定义:onmouseover事件会在鼠标指针移动到指定的对象上时发生

5、onmouseout 定义:onmouseout事件会在鼠标指针移出指定的对象时发生

6、onclick单击事件 定义:onclick事件和onmousedown不同。单击事件是在同一元素上发生了 鼠标按下时间之后发生了鼠标放开时间是发生的。 理解:鼠标按下抬起以后事件才发生。

7、onfocus光标移入事件 定义:onfocus事件在对象获得焦点时发生

8、onblur光标移出事件 定义:onblur事件会在对象失去焦点时发生

9、oncontextmenu右键事件 鼠标按下右键的时候发生

10、onsubmit onsubmit事件会在表单中的确认按钮(submit)被 点击是发生。

11、onkeydown onkeydown事件会在用户按下一个键盘按键时发生

12、onkeyup obkeyup事件会在键盘按键被松开时发生

13、onload onload事件会在页面或图像加载完成后立即发生

14、onscroll onscroll事件拖动滚动条时发生

15、onresize onresize事件会在窗口或框架被调整大小时发生

16、onmousewheel onmousewheel事件ie、chrome下鼠标滚轮滚动时发生

17、DOMMouseScroll DOMMouseScroll事件是标准下(ff)鼠标滚轮事件, 鼠标滚轮滚动时发生

18、onreadystatechange onreadystatechange事件:当请求被发送到服务器时; 我们需要执行一些基于响应的任务。每当readyState 改变时,就会触发onreadystatechange事件。 readyState属性存有XMLHttpRequest的状态信息。 在onreadystatechange事件中,我们规定当服务器响应 已做好被处理的准备时所执行的任务。

19、attachEvent绑定事件 ie下的绑定事件,2个参数,第一个什么事件,第二个执 行函数(倒序执行)。注意this指向 如:obj。attachEvent(‘onclick’,aaa) function aaa(){}

20、addEventListener绑定事件 标准下的绑定事件,3个参数。1什么事件(不加ON), 2执行函数 3、一个布尔值。true是捕获阶段,false是 冒泡阶段

21、event对象指事件的状态

简单的:一个 存了 事件详细信息的东西

网上较专业的:Event对象代表事件的状态,比如事件在其中发生的元素 键盘按键的状态,鼠标的位置,鼠标按钮的状态,通常 与函数结合使用。

22、clientX、clientY 在Event对象下获取鼠标位置

23、cancelBubble   =true 在Event对象下取消冒泡事件

24、keyCode 在Event对象下获取用户按下键盘的哪个按键

25、preventDefault() 阻止默认默认事件的绑定写法

26、return false 阻止默认时间的普通写法

 

二、getElementById 通过id获取某一个元素

28、getElementsByTagName 通过标签名获取一组元素的集合

29、childNodes 获取子节点,但是标准下会获取空白节点 获取第一级子元素的节点

30、nodeType 节点类型 1)元素节点(标签)2)文本节点(空白节点)

31、children 获取子节点,但是没有兼容性问题 获取第一级子元素的节点

32、firstElementChild || firstChild 标准下:firstElementChild ie不支持 ie下是  firstChild 获取子元素里的第一个

33、lastElementChild || lastChild 标准下:lastElementChild  ie不支持 ie下是  lastChild 获取子元素里的最后一个

34、nextElementSibling || nextSibling 标准下:nextElementSibling  ie不支持 ie下  nextSibling 获取子指定元素的下一个兄弟节点

35、previousElementSibling || previousSibling 标准下: previousElementSibling  ie不支持 id:previousSibling 获取指定元素的上一个兄弟节点

36、parentNode 获取父节点

37、offsetParent 获取有定位的父节点,都没有定位的话父节点就是body

38、offsetWidth-----有问题 获取元素的实际宽度(width+padding+border)

39、offsetHeight 获取元素的高度(height+padding+border)

40、clientWidth 获取元素的内部宽度(width+padding)

41、clientHeight 获取元素的内部高度(height+padding)

42、createElement(标签名) 创建一个节点

43、appendchild(节点) 追加一个节点

44、insertBefore(节点,原有节点) 在已有的元素前面插入

45、removeChild(节点) 删除一个节点

46、replaceChild(节点,已有节点) 替换已有的节点

 

三、BOM操作:  47-53 47、window。open() 打开窗口

48、window。close() 关闭窗口,标准下不支持

49、window。location 获取浏览器地址

50、window。location。href 获取整体的网址

51、window。location。search 获取问号?后面的内容,包括问号

52、window。location。hash 获取警号#后面的内容,包括警号

53、window。location。reload() 自动刷新,定时器配合

53、window。navigator。userAgent 获取浏览器信息

 

四、js基础:  54-126 54、if else  如果。。。。否则。。。

55、switch  如果

56、?: 三木,就是如果。。。否则。。。

57、for(){}  for循环

58、for  in 

59、while=for

60、continue   终止本次循环  if(i=2)continue 跳过这个条件

61、break      终止当前循环  if(i=3)break  结束本次

62、undefined   未定义

63、null=========?

64、===  只比较,不转换类型

65、==  不仅比较,而且还会将两个东西转换成相同的类型

66、=  赋值

67、!  就是  不  的意思

68、setTimeout  设置定时器,2秒钟后,执行一次,并且只执行一次,---定时炸弹

69、clearTimerout 清楚定时器,清理setTimerout

70、setInterval 设置定时器,每两秒执行一次

71、clearInterval 清楚定时器,清理setInterval

72、arguments 实参的元素集合

73、call 改变this取向 fn名.call(this,‘black’)第一个参数是函数之行的环境, 从第二个参数开始,才是函数的真正参数

oDiv.onclick = function(){ toChange.call(this,‘black‘); }; function toChange(sColor){ this.style.background = sColor; }

74、apply 改变this取向, function show(a, b) { alert(‘this是:‘+this+‘\na是:‘+a+‘\nb是:‘+b); } show(12, 8); show.apply(document, [12, 8]); 第二个参数是以数组形势存在的

75、callee ===============?调用这个函数自身的

76、var arr=【】;  声明一个数组

77、var arr=new Array()  声明一个数组

78、push  向数组的末尾添加一个或更多元素,并返回新的长度

79、pop 删除数组最后一个元素,并返回这个元素

80、shift 删除数组第一个元素,并返回这个元素

81、unshift 向数组的开头添加一个或多个元素,并返回新的长度

82、splice 删除元素,并向数组添加新的元素

83、join() 把数组的所有元素放入一个字符串。元素通过指定 的分隔符进行分隔

84、sort() 对数组的元素进行排序

85、concent----concat()? 连接两个数组或者多个数组,并返回结果

86、split 分割字符串,获得数组

87、substring 获取字符串 包括开始不包括结束

88、indexOf 从前往后检索字符串

89、charAt 获取某个字符
90、var re=//;   声明一个正则对象

91、var re=new RegExp() 声明一个正则对象

92、search   查找一个字符串,只找第一次出现的位置

93、month ===============? match-匹配符合正则的东西,挑东西返回数组

94、test  用正则检验字符串是否符合它所规定的规则

95、replace  替换,把符合规则的东西替换成字符串

96、量词:{n,m}至少出现n次,最多出现m次 +许多 *  {0,} 0到任意次 ?零次或者一次{0,1} {n,}最少n次,最多不限 {,m}最少不限最多m次 {n}正好n次

97、字符类: 1[abc]2  1和2中间出现a或b或c [^0-9]排除数字以外所有都可以 [a-z]所有的英文 [0-9]所有的数字

98、标识: i 忽略大小写   g  全局匹配

99、首尾: ^  $

100、转义: \d    查找数字 [0-9] \D   除了数字[^0-9] \s    空白 \b    单词边界 \w   数字字母下划线--用户名 .  任意字符 \. 代表.本身

101、var oDate= new Date()  获取当前时间

102、getHours() 获取小时

103、getMinutes() 获取分钟

104、getSeconds() 获取秒

105、getFullYear() 获取年

106、getDay() 获取星期

107、getDate() 获取当前的时间日期

108、setDate() 设置一个月的某一天

109、var oImg=new Image() 创建一个image对象

110、什么叫ajax 通过XMLHttpRequest与服务器通信,进行无刷新操作

ajax采用的是异步请求

111、同步与异步的区别

同步就是同一时间做一件事 异步就是同一时间做多件事

112、ajax的交互方式 1)发送数据并返回 ()(注册) 2)只发送不返回 ()========?例子 3)不发送只返回  (股票)

113、post与get的区别 1)发送方式不一样:get加载网址问好后面的 post把数据放在一个传输体中发送上去的

2)安全不一样 post相对安全,get不安全

3)网址长度不一样 ie下get网址超过2048字节将被截断 post没有上限

4)缓存问题 get可以缓存网址,post不会缓存网址

5)用途不一样 get:查询数据,post修改数据

114、发送数据是什么样的? 串联化数据:key1=value1&key2=value2

115、返回数据是什么样的? 返回的是字符串

116、跨域:jsonp? (利用script标签跨域) 在头部创建个script标签, 改变script标签中src

117、ajax的编写步骤? 1)创建ajax对象(要有手机) 2)链接服务器open(拨号) 3)监听数据返回onreadystatechange(听) 4)发送数据send(说) 5)close(忽略)(挂了)

118、json怎么取?=========? 通过串联化数据

119、什么是对象? 对象是一个整体,对外提供一些操作。|| 黑盒子,看不到内部的样子, 能看到表面的按钮

120、什么是面向对象? 使用对象时,只关注对象提供的功能, 不关注其内部细节,比如jQuery || 使用一个东西的时候,不去管内部是 怎么做的,只用好它的功能

121、引用类型是什么意思?=========?

122、this的本质其实就是这个方法或者函数 属于哪个对象的,this就是谁。函数前面有new 的时候this会失效。

123、原型是什么?    =========? 原型就是给一类对象加东西

124、面向对象怎么写?=========?

125、继承采用什么方式? 采用原型链的方式继承

126、面向对象变成的特点? 封装、继承、多态

 

五、常用技巧: 1、加开关:bBtn 例如: <script> window.onload = function(){ var aLi = document.getElementsByTagName(‘li‘); var aImg = document.getElementsByTagName(‘img‘);
for(var i=0;i<aLi.length;i++){ aLi[i].bBtn = true;  // ------设置开关 aLi[i].index = i;
aLi[i].onclick = function(){
if(this.bBtn){ aImg[this.index].src = ‘on‘ + this.index + ‘.png‘; this.bBtn = false; }
else{ aImg[this.index].src = ‘off‘ + this.index + ‘.png‘; this.bBtn = true; }
}; } }; </script>

2、加索引:index; 例如: <script> window.onload=function() { var oBtn=document.getElementById(‘btn‘); var aBtn=oBtn.getElementsByTagName(‘input‘);
var oText=document.getElementById(‘text‘); var aDiv=oText.getElementsByTagName(‘div‘);
for(var i=0; i<aBtn.length; i++) { aBtn[i].index=i; //先添加索引值 aBtn[i].onclick=fn1; } function fn1() { alert(this.index); //后获取索引值
aDiv[this.index].style.background=‘yellow‘; } }; </script>

js总结

标签:

原文地址:http://www.cnblogs.com/wyBlog117/p/4527094.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!