jqueryappend函数 jquery append()方法

转载

技术博客达人 2023-05-23 18:31:17

文章标签 html Vue jquery 文章分类 jQuery 前端开发

这个是W3SCHOOL的解释：
append描述实际在我们的开发中，页面使用append方法一般是用来做拼接。
但是在使用中又有不同。
1.拼接html代码：
此处不再说明。。自己百度吧
2.使用选择器进行拼接：

<html>
    <head>
        <!-- 开发环境版本，包含了有帮助的命令行警告 -->
        <!-- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> -->
        <script
            src="https://code.jquery.com/jquery-3.3.1.min.js"
            integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
            crossorigin="anonymous">
    </script>
    </head>
    <body>
        <!-- <div id="app">
            {{ message }}
        </div> -->
        <div id="a">
            <div id="a1" style="display: block;">
                <input type="text"  id="aaa" name="bbb.cc">
            </div>
        </div>
        <button οnclick="add()">add</button>
        <div id="b" style="display: none;">
            
            <div id="a2" style="display: block;">
                <input type="text" id="aaa" name="bbb.cc" readonly>
            </div>
        </div>
    </body>
    <script>
        // var app = new Vue({
        //             el: '#app',
        //             data: {
        //                 message: 'Hello Vue!'
        //             }
        //         })  
                function add(){
                    $("#a").append($("#a2"))
                }
    </script>
</html>

页面显示：

jqueryappend函数 jquery append()方法_html