From 55ddd4454665a3c66e3d5b186bc79048468d36e7 Mon Sep 17 00:00:00 2001 From: Alexey Pyltsyn Date: Mon, 15 Mar 2021 14:29:50 +0300 Subject: Auto fixes --- .../creating_and_triggering_events/index.html | 2 +- files/ru/web/guide/events/index.html | 8 +++--- files/ru/web/guide/events/media_events/index.html | 6 ++--- .../overview_of_events_and_handlers/index.html | 30 +++++++++++----------- 4 files changed, 23 insertions(+), 23 deletions(-) (limited to 'files/ru/web/guide/events') diff --git a/files/ru/web/guide/events/creating_and_triggering_events/index.html b/files/ru/web/guide/events/creating_and_triggering_events/index.html index f766a93097..5502179fae 100644 --- a/files/ru/web/guide/events/creating_and_triggering_events/index.html +++ b/files/ru/web/guide/events/creating_and_triggering_events/index.html @@ -9,7 +9,7 @@ tags: translation_of: Web/Guide/Events/Creating_and_triggering_events original_slug: Web/Guide/Events/Создание_и_вызов_событий --- -

Эта статья демонстрирует, как создавать и вызывать пользовательские DOM-события. Такие события часто называют исскуственными событиями, по отношению к событиям, производимым браузером.

+

Эта статья демонстрирует, как создавать и вызывать пользовательские DOM-события. Такие события часто называют искусственными событиями, по отношению к событиям, производимым браузером.

Создание собственных событий

diff --git a/files/ru/web/guide/events/index.html b/files/ru/web/guide/events/index.html index ccf1d5b353..e670fc0d15 100644 --- a/files/ru/web/guide/events/index.html +++ b/files/ru/web/guide/events/index.html @@ -27,9 +27,9 @@ translation_of: Web/Guide/Events

Остальные страницы описывают, как использовать события разных видов, определенных в веб-браузерах. К сожалению, эти события были определены по частям, веб-браузеры развивались таким образом, что нет удовлетворения систематическим характеристикам событий встроенным или определенным в современных веб-браузерах.

-

Устройство, на котором работа веб-браузера может спровоцировать событие, например связанное с изменением его положения и ориентации в реальном мире, частично описано page on orientation coordinate systems и page on the use of 3D transforms. Они разные, но похожи, с измененой вертикальной ориентации устройства.

+

Устройство, на котором работа веб-браузера может спровоцировать событие, например связанное с изменением его положения и ориентации в реальном мире, частично описано page on orientation coordinate systems и page on the use of 3D transforms. Они разные, но похожи, с измененной вертикальной ориентации устройства.

-

Окно в котором отображается браузер может вызвать события, к примеру, измененить размер, если пользователь максимизирует окно или изменит его размер.

+

Окно в котором отображается браузер может вызвать события, к примеру, изменить размер, если пользователь максимизирует окно или изменит его размер.

Процесс загрузки веб-страницы может вызвать ответное событие на завершение различных этапов загрузки, анализирования и перевода веб-страниц отображаемых пользователю.

@@ -39,7 +39,7 @@ translation_of: Web/Guide/Events
  • обычное событие при нажатии,
  • событие, активированное мышью,
  • событие жеста мышью,
  • -
  • события нажатия на экран и устаревшие экспериментальные события нажания на экран (от Mozilla).
  • +
  • события нажатия на экран и устаревшие экспериментальные события нажатия на экран (от Mozilla).
  • Модификация в структуре веб-страницы или содержании может быть вызвано некоторым событием описанным в mutation events page, но их использование устарело в пользу более легкого Mutation Observer подхода.

    @@ -51,7 +51,7 @@ translation_of: Web/Guide/Events

    Есть много других источников событий, определенных в веб-браузере, страницы которых пока не доступны в данном руководстве.

    -

    Примечание: Это руководство событие Разработчика нуждается в существенной работе.Структура должна быть реорганизована и страницы переписаны. Мы надеемся, что все, что вы знаете и должны знать о событиях будет опубликованно здесь.

    +

    Примечание: Это руководство событие Разработчика нуждается в существенной работе.Структура должна быть реорганизована и страницы переписаны. Мы надеемся, что все, что вы знаете и должны знать о событиях будет опубликовано здесь.

    Docs

    diff --git a/files/ru/web/guide/events/media_events/index.html b/files/ru/web/guide/events/media_events/index.html index 655e71ec61..a3a13cc821 100644 --- a/files/ru/web/guide/events/media_events/index.html +++ b/files/ru/web/guide/events/media_events/index.html @@ -34,7 +34,7 @@ translation_of: Web/Guide/Events/Media_events {{event("emptied")}} - Медиа стало пустым. Например, это событие отправляется, если медиа уже загружено (или частично заргужено), и метод load() был вызван что бы его перезагрузить. + Медиа стало пустым. Например, это событие отправляется, если медиа уже загружено (или частично загружено), и метод load() был вызван что бы его перезагрузить. encrypted {{experimental_inline}} @@ -54,7 +54,7 @@ translation_of: Web/Guide/Events/Media_events interruptend - Отправляется, когда ранее прерванное воспроизвдеение на Firefox OS устройстве продолжает воспроизведение. См. Using the AudioChannels API + Отправляется, когда ранее прерванное воспроизведение на Firefox OS устройстве продолжает воспроизведение. См. Using the AudioChannels API {{event("loadeddata")}} @@ -106,7 +106,7 @@ translation_of: Web/Guide/Events/Media_events {{event("suspend")}} - Отправляется, когда загрузка медиа приостановлена. Это может прозойти как потому, что загрузка была завершена, так и по другим причинам. + Отправляется, когда загрузка медиа приостановлена. Это может произойти как потому, что загрузка была завершена, так и по другим причинам. {{event("timeupdate")}} diff --git a/files/ru/web/guide/events/overview_of_events_and_handlers/index.html b/files/ru/web/guide/events/overview_of_events_and_handlers/index.html index b9f689caa2..0f457ad8b2 100644 --- a/files/ru/web/guide/events/overview_of_events_and_handlers/index.html +++ b/files/ru/web/guide/events/overview_of_events_and_handlers/index.html @@ -4,23 +4,23 @@ slug: Web/Guide/Events/Overview_of_Events_and_Handlers translation_of: Web/Guide/Events/Overview_of_Events_and_Handlers ---
    -

    Эта обзорная статья о событиях и их обработчиках описывает шаблон проектирования кода, который используется для реагирования на события, возникающие, когда браузер получает доступ к web-странице, и содержит подборку типов подобных событий, которые современные брауезеры могут обрабатывать.

    +

    Эта обзорная статья о событиях и их обработчиках описывает шаблон проектирования кода, который используется для реагирования на события, возникающие, когда браузер получает доступ к web-странице, и содержит подборку типов подобных событий, которые современные браузеры могут обрабатывать.

    События и их обработчики представляют собой основную технику в JavaScript для реагирования на события, возникающие, когда браузер получает доступ к web-странице, включая события о подготовке страницы к отображению, взаимодействии с ее содержимым, в зависимости от устройства, на котором браузер был запущен, и многие другие случаи, такие как воспроизведение потоковой медиа-информации или расчет времени анимации.

    -

    События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпановке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остается неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети, скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы, нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи "Неудобные API: Теория DOM", которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.

    +

    События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпоновке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остается неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети, скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы, нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи "Неудобные API: Теория DOM", которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.

    A comparison of the sequential and event-driven browser load sequences.
    -

    Второй подход изменяет последние шаги, переходя от просторого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер еще не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая этот.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.

    +

    Второй подход изменяет последние шаги, переходя от простого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер еще не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая этот.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.

    Шаблон проектирования событий

    Система событий, по своей сути, простой программный шаблон проектирования. Он начинается с соглашения о виде события и:

    @@ -32,13 +32,13 @@ translation_of: Web/Guide/Events/Overview_of_Events_and_Handlers
  • регистрации функции с помощью имени-строки через объект, который будет вызывать событие.
  • -

    Функция считается "слушателем" или "обработчиком", где оба именами взаимнозаменяемы. Этому шаблону можно легко следовать с использованием полностью пользовательского кода, как объяснено в статье о пользовательских событиях. Шаблон так же используется современными web-браузерами, определяющими множество событий, которые вызываются в ответ на пользовательский ввод или активность браузера.

    +

    Функция считается "слушателем" или "обработчиком", где оба именами взаимозаменяемы. Этому шаблону можно легко следовать с использованием полностью пользовательского кода, как объяснено в статье о пользовательских событиях. Шаблон так же используется современными web-браузерами, определяющими множество событий, которые вызываются в ответ на пользовательский ввод или активность браузера.

    -

    Современные браузеры следуют событийному шаблону, используя стандартизированный подход. В качестве структуры данных для свойств события они применяют объект, полученный от объекта EventPrototype. Для регистратрации функции, которая будет обрабатывать эту структуру даных, используется метод, называемый addEventListener, который ожидает в качестве аргумента имя-строку, соответствующую типу события, и функцию-обработчика. В итоге, браузеры определяют огромное число объектов источников событий и широкое разнообразие типов событий, сформированных объектами.

    +

    Современные браузеры следуют событийному шаблону, используя стандартизированный подход. В качестве структуры данных для свойств события они применяют объект, полученный от объекта EventPrototype. Для регистратрации функции, которая будет обрабатывать эту структуру данных, используется метод, называемый addEventListener, который ожидает в качестве аргумента имя-строку, соответствующую типу события, и функцию-обработчика. В итоге, браузеры определяют огромное число объектов источников событий и широкое разнообразие типов событий, сформированных объектами.

    Пример обработчика события кнопки

    -

    К примеру, браузерный элемент button предназначен для вызова события с именем  'click' в ответ на нажатие кнопки мыши или прикосновене пальца к чувствительной части экрана. В HTML мы можем определить  button как:

    +

    К примеру, браузерный элемент button предназначен для вызова события с именем  'click' в ответ на нажатие кнопки мыши или прикосновение пальца к чувствительной части экрана. В HTML мы можем определить  button как:

    <button id="buttonOne">Click here to emit a 'click' event</button>
    @@ -49,7 +49,7 @@ translation_of: Web/Guide/Events/Overview_of_Events_and_Handlers alert("We got a click event at " + ev.timeStamp + " with an argument object derived from: " + objKind ); }; -

    и затем зарегестрировать свою функцию с помощью объекта Button или со стороны скрипта, используя представление DOM (Document Object Model) на HTML-странице:

    +

    и затем зарегистрировать свою функцию с помощью объекта Button или со стороны скрипта, используя представление DOM (Document Object Model) на HTML-странице:

    var buttonDOMElement = document.querySelector('#buttonOne');
     buttonDOMElement.addEventListener('click', example_click_handler);
    @@ -58,7 +58,7 @@ buttonDOMElement.addEventListener('click', example_click_handler);

    {{ EmbedLiveSample('Button_Event_Handler') }}

    -

    Этот код полагается на соглашение о том, что существует некоторый вид события, называемый 'click' , который вызовет все функции-слушатели (или 'обработчи') с объектом-аргументом Event (на данный момент, в этом случае производный от объекта MouseEvent ) и будет запущен после манипуляций пользователя с элементами button на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдет, buttonDOMElement объекта JavaScript вызовет функцию example_click_handler с объектом Event в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту ev, так как тот передается в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.

    +

    Этот код полагается на соглашение о том, что существует некоторый вид события, называемый 'click' , который вызовет все функции-слушатели (или 'обработчик') с объектом-аргументом Event (на данный момент, в этом случае производный от объекта MouseEvent ) и будет запущен после манипуляций пользователя с элементами button на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдет, buttonDOMElement объекта JavaScript вызовет функцию example_click_handler с объектом Event в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту ev, так как тот передается в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.

    Во втором варианте, интегрирован в web-страницу намного более современный JavaScript обернут в событийный вызов функции, чтобы убедиться, что код будет выполнен только тогда, когда HTML будет обработан и доступен для изменения или декорирования. Например, код может быть объявлен так:

    @@ -71,7 +71,7 @@ document.addEventListener('DOMContentLoaded', funcInit);

    так что этот код будет вызван только после того, как объект document вызовет событие 'DOMContentLoaded', потому что HTML был проанализирован и были созданы объекты Javasript,   представляющие каждый узел HTML-документа. Заметим, что в этом примере, код даже не передает аргумент события в функцию, потому что тому никогда не понадобится использовать данные, описанные в нем; скорее, код всего лишь нужно подождать, пока не случится событие.

    -

    Шаблон легко изучить и внедрить. Сложность с событиями возникает из-за необходимости изучить большое разнообразие событий, которые представлены в современных web-браузерах. Так же есть некоторая сложность в понимании, как писать обработчики, так как данный код работает ассинхронно и потенциально может быть вызван несколько раз подряд, но в немного другой ситуации.

    +

    Шаблон легко изучить и внедрить. Сложность с событиями возникает из-за необходимости изучить большое разнообразие событий, которые представлены в современных web-браузерах. Так же есть некоторая сложность в понимании, как писать обработчики, так как данный код работает асинхронно и потенциально может быть вызван несколько раз подряд, но в немного другой ситуации.

    Важные события

    @@ -93,12 +93,12 @@ document.addEventListener('DOMContentLoaded', funcInit);

    Некоторые события, которые стоит отметить:

    -

    Заметка: Этот список событий будет нуждаться в доработке, чтобы соответствовать действительности; эта работа ожидает некоторой глобальной реорганизации в документе. Так же нужно найти хорошее объяснение событий, включая события во время загрузки страницы, таких, как частично описаных в этой статье  или  этом вопросе на  Stack Overflow.

    +

    Заметка: Этот список событий будет нуждаться в доработке, чтобы соответствовать действительности; эта работа ожидает некоторой глобальной реорганизации в документе. Так же нужно найти хорошее объяснение событий, включая события во время загрузки страницы, таких, как частично описанных в этой статье  или  этом вопросе на  Stack Overflow.

    @@ -109,10 +109,10 @@ document.addEventListener('DOMContentLoaded', funcInit);

    Web-браузер определяет множество событий различного вида. Каждое описание включает, как структуру данных, передающуюся в обработчика, объект, который наследуется от объекта EventPrototype.

    -

    Частичная диаграма иерархии класса объекта событий:

    +

    Частичная диаграмма иерархии класса объекта событий:

    -

    Заметка: Эта диаграма неполная.

    +

    Заметка: Эта диаграмма неполная.

    @@ -121,7 +121,7 @@ document.addEventListener('DOMContentLoaded', funcInit);

    Документации

    -

    Три ресурса на MDN (Mozilla Developer Network) частично полезные для программистов, желащих работать с событиями:

    +

    Три ресурса на MDN (Mozilla Developer Network) частично полезные для программистов, желающих работать с событиями: