Question

// 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() {

};

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

Answer 1

您非常亲密。只需在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>

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

1 个答案: