1、新建一个html文件。
2、为了更好区分,会创建两个按钮标签,然后给这两个按钮标签添加不同的id。
3、引入jquery文件(注:jquery的引入路径一定要正确)。
4、创建加载完成函数,然后创建一个点击按钮获取当前id的函数。
5、保存好html文件后使用浏览器打开,然后点击按钮即可看到点击的id。
6、页面所有代码,如有不懂可把所有代码复制到新建的html文件上,然后修改引入的jquery文件即可。
获取浏览器显示区域的高度 :
$(window)height();
获取浏览器显示区域的宽度 :
$(window)width();
获取页面的文档高度 :
$(document)height();
获取页面的文档宽度 :
$(document)width();
获取滚动条到顶部的垂直高度 :
$(document)scrollTop();
获取滚动条到左边的垂直宽度 :
$(document)scrollLeft();
计算元素位置和偏移量:
$(id)offset();
$('div')width();
$width 没有这么写的吧
如果div 没有设置宽度 且没有内容 那么宽度应该是0
如果你是利用jquery 后加入内容到div中去 计算宽度时也有可能是0;
给你推荐一个jquery重新封装resize代码,可以监听几乎所有html标签,比如text、p、div、span等。$(function(){
// Bind the resize event When any test element's size changes, update its
// corresponding info div
$('test')resize(function(){
var elem = $(this);
// Update the info div width and height - replace this with your own code
// to do something useful!
elemclosest('container')find('info')
text( thistagName + ' width: ' + elemwidth() + ', height: ' + elemheight() );});// Update all info divs immediately
$('test')resize();
// Add text after inline "add text" links
$('add_text')click(function(e){
epreventDefault();
$(this)parent()append( ' Adding some more text, to grow the parent container!' );});// Resize manually when the link is clicked, but only for the first paragraph
$(this)parent()resize();});});看一下官方介绍吧,里面有几个例子!jquery resize event
<body>
<div style="border: 1px solid red;height:200px;width: 200px;"></div>
<script>
$(function(){
alert($("div")[0]offsetWidth)
})
</script>
</body>
这是我刚写的一个例子,你可以看一下,可能不太好。
下面这两个是我在网上搜到直接复制的
标签元素的宽高值获取
//绝对宽度
ObjoffsetWidth
//绝对高度
ObjoffsetHeight
以上就是关于jQ如何获得网页实际高度全部的内容,包括:jQ如何获得网页实际高度、jquery 如何获取滚动条的宽度、为什么jQuery中的$width获得的值为0等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)