【jQuery】-- 基本使用步骤

jQuery是一个Javascript库,是对于ECMAScript、dom、bom的一个浅封装,让用户更方便操作。

♡ ‧₊˚  jQUery的安装  ‧₊˚ ♡

在 https://www.bootcdn.cn/jquery/ 中:

 

  • 从网页引入

找到需要的版本并复制相应的script标签,放到自己的html文件中即可。

  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  • 从本地引入

复制链接到搜索框打开一个新的网页,将页面中出现的代码全选复制到自己的jquery.js文件中,并用script标签引入到html中 

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

♡ ‧₊˚  jQUery函数  ‧₊˚ ♡

通过"jQuery"和"$"来调用jQuery函数

jQuery核心函数:
    简称:jQuery函数($/jQuery)
    引入jQuery库以后,直接使用$/jQuery即可
    当函数用:$(params)
    当对象用的时候:$.each()
jQuery核心对象:
    简称:jQuery对象 $()
    得到jQuery对象:执行jQuery函数返回的就是jQuery对象
    使用jQuery对象:$obj.xxx()

        console.log($,'jQuery函数', typeof $); // 'jQuery函数' 'function'
        console.log($(),'jQuery对象', typeof $()); // 'jQuery对象' 'object'
        console.log($() instanceof Object); // true

 入口函数

JS的入口函数:

        // 原生JS入口函数
        window.onload = function(){
            alert('我是入口函数')
        }

 jQuery的入口函数有四种不同的写法:

        // JQ入口函数的四种写法
        $(document).ready(function(){
            alert('我是入口函数1')
        })
        jQuery(document).ready(function(){
            alert('我是入口函数2')
        })
        // 推荐写法
        $(function(){
            alert('我是入口函数3')
        })
        jQuery(function(){
            alert('我是入口函数4')
        })

♡ ‧₊˚  jQUery对象  ‧₊˚ ♡

jQuery对象是类数组对象,jQuery的方法都是对类数组中的元素的批量操作

注意:jQuery对象可以调用jQuery.prototype中声明的方法,普通的Element元素则不能调用。在使用jquery的时候,拿到一个对象务必要搞明白该对象是Element元素还是jQuery实例

如下代码,this是Element元素,如果想调用jQuery方法,需要使用$()将其转换为jQuery实例

  1. <head>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/
  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值