• jQuery学习


    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
            <style type="text/css">
            div{
                width: 100px;
                height: 100px;
                background-color: green;
                margin-top: 20px;
                display: none;
            }
        </style>
    
    </head>
    <body>
    <button>操作</button>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            let obtn=$('button');
            let odiv=$("div");
            console.log(obtn);
            console.log(odiv);
            obtn.click(function () {
                odiv.show(1000);
                odiv.html('赵云')
            })
        })
    </script>
    </body>
    </html>

    导包

    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">

    文档加载的顺序:从上往下,边解析边执行。

    jQuery$符号

    jQuery 使用 $ 符号原因:书写简洁、相对于其他字符与众不同、容易被记住。

    jQuery占用了我们两个变量:$ 和 jQuery。当我们在代码中打印它们俩的时候:

     

      <script src="jquery-3.3.1.js"></script>

        <script>

     

            console.log($);

            console.log(jQuery);

            console.log($===jQuery);

     

     

        </script>

     

    打印结果:

     

    从打印结果可以看出,$ 代表的就是 jQuery。

    那怎么理解jQuery里面的 $ 符号呢?

    $ 实际上表示的是一个函数名 如下:

     

        $(); // 调用上面我们自定义的函数$

     

        $(document).ready(function(){}); // 调用入口函数

     

        $(function(){}); // 调用入口函数

     

        $(“#btnShow”) // 获取id属性为btnShow的元素

     

        $(“div”) // 获取所有的div标签元素

     

    如上方所示,jQuery 里面的 $ 函数,根据传入参数的不同,进行不同的调用,实现不同的功能。返回的是jQuery对象。

    jQuery这个js库,除了$ 之外,还提供了另外一个函数:jQuery。jQuery函数跟 $ 函数的关系:jQuery === $。

     

  • 相关阅读:
    luogu P3801 红色的幻想乡
    [USACO07OPEN]吃饭Dining
    [SCOI2007]蜥蜴
    [SDOI2011]染色
    [USACO07DEC]Sightseeing Cows
    [HNOI2007]紧急疏散EVACUATE
    [ZJOI2009]假期的宿舍
    [SDOI2013]费用流
    [CQOI2009]跳舞
    使用chrony安装chrony
  • 原文地址:https://www.cnblogs.com/bigc008/p/9948866.html
Copyright © 2020-2023  润新知