时间戳

首页 > 解决方案 > 在页面上显示用户输入

javascript - 在页面上显示用户输入

问题描述

我有一段时间遇到这个麻烦，我无法弄清楚。我想将用户输入显示为 h1 元素。我该怎么做呢？

let allAssignments;

if (localStorage.getItem("everyAssignment")) {
  allAssignments = JSON.parse(localStorage.getItem("everyAssignment"))
} else {
  allAssignments = []
}

function submitFunc() {
  let names = document.getElementById("name").value;
  allAssignments.push(names)
  localStorage.setItem("everyAssignment", JSON.stringify(allAssignments));
  let finalArray = JSON.parse(localStorage.getItem("everyAssignment"));
}
<button onclick="submitFunc()">Submit</button>
<input placeholder="Enter Name Here" id="name">

我想为本地存储中的每个项目创建一个 div 元素，并使用 .innerHTML 插入一个 h1 元素，其中包含数组中每个值的名称。我该怎么做呢？

标签： javascripthtml

解决方案

你可以这样做：

const submitFunc = () => {
  const value = document.getElementById('name').value;
  const parent = document.createElement('div');
  const pTag = document.createElement('p');
  pTag.innerText = value;
  parent.appendChild(pTag);
  document.body.appendChild(parent);
}
<button onclick="submitFunc()">Submit</button>
<input placeholder="Enter Name Here" id="name">

推荐阅读