如何循环读取div中包含的其他的div

var main1=document.getElementById("Main1");
var len=main1.childNodes.length;
for(var i=0;i<len-1;i++)
{
alert(main1.childNodes[i].id);
}

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    </HEAD><BODY>
    <div id=Main1>
    <div id=my1></div>
    <div id=my2></div>
    <div id=my3></div>
    <div id=my4></div>
    </div>
    <div id=Main2>
    <div id=my5></div>
    <div id=my6></div>
    <div id=my7></div>
    <div id=my8></div>
    </div>
    <script language="javascript">
    <!--
    function _test(MainID)
    {
    var objdiv = document.getElementById(MainID).getElementsByTagName("div");
    //*****************循环
    for(var i=0;i<objdiv.length;i++)
    {
    alert("top=:" + objdiv[i].offsetTop);
    alert("left=:" + objdiv[i].offsetLeft);
    }
    }
    //-->
    </script>
    <input type="button" name="test" value="test" onclick="_test('Main1')">
    </BODY>
    </HTML>
      

  2.   

    alert("top=:" + objdiv[i].offsetTop);
    alert("left=:" + objdiv[i].offsetLeft);
    alert("Width=:" + objdiv[i].offsetWidth);
    alert("Height=:" + objdiv[i].offsetHeight);获得页面的的宽高，左右边距有这些：
    window.screen.width;
    window.screen.height;
    window.document.body.offsetWidth;
    window.document.body.offsetHeight;
    window.screen.availWidth;
    window.screen.availHeight;
    window.document.body.offsetWidth;
    window.document.body.offsetHeight;
    window.screen.availWidth;
    window.screen.availHeight;
    window.document.body.scrollWidth;
    window.document.body.scrollHeight;
    window.document.body.clientHeight;
    window.document.body.clientWidth;通过事件来获得鼠标位置主要有这些:
    e.layerX;
    e.layerY;
    e.pageX;
    e.pageY;
    e.screenX;
    e.screenY;
    e.offsetX;
    e.offsetY;
    e.clientX;
    e.clientY;//获得对象相对于父级的位置
    obj .offsetLeft;
    obj .offsetTop;
    obj .offsetWidth;
    obj .offsetHeight;
      

  3.   

    最后的代码:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    </HEAD><BODY>
    <div id=Main1>
    <div id=my1></div>
    <div id=my2></div>
    <div id=my3></div>
    <div id=my4></div>
    </div>
    <div id=Main2>
    <div id=my5></div>
    <div id=my6></div>
    <div id=my7></div>
    <div id=my8></div>
    </div>
    <script language="javascript">
    <!--
    function _test(MainID)
    {
    var objdiv = document.getElementById(MainID).getElementsByTagName("div");
    //*****************循环
    for(var i=0;i<objdiv.length;i++)
    {
    alert("top=:" + objdiv[i].offsetTop);
    alert("left=:" + objdiv[i].offsetLeft);
    alert("Width=:" + objdiv[i].offsetWidth);
    alert("Height=:" + objdiv[i].offsetHeight);
    //**************************绝对左位置
    alert("绝对left=:" + getAbsoluteLeft(objdiv[i]));
    //***************************绝对TOP位置
    alert("绝对Top=:" + getAbsoluteTop(objdiv[i]));
    }
    }
    //返回对象位于窗口的绝对左边距离
    function getAbsoluteLeft( ob ){
    if(!ob){return null;}
    var obj = ob;
    var objLeft = obj .offsetLeft;
    while( obj != null && obj .offsetParent != null && obj .offsetParent.tagName != "BODY" ){
    objLeft += obj .offsetParent.offsetLeft;
    obj = obj .offsetParent;
    }
    return objLeft ;
    }
    //返回对象位于窗口的绝对上边距离
    function getAbsoluteTop( ob ){
    if(!ob){return null;}
    var obj = ob;
    var objTop = obj .offsetTop;
    while( obj != null && obj .offsetParent != null && obj .offsetParent.tagName != "BODY" ){
    objTop += obj .offsetParent.offsetTop;
    obj = obj .offsetParent;
    }
    return objTop ;
    }//-->
    </script>
    <input type="button" name="test" value="test" onclick="_test('Main1')">
    </BODY>
    </HTML>