4.jQuery和DOM 对象之间的相互转换

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        div {
            height: 200px;
            background: #000;
        }
    </style>
    <script src="jquery-3.3.1.js"></script>
    <script>
        $(document).ready(function () {
            // DOM对象转换成jQuery对象
            /*var btn = document.getElementById("btn");
            $(btn).click(function () {
                $("div").hide();
            });*/

            // jQuery对象转换成DOM对象
            /*$("button")[1].onclick = function (){
                alert("jQuery对象转换成dom对象");
            };*/

            // 另外一个方式
            $("button").get(0).onclick = function () {
                alert("jQuery对象转换成dom对象");
            }

            // js里面的click() 方法：触发click事件
            // js里面的onclick 是绑定点击事件
            /*var btn = document.getElementById("btn");
            btn.onclick = function () {
                alert("我是btn的onclick");
            };
            btn.click();*/
        });
    </script>
</head>
<body>
    <button id="btn">我是阿牛</button>
    <button>我是阿妹</button>
    <div>

    </div>
</body>
</html>
posted on 2018-10-02 22:48 xxcxxc 阅读(88) 评论(0) 收藏举报