移动李的,以便我可以列出新清单

时间:2019-04-13 14:39:52

标签: javascript html css

// makes an li inside of a ol when a button is pressed

function addLi() {

    var txtVal = document.getElementById('txtVal').value,
        listNode = document.getElementById('list'),
        liNode = document.createElement("li"),
        txtNode = document.createTextNode(txtVal);

    liNode.appendChild(txtNode);
    listNode.appendChild(liNode);

};

function addoutp() {

};

我不知道要在此函数中放置什么内容,以将输入的文本分别移到屏幕的另一部分...

1 个答案:

答案 0 :(得分:0)

您非常亲密。只需在JS代码中添加一些与选择器匹配的HTML,它便开始起作用。我还添加了一个检查,以确保在添加到列表之前有一个值,并且在将文本添加到列表(txtVal.value = '';)之后还要进行重置以清除输入值。

// makes an li inside of a ol when a button is pressed
function addLi() {
  var txtVal = document.getElementById('txtVal'),
    listNode = document.getElementById('list'),
    liNode = document.createElement("li"),
    txtNode = document.createTextNode(txtVal.value);
  
  if (txtVal.value) {
    liNode.appendChild(txtNode);
    listNode.appendChild(liNode);
    // clear the input
    txtVal.value = '';
  }
};
<input id="txtVal" type="text" />
<button onclick="addLi()">Add to list</button>
<ol id="list"></ol>