Действие JavaScript внутри атрибута ввода HTML5?

Question

Я изучаю HTML5. В одном из примеров, с которыми я столкнулся, используется элемент input типа range и элемент output (этот пример в настоящее время работает только в Chrome, Safari и Opera). Следующая форма создает слайдер с результатом, отображаемым в элементе вывода.

<form>
   <p>
      <input type="range" id="slideValue" value="50" 
          oninput="slideCurrent.value = parseInt (slideValue.value);" />
      <output id="slideCurrent">50</output>
   </p>
   <input type="submit" value="Send">
</form>

Мой вопрос касается атрибута oninput. Атрибут oninput содержит JavaScript. В пре-HTML5 JavaScript я обычно вижу ссылки JavaScript на this.value . Однако в приведенном выше примере HTML5 ссылки на slideCurrent и slideValue работают (очевидно, без необходимости использования getElementById ). Я считаю, что это новый способ поведения JavaScript.

Этот новый метод действия JavaScript задокументирован где-то?

Answer 1

Это метод, введенный IE, что имена и идентификаторы элементов являются ссылками в глобальной области видимости.Другие браузеры скопировали его, но это считается плохим использованием.Mozilla выдает предупреждение:

элемент, на который ссылается ID / NAME в глобальной области видимости.Вместо этого используйте стандартный WC3 document.getElementById () ...

При поиске в Google вы можете найти множество потоков.Хорошую статью можно найти здесь .В обработчике событий вы можете использовать this как ссылку на элемент, но доступ к выходному элементу должен осуществляться стандартными методами dom.

EDIT: О, черт, да, это в спецификации: http://www.whatwg.org/specs/web-apps/current-work/#dom-window-nameditem. Но с большим красным предупреждением:

Возможно, это изменится.Поставщики браузеров рассматривают возможность ограничения этого поведения в режиме причуд. Подробнее ...

См. Также ошибки Mozilla 303420 и 602381

Answer 2

Код внутри встроенных обработчиков событий ограничен элементом, как если бы он был в блоке with.
Следовательно, вы можете использовать свойства элемента в качестве глобальных переменных.

Это малоизвестная и опасная функция, которая не является новой для HTML5.