我正在尝试用CSS和JavaScript创建一个netflix类型的效果，其中的东西显示在使用flexbox的轮播上，并试图将flex项目添加到使用JavaScript的容器中，因为我使用API来获取数据，所以永远不知道将有多少元素，但没有它与JavaScript一起工作。
const container = document.getElementById("container");
var newDiv = document.createElement("div");
newDiv.className = "item";
var arr = ["1","1","1"];
const map = arr.map(x => {return `<div>${x}</div>`});
console.log(map)
map.forEach(function(element){
newDiv.innerHTML = element;
container.append(newDiv)
});
容器有container类，额外的div有item类
下面是HTML:
<body>
<!--Title for the Page-->
<h1 id="title">Will and Amys Movie App</h1>
<!--Grid Layout-->
<div id="container">
<div class="item"></div>
</div>
</body>
Uncaught TypeError: container is null
<anonymous> file:///D:/Github/MovieSummerProject22/script.js:8
<anonymous> file:///D:/Github/MovieSummerProject22/script.js:4
script.js:8:5
<anonymous> file:///D:/Github/MovieSummerProject22/script.js:8
map self-hosted:180
<anonymous> file:///D:/Github/MovieSummerProject22/script.js:4
将newDiv.innerHTML = element;更改为newDiv.innerHTML += element;
这也可以改进一点，你可以只使用map，不需要循环两次
注意，您正在创建一个您不想要的额外的div。
const container = document.getElementById("container");
const arr = ["1", "1", "1"];
arr.map(x => {
const newDiv = document.createElement("div");
newDiv.className = "item";
newDiv.innerHTML += x;
container.append(newDiv)
});<div id="container"></div>