jQuery获取页面宽高方法总结

这次给大家带来jQuery获取页面宽高方法总结,jQuery获取页面宽高的注意事项有哪些,下面就是实战案例,一起来看一下。

获取浏览器显示区域(可视区域)的高度 :   

$(window).height();

登录后复制

获取浏览器显示区域(可视区域)的宽度 :

$(window).width();

登录后复制

获取页面的文档高度  

$(document).height();

登录后复制

获取页面的文档宽度 :

$(document).width();

登录后复制

浏览器当前窗口文档body的高度: 

$(document.body).height();

登录后复制

浏览器当前窗口文档body的宽度:

$(document.body).width();

登录后复制

获取滚动条到顶部的垂直高度 (即网页被卷上去的高度) 

$(document).scrollTop();

登录后复制

获取滚动条到左边的垂直宽度 :

$(document).scrollLeft();

登录后复制

获取或设置元素的宽度:

$(obj).width();

登录后复制

获取或设置元素的高度:

$(obj).height();

登录后复制

某个元素的上边界到body最顶部的距离:obj.offset().top;(在元素的包含元素不含滚动条的情况下)
某个元素的左边界到body最左边的距离:obj.offset().left;(在元素的包含元素不含滚动条的情况下)
返回当前元素的上边界到它的包含元素的上边界的偏移量:obj.offset().top(在元素的包含元素含滚动条的情况下)
返回当前元素的左边界到它的包含元素的左边界的偏移量:obj.offset().left(在元素的包含元素含滚动条的情况下)
obj.offset().top;
设置或返回已经滚动到元素的左边界或上边界的像素数。简单地说,就是设置或者获取匹配元素相对滚动条上侧或者左侧的偏移。只有在元素有滚动条的时候,例如,元素的 CSS overflow 属性设置为 auto 的时候,这些像素才有用。这些属性也只在文档的 标记上定义(这和浏览器有关),并且一起来制定滚动文档的位置。注意,这些属性并不会指定一个 标记的滚动量。这是非标准的但却得到很好支持的属性

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

怎么在jQuery里使用循环

jQuery间隔一定数量的元素增加线段

怎样用JS+jQuery做出注册信息验证

以上就是jQuery获取页面宽高方法总结的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2768995.html

(0)
上一篇 2025年3月8日 12:14:36
下一篇 2025年3月8日 12:15:09

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • jquery如何遍历数组

    这次给大家带来jquery如何遍历数组,jquery遍历数组的注意事项有哪些,下面就是实战案例,一起来看一下。 本文实例讲述了jquery中map函数遍历数组用法。分享给大家供大家参考。具体如下: map函数/*注意map函数不能处理jso…

    编程技术 2025年3月8日
    200
  • jquery的方法grep()实现数组过滤筛选

    这次给大家带来jquery的方法grep()实现数组过滤筛选,使用jquery方法grep()实现数组过滤筛选的注意事项有哪些,下面就是实战案例,一起来看一下。 grep()的使用方法: grep(array,callback,invert…

    编程技术 2025年3月8日
    200
  • jQuery根据元素值操作数组元素步骤详解

    这次给大家带来jQuery根据元素值操作数组元素步骤详解,jQuery根据元素值操作数组元素的注意事项有哪些,下面就是实战案例,一起来看一下。 例如删除C这个元素 ,前提不知道C在这个数组的下标 var arr = [‘a’,’b’,’c’…

    编程技术 2025年3月8日
    200
  • Jquery解析json字符串json数组步骤详解(附代码)

    这次给大家带来Jquery解析json字符串json数组步骤详解(附代码),Jquery解析json字符串json数组的注意事项有哪些,下面就是实战案例,一起来看一下。 本文实例讲述了Jquery解析json字符串及json数组的方法。分享…

    编程技术 2025年3月8日
    200
  • jquery操作对象数组元素方法总结(附案例)

    这次给大家带来jquery操作对象数组元素方法总结(附案例),jquery操作对象数组元素的注意事项有哪些,下面就是实战案例,一起来看一下。 a b c 登录后复制 1.错误方式:不能用[]方式取jquery对象数组,如下: $(funct…

    编程技术 2025年3月8日
    200
  • jQuery实现表格隔行变色与鼠标滑过高亮(附代码)

    这次给大家带来jQuery实现表格隔行变色与鼠标滑过高亮(附代码),jQuery实现表格隔行变色与鼠标滑过高亮的注意事项有哪些,下面就是实战案例,一起来看一下。 此插件旨在实现表格隔行变色,且鼠标移动在表格的某一行上时,该行能高亮显示。整体…

    编程技术 2025年3月8日
    200
  • jquery动态操作表格行

    这次给大家带来jquery动态操作表格行,jquery动态操作表格行的注意事项有哪些,下面就是实战案例,一起来看一下。 具体代码如下: html代码: ID 起止时间 单位/部门 职位 登录后复制 js代码: $(function () {…

    2025年3月8日
    200
  • jQuery给html表格动态添加行方法总结

    这次给大家带来jQuery给html表格动态添加行方法总结,jQuery给html表格动态添加行的注意事项有哪些,下面就是实战案例,一起来看一下。 本文实例讲述了jQuery实现html表格动态添加新行的方法。分享给大家供大家参考。具体实现…

    编程技术 2025年3月8日
    200
  • jQuery操作Table方法总结

    这次给大家带来jQuery操作Table方法总结,jQuery操作Table的注意事项有哪些,下面就是实战案例,一起来看一下。 1.鼠标移动行变色 方法一:jQuery中的hover(fun(),fun())方法,参数一:第一个方法是添加样…

    编程技术 2025年3月8日
    200
  • 高效率的使用jquery操作表格

    这次给大家带来高效率的使用jquery操作表格,高效率使用jquery操作表格的注意事项有哪些,下面就是实战案例,一起来看一下。 利用jquery给指定的table添加一行、删除一行 登录后复制123112233 123 //在id为tes…

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论