js如何获取设备dpi兼容所有浏览器

要获取设备的 DPI（每英寸像素数），目前没有一种方法能够兼容所有浏览器。不同浏览器提供的获取 DPI 的方式各不相同。以下是一种常见的获取 DPI 的方法：

function getDeviceDPI() {
  var dpi = 96; // 默认值 96dpi

  if (window.screen && window.screen.deviceXDPI && window.screen.logicalXDPI) {
    dpi = window.screen.deviceXDPI / window.screen.logicalXDPI * dpi;
  } else if (window.devicePixelRatio) {
    dpi = dpi * window.devicePixelRatio;
  }

  return dpi;
}

var deviceDPI = getDeviceDPI();
console.log(deviceDPI);

在上述代码中，我们定义了一个 `getDeviceDPI` 函数来尝试获取设备的 DPI 值：

- 首先，我们尝试使用 `window.screen` 对象提供的 `deviceXDPI` 和 `logicalXDPI` 属性。这些属性在IE浏览器中可用，可以用来获取设备的物理像素和逻辑像素的比例。通过计算比例并乘以默认的 96dpi，可以得到设备的 DPI 值。
- 如果上述属性不可用，则尝试使用 `window.devicePixelRatio` 属性。这个属性在大多数现代浏览器中可用，用来表示物理像素与逻辑像素之间的比例。通过将默认的 96dpi 乘以这个比例，可以得到设备的 DPI 值。

返回的结果是设备的 DPI 值，并将其打印到控制台上。

请注意，不同浏览器可能使用不同的属性或方法来获取 DPI 值。因此，以上方法仍然可能无法兼容所有浏览器。在实际应用中，最好根据目标浏览器进行测试和适配，或者使用第三方库来获取准确的 DPI 值。