时间戳

首页 > 解决方案 > 我的列表功能在 javascript 中不起作用

javascript - 我的列表功能在 javascript 中不起作用

问题描述

所以我写了这段代码来创建一个列表，然后在点击时向它附加一个输入。真的很简单。但问题是它不起作用，我不知道为什么这里是代码：

function pushing() {
  var li = document.createElement("li");
  var inputValue = document.getElementById("inp").value;
  var pushchild = document.createTextNode(inputValue);
  li.appendChild(pushchild);
}

sub.addEventListener("click", pushing);

idinp是输入 id。谢谢你

标签： javascriptlistappendappendchild

解决方案

您的列表项永远不会附加到列表元素。

// Cache the elements,
// add the button listener,
// & focus on the input
const list = document.querySelector('ul');
const input = document.querySelector('#inp');
const sub = document.querySelector('#sub');
sub.addEventListener('click', pushing);
input.focus();

function pushing() {
  const li = document.createElement('li');
  const text = document.createTextNode(input.value);
  li.appendChild(text);

  // Adding the list item to the list element
  list.appendChild(li);
}
<input id="inp" />
<button id="sub">Click</button>
<ul></ul>

推荐阅读