jquery几种获取元素left方式的异同
Posted yswinwin
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jquery几种获取元素left方式的异同相关的知识，希望对你有一定的参考价值。
offset()函数用于设置或返回当前匹配元素相对于当前文档的偏移，也就是相对于当前文档的坐标。该函数只对可见元素有效。
该函数返回一个坐标对象(Object)，该对象有一个left属性和top属性。属性值均为数字，它们都以像素(px)为单位。
与position()不同的是：offset()返回的是相对于当前文档的坐标，position()返回的是相对于其定位的祖辈元素的坐标。
该函数属于jQuery对象(实例)。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> body,div{ margin: 0; padding: 0; } #dv{ width: 200px; height: 200px; background-color: orange; margin-left: 200px; position: absolute; } </style> <script src = "jquery-1.12.1.js"></script> <script type="text/javascript"> $(function(){ $("#btn").click(function(){ var divLeft = $("#dv").offset() console.log(divLeft);//输出的结果是一个对象 ：Object {top: 21, left: 200} var divLeft2 = $("#dv").offset().left; console.log(divLeft2);//输出结果是 200 数字类型 var divLeft3 = $("#dv").css("left"); console.log(divLeft3);//输出结果是 0px 字符串类型，不包括margin ,border: var divLeft4 = $("#dv").scrollLeft(); console.log(divLeft4);//输出的是 0 数字类型 获取的是卷曲出去的值 //offset()设置参数 //offset()传入参数的格式 {"left":100,"top":100} $("#dv").offset({"left":100,"top":100}); setTimeout(function() { $("#dv").offset({"left":"200","top":"200"}); }, 2000); //传入的值可以是字符串，但是不能带px }); }) </script> </head> <body> <input type="button" name="" id="btn" value="显示效果" /> <div id="dv"></div> </body> </html>
以上是关于jquery几种获取元素left方式的异同的主要内容，如果未能解决你的问题，请参考以下文章
jquery offset获取div的位置top和left数值