-
正则表达式
- 语法
/正则表达式/修饰符(可选)
- 使用字符串方法
search()
用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串,并返回子串的起始位置。replace()
用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
- 修饰符
i
:执行对大小写不敏感的匹配g
:执行全局匹配m
:多行匹配
- 正则表达式模式
-
方括号用于查找某个范围内的字符:
[abc]
查找方括号之间的任何字符。[0-9]
查找任何从 0 至 9 的数字。(x|y)
查找任何以 | 分隔的选项。
-
元字符是拥有特殊含义的字符:
\d
查找数字。\s
查找空白字符。\b
匹配单词边界。\uxxxx
查找以十六进制数 xxxx 规定的 Unicode 字符。
-
方括号用于查找某个范围内的字符:
n+
匹配任何包含至少一个 n 的字符串。n*
匹配任何包含零个或多个 n 的字符串。n?
匹配任何包含零个或一个 n 的字符串。
-
- 语法
-
CSS和HTML里面怎么写,JS就怎么写,但是唯一例外为class要写为className
-
为a链接添加JS:
<a href="javascript:;"></a>
去掉a标签的默认行为 -
操作属性的方法
.
[]
[]中为字符串,可以用于函数传参时的属性变化,.后面被认定为固定的属性
-
优先级:
同权重:内联样式 > 嵌入样式表 > 外部样式表
!important > 内联样式 > id > class > tag > *
故如果先改变行间属性再改变class和id,样式将不发生变化 ⟶ \longrightarrow ⟶只对class或者行间属性做改变
元素.style.属性=xxx
是修改行间样式,样式表中的样式不能涉及 -
匿名函数:将函数体不加名字写到对应的属性后
-
window.onload
:页面加载完成的时候发生 -
不能直接再HTML上添加自定义属性,要用js添加
-
this
:当前发生事件的元素 -
innerHTML
:可以插入字符也可以插入HTML语句 -
ECMAScript:解释器,翻译(核心,基础),几乎没有兼容性问题
DOM(Document Object Model):有操作HTML的能力,在JS中为document,有一些兼容问题
BOM(Browser Object Model):操作浏览器,在JS中为window,完全不兼容 -
判断是否是NaN,不能直接用
==
,因为NaN和NaN不相等,得用isNaN() -
显式类型转换:
parseInt()
parseFloat()
隐式类型转换:== 在比较前有时会先转换后比较,用===便是不转换直接比较 -
真:true,非0数字,非空字符串,非空对象
假:false,数字0,空字符串,空对象,undefined -
JSON
对象没有length
属性,循环它得用for(var in JSON)
-
可变参数:函数体不传参而用一个
arguments
数组来获得所有参数,可以传参增强可读性
通过对arguments
数组的长度判断可以知道传入了多少个参数,间接达到函数重载 -
取非行间样式:(不能用来设置样式;只能用来取单一样式,不能取复合样式如:
border
IE7及以下:obj.currentStyle[name]
Chrome及Firefox下:getComputedStyle(obj,无效参数可以任意写)[name]
-
数组定义方式:
var arr=[]
或var arr = new Array()
-
定时器:
setInterval
(间隔型:多次执行)
setTimeout
(延时型:一次执行)
停止定时器:cllearInterval
clearTimeout
定时器会产生阻塞,会暂时跳过它执行后面的程序 -
获取系统时间的函数返回的都是数字不是字符串
getDay()
取值为0-6,0表示周日
getMonth()
取值为0-11 -
通过字符串下标访问字符串出现兼容问题,用
str.charAt(i)
可以避免此问题 -
offsetLeft
:返回当前容器相对与左部文档的偏移距离,相似的还有offsetTop
left
获取或设置相对于具有定位属性的父对象的左边距,这同offsetLeft
是相同的,区别在:
style.left
返回的是字符串,如28px
,offsetLeft
返回的是数值28
style.left
是读写的,offsetLeft
是只读的- 未事先定义和写在样式表里取得的值都为空,但
offsetLeft
可以取得
-
childNodes
获取子节点,会把文本节点也算进去- 解决方法:
- 用for循环判断
nodeType==1
为元素节点,nodeType==3
为文本节点 - 用
children
直接取所有元素节点
-
parentNodes
获取父节点 -
offsetParent
获取定位参照的父节点,没有则默认为body
-
firstChild
有兼容问题,也是把文本节点算入,解决方法同childNodes
firstChild——firstElementChild
lastChild——lastElementChild
nextSibling——nextElementSibling
previousSibliing——previousElementSibling
-
DOM方式操作元素属性:
setAttribute(名称,属性)
——设置getAttribute(名称)
——获取removeAttribute(名称)
——删除
-
DOM元素灵活查找:用
className
选择元素,可以将其封装成函数,第一个参数为父节点,第二个参数为className
,如:getByClass(oParent,sClass)
-
DOM创建,插入和删除
- 创建:
createElement(标签名)
然后需要指定在那个节点后插入 - 插入:
appendChild(节点)
insertBefore(节点,原有节点)
- 删除
removeChild(节点)
都需要在父节点对子节点进行操作
- 创建:
-
文档碎片:理论上可以提高DOM操作性能,但高级浏览器基本无太大提升,可以忽略
document.createDocumentFragment()
先将元素添加到x中,再将x添加到插入位置 -
表格应用:
tBodies
(获取tbody,为数组)tHead
(表头thead)tFoot
(表尾tfoot)rows
(获取tr,数组)cells
(获取td,数组)
-
Math.ceil
向上取整,Math.floor
向下取整 -
document.documentElement.scrollTop
获取当前页面的滚动条纵坐标位置
或者也可以写document.body.scrollTop
-
获取当前页面滚动条横坐标位置:
document.documentElement.scrollLeft
或者document.body.scrollLeft
-
各浏览器下
scrollTop
的差异:
IE6/7/8: 可以使用document.documentElement.scrollTop
FireFox:window.pageYOffset
或document.documentElement.scrollTop
Safari:window.pageYOffset
或document.body.scrollTop
Chrome:document.body.scrollTop
因为document.body.scrollTop
和document.documentElement.scrollTop
同时会有一个值生效,所以有一个始终为0,所以不考虑safari,可以使用:
var sTop=document.body.scrollTop+documen.documentElement.scrollTop
JavaScript进阶
最新推荐文章于 2024-08-12 22:06:56 发布