Как внедрить html-теги в скрипт на Javascript?

#javascript #html #tags

Вопрос:

У меня есть строка, в которую я хотел бы ввести <br> тег на основе значений массива.

Мой html-код:

 'Hello people. `<span>`Hello to everyone`</span>`'; 
<script>
    let array = ['Hello', 'to everyone'];
</script> 

Мне нужно ввести <br> тег между «Привет» и «всем» внутри <span> , основываясь на содержимом массива. Как я могу это сделать, не меняя теги и не влияя на первое слово «Привет»?

Ожидаемый результат:

 'Hello people. `<span>`Hello `<br>` to everyone`</span>`' 

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

1. Пожалуйста, опубликуйте свой html-код

Ответ №1:

Вы должны сделать это, очистив содержимое <span> элемента, а затем выполнить итерацию по массиву с foreach помощью метода, в котором вы добавляете содержимое массива, а затем разрыв строки( <br> ).Вы можете определить разрыв строки с const lineBreak = document.createElement('br'); помощью , а затем добавить его в элемент span с помощью некоторых DOM манипуляций, таких как elem.appendChild(lineBreak)

Вот полный код:

 <head>
  <title>hello world</title>

</head>
<body>
  <p>Hello people. <span id='message'  style="WHITE-SPACE: br">Hello to everyone</span></p>
  <script>
    function split_words(){
      let array = ['Hello', 'to everyone'];
      const elem = document.getElementById('message');
      let result = '';
      const lineBreak = document.createElement('br');
      elem.innerHTML = '';
      array.forEach(word => {
        elem.innerHTML  = word;
        elem.appendChild(lineBreak)
        
      });
    }
    window.onload = split_words(); 
  </script>
</body> 

Ответ №2:

Вы можете просто использовать n или <br/> в тексте. Ваш код будет выглядеть примерно так

 document.write(`Hello people. <span>Hello <br> to everyone</span>`);