Техника определения

Автор: Евгений Рыжков и Татьяна Головко Дата публикации: 09.03.2011
Последнее обновление:12.09.2017

Когда веб-браузер рендерит страницу, он выстраивает Document Object Model (DOM) — набор объектов, которые представляют HTML-элементы на странице. Каждый элемент (каждый <p>, <div>, <span>) представлен в DOM разными объектами. Есть также глобальные объекты, например window и document, которые не привязаны к конкретным элементам.

У всех объектов DOM есть ряд общих свойств, но у некоторых объектов свойств больше, чем у других. В браузерах, которые поддерживают HTML5, некоторые объекты будут иметь уникальные свойства. Быстрый взгляд на DOM подскажет, какие возможности поддерживаются.

Существует четыре способа определить поддерживает ли браузер ту или иную возможность. Рассмотрим их в порядке возрастания сложности:

  1. Убедиться, что определенная возможность поддерживается глобальными объектами (такими как window или navigator). Например, таким образом, определяется поддержка геолокации.
  2. Создать элемент, а затем проверить существует ли нужная возможность для этого элемента. Таким способом проверяется поддержка canvas.
  3. Создать элемент, проверить существует ли нужный метод для этого элемента, затем вызвать этот метод и проверить возвращаемое значение. Таким способом определяется поддержка видео форматов.
  4. Создать элемент, установить для свойства определенное значение. Затем проверить, сохранилось ли неизменным значение свойства. Например, так определяется поддержка типов полей для input

Куда дальше