BOM编程
1.BOM编程图解:
2.window对象:
open()
:在一个窗口中打开页面
参数一: 打开的页面
参数二:打开的方式。 _self: 本窗口 _blank: 新窗口(默认)
参数三: 设置窗口参数。比如窗口大小
setInterval()
:设置定时器(执行n次)
setTimeout()
:设置定时器(只执行1次)
定时器: 每隔n毫秒调用指定的任务(函数)
参数一:指定的任务(函数)
参数二:毫秒数
clearInterval()
:清除定时器
clearTimeout()
:清除定时器
清除任务
参数:需要清除的任务ID
alert()
:提示框
仅仅有确定按钮
confirm()
:确认提示框
返回值就是用户操作
true:点击了确定
false:点击了取消
propmt()
:输入提示框
返回值就是用户操作
true:点击了确定
false:点击了取消
注意:因为window对象使用非常频繁,所以当调用js中的window对象的方法时,可以省略对象名不写。
3.location对象:
href属性: 代表的是地址栏的URL,可以获取和设置URL。URL表示统一资源定位符
reload方法: 刷新当前页面
4.history对象:
forward():前进到下一页
back():后退上一页
go():跳转到某页(正整数:前进 负整数:后退) 1 -2
5.screen对象:
四个属性:
availHeight和availWidth:是排除了任务栏之后的高度和宽度(可用高度和可用宽度)。
width和height:是整个屏幕的像素值(实际高度和实际宽度)。
事件编程
1.事件编程图解:
2.JavaScript事件编程三要素:
(1)事件源:HTML标签;
(2)事件:发生了一件什么事(单击事件,双击事件,获取焦点事件,失去焦点事件…);
(3)监听器:函数。
3.JavaScript事件分类:
点击相关的:
单击事件:onclick()
双击事件:ondblclick()
焦点相关的:
聚焦:onfocus()
失去焦点:onblur()
选项相关的:
改变选项:onchange()
鼠标相关的:
鼠标经过:onmouseover()
鼠标移除:onmouseout()
页面加载相关的(一般用在body标签中,用于网页加载完毕后还需执行什么操作进行触发):
页面加载:onload()
DOM编程
1.DOM编程图解:
DOM(document Object Model)文档对象模型编程。
2.查询标签对象:
(1)通过document对象获取,document代表一个html页面。
(2)通过document对象的集合获取:
作用:获取多个或者同类的标签对象。
all:获取所有标签对象
forms:获取form标签对象
images:获取img标签对象
links:获取a标签对象
var nodeList = document.all; //返回所有标签对象数组
var nodeList = document.forms; //返回form标签对象数组
var nodeList = document.images; //返回img标签对象数组
var nodeList = document.links; //返回a标签对象数组
(3)通过关系查找标签对象:
父节点:parentNode属性
子节点:childNodes属性
第一个子节点:firstChild属性
最后一个子节点:lastChild属性
上一个兄弟节点:previousSibling属性
下一个兄弟节点:nextSibling属性
(4)通过document方法查询标签对象:
document.getElementById("id属性值");
(最常用)
注意:
1)使用该方法获取的标签一定要有id属性
2)在同一个html页面中不要出现两个同名的id
documetn.getElementsByName("name属性值");
获取同name属性名的标签列表
注意:
使用该方法获取的标签一定要有name属性。
document.getElementsByTagName("标签名");
获取相同标签名的标签列表
3.修改标签对象属性:
常用的需要修改的属性:
innerHTML属性:修改标签体内容 。
innerHTML : 设置的标签内的html 。
value属性: 修改value属性值。 input type=”text”
src属性: 修改图片的src属性。
checked属性:修改单选或多项的默认值。
正则表达式
正则表达式的书写规则:
1.创建正则表达式:var 变量 = /正则规则/;
2.正则规则:
[a-z]:表示匹配字母
*:0或多个元素
+:1个或多个元素
?:0或1个元素
{n,m}:大于n,小于m的个数
3.正则方法:
test()
:用于匹配指定的字符串。true表示匹配成功;false表示匹配失败。
注意:
在js的正则表达式中,只要遇到了符合规则的内容,就代表匹配成功。如果需要和Java一样完全匹配 ,需要添加边界符号。
开始标记:^
结束标记:$