Skip to content

Template element #346

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 2 commits into from
Closed

Conversation

Lelihelija
Copy link
Contributor

No description provided.

@CLAassistant
Copy link

CLAassistant commented Jun 13, 2022

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.
1 out of 2 committers have signed the CLA.

✅ Lelihelija
❌ Olha Borysenko


Olha Borysenko seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account.
You have signed the CLA already but the status is still pending? Let us recheck it.

@dolgachio dolgachio added the in progress Translation in progress label Jun 27, 2022
Copy link
Collaborator

@dolgachio dolgachio left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Дякую за чудовий переклад! Будь ласка, подивіться мої коментарі і підпишіть CLA agreement :) Якщо будуть питання, напишіть мені :)


First, its content can be any valid HTML, even if it normally requires a proper enclosing tag.
По-перше, він може містити у собі будь-який коректний HTML, навіть якщо за звичайних умов він би потребував належного закриваючого тега.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
По-перше, він може містити у собі будь-який коректний HTML, навіть якщо за звичайних умов він би потребував належного закриваючого тега.
По-перше, він може містити у собі будь-який коректний HTML, навіть якщо за звичайних умов він би потребував якогось додаткового тега.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

</script>
</template>
```

The browser considers `<template>` content "out of the document": styles are not applied, scripts are not executed, `<video autoplay>` is not run, etc.
Браузер розглядає вміст тега `<template>` як такий, який є "за межами документа": до нього не застосовуються стилі, не виконуються скрипти, `<video autoplay>` не запускається і тому подібне.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Браузер розглядає вміст тега `<template>` як такий, який є "за межами документа": до нього не застосовуються стилі, не виконуються скрипти, `<video autoplay>` не запускається і тому подібне.
Браузер розглядає вміст тега `<template>` як такий, який існує "за межами документа": до нього не застосовуються стилі, не виконуються скрипти, `<video autoplay>` не запускається і тому подібне.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done


## Inserting template
## Вставлення шаблону
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
## Вставлення шаблону
## Вставка шаблону

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done


The template content is available in its `content` property as a [DocumentFragment](info:modifying-document#document-fragment) -- a special type of DOM node.
Вміст шаблону контенту за зверненням до його властивості `content`, оскільки [DocumentFragment](info:modifying-document#document-fragment) -- це спеціальний тип вузла DOM.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Вміст шаблону контенту за зверненням до його властивості `content`, оскільки [DocumentFragment](info:modifying-document#document-fragment) -- це спеціальний тип вузла DOM.
Вміст template доступний у його властивості `content` як [DocumentFragment](info:modifying-document#document-fragment) -- спеціальний тип вузла DOM.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done


We can treat it as any other DOM node, except one special property: when we insert it somewhere, its children are inserted instead.
Ми можемо працювати з ним як зі всіма іншими вузлами DOM, за винятком однієї особливості: використовуючи його будь-де, ми отримуємо вкладені всередину дочірні елементи, а не сам по собі тег.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Ми можемо працювати з ним як зі всіма іншими вузлами DOM, за винятком однієї особливості: використовуючи його будь-де, ми отримуємо вкладені всередину дочірні елементи, а не сам по собі тег.
Ми можемо працювати з ним як зі всіма іншими вузлами DOM, за винятком однієї особливості: коли ми його кудись вставляємо, вставляються його дочірні елементи, а не він сам.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done


The `<template>` tag is quite unique, because:
Тег `<template>` є досить унікальний, оскільки:
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Тег `<template>` є досить унікальний, оскільки:
Тег `<template>` є унікальниv, оскільки:

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

changed to унікальним
done

- The browser checks HTML syntax inside it (as opposed to using a template string inside a script).
- ...But still allows use of any top-level HTML tags, even those that don't make sense without proper wrappers (e.g. `<tr>`).
- The content becomes interactive: scripts run, `<video autoplay>` plays etc, when inserted into the document.
- Браузер перевіряє HTML синтаксис всередині нього (на противагу використанню шаблону рядка всередині скрипта).
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
- Браузер перевіряє HTML синтаксис всередині нього (на противагу використанню шаблону рядка всередині скрипта).
- Браузер перевіряє HTML синтаксис всередині нього (на відміну від рядка всередині скрипта з тією ж розміткою).

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

- ...But still allows use of any top-level HTML tags, even those that don't make sense without proper wrappers (e.g. `<tr>`).
- The content becomes interactive: scripts run, `<video autoplay>` plays etc, when inserted into the document.
- Браузер перевіряє HTML синтаксис всередині нього (на противагу використанню шаблону рядка всередині скрипта).
- ...Але все одно дозволяє використання будь-якого високорівневого тега HTML, навіть тих, використання яких не має сенсу без відповідного обгортання (напр. `<tr>`).
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
- ...Але все одно дозволяє використання будь-якого високорівневого тега HTML, навіть тих, використання яких не має сенсу без відповідного обгортання (напр. `<tr>`).
- ...Але все одно дозволяє використання будь-якого тега HTML, навіть тих, використання яких не має сенсу без відповідної обгортки (напр. `<tr>`).

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

- The content becomes interactive: scripts run, `<video autoplay>` plays etc, when inserted into the document.
- Браузер перевіряє HTML синтаксис всередині нього (на противагу використанню шаблону рядка всередині скрипта).
- ...Але все одно дозволяє використання будь-якого високорівневого тега HTML, навіть тих, використання яких не має сенсу без відповідного обгортання (напр. `<tr>`).
- Вміст стає інтерактивним: виконуються скрипти, запускається `<video autoplay>` і т. ін., коли він поміщається у документ.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
- Вміст стає інтерактивним: виконуються скрипти, запускається `<video autoplay>` і т. ін., коли він поміщається у документ.
- Вміст стає інтерактивним: виконуються скрипти, запускається `<video autoplay>` і т. ін., коли ми переміщаємо його у документ.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done


The `<template>` element does not feature any iteration mechanisms, data binding or variable substitutions, but we can implement those on top of it.
Елемент `<template>` не має жодних механізмів ітерації, зв’язування даних чи заміни змінних, але ми можемо їх реалізувати для до нього.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Елемент `<template>` не має жодних механізмів ітерації, зв’язування даних чи заміни змінних, але ми можемо їх реалізувати для до нього.
Елемент `<template>` не має жодних механізмів ітерації, зв’язування даних чи заміни змінних, але ми можемо реалізувати їх поверх нього.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

@Lelihelija Lelihelija closed this Jun 28, 2022
@Lelihelija Lelihelija mentioned this pull request Jun 28, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
in progress Translation in progress review needed
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants