您的位置：首页 > Web前端 > JavaScript

JS获取table中td的绝对坐标

2012-02-17 16:45 761 查看

<html>

<script language="javascript">
function findPosX(obj) {
var curleft = 0;

if (obj.offsetParent) { //返回父类元素，大多说offsetParent返回body
while (obj.offsetParent) {//遍历所有父类元素
curleft += obj.offsetLeft;//当前元素的左边距
obj = obj.offsetParent;
}
} else if (obj.x) curleft += obj.x;
return curleft;
}

function findPosY(obj) {
var curtop = 0;

if (obj.offsetParent) {
while (obj.offsetParent) {

curtop += obj.offsetTop;
obj = obj.offsetParent;
}
} else if (obj.y) curtop += obj.y;
return curtop;
}
function getPos(){
return {x:findPosX(document.getElementById("p36table")),y:findPosY(document.getElementById("p36table"))};
}

function showPos(){
var pos = getPos();
alert("x=="+pos.x+"y=="+pos.y);

}
</script>

<div id="parentdiv" style="position:relative; border:5px solid;" >
<table id="p36table" style="position: relative; " width="185" border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<td>
<iframe frameborder=0 scrolling=no width="185" height="170" marginHeight=0 marginWidth=0 align="left"
src='#'></iframe>
</td>
<td onClick="javascript:showPos();">测试获得坐标</td>
</tr>
</table>

</div>
</html>

附注：

方法1：

function   getAbsPoint(e)
{
var   x   =   e.offsetLeft,   y   =   e.offsetTop;
while(e=e.offsetParent)
{
x   +=   e.offsetLeft;
y   +=   e.offsetTop;
}
alert("x:"+x+","+"y:"+y);
}

方法2：

function   getAbsPoint(obj)
{
var   x,y;
oRect   =   obj.getBoundingClientRect();
x=oRect.left
y=oRect.top
alert("("+x+","+y+")")
}

JS中获得窗口属性的方法

1。获得屏幕的分辨率：
screen.width
screen.height

2。获得窗口大小：
document.body.clientWidth
document.body.clientHeight

3。获得窗口大小（包含Border、Scroll等元素）
document.body.offsetWidth
document.body.offsetHeight

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航