使用JavaScript获取显示器的每英寸像素(PPI)

这个值我们可以自己计算出来,也可以利用JavaScript代码来获得获得PPI。

比如来自Stackoverflow例1
function getPPI(){

// create an empty element
var div = document.createElement(“div”);
// give it an absolute size of one inch
div.style.width=”1in”;
// append it to the body
var body = document.getElementsByTagName(“body”)[0];
body.appendChild(div);
// read the computed width
var ppi = document.defaultView.getComputedStyle(div, null).getPropertyValue(‘width’);
// remove it again
body.removeChild(div);
// and return the value
return parseFloat(ppi);
}
var ppi = getPPI();
var x = ppi * devicePixelRatio * screen.pixelDepth / 24;
x;

还有例二
var dpi = {
v: 0,
get: function (noCache) {
if (noCache || dpi.v == 0) {
e = document.body.appendChild(document.createElement(‘DIV’));
e.style.width = ‘1in’;
e.style.padding = ‘0’;
dpi.v = e.offsetWidth;
e.parentNode.removeChild(e);
}
return dpi.v;
}
}
alert(dpi.get(true));
alert(dpi.get(false));

原理是利用CSS定义一英寸的单元,然后读取实际占用了多少像素。
这绝对是一个聪明人想出来的的方法。

在MacBook上并不适用。得出的值是192ppi,事实上Retina显示器有220ppi。(15.4″ & 2880x1800Pixel)


如果降低当前显示器的分辨率,通过这个代码也无法正确判断出真正的DPI(也有可能是JS比Window更聪明,无论怎么掩饰都知道显示的实际像素)。

“使用JavaScript获取显示器的每英寸像素(PPI)”的一个回复

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注