js 基础词汇及方法整理_js单词

闲余之际整理了一些Js初级词汇，分享于大家，现炮制如下:

一.数组

1.检测

arr.isArray(要判断的变量):判断一个变量是否是数组
1

2.数组方法

1).arr.toString():数组转为字符串,默认使用逗号来分隔元素

2).arr.join('指定符号'):使用指定符号分隔元素

3).arr.push('新元素1','新元素2'):从数组末位的位置添加新元素,并返回数组的长度

4).arr.pop():从数组末尾的位置删除一个元素,并把删除的元素返回出来

5).arr.shift():删除数组中的第一个元素,并返回删除的元素

6).arr.unshift('新元素1','新元素2'):从数组开始的位置添加新元素,并返回数组长度

7).数组排序方法(根据元素每一位的数值的大小顺序排序)

	a).arr.sort(排序函数)升序(从小到大)排列元素
	
	自定义排序函数
	
	b).arr.reverse()降序(从大到小)排列元素

8).arr.concat(参数1,参数2,参数3):根据现有数组创建新数组,原数组不受影响(push是在原数组的基础上进行拼接)
	
9).slice(起始下标,结束下标):根据当前数组中一个或多个元素来创建另一个数组

	只1参时表示开始直到结束

10).splice(起始下标位置,要删除的元素数,要删除的元素):数组元素的增、删、改

11).indexOf(要查找的元素,要搜索的起始位置[可选]):获取数组元素的下标
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

二.字符串操作方法

1.字符串拼接

1).arr.concat('要拼接的字符串'):字符串拼接

2).+:字符串拼接
1
2
3

2.根据一个字符串创建另一个字符串

1).arr.slice(截取起始下标,结束下标[可省]):

2).arr.substring(截取起始下标,结束下标[可省]):

3).arr.substr(截取起始下标,截取个数[可省]):
1
2
3
4
5

3.获取字符位置:返回第一个匹配元素的下标

1).arr.indexOf(匹配字符,'搜索的起始位置'):从左向右搜索

2).arr.lastIndexOf(匹配字符,'搜索的起始位置'):从右向左搜索
1
2
3

4.删除字符串前后的空格:arr.trim()

5.字符串大小写转换

1).大写转小写:toLowerCase()

2).小写转大写:toUpperCase()
1
2
3

6.把字符串类型的js语句转为可执行的js代码:eval('字符串类型的js')

三.Math对象(数学函数)

1.获取一堆数据的最大最小值

1).获取最大值:Math.max(数组)
			
2).获取最大值:Math.min(数组)
1
2
3

2.取整方法:

1).向上取整:Math.ceil(数字)

2).向下取整:Math.floor(数字 )

3).四舍五入取整:Math.round(数字 )
1
2
3
4
5

3.产生随机数

1).产生一个0-1之间的随机数:Math.random()

2).产生指定范围内的随机数:parseInt(Math.random()*(max-min)+min)
1
2
3

4.数学计算

1).次方运算:pow(x,y):x的y次方

2).开平方运算:sqrt(num)

3).绝对值:abs(num)
1
2
3
4
5

BOM

四.window对象的系统方法

1.获取主窗口的位置

1).screenLeft/X

2).screenTop/Y
1
2
3

2.窗口大小

1).浏览器宽度:window.innerWidth

2).浏览器高度:window.innerHeight
1
2
3

3.打开新窗口:window.open(参数1,参数2,参数3)

1).参数1:要打开页面的url字符串

2).参数2:在参2指定的窗口或框架内打开该页面.若无,则自动新建.该参数为_self._parent._top._blank

3).(拓展):设置打开窗口的样式
1
2
3
4
5

4.定时器

1).间隔执行代码

	a).setInterval(间隔执行的函数,间隔的时间),返回该定时器的ID
	
	b).clearInterval(要取消的间隔定时器的ID)

2).延时执行代码

	a).setTimeout(延迟执行的函数,延迟的时间)
	
	b).clearTimeout(要取消延迟定时器的ID)
1
2
3
4
5
6
7
8
9
10
11

5.系统对话框

1).alert()

2).confirm()

3).prompt('给用户提示的文字','输入框中的默认文字')
1
2
3
4
5

五.location对象

1.location对象的属性

1).location.hash:获取到url中#后的字符串

2).host:返回服务器域名和端口号

3).hostname:返回不包含端口号的域名

4).href:返回完整的url

5).toString():同上

6).pathname:获取URL的目录名

7).port:获取端口号

8).protocol:返回协议名

9).search:返回get请求参数
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

2.页面URL设置

1).location.assign('url字符串')打开并保存在历史记录中

2).href='url字符串' 同上

3).window.location='url字符串'同上

4).replace('url字符串')不会被保存历史记录,无法点击后退按钮

5).reload()无参时,从从本地缓存中加载;参为true,从服务器重新加载
1
2
3
4
5
6
7
8
9

六.screen对象:屏幕对象 常用属性(一般用于获取移动设备的屏幕尺寸信息)

 1.screen.availHeight:屏高减去系统部件高度

 2.screen.availWidth:屏宽减去系统部件宽度

 3.screen.height:屏高

 4.screen.width:屏宽
1
2
3
4
5
6
7

七.history对象:保存上网历史记录

 1.history.go(数值)在历史记录中跳转;-1后退一页;1前进一页

 2.history.back():后退一页

 3.history.forword():前进一页
1
2
3
4
5

DOM

八.节点遍历

 1.childNodes:获取当前节点的所有子节点

 2.firstChild:获取当前元素节点的第一个子节点

 3.lastChild:最后一个子节点

 4.ownerDocument:获取当前节点文档根节点,相当于document

 5.parentNode:获取当前节点的父节点

 6.previousSibling:获取当前节点的前一个同级节点

 7.nextSibling:获取当前节点的后一个同级节点
1
2
3
4
5
6
7
8
9
10
11
12
13

九.标签节点的操作方法

 1.document.createElement(标签节点):创建一个标签节点

 2.document.createTextNode(文本节点)

 3.appendChild(节点):把节点当做另一个节点的子节点,拼接在最后的位置

 4.insertBefore(插入的新节点,原节点):插入

 5.replaceChild(新节点,被替换的老节点):替换

 6.div.removeChild(p):移出当前节点下的指定子节点

 7.div.remove():移出当前节点
1
2
3
4
5
6
7
8
9
10
11
12
13

十.节点和节点层次关系

1.节点种类(常用的种类)(nodeType,nodeName,nodeValue)

1).元素节点(1,标签名,undefined或null)

2).文本节点(3,#text,文本本身)

3).属性节点(2,该标签属性的名字,属性的值)
1
2
3
4
5

2.document节点:表示整个文档的节点

常用属性:	
	1).document.body
	
	2).title:获取设置标题
1
2
3
4

3.网页请求相关属性:

1).URL:获取完整URL

2).domain:域名
1
2
3

十一.文档写入:后调用会覆盖

 1.document.write()

 2.document.writeln()结尾部分有空格
1
2
3

十二.查找元素

 1.getElementById()

 2.getElementsByTagName()

 3.getElementsByName()

 4.获取元素中属性值

	1).element.getAttributeNode('属性名')
	
	2).element.attributes['属性名']
	
	3).element.attributes.getNamedItem('属性名')

 5.设置元素中的属性值

	1).element.setAttribute('属性名','属性值')
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

十三.标签元素的属性

 1.tagName:获取元素节点的标签名

 2.innerHTML:获取设置元素节点里的内容(内容可以包含html标签),只能获取到标签里的内容

 3.outerHTML:除了内容外,还包括当前选中标签本身

 4.innerText:只能设置获取文本内容,无法获取子标签

 5.style.CSS只能获取到行内样式表
1
2
3
4
5
6
7
8
9

十四.鼠标点击事件对象的常用属性

 1.clientX\clientY:获取到的是鼠标点击的位置距离浏览器内部左边框和顶边框的间距；

 2.offsetX\offsetY:获取到的鼠标点击的位置距离当前点击标签的左边框和顶边框的间距；

 3.screenX\screenY:获取到的鼠标点击的位置距离屏幕的左边框和顶边框的间距；

 4.pageX\pageY:获取到的鼠标点击的位置距离整个文档(页面)的左边框和顶边框的间距；
1
2
3
4
5
6
7

十五.鼠标事件

 1.onclick按下并抬起

 2.onmousedown按下

 3.onmouseup抬起

 4.onmousemove标签内移动

 5.ondblclick双击

 6.oncontextmenu右键菜单
1
2
3
4
5
6
7
8
9
10
11

十六.键盘事件

 1.onkeydown:按下

 2.onkeyup:抬起

 3.keycode:标识码
1
2
3
4
5

十七.表单事件

 1.onfocus:获取焦点

 2.onblur:失去焦点

 3.onsubmit:提交事件(给表单,非表单元素)

	1).可以阻止默认时间,通过return false,但仅适用于on
	
	2).ev.preventDefault()阻止默认.存在兼容问题
1
2
3
4
5
6
7
8
9

十八.事件冒泡

1.取消时间冒泡

1).eventObj.cancelBubble = true;

2).eventObj.stopPropagation();
1
2
3

2.addEventListener(‘click’,function(){},参数3)

1).参数为true,事件捕捉

2).参数为false,事件冒泡(默认)
1
2
3

3.事件绑定方法的区别

1).on给同一时间绑定两次事件,后覆盖

2).addEventListener()不会覆盖,存在兼容,可用removeEventListener()移出事件
1
2
3

正则

十九.正则表达式方法

 1.test()获取匹配字符,返回布尔值

 2.exec()获取匹配字符并返回
1
2
3

二十.字符串方法

 1.str.search()返回出现位置,若无,返回-1

 2.str.replace(/被替换的词/，'要替换的词')

 3.str.match()找到匹配并返回

 4.修饰词

	a.i
	
	b.g

 5.小括号
	
	a.(abc)
	
	b.(abc|bcd)

 6.中括号

	a.[12345]
	
	b.[0-9]
	
	c.[a-z]
	
	d.[A-z]
	
	e.[0-9A-z]

 7.元字符

	a.\w
	
	b.\W
	
	c.\d
	
	d.\D
	
	e.\s
	
	f.\S
	
	g.\b
	
	h.\B

 8.量词

	a.^n
	
	b.n?
	
	c.{x}
	
	d.n+
	
	e.{x,y}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59