BOM 浏览器对象 Location History
<!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>Document</title>
</head>
<body>
<h1>history</h1>
<button></button>
<script>
/**
* BOM
* 浏览器对象
* BOM 可以使我们通过 js 来操作浏览器
* BOM 对象
* Window
* 代表的是整个浏览器 同时window 也是网页中的全局对象
* Navigator
* 代表当前浏览器的信息 通过该对象可以来识别不同的浏览器
* Location
* 代表当前浏览器的地址信息 通过location 可以获取地址栏信息 或者操作浏览器跳转页面
* History
* 代表浏览器的历史记录 可以通过该对象来操作浏览器的历史记录 --> 只能操作浏览器向前或向后翻页
* Screen
* 代表用户的屏幕信息 通过该对象可以获取到用户的显示器的相关信息
*/
/**
* Navigator
* 代表当前浏览器的信息 通过该对象可以来识别不同的浏览器
* 一般只会 使用 userAgent 来判断浏览器的信息
*
* userAgent
* Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.93 Safari/537.36
*/
// console.log(navigator);
// var ua = navigator.userAgent;
// console.log(ua);
// if(/firefox/i.test(ua)){
// alert("火狐")
// } else if(/chrome/i.test(ua)){
// alert("chrome")
// } else if(/msie/i.test(ua)){
// alert("IE")
// }else if("ActiveXObject" in window){
// alert("IE-11")
// }
/** userAgent 不能判断 ie 浏览器
* 如果 userAgent 不能判断, 还可以通过一些浏览器中特有的对象 来判断浏览器的信息
* 比如 ActivexObject
*/
// if("ActiveXObject" in window){
// alert("IE-11")
// }
/**
* History
* 代表浏览器的历史记录 可以通过该对象来操作浏览器的历史记录 --> 只能操作浏览器向前或向后翻页
*
* history.length 可以获取到当前访问的链接数量
* history.back() 可以用来回退到上一个页面 作用和 浏览器的回退按钮一样
* history.forward() 可以跳转下一个页面 作用和 浏览器的前进按钮一样
*
* history.go()
* 可以用来 跳转到指定页面
* 它需要一个整数作为参数
* 1 表示向前跳转一个页面
* 2 表示向前跳转两个页面
* -1 : 表示向后跳转一个页面
* -2 : 表示向后跳转两个页面
*
**/
// alert(history.length)
/**
* Location
* 代表当前浏览器的地址信息 通过location 可以获取地址栏信息 或者操作浏览器跳转页面
* location.reload() 用于重新加载页面
* location.reload(true) 强制清空缓存 并刷新页面
* **/
console.log(location);
// location.reload()
</script>
</body>
</html>
我是Eric,手机号是13522679763

浙公网安备 33010602011771号