jquery_新增元素 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript" src="https://common.cnblogs.com/scripts/jquery-2.2.0.min.js"></script>
    <script type="text/javascript">
        $(function(){

            // 通过html的字符串的方式添加节点性能最高
            //$('#div1').html($('#div1').html()+'<a href="#">链接</a>')

            // 预生成要新建的元素,
            el_a = $('<a href="#">div子级最后插入</a>');

            // 在指定元素的子级的最后插入元素
            $('#div1').append(el_a);


            // 在指定元素的子级的最前插入元素
            $('#div1').prepend('<p>div子级最前插入</p>');

            // 在指定元素的同级的后面插入元素
            h2 = $('<h2>div同级最后插入</h2>')
            $('#div1').after(h2);

            // 在指定元素的同级的前面插入元素
            $('#div1').before('<h3>div同级最前插入</h3>');
        })
    </script>
</head>
<body>
    <div id="div1">
        <h1>指定元素的初始子元素</h1>
    </div>
</body>
</html>

 

posted @ 2022-08-02 17:44  码上测  阅读(43)  评论(0)    收藏  举报