JavaScript BOM操作

1.获取浏览器窗口尺寸

var width=window,innerWidth        //获取可视窗口宽度
var height=window.innerHeight //获取可视窗口高度

2.浏览器的弹窗层

window.alert("提示信息")     //提示框       无返回值
window.confirm("提示信息") //询问框 返回值为Boolean型
window.prompt("提示信息") //输入框 返回值为输入的内容

3.开启和关闭标签页

widow.open("url链接")           //打开链接
widow.close("url链接") //关闭链接

4.浏览器常见事件

window.onload=function(){ }              //资源加载完毕触发事件
window.onresize=function(){ } //可视窗口尺寸改变时触发事件
window.onscroll=function(){ } //滚动条位置改变触发事件

5.浏览器卷去的尺寸

(1)获取卷去的高度

document.documentElment.scrollTop     //页面有<!DOCTYPE html>标签时使用
documen.body.scrollTop //页面没有<!DOCTYPE html>时使用 //兼容写法
var height=document.documentElment.scrollTop || documen.body.scrollTop

(2)获取卷去的宽度

document.documentElement.scrollLeft  //页面有<!DOCTYPE html>标签时使用
document.body.scrollLeft //页面没有<!DOCTYPE html>时使用 //兼容写法
var widght=document.documentElment.scrollTop || documen.body.scrollTop

6.设置浏览器滚动条位置

//瞬间跳转
window.scrollTo(left,top) //left 是宽的位置,top是高的位置 //平滑滚动
window.scrollTo({
left:宽度位置
top:高度位置
behavior:'smooth' //定位方式:平滑滚动
})

JavaScript 中BOM的常用操作的更多相关文章

  1. JavaScript中常见的字符串操作函数及用法

    JavaScript中常见的字符串操作函数及用法 最近几次参加前端实习生招聘的笔试,发现很多笔试题都会考到字符串的处理,比方说去哪儿网笔试题.淘宝的笔试题等.如果你经常参加笔试或者也是一个过来人,相信 ...

  2. JavaScript中,有三种常用的绑定事件的方法

    要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有三种常用的 ...

  3. JavaScript中常见的数组操作函数及用法

    JavaScript中常见的数组操作函数及用法 昨天写了个帖子,汇总了下常见的JavaScript中的字符串操作函数及用法.今天正好有时间,也去把JavaScript中常见的数组操作函数及用法总结一下 ...

  4. javascript中对字符串的操作总结

    原文:javascript中对字符串的操作总结 没听过一句话吗?程序员的世界,不处理字符串就是处理数组.这是群里的一位前辈和我说的,显然这和我之前理解的DOM是javascript的核心的不同的,看了 ...

  5. JavaScript中对数组的操作

    原文:JavaScript中对数组的操作 一:数组的使用 1.定义:JavaScript中对数组的定义有两种形式.如: .var arr = [12,3,5,8]; .var arr = new Ar ...

  6. javascript中数组的常用算法深入分析

    Array数组是Javascript构成的一个重要的部分,它可以用来存储字符串.对象.函数.Number,它是非常强大的.因此深入了解Array是前端必修的功课.本文将给大家详细介绍了javascri ...

  7. 前端javascript之BOM、DOM操作、事件

    BOM与DOM操作 BOM 浏览器对象模型>>>:使用js操作浏览器 DOM 文档对象模型>>>:使用js操作前端页面 window对象 所有浏览器都支持 wind ...

  8. 深圳尚学堂:JavaScript中常见的字符串操作

    快到春节放假了,春节后又是一大波的找工作热潮,在前端实招聘笔试时,必不可免额会考到关于JavaScript中字符串的处理问题.考的不是你会不会,而是你能不能在不借用XX手册或者XX指南再或者百度谷歌的 ...

  9. JavaScript之字符串的常用操作函数

    字符串的操作在js中非常繁琐,但也非常重要.在使用过程中,也会经常忘记,今天就对这个进行一下整理. String 对象 String 对象用于处理文本(字符串). new String(s); // ...

随机推荐

  1. Asp.NetCore3.1开源项目升级为.Net6.0

    概述 自从.Net6.0出来后,一直想之前开发的项目升级.Net6.0,有时想想毕竟中间还跨了个5.0版本,升级起来不知道坑大不大,最近抽时间对升级的方案做了些研究,然后将代码升级为.Net6.0.本 ...

  2. MeteoInfo-Java解析与绘图教程(七)_图层添加站点名称或区域名称

    MeteoInfo-Java解析与绘图教程(七)_图层添加站点名称或区域名称 在上文说了用自动站的数据经过插值绘制色斑图,这种一般是在geoserver上叠加图片呈现,但遇到后端导出图片,我们又想添加 ...

  3. 【LeetCode】561. Array Partition I 解题报告(Java & Python)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 排序 日期 题目地址:https://leetcod ...

  4. 【LeetCode】565. Array Nesting 解题报告(Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 日期 题目地址:https://leetcode.c ...

  5. 【LeetCode】703. Kth Largest Element in a Stream 解题报告(Python)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 小根堆 日期 题目地址:https://leetco ...

  6. 洛谷 P3431:[POI2005]AUT-The Bus(离散化+DP+树状数组)

    题目描述 The streets of Byte City form a regular, chessboardlike network - they are either north-south o ...

  7. 为什么我的 WordPress 网站被封了?

    今年以来,一系列 "清朗" "护苗" "净网" 专项整治行动重拳出击,"清朗·春节网络环境"取消备案网站平台2300余家 ...

  8. 「算法笔记」快速傅里叶变换(FFT)

    一.引入 首先,定义多项式的形式为 \(f(x)=\sum_{i=0}^n a_ix^i\),其中 \(a_i\) 为系数,\(n\) 为次数,这种表示方法称为"系数表示法",一个 ...

  9. C++输出控制小数点后位数的方法

    以C++输出小数点两位数为例 setprecision(n)使用方法总结 首先要记住写头文件 #include <iomanip> //不要忘了头文件 以下是控制小数位数的三种写法 //t ...

  10. 编写Java程序,通过接口摸拟麦当劳食物生产过程,接口设计

    返回本章节 返回作业目录 需求说明: 通过接口摸拟麦当劳食物生产过程 实现思路: 通过接口摸拟麦当劳食物生产过程的实现思路: 创建接口食物(Food),该接口需要被所有的食物类所实现.在该接口中定义g ...