javascript - 添加至有限制（纯JS）

Question

所以我想通过在返回值的旁边键入项目来将项目添加到列表中，将值添加到列表中。我已经完成了......但我想限制我在列表中添加项目的次数。假设我只想将其限制为 5 次。所以我基本上可以在一个列表中添加 5 个项目......仅此而已......现在......我该怎么做？

谢谢回复。

<script type="text/javascript">         
    var input = document.getElementById('username');

    function checkLength() {
        var node = document.createElement('li');
        var nodeText = document.createTextNode(input.value);
        var ul = document.getElementsByTagName('ul')[0];

        node.appendChild(nodeText);
        ul.appendChild(node);
        input.value = "";
        node.setAttribute('style', "color:green; text-transform:uppercase;");
    }
}
</script>

标签： javascriptlistsetlimit

Answer 1

您可以获得节点的子节点数：

var ul = document.getElementsByTagName('ul')[0];

if (ul.childNodes.length < 5) {
  ul.appendChild(node);
}

请注意，这会计算所有子节点而不仅仅是li元素，因此如果您在其中有文本节点，我认为您不会将它们包含在此计数中。