Javascript

作用 ：进行交互，完成人和网页之间的互动

交互可分为两部分 ：*效果交互 、*数据交互

<script>
        $(function() {
            事件绑定方法一 :
                点击消失
                $(".btn").click(function() {
                    $(".box").hide()
                })

            事件绑定方法二 :
                $(".btn").on("click", function() {
                    $(".box").hide()
                })
            s可以让交互变得更灵活，如可以通过用户输入的数据来更改交互的方式) 
            // 体会on绑定事件的重要性
            // $(".input").on("blur", function() {
            //     var type = $(".input").val()
            //     $(".btn").on("click", function() {
            //       $(".box").hide()
            //     })
            // })

            // 事件绑定事件三 绑定未来元素
            // $("body").on("click", ".btn", function() {
            //     $(".box").hide()
            // })
            //未来元素(通过js后来添加上的元素)
            //添加（制造未来元素）体会事件绑定方法三 绑定未来元素的重要性
            //$("body").append('<input type="button" value="点我" class="btn">')

            $("body").on("click", ".btn", function() {
                $(".box").hide(4000, function() {
                    alert("666")
                })
            })

        })
    </script>

弹框

不同样式的弹框

在控制台打印数据

后端将数据传给前端

上面的只能将一个数据传给前端，下面的形式可以将多个数据传给前端