<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
  <head>
    <style type="text/css">
    h2{
     width: 100pt;
     }
    </style>
    <script type="text/javascript">
     function one(obj){
     var X;
     var Y;
     X=obj.style.left;
     Y=obj.style.top;
     obj.style.backgroundColor = "red";
     document.getElementsByTagName("input")[0].value="X ="+X+"   Y ="+Y;
     }
     function two(obj){
     obj.style.backgroundColor = "blue";
     }
    </script>
  </head>
  
  <body>
  <h2 onmouseover="one(this)"  onmouseout="two(this)" >我是中国人 </h2>
  <BR>
  <input type="text">
  </body>
</html>取不到h2的left和top的值,这是怎么回事?

解决方案 »

  1.   

     X=obj.style.left;
     Y=obj.style.top;
    这种只能取到写在元素内部的style,css里面的内容取不到的
    比如:<h2 style="left : 200px; top : 200px">我是中国人 </h2>
    你的html代码里没有定义这两个style属性,所以取出来的是空字符串
      

  2.   

    就 1楼 说的.没有在style 设置 left .top obj.offsetLeftobj.offsetTop;
      

  3.   

    貌似  position:absolute   left  top才有效果吧
      

  4.   

     var X;
                var Y;
                X=obj.offset.left;
                Y=obj.offset.top;