Конструктор HTML, CSS и javascript

11.01.25

Разработка - Инструментарий разработчика

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

Скачать файл

ВНИМАНИЕ: Файлы из Базы знаний - это исходный код разработки. Это примеры решения задач, шаблоны, заготовки, "строительные материалы" для учетной системы. Файлы ориентированы на специалистов 1С, которые могут разобраться в коде и оптимизировать программу для запуска в базе данных. Гарантии работоспособности нет. Возврата нет. Технической поддержки нет.

Наименование По подписке [?] Купить один файл
Конструктор HTML, CSS и javascript
.epf 14,38Kb ver:1.0
173
173 Скачать (3 SM) Купить за 2 450 руб.



Как работать

Пользовательский интерфейс обработки состоит из трех блоков, слева направо:

 • Иерархия элементов HTML в виде дерева;

 • Область редактирования текущего (выделенного в дереве) элемента;

 • Просмотр результата.

Состав и структуру элементов программист определяет сам. Предполагается, что одним элементом в иерархии является узел (тег HTML), однако это не является обязательным правилом. К примеру, все функции JS или несколько логически взаимосвязанных можно поместить в один элемент иерархии. Точно так же и с CSS.

Пример работы

Выведем веселенькую анимацию.

1. Разносим следующую заготовку страницы в обработке так, как на картинке:

<!DOCTYPE html>
<HTML>
	<style type="text/css">
	</style>
	<body>
	</body>
	<script type="text/javascript">
	</script>
</HTML>



2. Выделим строку с объявлением стилей (<style...), нажмем кнопку "Внутрь" и в содержимое вставим следующий текст со стилями CSS:

 
 CSS


 

3. Выделим строку с телом HTML (<body>), нажмем кнопку "Внутрь", в поле "Тег и его свойства" вставим <div class="aquarium"> а в поле "содержимое" - все блоки div:

 
 div's

 

 

Готово. Нажимаем кнопку "Сформировать" и любуемся демонстрационной анимацией.

 

Обработкой удобно отлаживать вызов функций javascript из встроенного языка платформы 1С и наоборот, вызов процедур и функций 1С из странички html с javascript.

 

Проверено на платформе 8.3.21.1709 (64), но будет работать на всех версиях платформы 8.3.

 

Смотрите и другие мои публикации - делаю удобные инструменты для работы.

Обработка 1С HTML CSS Javascript инструменты разработки web-разработка

См. также

Инструментарий разработчика Роли и права Запросы СКД Программист Руководитель проекта Платформа 1С v8.3 Управляемые формы Запросы Система компоновки данных Платные (руб)

Инструменты для разработчиков 1С 8.3: Infostart Toolkit. Автоматизация и ускорение разработки на управляемых формах. Легкость работы с 1С.

15500 руб.

02.09.2020    186895    1044    403    

976

Инструментарий разработчика Чистка данных Свертка базы Инструменты администратора БД Системный администратор Программист Руководитель проекта Платформа 1С v8.3 1С:ERP Управление предприятием 2 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 1С:Комплексная автоматизация 2.х 1С:Управление нашей фирмой 3.0 Россия Платные (руб)

Инструмент представляет собой обработку для проведения свёртки или обрезки баз данных. Работает на ЛЮБЫХ конфигурациях (УТ, БП, ERP, УНФ, КА и т.д.). Поддерживаются серверные и файловые базы, управляемые и обычные формы. Может выполнять свертку одновременно в несколько потоков. А так же автоматически, без непосредственного участия пользователя. Решение в Реестре отечественного ПО

8400 руб.

20.08.2024    26077    170    88    

166

Пакетная печать Печатные формы Инструментарий разработчика Программист Платформа 1С v8.3 Запросы 1С:Зарплата и кадры бюджетного учреждения 1С:ERP Управление предприятием 2 1С:Управление торговлей 11 Платные (руб)

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

22200 руб.

06.10.2023    20865    55    19    

86

Инструменты администратора БД Инструментарий разработчика Роли и права Программист Платформа 1С v8.3 1C:Бухгалтерия Россия Платные (руб)

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

15000 руб.

10.11.2023    14014    60    33    

79

Инструментарий разработчика Программист Платформа 1С v8.3 Платные (руб)

Инструмент для написания и отладки кода в режиме «1С:Предприятие». Представляет собой консоль кода с возможностью пошаговой отладки, просмотра значений переменных любых типов, использования процедур и функций, просмотра стека вызовов, вычисления произвольных выражений на встроенном языке в контексте точки останова, синтаксического контроля и остановки по ошибке. В консоли используется удобный редактор кода с подсветкой, контекстной подсказкой, возможностью вызова конструкторов запроса и форматной строки.

9360 руб.

17.05.2024    31062    107    48    

149

Работа с интерфейсом Анализ учета Мониторинг Платформа 1С v8.3 8.3.14 1C:Бухгалтерия 1С:ERP Управление предприятием 2 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 Платные (руб)

Создайте свой функциональный интерфейс в любой конфигурации 1С с помощью подсистемы "Инфоборды". Настраивайте панели виджетов с метриками, индикаторами и показателями на начальном экране. Подсистема реализована в форме расширения 1С.

9600 руб.

27.03.2025    1084    3    5    

8

Инструментарий разработчика Программист 8.3.14 Россия Платные (руб)

Расширение для конфигурации “Конвертация данных 3”. Добавляет подсветку синтаксиса, детальную контекстную подсказку, глобальный поиск по коду.

20000 руб.

07.10.2021    19295    8    32    

43
Отзывы
24. adhocprog 1144 29.04.23 01:04 Сейчас в теме
Ниже добавил вариант css и html для тех, кому ближе велосипед )
Прикрепленные файлы:
Css2.txt
Div2.txt
shusha9951; DrAku1a; acces969; +3 Ответить
22. adhocprog 1144 29.04.23 00:53 Сейчас в теме
Потратил 20 минут, но взлетело )
Прикрепленные файлы:
acces969; +1 Ответить
Остальные комментарии
Подписаться на ответы Инфостарт бот Сортировка: Древо развёрнутое
Свернуть все
1. ubnkfl 10.04.23 22:36 Сейчас в теме
Используете ли вы свой механизм в реальной работе? Можете показать примеры, когда это нужно?
acces969; +1 Ответить
3. acces969 373 11.04.23 08:31 Сейчас в теме
(1) Постоянно. Особенно при разработке мобильных приложений - там все на веб-страницах. Потому и написал этот инструмент. К сожалению, показывать их я не могу.
Прикрепленные файлы:
DrAku1a; adhocprog; ubnkfl; +3 1 Ответить
14. maksa2005 369 12.04.23 07:05 Сейчас в теме
30. acvatoris 563 04.08.23 14:22 Сейчас в теме
Добрый день. Вы говорите, что разрабатываете мобильные приложения в html, js. Скажите, я правильно вам понимаю, что вы при разработке мобильных приложений используйте технологическую платформу 1С, но верстаете страницы в html и навешиваете обработчики js? Если это так, то меня интересует быстродействие таких приложений. А так же не возникает ли при эксплуатации такого рода приложений каких либо непонятных моментов, например приложение просто закрылось.
Я написал с десяток несколько мобильных приложений на платформе 1С, но я не использовал веб. Но когда я открыл для себя flutter, то полностью перешел на него, это было в 2020 году. Ни на секунду об этом не жалею. (Агитирую вас поэкспериментировать с ним. :))
2. maksa2005 369 11.04.23 07:02 Сейчас в теме
Лично я красивый интерфейс для мобилки делал через dw
5. pyrkin_vanya 498 11.04.23 09:52 Сейчас в теме
(2)любопытна эта тема. Можно чуть точнее? Через что делали? Что такое dw?
7. maksa2005 369 11.04.23 10:00 Сейчас в теме
(5)через Adobe DreamWeaver мне удобнее чем через 1с.
Написано 3 успешных проекта с использованием js+html5+css. Посмотрите в гугле плей: Мастерок86 ,а там уже в разделе Автора)
adhocprog; pyrkin_vanya; +2 Ответить
11. Созинов 11.04.23 20:12 Сейчас в теме
(7) интересно было узнать, что DW еще жив. Пользовался им лет 15 назад.
13. maksa2005 369 12.04.23 07:04 Сейчас в теме
(11)жив не жив. не важно. мне удобно там)
15. Созинов 12.04.23 07:31 Сейчас в теме
(13)
(13)я без наезда, каждый выбирает свой инструмент. Интересно было узнать, что он развивается. Свои задачи он решает и решает хорошо.
maksa2005; +1 Ответить
19. maxrubtsoff 20 16.04.23 16:30 Сейчас в теме
(7) ваш мастерок какая то шляпа, это вы называете успешный проект? скачал, но зарегистрироваться не даёт, в настройках доступна отладка, сразу при открытии нужен доступ к файлам
20. maksa2005 369 16.04.23 19:22 Сейчас в теме
(19)шляпа это то что у вас на плечах, а проект был под заказчика. И правильно что Вас и не пустил)
4. sandr13 35 11.04.23 08:33 Сейчас в теме
Идеи интересные. Спасибо!
acces969; +1 Ответить
6. acces969 373 11.04.23 09:55 Сейчас в теме
Интересно - как сделал обработку бесплатной, так все переставили ставить плюсики)
torbeev; av_kuznetsov; cheshirshik; +3 Ответить
8. cheshirshik 74 11.04.23 10:25 Сейчас в теме
(6) плюсик поставил. Не переживай. Ещё минус влепить могут.
acces969; +1 Ответить
9. arsvlg 11.04.23 11:03 Сейчас в теме
Большое спасибо!
Тоже сейчас размышляем на тему рисования мобильных форм.
Созинов; acces969; +2 Ответить
10. akR00b 24 11.04.23 16:45 Сейчас в теме
12. kirill_sh 2 11.04.23 21:57 Сейчас в теме
Классная тема, плюс автору в карму :)
acces969; +1 Ответить
16. Matveev_VS 167 12.04.23 09:32 Сейчас в теме
Отличная идея, интересно. Спасибо)
acces969; +1 Ответить
17. JohnyDeath 302 14.04.23 09:57 Сейчас в теме
Непонятно самое главное: откуда берутся все эти CSS и скрипты?
Надо гуглить в определенном месте? По каким ключевым словам?
18. acces969 373 15.04.23 10:58 Сейчас в теме
(17) Да, все гуглить - там ничего сложного нет, если начинать делать свое с нуля.
21. Viktor_Ermakov 375 17.04.23 15:18 Сейчас в теме
Я так и не понял чем этот инструмент облегчает работу, есть например
https://codepen.io/
Там можно сверстать страницу так же, и посмотреть.
Какую именно дополнительную пользу дает инструмент?
d4rkmesa; manuel; BomjBandit; +3 Ответить
25. acces969 373 02.05.23 08:08 Сейчас в теме
(21) тем, что создаваемая страничка нацелена на работу с 1С, и разрабатывать, проверять ее удобно тут же, в 1С. Это позволяет, помимо прочего, решить два важных вопроса:
1. Как web-станичка нарисуется и будет работать в 1С, а не в обычных веб-браузерах
2. Отладить взаимодействие и обмен данными, вызов функций между js и исполняемым кодом 1С.
Касаемое второго пункта замечу, что сейчас такого функционала в обработке нет, но я планирую его добавить в будущем. Сейчас же, тот, кому это нужно, может сам добавить этот функционал в обработку так, как ему удобно.
26. Viktor_Ermakov 375 02.05.23 18:14 Сейчас в теме
(25)
Касаемое второго пункта замечу, что сейчас такого функционала в обработке нет, но я планирую его добавить в будущем. Сейчас же, тот, кому это нужно, может сам добавить этот функционал в обработку так, как ему удобно.

Идею понял, спасибо за ответ.
22. adhocprog 1144 29.04.23 00:53 Сейчас в теме
Потратил 20 минут, но взлетело )
Прикрепленные файлы:
acces969; +1 Ответить
23. adhocprog 1144 29.04.23 00:54 Сейчас в теме
(0) Когда выйдет релиз с кнопками Сохранить/Открыть? )
24. adhocprog 1144 29.04.23 01:04 Сейчас в теме
Ниже добавил вариант css и html для тех, кому ближе велосипед )
Прикрепленные файлы:
Css2.txt
Div2.txt
shusha9951; DrAku1a; acces969; +3 Ответить
27. Viktor_Ermakov 375 02.05.23 18:19 Сейчас в теме
А не сравнивали свой инструмент и вот расширение https://github.com/cpr1c/tools_ui_1c ?
Там помимо разнообразных возможностей есть так же редактор HTML.
28. ip0593 20 10.05.23 13:25 Сейчас в теме
а каким редактором/сервисов для создания html и css пользуетесь?
29. Viktor_Ermakov 375 06.07.23 13:43 Сейчас в теме
(28) я исключительно VSC, оттуда переношу уже в например макет текстовый, а его уже подсовываю в HTML поле.
31. Светлый ум 455 28.08.23 11:48 Сейчас в теме
а для XML / JSON есть такие конструкторы ?
Оставьте свое сообщение