Блог

Главная - Вопросы по программированию - Как заставить функцию javascript работать в html

Как заставить функцию javascript работать в html

#javascript #html

Вопрос:

У меня есть код в js:

 document.getElementById("collection").innerHTML = `
    <div style="width: 100%; text-align: center" class="mb-4">
    <h1>Collection of ${bottleData.length} bottles</h1>
</div>
${bottleData.map(bottleTemplate).join('')}
`

И хотел бы, чтобы ${bottleData.length} функция работала в HTML.
HTML — код находится здесь: https://github.com/MarvelousMartin/absolut-vodka-collection/blob/master/index.html

Есть ли какой-нибудь способ? Спасибо.

Комментарии:

1. Это должно сработать. Покажите полный код, включая способ bottleData установки.

2. можете ли вы поделиться HTML своим кодом, чтобы мы могли помочь.

3. Литералы шаблонов не создают живые функции. Когда длина bottleData изменится, HTML не изменится автоматически. Он просто использует значение bottleData.length в то время, когда вы его назначаете.

4. bottleData это просто const набор в JS, который включает в себя JSON.

Ответ №1:

В вашем index.html файл должен быть список событий, чтобы функция работала в html.

Предположим, у вас есть кнопка и вы хотите, чтобы функция работала при нажатии

HTML :

 <button onclick="Test()">Event Listener in HTML</button>
<script src="Path_to_your_script_file"></script>

JS :

 function Test() {
    document.write("<h1>HTML code can be written Inside Js like this</h1>")
    document.write("<h1>HTML can be written inside document.write('') in Js</h1>")
 }

Дополнительную информацию смотрите в разделе Codepen

Метки: