Что такое DOM в 1С и как с ним работать

DOM (Document Object Model, объектная модель документа) в контексте 1С — это программное представление HTML-документа, загруженного в элемент формы «Поле HTML-документа». Через DOM разработчик получает доступ к структуре страницы: тегам, атрибутам, тексту, формам — и может читать или изменять их прямо из встроенного языка 1С, без JavaScript.

Такая возможность нужна, когда в интерфейс конфигурации встраивают HTML-страницу: карту, отчёт с интерактивной графикой, форму обратной связи, веб-клиент внешнего сервиса. Платформа 1С формирует дерево объектов документа, и каждый узел этого дерева доступен как объект со свойствами и методами.

Важно понимать: DOM в 1С — это не отдельная технология платформы, а стандартная объектная модель браузера, к которой 1С даёт доступ через свой объектный интерфейс. Работа ведётся через свойство Документ элемента формы, дальше используются привычные веб-разработчикам методы вроде getElementById.

Где в 1С встречается DOM и зачем он нужен

DOM появляется в работе разработчика 1С в одном основном сценарии — при использовании элемента формы «Поле HTML-документа» (в управляемых формах — реквизит формы с видом «Поле HTML документа»). В это поле загружается HTML-страница: из строки, из файла, из макета или по URL. Как только документ загружен, платформа строит его объектную модель.

Типовые задачи, где без DOM не обойтись: подстановка данных из базы 1С в HTML-шаблон перед показом пользователю, чтение значений, которые пользователь ввёл в HTML-форму, обработка кликов по ссылкам и кнопкам страницы, динамическое изменение оформления (подсветка строк, скрытие блоков), взаимодействие с JavaScript-кодом страницы.

Без доступа к DOM пришлось бы каждый раз заново формировать весь HTML-текст и перезагружать страницу целиком. Объектная модель позволяет точечно менять отдельные узлы, что быстрее и не сбрасывает состояние страницы — например, позицию прокрутки или введённые пользователем данные в других полях.

Как устроена объектная модель документа

DOM представляет HTML-документ в виде дерева узлов. Корневой объект — сам документ, у него есть элемент html, внутри него head и body, а дальше — вложенные элементы: таблицы, абзацы, ссылки, поля ввода. Каждый узел имеет родителя, может иметь дочерние узлы и соседние элементы.

В 1С узлы дерева доступны как объекты со стандартными свойствами: id, className, innerHTML, innerText, value (для полей ввода), style и другие. Набор свойств соответствует объектной модели браузера, на движке которого работает поле HTML-документа в данной версии платформы — исторически это был Internet Explorer, в современных версиях используется WebKit.

Отличие от «чистого» браузерного JavaScript в том, что обращение идёт из кода 1С, поэтому применяется синтаксис встроенного языка: русские или английские имена методов платформа принимает, но вызовы оформляются как обычные вызовы методов объектов 1С, а результат возвращается в переменные встроенного языка.

Как получить доступ к элементам страницы

Точка входа — свойство Документ поля HTML-документа. От него вызываются методы поиска элементов. Самый надёжный способ — поиск по уникальному идентификатору: Документ.getElementById("ИмяЭлемента"). Если идентификатора нет, используют getElementsByTagName (возвращает коллекцию элементов по имени тега) или getElementsByName.

Коллекции, которые возвращают эти методы, перебираются по индексу: первый элемент имеет индекс 0, количество элементов доступно через свойство length. Это частый источник ошибок у начинающих: метод возвращает не один элемент, а коллекцию, даже если элемент один.

// Пример: подстановка текста в элемент страницы
Элемент = Элементы.ПолеHTML.Документ.getElementById("Заголовок");
Если Элемент <> Неопределено Тогда
Элемент.innerText = "Отчёт сформирован";
КонецЕсли;

1. 1
   Добавьте на форму поле HTML-документа и загрузите в него страницу
2. 2
   Дождитесь события ДокументСформирован или завершения загрузки
3. 3
   Получите объект документа через свойство Документ
4. 4
   Найдите элемент через getElementById или getElementsByTagName
5. 5
   Проверьте, что элемент найден (не Неопределено), и работайте с его свойствами

Перед обращением к элементу всегда проверяйте, что он найден. Если страница ещё не загрузилась или идентификатор указан с ошибкой, метод вернёт пустое значение, и попытка обратиться к свойству приведёт к ошибке выполнения.

Чтение и изменение содержимого элементов

Для изменения текстового содержимого используются свойства innerText (только текст без тегов) и innerHTML (фрагмент HTML, который будет разобран и вставлен в дерево). Присваивание нового значения innerHTML фактически перестраивает часть DOM — это удобно для вставки сформированных блоков, но уничтожает старые узлы вместе с привязанными к ним данными.

Для полей ввода (input, textarea) значение читается и устанавливается через свойство value. Для ссылок доступен href, для изображений — src. Атрибуты без отдельного свойства читаются и пишутся методами getAttribute и setAttribute.

Оформление меняется через объект style: например, Элемент.style.display = "none" скрывает элемент, а изменение style.backgroundColor подсвечивает строку. Имена CSS-свойств записываются в camelCase: fontSize вместо font-size.

Коллекция = Документ.getElementsByTagName("input");
Для Инд = 0 По Коллекция.length - 1 Цикл
    Поле = Коллекция.item(Инд);
    Если Поле.type = "text" Тогда
        Поле.value = "";
    КонецЕсли;
КонецЦикла;

События: как отреагировать на действия пользователя

Поле HTML-документа поддерживает события, возникающие при взаимодействии пользователя со страницей. Ключевое событие в управляемых формах — «ПриНажатии»: оно срабатывает при клике по ссылке или элементу, и в обработчик передаются данные о событии, включая элемент, по которому кликнули, и возможность отменить стандартное действие (например, переход по ссылке).

Типовой приём: на HTML-странице размещают ссылки со специальными href вида data:... или с понятными идентификаторами, а в обработчике события анализируют, по какой ссылке кликнули, и выполняют логику 1С — открытие документа, запуск отчёта, переход к справочнику. Так HTML-страница становится полноценным элементом интерфейса конфигурации.

Отдельно нужно отслеживать завершение загрузки документа. Обращаться к DOM до того, как страница загружена, нельзя — объект документа будет пустым или неполным. В обычных формах для этого служит событие «ДокументСформирован», в управляемых формах следует ориентироваться на событие завершения загрузки поля HTML-документа.

Ограничения и отличия от браузерного DOM

Объектная модель в 1С зависит от движка отображения, который использует платформа на конкретной операционной системе. Набор поддерживаемых возможностей HTML и CSS может отличаться от современных браузеров: сложная вёрстка, новые стандарты CSS и часть JavaScript-API могут работать иначе или не работать вовсе. Перед использованием нестандартных приёмов страницу стоит проверять именно в клиенте 1С, а не только в браузере.

Второе ограничение — кроссплатформенность. Поведение поля HTML-документа может различаться между Windows и Linux-клиентами, а также между тонким и веб-клиентом. Если конфигурация должна работать в веб-клиенте, взаимодействие с DOM требует отдельной проверки: часть сценариев там реализуется иначе.

Третий момент — производительность. Каждое обращение из кода 1С к объекту DOM — это межпроцессное взаимодействие с движком отображения. Массовые операции в цикле (например, обход тысяч строк таблицы с изменением каждой ячейки) выполняются заметно медленнее, чем аналогичный JavaScript внутри страницы. Для тяжёлых операций эффективнее сформировать HTML целиком или выполнить скрипт на стороне страницы.

Типичные ошибки при работе с DOM в 1С

Самая распространённая ошибка — обращение к элементам до загрузки документа. Симптом: код «иногда работает, иногда падает», потому что загрузка страницы асинхронна. Лечение — перенос логики в обработчик события завершения загрузки.

Вторая группа ошибок связана с коллекциями: разработчик пишет getElementsByTagName("table").innerText и получает ошибку, потому что метод вернул коллекцию, а не элемент. Нужно явно брать элемент по индексу: .item(0) или обращение по индексу коллекции.

Третья типичная проблема — ожидание, что изменения DOM сохранятся при перерисовке формы. Если страница перезагружается (например, при повторной установке текста поля), все изменения, внесённые через DOM, теряются. Состояние нужно хранить в данных формы и восстанавливать после загрузки.

Когда DOM не нужен: альтернативные подходы

Не каждая задача требует работы с объектной моделью. Если HTML-страница статична и формируется целиком на сервере, проще сгенерировать текст страницы в коде 1С (например, через текстовый шаблон с подстановкой параметров) и загрузить его в поле одним присваиванием. Это надёжнее и быстрее, чем точечная правка дерева элементов.

Если страница содержит собственный JavaScript, часть логики разумно оставить на стороне страницы: пусть скрипт сам обновляет содержимое, а 1С лишь передаёт ему данные и получает результаты через события. Такой вариант снижает количество обращений к DOM из встроенного языка и улучшает отзывчивость интерфейса.

Проверка результата и отладка

Отладка кода, работающего с DOM, ведётся стандартными средствами конфигуратора: точки останова в обработчиках событий поля HTML-документа, просмотр значений переменных. Объект документа и его элементы отображаются в табло как COM-объекты — их внутреннюю структуру удобно изучать через вычисление выражений, например Документ.body.innerHTML, чтобы увидеть фактическую разметку.

Полезный приём — временно вывести весь HTML документа в сообщение или в текстовый файл и проверить, что идентификаторы элементов совпадают с теми, к которым обращается код. Расхождение регистра или лишний пробел в id — частая причина «невидимых» ошибок, когда элемент формально существует, но не находится.

Частые вопросы