10-JS BOM基础
2021-04-25 16:28
标签:val 移动设备 cli history cpu result family 获取 str window对象方法 定义一个全局变量 调用一个全局函数 弹窗 confirm() window.prompt window.open window.close() setTimeout clearTimeout setInterval clearInterval location对象属性 //location 既属于window对象,也属于document对象 更改url地址 模仿浏览器后退按钮 模仿浏览器前进按钮 screen对象及属性 获取网页宽高 获取网页的宽高 navigator对象 userAgent属性:一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值。 判断pc端跟移动端 判断是安卓还是苹果 判断用的是什么浏览器 10-JS BOM基础 标签:val 移动设备 cli history cpu result family 获取 str 原文地址:https://www.cnblogs.com/mingliangge/p/12207686.htmlvar abc = 12 等同与 window.abc = 12
abc() 等同于 window.abc()
alert() 等同于 window.alert()
confirm() 等同于 window.confirm() //(对话弹窗)
如:var mm = document.getElementById("mm");
mm.onclick = function(){
var result = window.confirm("你确定要删除吗");
if(result) alert("删除");
else alert("取消");
}
window.prompt("提示文本","提示框默认文本");
按确认时,返回值为文本框内容;按取消时,返回值为null
window.open("url","name","parameters") //打开一个新窗口
url:子窗口的url地址
name:给子窗口的名字
parameters:子窗口的各种参数,用逗号隔开
parameters参数:
width:子窗口宽度 / height:子窗口高度 / left:子窗口x轴坐标 / top:子窗口y轴坐标
toolbar:是否显示浏览器工具栏 / menubar:是否显示菜单栏
scrollbars:是否显示滚动条 / location:是否显示地址字段
status:是否添加状态栏window.close() //关闭当前浏览器窗口
如:btn.onclick = function(){window.close();}
setTimeout("alert(123)",2000) //超时调用。第一个参数可以是函数名/代码串。在2000毫秒后弹出123
clearTimeout(rew) //清除超时调用。里面的参数是函数名
setInterval(wer,1000) //间歇调用。每隔1000毫秒调用一次wer函数
clearInterval(wer) //清除间歇调用
location.href //返回当前页面完整的url地址。等价于window.location.href
location.pathname //返回url中的目录和(或)文件名
location.host //返回当前服务器的名称和端口号
location.hostname //返回当前服务器名称
location.host //返回当前服务器的端口号
location.hash //返回当前url地址#后面的内容,包括#;如果没有#,则返回空字符串。
location.search //返回当前url地址?后面的内容,包括?;如果没有?,则返回空字符串。
location.protocol //返回页面使用的协议
location对象方法
setTimeout(function(){
location.href = "index2.html"; //1秒后跳转到index2页面。有历史记录
window.location = "index2.html"; //1秒后跳转到index2页面。有历史记录
//同样location.hash和location.search也可以更改url地址
location.replace("index2.html"); //1秒后跳转到index2页面。无历史纪录
},1000)
history.back() 或者 history.go(-1)
history.forward() 或者 history.go(1)
ps:history.go可以前进后后退n步
获取网页宽高 //固定的。网页最大化,不带工具栏,的宽高
screen.availWidth / screen.availHeight
获取网页的宽高 //会随着宽口浏览器大小的变化而变化
window.innerWidth / window.innerHeight
var browser = {
versions: function() {
var u = navigator.userAgent,
app = navigator.appVersion;
return {
//浏览器版本信息
trident: u.indexOf(‘Trident‘) > -1, //IE内核
presto: u.indexOf(‘Presto‘) > -1, //opera内核
webKit: u.indexOf(‘AppleWebKit‘) > -1, //苹果、谷歌内核
gecko: u.indexOf(‘Gecko‘) > -1 && u.indexOf(‘KHTML‘) == -1, //火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf(‘Android‘) > -1 || u.indexOf(‘Linux‘) > -1, //android终端或uc浏览器
iPhone: u.indexOf(‘iPhone‘) > -1, //是否为iPhone或者QQHD浏览器
iPad: u.indexOf(‘iPad‘) > -1, //是否iPad
webApp: u.indexOf(‘Safari‘) == -1 //是否web应用程序,没有头部与底部
};
}(),
language: (navigator.browserLanguage || navigator.language).toLowerCase()
}
if (browser.versions.mobile) console.log(‘移动设备‘);
else console.log("PC设备");
if (browser.versions.ios) {
console.log(‘IOS系统‘);
}
if (browser.versions.android) {
console.log(‘Android系统‘);
}
if (browser.versions.trident) {
console.log(‘IE浏览器‘);
}
if (browser.versions.presto) {
console.log(‘opera浏览器‘);
}
if (browser.versions.webKit) {
console.log(‘Safari或Chrome浏览器‘);
}
if (browser.versions.gecko) {
console.log(‘Firefox浏览器‘);
}