一、 RegExp对象
1.1 定义正则表达式两种方式
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}"); var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/;
1.2 正则校验数据
reg1.test('jason666') reg2.test('jason666')
1.3 全局匹配
var s1 = 'egondsb dsb dsb'; s1.match(/s/) s1.match(/s/g) var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/g reg2.test('egondsb'); reg2.test('egondsb'); reg2.lastIndex; var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/ reg2.test(); reg2.test(undefined);var reg3 = /undefined/; reg3.test();
注:1.正则表达式中不能有空格
2.全局匹配时有一个lastIndex属性
二、 Math对象
abs(x) 返回数的绝对值。
exp(x) 返回 e 的指数。
floor(x) 对数进行下舍入。
log(x) 返回数的自然对数(底为e)。
max(x,y) 返回 x 和 y 中的最高值。
min(x,y) 返回 x 和 y 中的最低值。
pow(x,y) 返回 x 的 y 次幂。
random() 返回 0 ~ 1 之间的随机数。
round(x) 把数四舍五入为最接近的整数。
sin(x) 返回数的正弦。
sqrt(x) 返回数的平方根。
tan(x) 返回角的正切。
三、 前端基础之BOM和DOM
3.1 介绍
BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进行“对话”
DOM (Document Object Model)是指文档对象模型,通过它,可以访问HTML文档的所有元素。
3.2 window对象
一些常用的Window方法:
● window.innerHeight - 浏览器窗口的内部高度
● window.innerWidth - 浏览器窗口的内部宽度
● window.open() - 打开新窗口
● window.close() - 关闭当前窗口
3.3 history对象
history.forward() // 前进一页
history.back() // 后退一页
3.4 location对象(重要)
location.href 获取URL
location.href="URL" // 跳转到指定页面
location.reload() 重新加载页面
3.5 弹出框
alert("你看到了吗?");
confirm("你确定吗?");
prompt("请在下方输入","你的答案");
3.6 计时相关
setTimeout()
clearTimeout()setInterval()
clearInterval()
function func2() {
alert(123)
}function show() {
let t = setInterval(func2, 3000); // 每隔3秒执行一次
function inner() {
clearInterval(t) // 清除定时器
}setTimeout(inner, 9000) // 9秒中之后触发
}show()
四、 DOM
DOM标准规定HTML文档中的每个成分都是一个节点(node):
● 文档节点(document对象):代表整个文档
● 元素节点(element 对象):代表一个元素(标签)
● 文本节点(text对象):代表元素(标签)中的文本
● 属性节点(attribute对象):代表一个属性,元素(标签)才有属性
● 注释是注释节点(comment对象)JavaScript 可以通过DOM创建动态的 HTML:
● JavaScript 能够改变页面中的所有 HTML 元素
● JavaScript 能够改变页面中的所有 HTML 属性
● JavaScript 能够改变页面中的所有 CSS 样式
● JavaScript 能够对页面中的所有事件做出反应
4.1 查找标签
直接查找:
id查找、class查找、标签查找
document.getElementById 根据ID获取一个标签
document.getElementsByClassName 根据class属性获取
document.getElementsByTagName 根据标签名获取标签合集间接查找
parentElement 父节点标签元素
children 所有子标签
firstElementChild 第一个子标签元素
lastElementChild 最后一个子标签元素
nextElementSibling 下一个兄弟标签元素
previousElementSibling 上一个兄弟标签元素