aria-valuemin=1 aria-valuemax=11 aria-valuenow=0 onchange="this.setAttribute('aria-valuenow', ¬ this.value)"> Такой код будет обновлять значение атрибута
aria-valuenow
; это можно проверить, про-
следив за элементом с помощью DOM Inspector.
О БРАТНАЯ СОВМЕСТИМОСТЬ С УСТАРЕВШИМИ БРАУЗЕРАМИ Остается главный вопрос: что мы можем сделать для устаревших браузеров? Ответ звучит
так: пока не отправляйте на пенсию вашу старую JavaScript-валидацию и модные сборщики
данных DHTML; оставьте их в качестве запасного варианта и выполните проверку воз-
можностей.
Как мы видели раньше, встречая неподдерживаемый тип, браузеры прибегают к альтерна-
тивному варианту и используют
type=text
. Таким образом, устаревший браузер, встретив
118 • Глава 3
input
type=email
, просто заменит это на
input
type=text
. Данное изменение распростра-
няется и на DOM, поэтому, проверив тип элемента ввода, мы можем программным обра-
зом определить, поддерживает ли браузер новые крутые элементы, и в противном случае
выбрать подходящий обходной путь.
Например, чтобы определить, поддерживается ли
type=email>
, вы создаете новый
type=email>
с помощью JavaScript, но не добавляете его на страницу. Далее вы про-
сите ваш новый элемент сообщить, какой у него тип. Если в ответ вы получаете «email»,
браузер поддерживает эту возможность — и тогда пусть он делает все сам без JavaScript-
валидации. Если вы получаете в ответ «text», это значит, что было выбрано значение по
умолчанию и эта возможность не поддерживается. Так что в идеале ваш код должен за-
гружать альтернативную библиотеку валидации, используя метод загрузки по требованию (lazy load).
var i = document.createElement("input");
i.setAttribute("type", "email");
return i.type !== "text";
Атрибуты тоже можно проверять.
return 'autofocus' in document.createElement("input");
Итак, что вам это дает? Во-первых, вы создаете удобные в использовании и доступные
формы, предоставляя простые механизмы ввода (такие, как сборщики данных) и проверяя
пользовательские данные еще до того, как будет отправлен первый запрос на сервер. Во-
вторых, вы экономите ресурсы, прибегая к помощи встроенных возможностей браузера
(если они уже понимают валидацию на клиентской стороне и новые типы и атрибуты
HTML5) или, в случе устаревших браузеров, изящно подтягивая поддержку традиционных
библиотек JavaScript.
Методологию и обсуждение добавления такой поддержки в старые браузеры вы найдете
в главе 12.