Javascript JS表单：如何将（）推送到数组中，而不在每次单击Submit时创建新数组？

每次单击Submit，都会创建一个包含对象的新数组

数组应接收并保持接收对象，而不是创建新对象

JS:

HTML:

提交

有人能告诉我在这里该做什么吗

---

每次单击submit时，我都需要将对象添加到同一数组中。每次提交表单时，

submit

事件都会触发，处理程序函数也会执行。由于您正在函数中初始化一个新的

故事

数组，因此每次提交表单时，都会创建一个新的

故事

数组。 您可能希望将

故事

数组声明移出函数，以便将新帖子添加到现有的

故事

数组中

const form = document.querySelector('#form')
let stories= [];
form.addEventListener('submit', (e) => {...}

---

首先在

submit

处理程序之外声明数组。其次，如果要将其附加到dom中，可以避免数组并对其进行迭代。此外，在数组上迭代可能会在行上创建重复

const form=document.querySelector（“#form”）
让故事=[]
表格.addEventListener（'submit'，（e）=>{
e、 预防默认值（）
const title=document.querySelector（“#title”）.value；
const img=document.querySelector（'#img'）.value；
const story=document.querySelector（“#story”）.value；
const author=document.querySelector（“#author”）.value；
root.innerHTML+=
`
${title}
${img}
${story}
${author}
`;
推({
我的头衔：头衔，
myImg:img，
神秘故事：故事，
我的作者：作者
})
})

提交

在提交时单击它将创建新对象和外接程序数组。下一次/每次单击它将仅在现有数组中添加对象，而不会删除现有对象

const form = document.querySelector("#form");
let stories = [];

form.addEventListener("submit", e => {
  e.preventDefault();

  const title = document.querySelector("#title").value;
  const img = document.querySelector("#img").value;
  const story = document.querySelector("#story").value;
  const author = document.querySelector("#author").value;

  var storyObj = {};
  storyObj["myTitle"] = title;
  storyObj["myImg"] = img;
  storyObj["myStory"] = story;
  storyObj["myAuthor"] = author;
  stories.push(storyObj);

  stories.forEach(story => {
    root.innerHTML += `
    ${story.myTitle}
    ${story.myStory}
    ${story.myImg}
    ${story.myAuthor}
   `;
  });
  console.log("Create data value==>+", JSON.stringify(stories));
});

可能重复的

const form = document.querySelector('#form')
let stories= [];
form.addEventListener('submit', (e) => {...}

const form = document.querySelector("#form");
let stories = [];

form.addEventListener("submit", e => {
  e.preventDefault();

  const title = document.querySelector("#title").value;
  const img = document.querySelector("#img").value;
  const story = document.querySelector("#story").value;
  const author = document.querySelector("#author").value;

  var storyObj = {};
  storyObj["myTitle"] = title;
  storyObj["myImg"] = img;
  storyObj["myStory"] = story;
  storyObj["myAuthor"] = author;
  stories.push(storyObj);

  stories.forEach(story => {
    root.innerHTML += `
    ${story.myTitle}
    ${story.myStory}
    ${story.myImg}
    ${story.myAuthor}
   `;
  });
  console.log("Create data value==>+", JSON.stringify(stories));
});