《精通javascript》-----------------------读书笔记

《精通javascript》一书由jquery作者写成，其中不少对于js原生事件的处理正好是jquery使用的方法，为我看jquery源码提前做了一些准备。
第七章关于位置的处理方法，记录下来。以前一直是使用封装好的方法，很少去考虑兼容性，因为觉得这块兼容性实在是太差了。
1 样式的获取。普通样式：ele.style[name]（name即为样式名称）。
     计算样式：ie：ele.currentStyle[name]
ff：document.defaultView.getComputedStyle(ele).getPropertyValue(name);//其中，它使用的是通用的text-align
   而不是textAlign，所以要进行处理：name = name.replace(/[A-Z]/g,'-$1').toLowerCase();
2 元素相对于整个文档位置。使用offsetLeft和offsetTop来计算，这里涉及到offsetParent，ff中其始终指向跟节点，opera中指向直接父亲。所以
做如下处理：
function getX(ele)
{
return  ele.offsetParent?ele.offsetLeft+getX(ele.offsetParent):ele.offsetLeft;
}
就是当其offsetParent不是根节点时，一直递归，最后把每一个offsetLeft加起来。
3 元素相对于父元素的位置。（好多人说用style.left就行了，那个值只是相对于css父级盒子的距离，这里需要直接父级元素的距离）
用上面的 getX(child) - getX(child.parentNode)即可。
4 设置位置,修改left和top的值是唯一的方法。
5 获取元素的大小:普通元素,用 1 里面获取样式的兼容方法获取 'height'和‘width’属性。对于display：none隐藏元素，先将其变为
 display：‘’；visbility：‘hidden’；然后用clientHeight实现。
6 透明度：ie：ele.style.filters = alpha(opacity='[1-100]');
 ff: ele.style.opacity = [0-1];
7 鼠标位置：ff ： e.pageX 
   ie : window.event.clientX + document.body.scrollLeft
8 视口大小：document.body.clientHeight:不包含边框，只是记载内容高度 document.body.scrollHeight 也可以 
9 滚动条位置 self.pageXoffset||document.documentElement.scrollTop(ie)||document.body.scrollTop