zoukankan      html  css  js  c++  java
  • Javascript 获取页面高度(多种浏览器)

    在我本地测试当中:
    在IE、FireFox、Opera下都可以使用
    document.body.clientWidth
    document.body.clientHeight
    即可获得,很简单,很方便。
    而在公司项目当中:
    Opera仍然使用
    document.body.clientWidth
    document.body.clientHeight
    可是IE和FireFox则使用
    document.documentElement.clientWidth
    document.documentElement.clientHeight
    原来是W3C的标准在作怪啊
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    如果在页面中添加这行标记的话

    在IE中:
    document.body.clientWidth ==> BODY对象宽度
    document.body.clientHeight ==> BODY对象高度
    document.documentElement.clientWidth ==> 可见区域宽度
    document.documentElement.clientHeight ==> 可见区域高度
    在FireFox中:
    document.body.clientWidth ==> BODY对象宽度
    document.body.clientHeight ==> BODY对象高度
    document.documentElement.clientWidth ==> 可见区域宽度
    document.documentElement.clientHeight ==> 可见区域高度
    ?
    在Opera中:
    document.body.clientWidth ==> 可见区域宽度
    document.body.clientHeight ==> 可见区域高度
    document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
    document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
    而如果没有定义W3C的标准,则
    IE为:
    document.documentElement.clientWidth ==> 0
    document.documentElement.clientHeight ==> 0
    FireFox为:
    document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
    Opera为:
    document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
    真是一件麻烦事情,其实就开发来看,宁可少一些对象和方法,不使用最新的标准要方便许多啊。


  • 相关阅读:
    Yii2 分页
    Yii2 或者当前登录用户帐号
    css3媒体查询判断移动设备横竖屏
    Javascript操作Tr隐藏显示变形~
    php注释标准
    匹配一段html中所有的src
    数据库遇到错误(随时补充)
    NetCore-缓存文件上传和文件流上传
    SVN跨服务器版本迁移
    发票同步微信卡包
  • 原文地址:https://www.cnblogs.com/see7di/p/2239958.html
Copyright © 2011-2022 走看看