BOM浏览器对象模型

菜园前端
• 阅读 501

原文链接:https://note.noxussj.top/?source=helloworld


window 对象

提示框 alert

alert(1)

确认提示框 confirm

var conf = confirm('是否打开') // true or false

定时器 setTimeout

var t1 = setTimeout(function () {
    console.log(1) // 3000 毫秒后打印 1
}, 3000)

取消定时器 clearTimeout

clearTimeout(t1)

循环定时器 setInterval

var t1 = setInterval(function () {
    console.log(1) // 每隔 1000 毫秒打印 1
}, 1000)

取消循环定时器 clearInterval

clearInterval(t1)

本地化存储 localStorage

localStorage 是 HTML5 新增的 API,主要用于长期存储数据在本地(存储在访问者的浏览器中),它是没有过期时间的,除非你的手动删除它,否则它会一直存在。localStorage 的存储数据大小是 4M。

// 设置缓存
localStorage.setItem('name', 'xiaoming')

// 读取缓存
localStorage.getItem('name') // 'xiaoming'

// 删除缓存
localStorage.removeItem('name')

设置和删除缓存后可以通过 "浏览器调试工具" 进行验证。

location 对象

获取 url 地址 location.href

var str = location.href // 'https://echarts.noxussj.top/#/'

获取域名 location.host

var str = location.host // 'echarts.noxussj.top'

获取端口号 location.port

var str = location.port // 8888

获取 web 协议 location.protocol

var str = location.protocol // 'https:'

获取浏览器名称 navigator.appName

var str = navigator.appName // 'Netscape'

获取浏览器版本 navigator.appVersion

var str = navigator.appVersion // '5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36'

获取操作系统 navigator.platform

var str = navigator.platform // 'Win32'

history 对象

返回上一页 history.back

history.back()

返回下一页 history.forward

history.forward()

返回上下页 history.go

history.go(-1)

screen 对象

屏幕宽度 screen.width

var str = screen.width // 1920

屏幕高度 screen.height

var str = screen.height // 1080

document 对象

浏览器缓存 document.cookie

cookie 是最原始的浏览器缓存,cookie 会有过期时间,如果不设置则关闭当前浏览器窗口则会立即失效。cookie 的存储数据的上限是 4kb。

// 设置cookie
document.cookie = 'name=xiaoming;'

// 访问cookie
var str = document.cookie //  'name=xiaoming';

// 删除cookie
document.cookie = ''

文档标题 document.title

document.title = 'my-title'

打印内容 document.write

document.write('我是内容')
点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Karen110 Karen110
3年前
一篇文章带你了解JavaScript弹出框
在JavaScript中,可以创建对话框或弹出窗口来与用户进行交互。JavaScript具有三种不同类型的弹出框:警告框,确认框和提示框。一、警告框警告框是最简单的弹出框。它使可以向用户显示一条短消息。还包括“确定”按钮,用户必须单击此“确定”按钮才能继续。window.alert()语法:window.alert("msg")方法可以在没有窗口的前缀被写
凝雪探世界 凝雪探世界
3年前
js-Answers一
JavaScript的组成JavaScript由以下三部分组成:1.ECMAScript(核心):JavaScript语言基础2.DOM(文档对象模型):规定了访问HTML和XML的接口3.BOM(浏览器对象模型):提供了浏览器窗口之间进行交互的对象和方法JS的基本数据类型和引用数据类型
陈占占 陈占占
2年前
PHP 利用confirm删除指定数据库的数据
完整的效果图方法一a标签href中的是你要删除记录html<ahref"PHPtest.php?name1"onclick"returnconfirm('是否要移除该小说?')"方法二下面这个方法是js代码,点击获取id,弹出提示框,确定是否删除,confirm好像可以返回true或者falsejavascriptfunctiond
Stella981 Stella981
3年前
Javascript核心对象
JavaScript的实现包括以下3个部分:1)核心(ECMAScript):描述了JS的语法和基本对象。2)文档对象模型(DOM):处理网页内容的方法和接口3)浏览器对象模型(BOM):与浏览器交互的方法和接口ECMAScript扩展知识:① ECMAScript是一个标准,JS只是它的一个实现,其他实现包括ActionScript。
Stella981 Stella981
3年前
JavaScript中的各种宽高总结
window和document首先我们来高清两个概念:   window和document的区别是什么?   window.location和document.location是一样吗?第一个问题:   Window对象表示浏览器中打开的窗口;window对象可以省略。比如alert()、window.alert(
Wesley13 Wesley13
3年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
Wesley13 Wesley13
3年前
BOOM和DOOM操作
\TOC\BOMBOM操作指的是浏览器对象模型,它可以是JavaScript可以于浏览器进行对话,在JavaScript中与浏览器交互就是对window对象进行操作window对象window对象是客户端JavaScript最高层对象之一,由于window对象是其他大部分对象的共同的祖先,在调用window对象的
Stella981 Stella981
3年前
JavaScript的BOM和DOM
1,window对象,所有浏览器都支持window对象,它表示浏览器窗口BOM(browserObjectModel)是指浏览器对象模型,它使JavaScript有能力与浏览器进行"对话".DOM(DocumentObjectModel)是指文档对象类型,通过它,可以访问HTML文档的所有元素window对象客户端JavaScript最高
Wesley13 Wesley13
3年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_