SOURCE

console 命令行工具 X clear

                    
>
console
$(function () {
    $('#button-add').on('click', function () {

        var item = $('#text-item').val();
        // 为空
        if (item == '') {
            return;
        }
        // 不为空
        else {

            var li = '<li>' + item + '</li>';
            var ol = $('#ol-john');

            // 是否重复
            for (var i = 0; i < ol.length; i++) {

                var itemexist = ol.find('li').eq(i).text();
                if (itemexist === item) {
                    return;
                }
            }
            // 新增项目
            ol.append(li);

        }
    });

    $('#ol-john li').on.li('dblclick', function () {
        $(this).remove();
    });
});

$(function () {

    $('#button-add').on('click', function () {
        var input = $('#text-item').val();
        if (input.trim() == '') {
            alert('不能添加空字符串!');
        }
        var $li = $('<li>').text(input); //创建一个Jquery对象li,并赋值input;
        $('#ol-john').append($li);
    })
});
<ol id="ol-john">
	<li>牛奶</li>
	<li>香蕉</li>
	<li>土豆</li>
    <li>苹果</li>
    <li>橙子</li>
</ol>

<input id="text-item" type="text" placeholder="请输入新的列表项目"/>
<input id="button-add" type="button" value="新增"/>
<button id= "button-add1">新增1</button>
ol{
background-color: black;
color:white;
}
#button-add{
font-weight:bold;
}

ol{
background-color: black;
color:white;
}

button{
    font-weight: bold;
}

本项目引用的自定义外部资源