Блог

Главная - Вопросы по программированию - JavaScript добавляет HTML в цикл для

JavaScript добавляет HTML в цикл для

#javascript #html #for-loop #append

Вопрос:

в следующем фрагменте у меня есть цикл for и я хочу добавлять HTML-код в каждой итерации, чтобы использовать список внутри моего ul-тега. Если я заменю = оператором=, это сработает, но, очевидно, только для последнего элемента. Как я могу правильно добавить его в цикл?

     var text = "the Text"
    var list
    for (var i = 1; i < split_respone.length; i =2) {
      list  = <li className="link-list-item">
            <a
            href={split_respone[i]}
            target="_blank"
            rel="noopener noreferrer"
            className="link-list-item-url">
            {split_respone[i 1]}</a>
            </li>
    }
    string = <ul className="link-list">{text}{list}</ul>;
  } 
  const message = self.createChatBotMessage(string);
});
}

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

1. Вы должны ввести list в пустую строку: var list = ""; . Вам также нужно поместить обратные метки вокруг строк шаблона.

2. Что }); вы делаете и } делаете в конце?

3. но теперь мой список представляет собой строку и печатается в моем интерфейсе. Мне нужен HTML-объект, чтобы он не печатал строку, а показывал список.

4. То, что вы делаете с результирующей строкой, — это другая проблема.

5. Вы должны назначить его для .innerHTML DIV.

Ответ №1:

Вы должны установить «список» в пустую строку, чтобы он работал. Кроме того, поскольку вы объединяете строки, вам необходимо заключить HTML-код в кавычки. (Вы также можете использовать `)

     var text = "the Text"
    var list = "";
    for (var i = 1; i < split_respone.length; i =2) {
      list  = '<li className="link-list-item">
            <a
            href={split_respone[i]}
            target="_blank"
            rel="noopener noreferrer"
            className="link-list-item-url">
            {split_respone[i 1]}</a>
            </li>'
    }
    string = <ul className="link-list">{text}{list}</ul>;
  } 
  const message = self.createChatBotMessage(string);
});

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

1. но теперь мой список представляет собой строку и печатается в моем интерфейсе. Мне нужен HTML-объект, чтобы он не печатал строку, а показывал список.

2. @reBo137 Не могли бы вы попробовать использовать ` вместо «?

3. Я нашел решение. Я инициализировал свой список как list = [] и изменил оператор = на list.push(html_code без «» или «)

Метки: