dom.html

<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="utf-8" />
  <title>OneScript: работа с DOM</title>
  <style>
    body { font-family: system-ui, sans-serif; margin: 2rem; max-width: 46rem; }
    .card { border: 1px solid #ddd; border-radius: 8px; padding: 1rem; margin: 1rem 0; }
    .активный { background: #e8f0fe; }
  </style>
</head>
<body>
  <h2>OneScript: работа с DOM</h2>
  <p>Код внутри <code>&lt;one-script&gt;</code> создаёт и меняет элементы через объект
     <code>Документ</code>. Вывод <code>Сообщить()</code> по-прежнему идёт в консоль.</p>

  <div id="контейнер"></div>

  <script src="/onescript.js"></script>

  <one-script>
    // Создаём карточку и наполняем её из BSL
    Карточка = Документ.СоздатьЭлемент("div");
    Карточка.Класс = "card";
    Карточка.Идентификатор = "карточка";

    Заголовок = Документ.СоздатьЭлемент("h3");
    Заголовок.Текст = "Список, собранный из BSL";
    Заголовок.ДобавитьВ(Карточка);

    Список = Документ.СоздатьЭлемент("ul");
    Для Инд = 1 По 3 Цикл
      Пункт = Документ.СоздатьЭлемент("li");
      Пункт.Текст = "Пункт " + Инд;
      Пункт.ДобавитьВ(Список);
    КонецЦикла;
    Список.ДобавитьВ(Карточка);

    Кнопка = Документ.СоздатьЭлемент("button");
    Кнопка.Текст = "Выделить карточку";
    Кнопка.ДобавитьВ(Карточка);

    Карточка.ДобавитьВ(Документ.ПолучитьЭлемент("контейнер"));

    // Обработчик наведения/нажатия появится в T47; пока просто выводим в консоль
    сообщить("Карточка собрана, пунктов: " + Список.Дети.Количество());
  </one-script>
</body>
</html>