<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
<input type="text" id="v">
<input type="button" id="add" value="添加"/>
<input type="button" id="del" value="删除"/>
<input type="button" id="clone" value="复制"/>
</div>
<ul id="u1">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<script src="jquery-3.3.1.js"></script>
<script type="application/javascript">
$('#add').click(function () {
var v = $('#v').val();
var temp = "<li>" + v + "</li>";
$('#u1').append(temp); //内部尾部追加
// $('#u1').prepend(temp); //内部最前面插入
// $('#u1').after(temp); //外部后面加
// $('#u1').before(temp); //外部前面加
});
$('#del').click(function () {
var v = $('#v').val();
// $('#u1').children().eq(v-1).empty(); //清空标签内容
$('#u1').children().eq(v-1).remove(); //删除标签
});
$('#clone').click(function () {
var v = $('#v').val();
var temp = $('#u1').children().eq(v-1).clone(); //克隆标签
$('#u1').append(temp);
});
</script>
</body>
</html>