从JS/CSS检测系统DPI/PPI？

有resolutionCSS媒体查询 - 它允许您将CSS样式限制为特定的分辨率:

http://www.w3.org/TR/css3-mediaqueries/#resolution

但是,它仅受Firefox 3.5及更高版本,Opera 9及更高版本以及IE 9的支持.其他浏览器根本不会应用特定于分辨率的样式(尽管我没有检查过非桌面浏览器).

我提出了一种根本不需要DOM的方法

DOM可能很乱,要求你在不知道width: x !important样式表中发生了什么东西的情况下将东西附加到身体上.您还必须等待DOM准备好使用...

// Binary search, (faster then loop)
// also don't test every possible value, since it tries low, mid, and high
// http://www.geeksforgeeks.org/find-the-point-where-a-function-becomes-negative/
function findFirstPositive(b, a, i, c) {
  c=(d,e)=>e>=d?(a=d+(e-d)/2,0=b(a-1))?a:0>=b(a)?c(a+1,e):c(d,a-1)):-1
  for (i = 1; 0 >= b(i);) i *= 2
  return c(i / 2, i)|0
}


var dpi = findFirstPositive(x => matchMedia(`(max-resolution: ${x}dpi)`).matches)

console.log(dpi)