复盘---js--BOM-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_70027586/article/details/128172651

本文介绍了浏览器对象模型(BOM)的基本概念及其与JavaScript的交互方式。内容涵盖全局方法如警告提示框、确认提示框等；如何声明全局变量；直接访问DOM元素；定时器的使用；获取屏幕尺寸；页面导航及位置控制；以及窗口事件和字符串编码方法。适合初学者快速了解BOM的基础用法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

BOM浏览器与js交互

Browser Object Model(浏览器对象模型)

一、常用的全局方法

1.window.alert()警告提示框
2.window.confirm()确认提示框
3.window.prompt()用户输入提示框

二、var声明全局变量

var a =12;
alert(window.a)

三、id元素可直接访问

<p id="myp"></p>
alert(window.myp.innerText)

四、定时器

setInterval间隔计时器
setTimeout定时器

var num = 1;
window.setInterval(function(){
   num++;
   console.log(num)
},1000)

screen对象

document.write(`<br>屏幕宽`+screen.width)
document.write(`<br>屏幕高`+screen.height)
document.write(`<br>可用屏幕宽`+screen.availWidth)
document.write(`<br>可用屏幕高`+screen.availHeight)
document.write(`<br>浏览器可视区域宽`+window.innerWidth)
document.write(`<br>浏览器可视区域高`+window.innerHeight)

history

  function goForword(){
  history go(1);//前进一步
}
（-1）后退一步
forword前进
back后退

location刷新

open方法

function openWin(){
   window.open("https://www.baidu.com")
}
//close()关闭

windows常用事件

1.onload 等待窗口加载完毕
2.onscroll 监听页面滚动

var t = document.documentElement.scrollTop;//垂直滚动距离

字符串编码

.encodeURL编码
.docodeURL解码

图片预览

var src = window.URL.createObjectURL(file);