假設(shè)，假設(shè)我有一個(gè)名為“fruits”的數(shù)組，其中包含不同的水果?？雌饋硐襁@樣的東西：var fruits = ["bannanna", "apple", "orange", "grapes"]我想用數(shù)組中的每個(gè)名稱創(chuàng)建一個(gè) h1 元素。我該怎么做呢？
3 回答
不負(fù)相思意
TA貢獻(xiàn)1777條經(jīng)驗(yàn) 獲得超10個(gè)贊
循環(huán)項(xiàng)目，并使用insertAdjacentHTML將項(xiàng)目添加到正文或您想要添加的任何位置。
var fruits = ["bannanna", "apple", "orange", "grapes"]
fruits.forEach(item => document.body.insertAdjacentHTML('beforeend', `<h1>${item}</h1>`))
偶然的你
TA貢獻(xiàn)1841條經(jīng)驗(yàn) 獲得超3個(gè)贊
你可以通過 forEach 來做到這一點(diǎn)。
<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);
狐的傳說
TA貢獻(xiàn)1804條經(jīng)驗(yàn) 獲得超3個(gè)贊
好吧，試試這個(gè)，我相信這會(huì)起作用：
<!DOCTYPE html>
<html>
<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>
- 3 回答
- 0 關(guān)注
- 190 瀏覽
添加回答
舉報(bào)
0/150
提交
取消