Hipotetycznie załóżmy, że mam tablicę o nazwie „owoce”, która zawiera różne owoce. Coś, co wygląda tak:

var fruits = ["bannanna", "apple", "orange", "grapes"]

Chcę utworzyć element h1 z każdą z nazw w tablicy. Jak mam to zrobic?

-1
Ved Tiwari 3 kwiecień 2020, 01:35

3 odpowiedzi

Najlepsza odpowiedź

Zapętl elementy i użyj insertAdjacentHTML, aby dodać element do treści lub gdziekolwiek chcesz go dodać.

var fruits = ["bannanna", "apple", "orange", "grapes"]

fruits.forEach(item => document.body.insertAdjacentHTML('beforeend', `<h1>${item}</h1>`))
2
Get Off My Lawn 2 kwiecień 2020, 22:40

Możesz to zrobić przez forEach.

<div id="generate-h1"></div>

var fruits = ["bannanna", "apple", "orange", "grapes"]

// Create any HTML Element to put H1 Tags into this HTML Tag
var main = document.createElement('main');

// Create H1 items for each fruits
// Append it to the main Tag or whatever you have.
fruits.forEach(function (fruits) {
    var headline = document.createElement('h1');
    headline.textContent = fruits;
    main.appendChild(headline);
});


// Inject into the DOM
var app = document.querySelector('#generate-h1');
app.appendChild(main);


0
Oğuz Akankan 2 kwiecień 2020, 22:51

Dobra, spróbuj tego, jestem pewien, że to zadziała:

    <!DOCTYPE html>
<html lang="en">
  <head>
    <title>Try This</title>
  </head>
  <body>
    <h1 id="fruit"></h1>
    <script>
      var fruits = ["bannanna", "apple", "orange", "grapes"];
      var text = "";
      var i;
      for (i = 0; i < fruits.length; i++) {
        text += fruits[i] + "<br>";
      }
      document.getElementById("fruit").innerHTML = text;
    </script>
  </body>
</html>
0
kheman garg 2 kwiecień 2020, 22:58