u 系统对话框
alert(),confirm(),prompt()
方法可以调用系统对话框向用户显示消息。显示这些对话框的时候代码会停止执行,关掉这些对话框后代码又会恢复执行。
l alert()
该方法接受一个字符串并将其显示给用户。该对话框会包含指定的文
本和一个
"OK"
按钮。主要用来显示警告信息
l confirm()
确认对话框,显示包含指定的文本和一个
"OK"
按钮以及
"Cancel"
按钮。该方法返回布尔值,
true
表示单击了
OK
,
false
表示单击
cancel或者
X
按钮
l prompt()
会话框,提示用户输入一些文本。显示包含文本,
ok
按钮
,cancel
按钮以及一个文本输入域,以供用户在其中输入内容。传入两个参数,
要显示给用户的文本提示和文本输入域的默认值。
如果用户单击
OK
按钮,该方法返回输入域的值,如果用户单击了Cancel
或者关闭对话框该方法返回
null
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>系统对话框</title>
<script>
console.log(1);
// 警告弹框
// alert(111)
// 确认弹框
// var result = confirm('是否确认删除')
// 会话框
var result = prompt('请输入姓名');
console.log(result);
</script>
</head>
<body>
</body>
</html>
u location对象
是最有用的
BOM
对象之一,提供了与当前窗口中加载的文档有关的信息,还提供一些导航功能。
location
是个神奇的对象,既是
window
的对象也是
document
的对象。
console.log(window.location == document.location);//true
属性:
host
返回服务器名称和端口号
hostname 返回不带端口号的服务器名称
href 返回当前加载页面的完整
URL
pathname 返回
URL
的目录和文件名
port 返回
URL
中指定的端口号
protocol
返回页面使用的协议
search 返回
URL
的查询字符串。这个字符串以问号开头
方法:
assign() 传递一个
url
参数,打开新
url
,并在浏览记录中生成一条记
录。
replace() 参数为一个
url,
结果会导致浏览器位置改变,但不会在历史
记录中生成新记录
reload()
重新加载当前显示的页面,参数可以为
boolean
类型,默认
为
false,
表示以最有效方式重新加载,可能从缓存中直接加
载。如果参数为
false,
强制从服务器中重新加载
为
location.href; window.location
设置为一个
URL
值,也会以该值调用
assign()
方法。以
下三句话效果一样
window.location="http://www.baidu.com";location.href="http://www.baidu.com"location.assign("http://www.baidu.com") ;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BOM-location</title>
<script>
// console.log(window.location === document.location);
// console.log(location);
window.onload = function() {
var btns = document.getElementsByTagName('button')
btns[0].onclick = function() {
// location.assign('./1-超时调用-间歇调用.html')
// location.replace('./1-超时调用-间歇调用.html')
// location.href = './1-超时调用-间歇调用.html'
// 前进一步
// history.forward()
history.go(1)
}
btns[1].onclick = function() {
// 后退一步
history.back()
}
btns[2].onclick = function() {
// 页面重载
location.reload(true)
}
btns[3].onclick = function() {
window.open('./1-超时调用-间歇调用.html')
}
}
</script>
</head>
<body>
<button>下一页</button>
<button>上一页</button>
<button>刷新</button>
<button>新窗口</button>
</body>
</html>
u history对象
该对象保存着用户上网的历史记录。出于安全方面的考虑,开发人员无法得知用户浏览过的
URL
,不过借由用户访问过的页面列表,同样可以在不知道实际
URL
的情况下实现后退
前进
,
注意: 没有应用于
History
对象的公开标准,不过所有浏览器都支持该对象。
length
返回历史列表中的网址数
注意:
IE
和
Opera
从
0
开始,而
Firefox
、
Chrome
和
Safari
从
1
开始。
back()
加载
history
列表中的前一个
URL
forward() 加载
history
列表中的下一个
URL
go() 加载
history
列表中的某个具体页面
负数表示向后跳转,正数表示向前跳转