Uzyskaj wysokość strony w JS (przeglądarka krzyżowa)

Question

Jaki jest najlepszy sposób uzyskania rzeczywistej wysokości strony (nie okna) w JS, która jest kompatybilna z wieloma przeglądarkami?

Widziałem kilka sposobów, ale wszystkie one zwracać różne wartości ...

self.innerHeight lub document.documentElement.clientHeight lub document.body.clientHeight lub coś innego?

Jednym ze sposobów to co wydaje się pracować to:

var body = document.body, 
    html = document.documentElement; 

var height = Math.max(body.scrollHeight, body.offsetHeight, 
         html.clientHeight, html.scrollHeight, html.offsetHeight); 

Answer 1

Spróbuj to bez jQuery

//Get height 
var myWidth = 0, myHeight = 0; 
if (typeof (window.innerWidth) == 'number') { 
    myWidth = window.innerWidth; 
    myHeight = window.innerHeight; 
} else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) { 
    myWidth = document.documentElement.clientWidth; 
    myHeight = document.documentElement.clientHeight; 
} else if (document.body && (document.body.clientWidth || document.body.clientHeight)) { 
    myWidth = document.body.clientWidth; 
    myHeight = document.body.clientHeight; 
} 

nadzieję, że to pomaga.

Answer 2

var width = window.innerWidth || 
      html.clientWidth || 
      body.clientWidth || 
      screen.availWidth; 

var height = window.innerHeight || 
      html.clientHeight || 
      body.clientHeight || 
      screen.availHeight; 

Powinien być dobrym sposobem, aby to osiągnąć.

Answer 3

Strona/Wysokość dokumentu jest obecnie przedmiotem implementacji dostawcy (IE/Moz/Apple/...) i nie ma standardowej i spójnej przeglądarki wyników.

Patrząc na metodę JQuery .height();

if (jQuery.isWindow(elem)) { 
      // Everyone else use document.documentElement or document.body depending on Quirks vs Standards mode 
      // 3rd condition allows Nokia support, as it supports the docElem prop but not CSS1Compat 
      var docElemProp = elem.document.documentElement[ "client" + name ], 
       body = elem.document.body; 
      return elem.document.compatMode === "CSS1Compat" && docElemProp || 
       body && body[ "client" + name ] || docElemProp; 

     // Get document width or height 
     } else if (elem.nodeType === 9) { 
      // Either scroll[Width/Height] or offset[Width/Height], whichever is greater 
      return Math.max(
       elem.documentElement["client" + name], 
       elem.body["scroll" + name], elem.documentElement["scroll" + name], 
       elem.body["offset" + name], elem.documentElement["offset" + name] 
      ); 

nodeType === 9 Średni DOCUMENT_NODE: http://www.javascriptkit.com/domref/nodetype.shtml więc nie rozwiązanie JQuery kod powinien wyglądać tak:

var height = Math.max(
        elem.documentElement.clientHeight, 
        elem.body.scrollHeight, elem.documentElement.scrollHeight, 
        elem.body.offsetHeight, elem.documentElement.offsetHeight)