js 常见问题 4

(1)js创建组件
js 常见问题 4

 

 //创建"+1"超链接
        var addOneHref=document.createElement("a");
        addOneHref.href="javascript:buy("+id22+")"
        addOneHref.text="+1";
addOneHref. innerHTML ="+1";

        addOneHref.style.position="absolute";
        addOneHref.style.bottom='10px';
        addOneHref.style.left='20px';
        addOneHref.style.size="20px";
        addOneHref.className="deleteHrefClass";
        alert(addOneHref);
        $("#loadPanel").append(addOneHref);
 

 


 

(2)获取div的高度和宽度

 

 var coords = document.getElementById("coordAreas");
divLoc.innerHTML="  div:高度 "+coords.offsetHeight+" 宽度 "+coords.offsetWidth;
 兼容IE8,IE9,火狐,chrome

 

 

(3)获取div的坐标

 

 var divHeight=divObj.offsetHeight;//div自身的高度,包含border的宽度
    var divWidth=divObj.offsetWidth;//div自身的宽度,包含border的宽度
    var left22=divObj.offsetLeft;
    var top22=divObj.offsetTop;
 
js 常见问题 4
 

 

(4)通过jQuery对象获取js对象

jQuery对象:var loadPanel22=$("#loadPanel");

js对象:loadPanel22.get(0)

 

(5)跨浏览器获取滚动条的位置

 

// Cross browser gets the position of scroll
com.whuang.hsj.getScroll=function(){
    return {
        top:document.documentElement.scrollTop || document.body.scrollTop,
        left:document.documentElement.scrollLeft || document.body.scrollLeft
    }
}
 

 

(6)判断鼠标(光标)是否在div里面

 

/***
 * whether mouse is in the Div
 * @param divObj
 * @returns {boolean}
 */
com.whuang.hsj.isInDiv= function(event22,divObj,isFixed){
    var pointer = getCoordInDocument(event22);//the location of mouse
    var divHeight=divObj.offsetHeight;//div自身的高度,包含border的宽度
    var divWidth=divObj.offsetWidth;//div自身的宽度,包含border的宽度
    var left22=divObj.offsetLeft;
    var top22=divObj.offsetTop;
    if(isFixed){//position是否是fixed
        top22+=com.whuang.hsj.getScroll().top
    }
    var maxX=divWidth+left22;//X坐标的最右边
    var maxY=divHeight+top22;//Y坐标的最下边
    if(pointer.x>=left22 && pointer.x<=maxX  &&pointer.y>=top22 && pointer.y<=maxY){
        return true;
    }else{
        return false;
    }
}

js 常见问题 4
 getCoordInDocument
方法参考 获取鼠标的位置/坐标 
应用:

 

 

window.document.onmousemove=function(e){
                    console.log(com.whuang.hsj.isInDiv(e,loadPanel22.get(0),true));
                }
 

 

 

注意:

(1)js创建a标签时,超链接的文字如何设置呢?

光设置text 是不够的,因为IE不认text,IE认innerHTML

 (2)