一些BOM和DOM

BOM(浏览器对象模型)

iframe

//以下都为window对象下属性

`parent`//指当前窗口的父级窗口
`top`   //永远指向最上层窗口
`self`  //指向被调用窗口

窗口位置

//在IE、Safari、Opera和Chrome中
window.screenTop 和 window.screenLeft

//在Firefox中
wndow.screenX 和 wndow.screenY

在IE、Opera中，screenLeft和screenTop保存的是从屏幕左边和上边到由window对象表示的页面的可见区域的距离。但在Chrome、Firefox和Safari中，screenX或screenTop保存的都是整个浏览器窗口偶相对于屏幕的坐标值。

窗口大小及调整

outerWidth、outerHeight   //IE9+、Firefox、Safari返回浏览器窗口本身尺寸，在Opera中返回页面视图容器的大小
innerWidth、innerHeight   //IE9+、Firefox、Safari该容器中页面视图大小

//在Chrome中，这四个值都返回相同的值，即视图大小而非浏览器窗口大小

document.documentElement.clientWidth
document.documentElement.clientHeight
//保存了页面视口信息

document.body.clientWidht
document.body.clientHeight
//混杂模式取得相同信息，在Chrome混杂模式下，这这两种都可以使用

window.resizeTo(x,y)    //调整到 x x y

检测平台、设备

var system = {
    win:false,
    mac:false,
    x11:false,
    
    //移动设备
    iphone:false,
    ipod:false,
    ipad:false,
    ios:false,
    android:false,
    nokiaN:false,
    winMobile:false,
    
    //游戏系统
    wii:false,
    ps:false
}

var ua = navigator.userAgent;

var p = navigator.platform;
system.win = p.indexOf('Win') == 0;
system.mac = p.indexOf('Mac') == 0;
system.x11 = (p == 'X11') || (p.indexOf('Linux') === 0);

//检测ios版本
if(system.mac && ua.indexOf('Mobile') > -1){
    if(/CPU (?:iPhone )?OS (\d+_\d+)/.test(ua)){
        system.ios = parseFloat(RegExp.$1.replace('_','.'));
    } else {
        system.ios = 2; //不能真正检测出来，所以只能猜测
    }
}

//检测android版本
if(/Android (\d+\.\d+).test(ua)/){
    system.android = parseFloat(RegExp.$1);
}

还有location等

DOM(文档对象模型)

classList 可以取得元素的class，使用remove、add、toggle可以操作类名。


PS：只支持 Firefox3.6+ 和 Chrome

readyState属性

loading 正在加载文档

complete 文档加载完成

insertAdjacentHTML()

//作为前一个同辈元素插入
element.insertAdjacentHTML('beforebegin',"<p>123</p>");

//最为第一个子元素插入
element.insertAdjacentHTML('afterbegin',"<p>123</p>");

//作为最后一个子元素插入
element.insertAdjacentHTML('beforeend',"<p>123</p>");

//作为后一个同辈元素插入
element.insertAdjacentHTML('afterend',"<p>123</p>");

//支持IE、Firefox 8+、Safari、Opera和Chrome

scrollIntoView()

//让元素可见
document.forms[0].scrollIntoView();

//支持IE、Firefox、Safari和Opera