如何检测浏览器是否支持对话框答案

【问题标题】：How to detect if browser supports dialog如何检测浏览器是否支持对话框
【发布时间】：2015-10-28 23:53:47
【问题描述】：

发布的here 是一个答案，指导那些怀念旧的window.showModalDialog JavaScript 函数的人使用

<dialog>

元素。我已经将它与 IE 和 FF 所需的 polyfill 一起使用，它可以工作。但是，在使用 polyfill 时引入了一个明显的延迟，我想避免在 Chrome 中使用（更不用说在浏览器支持时不要使用 polyfill 的警告）。如何检测是否支持对话框元素，以便我可以省略 polyfill 处理？特别是这些行：

var dialog = document.getElementById('<element id>');
dialogPolyfill.registerDialog(dialog);

【问题讨论】：

标签： javascript html dialog polyfills

【解决方案1】：

你可以这样写一个简单的测试：

if (typeof HTMLDialogElement === 'function') {
  /** yep */
} else {
  /** nope */
}

【讨论】：

刚刚测试过，可以在 IE、FF 和 Chrome 中正常运行。我希望当其他浏览器开始更新时它会继续工作。

【解决方案2】：

试试console.log(typeof window.showModalDialog === 'undefined')

if (typeof window.showModalDialog === 'undefined') {
  console.log('No. ');
} else {
  console.log('Yes! ');
}

【讨论】：

从技术上讲，这只会检查是否缺少 showModalDialog。可以想象，未来的浏览器可能会添加对对话框元素的支持，但保留使用 showModalDialog（MS 肯定会这样做）。
我在 Chrome、Firefox 和 IE 中进行了测试。它对每个人都给出了正确的回应。 1up

【解决方案3】：

function dialogElementSupported() {
  return typeof document.createElement('dialog').show === 'function';
}

【讨论】：