jQuery文档处理

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <input id="t1" type="text"/>
    <input id="t2" type="button" value="添加">
    <input id="t3" type="button" value="删除">
    <input id="t4" type="button" value="复制">


    <ul id="ul">
        <li>1</li>
        <li>2</li>
    </ul>
    <script src="jquery.js"></script>
    <script>
        $('#t2').click(function () {
            var v=$('#t1').val();

            var tem = "<li>"+ v +"</li>"
            //最后追加数据
            $('#ul').append(tem)
            //最前面插入数据
            // $('#ul').prepend(tem)
            //最外层加入数据
            // $('#ul').after(tem)
            // $('#ul').before(tem)

        })
        $('#t3').click(function () {
            var index = $('#t1').val();
            //删除
            // $('#ul li').eq(index).remove();
            $('#ul li').eq(index).empty()

        })
        $('#t4').click(function () {
            var index = $('#t1').val();
            //克隆
            var v = $('#ul li').eq(index).clone();
            $('#ul').append(v);


        })
    </script>
</body>
</html>

            文档处理:
                append
                prepend
                after
                before
                remove
                empty                
                
                clone

posted @ 2021-02-18 15:19  安好_世界  阅读(34)  评论(0编辑  收藏  举报