为了方便开发,网站中经常会获取相同类名的所有元素,同时在显示数据时可能需要获取当前行元素的具体坐标偏移位置,以便进行精确定位。因此这里为DOM扩展了几个功能辅助工具。
//===================================
//获取元素距离窗口左侧的偏移位置
//参数说明:element-元素对象,DOM对象
//返回值:返回距离的数值
function getElementLeft(element){
var actualLeft = element.offsetLeft;
var current = element.offsetParent;
while (current !== null){
actualLeft += current.offsetLeft;
current = current.offsetParent;
}
return actualLeft;
}
//获取元素距离窗口顶部的偏移位置
//参数说明:element-元素对象,DOM对象
//返回值:返回距离的数值
function getElementTop(element){
var actualTop = element.offsetTop;
var current = element.offsetParent;
while (current !== null){
actualTop += current.offsetTop;
current = current.offsetParent;
}
return actualTop;
}
//===================================
//使用标准方法绑定事件
//参数说明:e-元素对象;event-事件类型,不要添加on前缀;fn-绑定的事件函数
var addEvent=function(e,event, fn) {
if(document.addEventListener){
return e.addEventListener(event, fn, false);
}
else if(document.attachEvent){
return e.attachEvent("on"+event, fn);
}
};
//===================================
//扩展Document对象的getElementsByClassName方法
//获取文档或指定对象内特定类型的对象
//参数说明:className-类名,字符串;dom-文档或文档内任何对象,DOM对象
//返回值:返回匹配类名的DOM对象的数据集合
document.getElementsByClassName = function(className,dom) {
var dom = dom || document;
var el = [],
_el = dom.getElementsByTagName('*');
for (var i=0; i<_el.length; i++ ) {
if (_el[i].className == className ) {
el[el.length] = _el[i];
}
}
return el;
}