目录
BOM模型
BOM:浏览器对象模型(Browser Object Model)
BOM提供了独立于内容的、可以与浏览器窗口进行互动的对象结构
BOM可实现的功能
- 弹出新的浏览器窗口
- 移动、关闭浏览器窗口以及调整窗口的大小
- 页面的前进、后退
window对象
-
常用属性
属性名称 | 说 明 |
history | 有关客户访问过的URL的信息 |
location | 有关当前 URL 的信息 |
window.属性名= "属性值"
-
常用方法
方法名称 | 说 明 |
prompt( ) | 显示可提示用户输入的对话框 |
alert( ) | 显示带有一个提示信息和一个确定按钮的警示框 |
confirm( ) | 显示一个带有提示信息、确定和取消按钮的对话框 |
close( ) | 关闭浏览器窗口 |
open( ) | 打开一个新的浏览器窗口,加载给定 URL 所指定的文档 |
setTimeout( ) | 在指定的毫秒数后调用函数或计算表达式 |
setInterval( ) | 按照指定的周期(以毫秒计)来调用函数或表达式 |
confirm( )
- confirm( ):将弹出一个确认对话框
- confirm()与alert ()、 prompt()区别
- alert( ):一个参数,仅显示警告对话框的消息,无返回值,不能对脚本产生任何改变
- prompt( ):两个参数,输入对话框,用来提示用户输入一些信息,单击“取消”按钮则返回null,单击“确定”按钮则返回用户输入的值,常用于收集用户关于特定问题而反馈的信息
- confirm( ):一个参数,确认对话框,显示提示对话框的消息、“确定”按钮和“取消”按钮,单击“确定”按钮返回true,单击“取消”按钮返回false,因此与if-else语句搭配使用
open( )
window.open("弹出窗口的url","窗口名称","窗口特征”)
属性名称 | 说 明 |
height、width | 窗口文档显示区的高度、宽度。以像素计 |
left、top | 窗口的x坐标、y坐标。以像素计 |
toolbar=yes | no |1 | 0 | 是否显示浏览器的工具栏。黙认是yes |
scrollbars=yes | no |1 | 0 | 是否显示滚动条。黙认是yes |
location=yes | no |1 | 0 | 是否显示地址地段。黙认是yes |
status=yes | no |1 | 0 | 是否添加状态栏。黙认是yes |
menubar=yes | no |1 | 0 | 是否显示菜单栏。黙认是yes |
resizable=yes | no |1 | 0 | 窗口是否可调节尺寸。黙认是yes |
titlebar=yes | no |1 | 0 | 是否显示标题栏。黙认是yes |
fullscreen=yes | no |1 | 0 | 是否使用全屏模式显示浏览器。黙认是no。处于全屏模式的窗口必须同时处于剧院模式 |
history对象
- 常用方法
名称 | 说 明 |
back() | 加载 history 对象列表中的前一个URL |
forward() | 加载 history 对象列表中的下一个URL |
go() | 加载 history 对象列表中的某个具体URL |
location对象
- 常用属性
名称 | 说 明 |
host | 设置或返回主机名和当前URL的端口号 |
hostname | 设置或返回当前URL的主机名 |
href | 设置或返回完整的URL |
- 常用方法
名称 | 说 明 |
reload() | 重新加载当前文档 |
replace() | 用新的文档替换当前文档 |
Document对象
- 常用属性
名称 | 说 明 |
referrer | 返回载入当前文档的URL |
URL | 返回当前文档的URL |
document.referrer
document.URL
- Document 对象的常用方法
- Document 对象访问页面元素
- 动态改变层、标签中的内容
document.getElementById("book").innerHTML="现象级全球畅销书";
- 范围跟相同name 的元素
var aInput=document.getElementsByName("season");
var sStr="";
for(var i=0;i<aInput.length;i++){
sStr+=aInput[i].value+" ";
}
document.getElementById("replace").innerHTML=sStr;
- 访问相同标签的元素
var aInput=document.getElementsByTagName("input");
var sStr="";
for(var i=0;i<aInput.length;i++){
sStr+=aInput[i].value+" ";
}
document.getElementById("replace").innerHTML=sStr;
- 动态改变层、标签中的内容
JavaScript 内置对象
-
Array:用于在单独的变量名中存储一系列的值
-
String:用于支持对字符串的处理
-
Math:用于执行常用的数学任务,它包含了若干个数字常量和函数
-
Date:用于操作日期和时间
Date对象
var 日期对象 = new Date(参数)
参数格式:MM DD.YYYY.hh:mm:ss
常用方法
getDate() | 返回 Date 对象的一个月中的每一天,其值介于1~31之间 |
getDay() | 返回 Date 对象的星期中的每一天,其值介于0~6之间 |
getHours() | 返回 Date 对象的小时数,其值介于0~23之间 |
getMinutes() | 返回 Date 对象的分钟数,其值介于0~59之间 |
getSeconds() | 返回 Date 对象的秒数,其值介于0~59之间 |
getMonth() | 返回 Date 对象的月份,其值介于0~11之间 |
getFullYear() | 返回 Date 对象的年份,其值为4位数 |
getTime() | 返回自某一时刻(1970年1月1日)以来的毫秒数 |
Math对象
常用方法
方法 | 说 明 | 示例 |
ceil() | 对数进行上舍入 | Math.ceil(25.5);返回26 Math.ceil(-25.5);返回-25 |
floor() | 对数进行下舍入 | Math.floor(25.5);返回25 Math.floor(-25.5);返回-26 |
round() | 把数四舍五入为最接近的数 | Math.round(25.5);返回26 Math.round(-25.5);返回-26 |
random() | 返回0~1之间的随机数 | Math.random(); 例如:0.6273608814137365 |
定时函数
- setTimeout()
setTimeout("调用的函数",等待的毫秒数)
- setInterval()
setInterval("调用的函数",间隔的毫秒数)
清除函数
- clearTimeout()
clearTimeout(setTimeOut(),返回的ID值)
- clearInterval()
clearInterval(setInterval(),返回的ID值)