原生js实现jQuery的功能 width()方法实现 (二)

getElWidth: function (elObj) {
//如果传入的不是对象是字符串 则通过字符串转换成对象
elObj = GoingUtils.getElObj(elObj);
if (elObj != null&&GoingUtils.isShow(elObj)) {
//如果标签上定义了style 而且style里面定义了width 则返回width
if (elObj.style.width != null && elObj.style.width.length > 0) {
return parseFloat(elObj.style.width);
}
//如果elObj.style.width为空  则从css里面获取是否定义了width信息如果定义了 则读取css里面定义的宽度width
if(parseFloat(GoingUtils._getStyleValue(elObj,"width"))>0) {
return parseFloat(GoingUtils._getStyleValue(elObj,"width"));
}
//如果从css里获取到的值不是大于0  可能是auto 则通过offsetWidth来进行计算
if (elObj.offsetWidth > 0) {
var borderLeftWidth = GoingUtils._getStyleValue(elObj, "borderLeftWidth");
var borderRightWidth = GoingUtils._getStyleValue(elObj, "borderRightWidth");
var paddingLeft = GoingUtils._getStyleValue(elObj, "paddingLeft");
var paddingRight = GoingUtils._getStyleValue(elObj, "paddingRight")
var backWidth = parseFloat(elObj.offsetWidth) - parseFloat(borderLeftWidth) - parseFloat(borderRightWidth) - parseFloat(paddingLeft) - parseFloat(paddingRight);
return parseFloat(backWidth);
}
return 0;
} else {
//将元素显示出来 获取高度 再将元素隐藏掉 注意这里的inline-block  如果是block就是整个宽度了
GoingUtils.attrEl(elObj,'style',"visibility:hidden;display:inline-block !important;");
var width=GoingUtils.getElWidth(elObj);
elObj.removeAttribute('style');
return Math.ceil(width);
}
}