jQuery方法之插入元素

append：在每个匹配元素里面的末尾处插入参数内容。(内部插入)—向后插入

语法：$(selector).append(content)—content类型: String, Element, Array, jQuery

    <div class="add"></div>
    <div id="foo">

    </div>
    <script src="./jquery-3.4.1.min.js"></script>
    <script>

        var $newdiv1 = $('<div id="object1"/>'),
            newdiv2 = document.createElement('div'),
            existingdiv1 = document.getElementById('foo');
        //将hello插入到add
        $('.add').append('hello');
        //将p标签插入到add
        $('.add').append('<p>');
        // 将已定义的existingdiv1先剪切再粘贴到add
        $('.add').append(existingdiv1);
        //将$newdiv1和newdiv2插入到add      
        $('.add').append([$newdiv1, newdiv2]);
    </script>

语法：$(selector).append(function(index,html))—function()是必需的，参数index和html都是可选的。index表示 接收选择器的index位置，html表示接收选择器的当前html。

        //将function插入到#foo里        
        $('#foo').append(function (index) {
            return "<b>This p element has index " + index + "</b>" + html

        });

appendTo：将匹配的元素插入到目标元素的最后面（内部插入）—向后插入。

语法：$(content).appendTo(selector)—selector类型：Selector, Element, jQuery

        // 把<p>hello world</p>插入到add里
        $('<p>hello world</p>').appendTo('.add');

append和appendTo异同

相同点：无论是一个选择器表达式 或创建作为标记上的标记，它都将被插入到目标容器的末尾
不同点：两种语法——内容和目标的位置不同。.append(), 选择表达式在函数的前面，参数是将要插入的内容。对于.appendTo()刚好相反，内容在方法前面

		$('.add').append('<p>hello world</p>');       
        $('<p>hello world</p>').appendTo('.add');