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 === $。

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值