javascript获取可见区域、body对象的宽度和高度

最新推荐文章于 2023-02-16 19:32:18 发布
最新推荐文章于 2023-02-16 19:32:18 发布
阅读量3k 收藏 1
点赞数
分类专栏： javascript 文章标签： javascript 可见区域 body对象 宽 高 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication19._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script language="javascript" type="text/javascript" src="javascript/jquery-1.7.2.min.js"></script>
    <script language="javascript" type="text/javascript">
        $(function() {
            var $ul = $('<ul></ul>');
            $('#main_Div').append($ul);
            //jquery 获取可见区域的宽度和高度
            $ul.append('<li>jquery 获取可见区域的宽度和高度</li>')
            $ul.append('<li>' + $(window).width() + ',' + $(window).height() + '</li>');
            //javascript 获取可见区域的宽度和高度
            $ul.append('<li>javascript 获取可见区域的宽度和高度</li>');
            $ul.append('<li>' + document.documentElement.clientWidth + ',' + document.documentElement.clientHeight + '</li>');
            //jquery 获取body对象的宽度和高度
            $ul.append('<li>jquery 获取body对象的宽度和高度</li>');
            $ul.append('<li>' + $('body').width() + ',' + $('body').height() + '</li>');
            //javascript 获取body对象的宽度和高度
            $ul.append('<li>javascript 获取body对象的宽度和高度</li>');
            $ul.append('<li>' + document.body.clientWidth + ',' + document.body.clientHeight + '</li>');
            //javascrpit 获取客户端分辨率
            $ul.append('<li>javascrpit 获取客户端分辨率</li>');
            $ul.append('<li>' + window.screen.width + ',' + window.screen.height + '</li>');
            
        });
    </script>
</head>
<body style=" width:500px; height:500px;">
    <form id="form1" runat="server">
    <div id='main_Div'>
    </div>
    </form>
</body>
</html>


曹振华
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js获取浏览器和屏幕的各种宽度高度
10-20
接下来，我们介绍如何获取网页正文的全文宽高，也就是网页内容的实际高度和宽度。这可以通过获取元素的scrollWidth和scrollHeight属性来实现。scrollWidth代表元素的总宽度，scrollHeight代表元素的总高度。对于现代...
js中获取浏览器和屏幕高度
ddr66288的博客
03-15 202
Javascript: IE中： document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeig...
JavaScript学习7
aneyal的博客
03-28 1804
简单数据类型和复杂数据类型、WebAPIs、DOM、获取元素、事件基础、操作元素
jquery如何获取元素的滚动高度
weixin_34376986的博客
07-04 558
获取浏览器显示区域（可视区域）的高度 ： $(window).height(); 获取浏览器显示区域（可视区域）的宽度 ： $(window).width(); 获取页面的文档高度 $(document).height(); 获取页面的文档宽度 ： $(document).width(); 浏览器当前窗口文档body的高度： $(docum...
JS获取body的高度
qq_14861367的专栏
07-07 4552
html>  head>                                     head>  body  style="height:400px">  div id="div1">12312div>  script type="text/javascript">                                        document.
JavaScript获取屏幕的宽和高
weixin_30760895的博客
08-03 127
var bodyWidth =document.body.clientWidth; //网页可见区域宽 var bodyHeight =document.body.clientHeight; //网页可见区域高 var bodyWidthWithBorder =doc...
javascript获取和判断浏览器窗口、屏幕、网页的高度、宽度等
10-25
本文主要探讨了JavaScript中获取和判断浏览器窗口、屏幕以及网页高度和宽度的方法，这对于网页布局和响应式设计至关重要。在JavaScript中，有多种属性和方法可以用来获取不同维度的尺寸信息。 首先，我们关注的是...
jQuery javascript获得网页的高度与宽度的实现代码
10-22
在网页开发中，获取网页的高度与宽度是一项基础且重要的...以上就是文章提供的关于使用jQuery和原生JavaScript获取网页的高度和宽度的实现代码和相关知识点。掌握这些知识能够帮助开发者更好地进行网页设计和开发工作。
JS和jquery获取各种屏幕的宽度和高度的代码
10-27
2. **网页可见区域高**：`document.body.clientHeight` 返回不包括滚动条的页面高度。 3. **网页可见区域宽（包括边线）**：`document.body.offsetWidth` 包括了边框的宽度。 4. **网页可见区域高（包括边线）**：`...
javascript获取网页高度宽度.rar
01-31
总结，JavaScript获取网页高度和宽度的方法多种多样，可以根据具体需求选择合适的方式。了解这些知识对于提升网页交互体验和实现动态布局至关重要。在教育领域，理解并熟练掌握这些技术可以帮助学生更好地构建动态、...
JS获取body及屏幕的宽度和高度
热门推荐
射手天之玉的博客
04-21 1万+
原生JS获取body及屏幕的宽度和高度
jq获取页面高度_jquery常见获取高度
weixin_30695909的博客
12-31 3775
jquery获取文档高度和窗口高度，$(document).height()、$(window).height()$(document).height()：整个网页的文档高度$(window).height()：浏览器可视窗口的高度$(window).scrollTop()：浏览器可视窗口顶端距离网页顶端的高度(垂直偏移)用一句话理解就是：当网页滚动条拉到最低端时，$(document).heig...
JS高级编程 - - day03
最新发布
m0_48625424的博客
02-16 1586
js,dom
JS设置body-width为屏幕最大宽度（width自适应）
Satsuki.Cyan的博客
04-17 1万+
// 设置body-width与屏幕width一致（减去20px进行修正） document.getElementsByTagName("body")[0].style.width = (window.screen.availWidth - 20) + "px"; 摘录参考： 网页可见区域宽：document.body.clientWidth; 网页可见区域高："+ document.body....
JavaScript文档对象模型获取body元素对象和获取Html元素对象(3)
qq_45308912的博客
11-07 487
1.获取body元素对象和获取Html元素对象 代码如下： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script> // 获取body元素对象 var bodyEle = document.body; console.log(bodyE
jquery获取body_jQuery基础语法
weixin_35876760的博客
01-21 5759
一、jQuer介绍及安装1、jQuery介绍jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架），极大简化了JavaScript 编程。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaS...
js获取网页可见区域的高度和宽度
snowstorm的博客
04-22 2588
转自：http://qiaolevip.iteye.com/blog/2076034 document.body.clientWidth ==> BODY对象宽度   document.body.clientHeight ==> BODY对象高度   document.documentElement.clientWidth ==> 可见区域宽度   document.docum
js获取可视区域与body的宽高
一个前端小菜鸟的博客
03-11 9965
可视区域的宽高： document.documentElement.clientWidth;    document.documentElement.clientHeight; body的宽高： document.body.clientWidth;    document.body.clientHeight;
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值