BOM总结
1.浏览器对象模型
主要是问了解决窗口和窗口之间的通信交互.
window是Bom中的核心对象,创建的对象,变量都成为window的子对象。
2.ie9以上和其他浏览器:
window.innerWith
window.innerHeight;
3.适用于ie浏览器
document.documentElement.clientWidth
document.documentElement.clientHeight
4.获取body的宽和高
document.body.clientWidth;
document.body.clientHeight;
5.window的screen对象
目的：获取屏幕的宽高
window.screen.availWidth;
window.screen.availHeight;
3.打开新窗口
方法：window.open("参数一","参数二","参数三");
参数一:url:可以是空"",也可以写"Text.html";
参数二:可以是"",如果是"",可以一直创建.如果里面有东西,只能创建一次;
参数三:false( ? )
4.关闭窗口
方法:window.close(div.close)
5.移动窗口
moveTo(x,y)移动x,y不在动了.
moveBy(x,y)在原来的基础上移动,一直可以移动.
6.改变窗口的大小
resizeTo(x,y)改变到x,y,不再变了
resizeBy(x,y)改变x,y一直可以增加. -x,-y缩小;
7.scrollby(x,y):
参数：X：横着的滚动条距在原来基础上改变距离
y:竖着的滚动条距在原来基础上改变的距离
注意：滚动条相对与原来的位置发生移动
8.navigator
判断是不是对应浏览器，js中做兼容使用
navigator.userAgent.indextOf("浏览器名称")
返回值-1,不是该浏览器
否则,就是该浏览器.
<input type="button" id="navigatorBtn" value="判断浏览器" />
var naviator = document.getElementById("navigatorBtn");
naviator.onclick = function() {
if(window.navigator.userAgent.indexOf("Chrome") != -1) {
console.log("谷歌浏览器");
}else{
console.log("其他浏览器");
}
}
9.得到和失去交点:
<div id="div1">获取焦点</div>
<div id="div2">失去焦点</div>
div1.οnclick=function(){
//获取焦点
text.focus();
text.style.placeholder="输入内容"
}
div2.οnclick=function(){
//失去焦点
text.blur();
}
10：history
history.back();
历史界面中当前界面的上一个
history.forword();
历史界面中当前界面的下一个
history.go(num);
直接跳转到某个界面
num:正—后面的num页
负--前面的num页
注意：所要跳转的界面必须存在于history之中
11：对象
写法：
var 对象={
key1值： value1值，
key2值： value2值，
key3值： value3值，
key4值： value4值
}
a:增加：
对象.key5值=value5值；
b:删除：
delete 对象.key3值；
c:修改：
对象.key2值=value6值；
d:查（获取）
方式一：对象.key2值；
方式二：对象["key2值"]；
e:遍历
for(var 变量 in 对象){
变量—key
对象["变量"]—value
}
变量：对应的是对象中的key
获取变量对应的value—对象["变量"]
事件
1：对象事件
event
兼容性写法
function(e){
var even=e||event;
}
2:鼠标事件
a：onmousedown
按下事件
b：onmouseup
抬起事件
c:onmousemove
移动事件
d:ondblclick
双击事件
e：oncontextment
右键事件
注意：写法和onclick事件一致
eg：
对象.事件名=function(){
代码块
}
3：键盘事件
onkeydown
键盘按下事件
onkeyup
抬起事件
注意：a:写法和onclick事件一致
b:通常和使用keyCode来判断具体的按键
4：输入框事件
oninput
输入内容时触发的事件
onchange
输入框内容发生改变时触发的事件
注意：1：oninput输入框每输入一个字符都会触发
2：onchange是在输入框内容发生改变并且失去焦点时触发的事件—>