代码改变世界

jQuery选择器

2020-04-09 20:31  默默不语  阅读(164)  评论(0)    收藏  举报 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <!-- jQuery是一个快速简洁的javascript函数库（js框架）
         -->
    </head>
    <body>
        <div id="d1">
            我是div1
        </div>
        <div class="d2">
            <p>哈哈</p>
        </div>
        <button type="button" id="b1">我是button1</button>
    </body>
    <!-- 注意:因为有些东西需要依赖于jquery,所以一般我们把jquer的导入代码放到上边-->
    <script type="text/javascript" src="../images/jquery-3.4.1.min.js"></script>
    <script type="text/javascript">
        
        /* 原生js取法 */
        var d1 = document.getElementById("d1");
        alert("d1:"+d1.innerText);
        /* jQuery取法 */
        /* $("#d1")相当于css中学的id选择器，后面我们会讲jquery中的几种选择器 */
        /* html()等同于innerHTML */
        var d2 = $("#d1").html();
        alert("d2:"+d2);
        /* 注：d1是DOM对象，d2是jquery对象，两者不一样 */
         var d2 = $(".d2").html();
         alert(d2);
         var div = $("div p").html();
         alert("div:"+div);
         
        
        
    </script>
</html>