На codepen.io сейчас для работы с Jade используется новый синтаксис Pug, поэтому буду отвечать именно по этому синтаксису. В Pug есть возможность получить доступ к JavaScript переменным.
Pug – это шаблонизатор, который поддерживает встраивание JavaScript кода непосредственно в шаблон. Для доступа к JavaScript переменным в Pug можно использовать интерполяцию.
Для этого нужно поставить знак "=" перед переменной или выражением, которое вы хотите использовать:
- var name = 'John'
h1= `Hello, ${name}!`
В приведенном примере переменная "name" содержит значение "John", а в элементе "h1" с помощью интерполяции выводится фраза "Hello, John!".
Также можно использовать блоки кода JavaScript, используя специальный символ "-":
- var users = ['John', 'Kate', 'Alex']
ul
each user in users
li= user
В этом примере переменная "users" содержит список имен пользователей, а с помощью блока кода JavaScript и цикла "each" значения элементов списка выводятся в элементе "li".
Благодаря таким возможностям в Pug можно использовать JavaScript переменные, передавать их значения в шаблон и встраивать в нужные места.
Кроме того, Pug также поддерживает условные операторы, циклы, функции и другие конструкции JavaScript, чтобы обеспечить более гибкую и мощную динамическую генерацию контента.