JavaScript中的BOM操作（浏览器对象模型）Part①

BOM全称Browser Object Model，中文名为浏览器对象模型。它是可以操作浏览器的方法，是各个浏览器厂商提供的
览器厂商允许我们操作浏览器，我们才可以操作。如果不允许，就不能操作
各个浏览器厂商都有自己的特点，因此BOM操作需要考虑兼容性

浏览器三大弹窗操作：
①提示框/警告框
转义符类似于 HTML中的字符实体，是为了解决输入内容和JavaScript代码的冲突
\n 换行
’ 单引号
" 双引号
\r 回车
\t 横向跳格 (Ctrl-I)
\ 反斜杠
\f 纵向的间隔

window.alert('弹出内容\n警告内容');

②输入框
使用window.prompt('提示内容'); 弹出一个输入框，可以输入数据。()中定义的内容作为输入数据的提示内容。输入框执行结果可以使用变量来存储，存储的内容是数据的数据内容
输入的数据，存储的方式是字符串类型。如果是输入数值需要计算，必须把数据类型转化为数值

var userName = window.prompt('请输入账号');
var userPwd = window.prompt('请输入密码');
console.log(userName,userPwd);

将纯数字的字符串转化为数值类型方法
方法1： 使用parseInt()获取整数部分

var res1 = parseInt(window.prompt('请输入密码'));
console.log(res1);

方法2：执行非加法的，不影响数值的运算

var res2 = window.prompt('请输入密码') - 0 ;//减0不影响结果
var res2 = window.prompt('请输入密码') * 1 ;//乘1不影响结果
var res2 = window.prompt('请输入密码') / 1 ;//除1不影响结果
console.log(res2);

方法3：在数值前添加 + 正号 或者 - 符号，获取正数的部分。但是要注意正数和负数的问题

• 正号 : 正数获取的正数结果 负数获取的是负数结果

• 负号 : 正数获取的负数结果 负数获取的是正数结果

var res3 = -window.prompt('请输入密码');
console.log(res3);

③确认框
使用window.confirm('提示内容');
点击确定按钮，window.confirm()执行结果，返回值是 true
点击取消按钮，window.confirm()执行结果，返回值是 false
可以根据返回值执行不同的操作

var res = window.confirm('请问您是否确定删除这个邮件');
console.log(res);

BOM可以用来获取浏览器滚动条，分为宽度和高度两个属性
获取高度的兼容性要看有没有文档类型声明有: document.documentElement.scrollTop;没有： document.body.scrollTop;
如果获取方式错误，程序不会报错，只是获取的结果是0

var height1 = document.documentElement.scrollTop;
var height2 = document.body.scrollTop;
console.log(height1 , height2);

实际当中要确保始终可以获取到正确的数值，不管有没有文档类型声明
var 变量 = 方式1 || 方式2 ;
当方式1有结果时，数值会转化为 true，方式2就不会执行。变量中存储的是方式1获取的结果
当方式1结果是0时，数值会转化为 false ，方式2会执行。变量中先存储方式1的结果0，再存储方式2的结果，最终为方式2的结果

console.log(document.documentElement.scrollTop);
console.log(document.body.scrollTop);
//浏览器上卷的高度
var height = document.documentElement.scrollTop || document.body.scrollTop

//浏览器移动的宽度
var width = document.documentElement.scrollLeft || document.body.scrollLeft;

console.log(height , width);

还可以利用属性来设定滚动条移动的宽度和高度，直接设定数值就可以，不要加PX

document.documentElement.scrollTop = 500;
document.documentElement.scrollLeft = 500;