Universal Screen Width and Height in Javascript

There is plenty of ways how to get screen width and height using a javascript. We collected all of them:

Universal cross-platform code 

Always use following code which was tested across all platforms:

document.documentElement.clientWidth
document.documentElement.clientHeight

All possibilities how to get screen width and height in javascript

const contentElement = document.getElementById('index');

contentElement.innerHTML += 'window.devicePixelRatio ' + window.devicePixelRatio + '<br>';
contentElement.innerHTML += '<h2>Recommended</h2><br>';
contentElement.innerHTML += 'window.document.width ' +  window.document.width + '<br>';
contentElement.innerHTML += 'window.document.body.width ' + window.document.body.width + '<br>';
contentElement.innerHTML += 'window.document.height ' + window.document.height + '<br>'; 
contentElement.innerHTML += 'window.document.body.height ' + window.document.body.height + '<br>';
contentElement.innerHTML += '<br><br><h2>Other options</h2><br>';
contentElement.innerHTML += 'document.documentElement.clientWidth ' + document.documentElement.clientWidth + '<br>';
contentElement.innerHTML += 'document.documentElement.clientHeight ' + document.documentElement.clientHeight + '<br>';
contentElement.innerHTML += 'window.innerWidth ' + window.innerWidth + '<br>';
contentElement.innerHTML += 'window.outerWidth ' + window.outerWidth + '<br>';
contentElement.innerHTML += 'window.innerHeight ' + window.innerHeight + '<br>';
contentElement.innerHTML += 'window.outerHeight ' + window.outerHeight + '<br>';
contentElement.innerHTML += 'window.screen.width ' + window.screen.width + '<br>';
contentElement.innerHTML += 'window.screen.height ' + window.screen.height + '<br>';
contentElement.innerHTML += 'window.screen.width ' + window.screen.width + '<br>';
contentElement.innerHTML += 'window.screen.availWidth ' + window.screen.availWidth + '<br>';
contentElement.innerHTML += 'window.screen.heigh ' + window.screen.heigh + '<br>';
contentElement.innerHTML += 'window.screen.availHeight ' + window.screen.availHeight + '<br>';
contentElement.innerHTML += 'document.body.clientWidth ' + document.body.clientWidth + '<br>';
contentElement.innerHTML += 'document.body.offsetWidth ' + document.body.offsetWidth + '<br>';
contentElement.innerHTML += 'document.body.scrollWidth ' + document.body.scrollWidth + '<br>';
contentElement.innerHTML += 'document.body.clientHeight ' + document.body.clientHeight + '<br>';
contentElement.innerHTML += 'document.body.offsetHeight ' + document.body.offsetHeight + '<br>';
contentElement.innerHTML += 'document.body.scrollHeight ' + document.body.scrollHeight + '<br>';