BOM简介
BOM简介
- BOM Browser Object Model
- 浏览器对象模型
// 通过window对象来访问浏览器
console.log(window.document);
// frames:当前文件的框架集合
console.log(window.frames);
// 浏览器环境信息
console.log(window.screen);
console.log(window.history);
// 浏览器及其相关功能的信息
console.log(window.navigator);
// 浏览器本地信息
console.log(window.location);
// href属性 reload() assign() replace() 等方法
window.location.href = 'red.html';
window.location.reload(); //刷新
// 有历史记录
window.location.assign('yellow.html');
// 替换页面 无历史记录
window.location.replace('yellow.html')
window.history.forward();
window.history.back();
// go(num)： num大于0 向后跳转num个界面
window.history.go(2);
onload
onload:是windows的属性 本身是函数类型的属性，赋值时需要接受一个函数,当页面加载完毕才会执行
window.onload = function(){
alert('页面加载完毕')
}
onscroll
<body style="height: 2000px;">
<button onclick="goTop()" style="position: fixed;bottom: 50px; right: 50px;">回到顶部</button>
<script type="text/javascript">
window.onscroll = function(){
// console.log('页面滚动')
var height = document.documentElement.scrollTop || document.body.scrollTop;
console.log(height);
}
function goTop(){
document.documentElement.scrollTop = 0;
//document.body.scrollTop = 0;
}
</script>
</body>
onresize
<script type="text/javascript">
// onresize 浏览器更改大小时会执行
window.onresize = function(){
console.log('大小更改');
}
</script>
定时器
<button onclick="clearTime()">清除定时器</button>
<button onclick='create()'>创建定时器</button>
<script type="text/javascript">
// 创建定时器
function create () {
timer = window.setInterval(function(){
console.log("666");
}, 2000)
}
//window.setInterval(func, 2000)
function clearTime () {
window.clearInterval(timer);
}
</script>
延时器
<button onclick='clearTimer()'>清除定时器</button>
<script type="text/javascript">
var timer = window.setTimeout(func, 5000);
function func () {
console.log('您很好');
}
function clearTimer(){
window.clearTimeout(timer);
}
</script>
BOM简介的更多相关文章
- Javascript学习笔记3 Javascript与BOM简介
什么是BOM BOM是browser object model的缩写,简称浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象 ...
- JavaScript学习总结【6】、JS BOM
1.BOM 简介 所谓的 BOM 即浏览器对象模型(Browser Object Model).BOM 赋予了 JS 操作浏览器的能力,即 window 操作.DOM 则用于创建删除节点,操作 HTM ...
- 从零开始的JS生活（二）——BOM、DOM与JS中的事件
上回书说道,JS中变量.运算符.分支结构.循环和嵌套循环等内容.本回就由本K给大伙唠唠JS中的BOM.DOM和事件. 一."花心大萝卜"--BOM 1.震惊,FFF团为何对BOM举 ...
- BOM：浏览器对象模型之浏览器剖析入门
BOM简介 BOM与DOM的关系 BOM对象包含的内容 重新认识浏览器 一.分裂的BOM和被收服的DOM BOM定义:是browser object model的缩写,简称浏览器对象模型. 主要处理浏 ...
- javascript教程5:--BOM操作
1.BOM 简介 所谓的 BOM 即浏览器对象模型(Browser Object Model).BOM 赋予了 JS 操作浏览器的能力,即 window 操作.DOM 则用于创建删除节点,操作 HTM ...
- js下 Day01、DOM对象，BOM浏览器对象模型
一．初识DOM 1．什么是DOM?为什么学习DOM 2．DOM是实现js在网页实现交互的关键环节,我们的js代码就是通过DOM的方法来实现对于html内容的操作. 3．认识DOM实现了js和网页结合的 ...
- JS之DOM编程
为什么学dom编程? 通过dom编程,我们可以写出各种网页游戏 dom编程也是我们学习ajax技术的基础,所以我们必需掌握好dom编程. dom编程简介 DOM=Document Object Mo ...
- js基础提高（二）
JavaScript基础提高(二) 上篇写的是JavaScript的历史.基本的数据类型和基本的语法进填的话讲的就深入一些了. js的函数 1.js函数定义的方式 (1)普通方式 语法:functio ...
- JavaScript基础精讲
---------------------------------------------------------------------------------------------------- ...
随机推荐
- 记一次GRPC使用报错排查
项目一直使用grpc作为服务交互程序,其中我负责的java模块第一次引用该框架:当框架搭建好后,建立客户端代码,报错: Runable Error:java.lang.IllegalAccessErr ...
- Ubuntu12.04下解决sudo apt-get update警告Duplicate sources.list entry
sudo apt-get update,会提示如下警告: W: Duplicate sources.list entry http://archive.canonical.com/ubuntu/ pr ...
- mysql批量update的两种方法
today a question let me happy(抓狂) 头儿分了一个小任务,让修改循环调用dao层的那些不啦不啦不啦,鉴于之前写过批量更新的玩意,so 很快代码就修改完了,but 测的时候 ...
- pandas读取文件报错
path = 'D:/Postgraduate/Python/Machine Learning/小象学院机器学习/08.回归实践/8.Regression代码/8.Regression/8.Adver ...
- 1.7Oob 静态成员
1)public class Exse3 { static int iCounter = 0; String name; boolean bGender = false; int iAge; doub ...
- html form禁止表单回车自动提交（通常原因是为在ajax提交前、后进行js判断控制）
@*onkeydown事件用于禁止回车自动提交form,这样就不经过js控制跳转*@ <form action="/Account/CheckPsw" method=&quo ...
- xss脚本绕过限制的方法
第一关:第一关比较简单,直接写入标签就可以,这里不多说了,payload如下: http://sqler.win/xss/level1.php?name=test%3Csvg/onload=alert ...
- 第二周作业-web后台应用开发与xml
web后台: 网站前台和网站后台通常是相对于动态网站而言,即网站建设是基于数据库开发 的网站.基于带数据库开发的网站,一般分网站前台和网站后台.网站前台是面向网站访问用户的,通俗的说也就是给访问网站的 ...
- :after和:before 伪类
1 使用伪类画三角形 .div{ margin-top: 100px; margin-left: 100px; } .div:after{ content: ''; display:inline-bl ...
- ES6 数组
数组创建 Array.of() 将参数中所有值作为元素形成数组. console.log(Array.of(1, 2, 3, 4)); // [1, 2, 3, 4] // 参数值可为不同类型 con ...