jquery元素位置,jquery放在哪里

jquery怎么获取元素距离屏幕的位置

$(window).height();//是文档窗口高度

$("div").offset().top//是标签距离顶部高度（没有到下面的距离，比如$("div").offset().down）

$("div").offset().left//是标签距离右边高度（没有到下面的距离，比如$("div").offset().right）

$(document).scrollTop();//是滚动条高度

$("div").height();//是标签高度

你要的高度+$("div").height()+[$("div").offset().top-$(document).scrollTop()]=$(window).height();

经过简单的数学变换即可得到你要的值了

获取页面某一元素的绝对X,Y坐标，可以用offset()：

var X = $(‘#DivID’).offset().top;

var Y = $(‘#DivID’).offset().left;

获取相对(父元素)位置:

var X = $(‘#DivID’).position().top;

var Y = $(‘#DivID’).position().left;

通过getBoundingClientRect方法获取对象位置，包含： left , top , right , bottom 4个参数值。

相关问答

Q1: 如何使用jQuery将元素移动到另一个元素中？

想要使用jQuery将元素移动到另一个元素中，可以使用jQuery的内置方法append()或prepend()。下面本篇文章就来给大家介绍一下，希望对大家有所帮助。

方法1：使用append()方法

jQuery的append()方法用于在所选元素的末尾插入一些内容。

语法：

参数： 此方法接受上述两个参数

●　content：它是必需参数，用于指定要在所选元素末尾插入的内容。content的可能值是HTML元素，jQuery对象和DOM元素。

●　function（index，html）：它是可选参数，用于指定将返回要插入的内容的函数。

●　index：用于返回元素的索引位置。

●　html：用于返回所选元素的当前HTML。

示例：

效果图：

方法2：使用prepend()方法

prepend()方法是jQuery中的内置方法，用于在所选元素的开头插入指定的内容。

语法：

参数： 此方法接受上述两个参数

●　content：需要参数，用于指定需要插入的内容。

●　function：可选参数，用于指定调用后执行的函数。

示例：

效果图：

更多 前端开发 知识，请查阅 HTML中文网 ！！

Q2: 关于jquery获得元素绝对位置的问题，定位问题

原因很不好判定，这种方式定位出现错误的原因挺多的，要考虑css和html的具体写法，有时候某些不标准的写法会造成jQuery的定位数据不准确。

建议换个方式，例如每个tr中第一列放置一个th/th，后面是td，然后你的红框放到th里面，这样计算量就小多了，而且显示的也快一点。

Q3: jQuery简单获取DIV和A标签元素位置的方法

本文实例讲述了jQuery简单获取DIV和A标签元素位置的方法。分享给大家供大家参考，具体如下：

一、获取DIV的位置

var

top

=

jquery("#div_id").offset().top;

//获取div的居上位置

var

left

=

jquery("#div_id").offset().left;

//获取div的居左位置

var

height

=

jquery("#div_id").height();

//获取div的高度

var

width

=

jquery("#div_id").width();

//获取div的宽度

jquery("#div_id").css({'top':top,'left':left,'height':height,'width':width});

//设置DIV的css属性

二、获取A标签的位置

a

href=""

rel="external

nofollow"

onclick="javascript:get_a(this,1)"获取A标签的位置/a

script

language="javascript"

function

get_a(thisObj,param){

var

top

=

jquery(thisObj).offset().top;

var

left

=

jquery(thisObj).offset().left;

var

height

=

jquery(thisObj).height();

var

width

=

jquery(thisObj).width();

}

/script

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery页面元素操作技巧汇总》、《jquery选择器用法总结》、《jQuery表单操作总结》、《jQuery常用插件及用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery扩展技巧总结》及《jQuery常见经典特效汇总》

希望本文所述对大家jQuery程序设计有所帮助。